/*
 * Grammarsaurus Australia — styling overrides.
 * Loaded after style.css only when the region is 'au' (see inc/region.php).
 *
 * Generated from the AU child theme (Nov 2024): only declarations the AU site
 * changed from the shared original AND that still differ from the UK stylesheet.
 * Variables are prefixed --au- so they never clash with UK variables of the same name.
 */

:root {
    --au-color-bright-turquoise: #49b9cd;
    --au-color-grammarsaurus-australia-gold: #fcc73d;
    --au-color-black: #000000;
    --au-color-grammarsaurus-australia-green-dark: #197355;
    --au-color-grammarsaurus-australia-green: #188554;
    --au-color-buttercup: #eeaa0f;
    --au-color-sushi: #87bd42;
    --au-color-jacksons-purple: #1d2c79;
    --au-color-alizarin-crimson: #df1c21;
    --au-color-shakespeare: #3db9cd;
    --au-color-red-violet: #d90f85;
    --au-color-gigas: #5c3f93;
    --au-color-corn: #d8c700;
    --au-color-razzmatazz: #d50078;
}

.text-blue {
    color: var(--au-color-bright-turquoise);
}

.pg_school_headline .mepr-submit {
    background: var(--au-color-grammarsaurus-australia-gold);
}

.categories_menus_two .menu > li {
    margin-right: 5px !important;
}

.categories_menus_two .menu > li > a {
    font-size: 15px !important;
}

.categories_menus_two .menu > .menu-item-has-children > a {
    padding: 10px 15px 10px 15px !important;
}

#Top_bar .menu > li ul li a {
    font-size: 12px !important;
}

.section-related-adjustment,
.section-related-adjustment .section-related-ul {
    display: flex;
    flex-wrap: wrap;
}

div.eyfs_tab_content div.image_frame div.image_wrapper img.wp-post-image {
    margin: 20px 20px 20px 0;
}

.cate,
.subs_buttons a:hover {
    text-decoration: none;
}

a.have-coupon-link {
    border: 1px solid;
}

#Top_bar .menu > li > a {
    color: var(--au-color-black);
}

p.big-londrina {
    font-family: "Londrina Solid", Arial, Tahoma, sans-serif;
    font-size: 35px;
}

.subs_visual p,
.solo_sub_inner:nth-child(2) {
    margin: 10px 0 10px;
    font-size: 20px;
}

#reviews i.icon-right-dir,
i.icon-left-dir {
    color: var(--au-color-grammarsaurus-australia-green-dark) !important;
}

#reviews .testimonials_slider .testimonials_slider_ul li .bq_wrapper {
    background: var(--au-color-grammarsaurus-australia-gold);
}

#reviews .slick-slide:first-child .bq_wrapper {
    background-color: var(--au-color-grammarsaurus-australia-gold) !important;
}

#reviews .slick-slide:nth-child(2n) .bq_wrapper {
    background-color: var(--au-color-grammarsaurus-australia-green) !important;
}

.bg-col-blog {
    background: url(/portal/wp-content/uploads/BG_footer.png);
}

#Footer {
    background-image: url(/portal/wp-content/uploads/grammarsaurus-australia-footer.png);
}

.mepr-form-input.mepr-coupon-code.active.valid {
    border: 1px solid var(--au-color-buttercup);
}

.mepr-form-input.mepr-coupon-code.active.valid + sub {
    color: var(--au-color-buttercup);
}

div.menu_wrapper div.menu-menu-container ul.menu li.menu-item {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

div.menu_wrapper div.menu-menu-container ul.menu li.menu-item:hover a {
    color: var(--au-color-black) !important;
}

div.menu_wrapper div.menu-menu-container ul.menu li.menu-item:is(:nth-of-type(8n+1)) {
    border-color: var(--au-color-buttercup);
}

div.menu_wrapper div.menu-menu-container ul.menu li.menu-item:is(:nth-of-type(8n+2)) {
    border-color: var(--au-color-sushi);
}

div.menu_wrapper div.menu-menu-container ul.menu li.menu-item:is(:nth-of-type(8n+3)) {
    border-color: var(--au-color-jacksons-purple);
}

div.menu_wrapper div.menu-menu-container ul.menu li.menu-item:is(:nth-of-type(8n+4)) {
    border-color: var(--au-color-alizarin-crimson);
}

div.menu_wrapper div.menu-menu-container ul.menu li.menu-item:is(:nth-of-type(8n+5)) {
    border-color: var(--au-color-shakespeare);
}

div.menu_wrapper div.menu-menu-container ul.menu li.menu-item:is(:nth-of-type(8n+6)) {
    border-color: var(--au-color-red-violet);
}

div.menu_wrapper div.menu-menu-container ul.menu li.menu-item:is(:nth-of-type(8n+7)) {
    border-color: var(--au-color-gigas);
}

div.menu_wrapper div.menu-menu-container ul.menu li.menu-item:is(:nth-of-type(8n+8)) {
    border-color: var(--au-color-corn);
}

div.menu_wrapper div.menu-menu-container ul.menu li.menu-item:is(:nth-of-type(8n+9)) {
    border-color: var(--au-color-razzmatazz);
}

/* Was a direct edit to the AU parent theme (betheme/css/layout.css): hover/current colour #fff -> #2d81af */
.widget_mfn_menu ul li a:hover,
.widget_mfn_menu ul li.current-menu-item:not(.current-menu-ancestor) > a,
.widget_mfn_menu ul li.current_page_item:not(.current_page_ancestor) > a {
    text-decoration: none;
    color: #2d81af !important;
}

/* BeTheme 29 sets box-sizing:border-box on everything, which squeezed the 6px icon padding into the 33px width */
a.button-bespoke img,
a.button-resource img,
a.button-cpd-home img {
    box-sizing: content-box;
}

/* style.css gives the UK schools-contact testimonial column a blue background; AU's has none */
.pg_school_headline .mcb-item-egxrrrlw4 {
    background: none;
}

/* Fluent Forms submit buttons: AU green (the old FormCraft button colour) */
.fluentform .frm-fluent-form .ff-btn-submit {
    background-color: #197355 !important;
    border-color: #197355 !important;
}

/* Content width: style.css (from the UK theme) widens the layout to 1400px on large screens.
   The AU site has always used BeTheme's 1220px column (Theme Options grid width). */
@media only screen and (min-width: 1240px) {
    .section_wrapper,
    .container {
        max-width: 1220px !important;
        width: auto !important;
    }
}

/* Header, to match the AU site on BeTheme 21:
   - menu links: AU has always shown Theme Options' #444 (the old AU rule had no !important; style.css forces black)
   - top bar: BeTheme 29 adds column-gap padding to header containers; BeTheme 21 had none */
#Top_bar .menu > li > a {
    color: #444444 !important;
}

#Action_bar .container {
    padding-left: 0;
    padding-right: 0;
}

/* BeTheme 29 added a "laptop" size (961-1440px); "hide-desktop" now only hides at 1441px+.
   Builder visibility settings were converted by BeTheme > Tools > Laptop Breakpoint, but some elements
   have the classes typed into their custom-class field (e.g. the home page's spare "Most popular" grid),
   which the tool doesn't touch. Keep the BeTheme 21 meaning: hidden on desktop = hidden on laptop too. */
@media only screen and (min-width: 960px) and (max-width: 1440px) {
    .hide-desktop:not(.hide-laptop) {
        display: none !important;
    }
}

/* MemberPress forms (login, sign-up on resource pages): MemberPress 1.14 brought its own label and
   button styles; restore the look of the AU site on MemberPress 1.9 */
body .mp_wrapper label,
body .mp_wrapper .mp-form-label label {
    font-weight: 700;
}

body .mp_wrapper input[type="submit"],
body .mp_wrapper .mepr-submit,
body .mp_wrapper .button-primary {
    background-color: #0095eb;
    border: 0;
    border-radius: 5px;
    padding: 11px 20px;
    font-size: 13.3333px;
    font-weight: 400;
    color: #fff;
}

/* Tablet (768-959px): BeTheme 21 spaced builder columns with a 1% margin (~7px at this width);
   BeTheme 29 uses a fixed 12px gap, so text in columns wrapped earlier. Desktop and mobile already match. */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    html body .content_wrapper .mcb-column-inner {
        margin-left: 7px;
        margin-right: 7px;
    }
}

/* On-demand training enquiry (Fluent form 10): match the FormCraft form it replaced.
   Its text blocks use an h4 and hard-coded #3366ff, which the h1/h2 form rules above don't cover. */
.fluentform_wrapper_10,
.fluentform_wrapper_10 label,
.fluentform_wrapper_10 input,
.fluentform_wrapper_10 select,
.fluentform_wrapper_10 textarea,
.fluentform_wrapper_10 .ff-btn,
.fluentform .frm-fluent-form.fluent_form_10 .ff-custom_html,
.fluentform .frm-fluent-form.fluent_form_10 .ff-custom_html * {
    font-family: "Open Sans", Arial, sans-serif;
}
.fluentform .frm-fluent-form.fluent_form_10 .ff-custom_html h4,
.fluentform .frm-fluent-form.fluent_form_10 .ff-custom_html h4 span {
    font-size: 19.5px;
    line-height: 1.3;
    font-weight: 500;
    color: #0066bf !important;
}
.fluentform .frm-fluent-form.fluent_form_10 .ff-custom_html p,
.fluentform .frm-fluent-form.fluent_form_10 .ff-custom_html li {
    font-size: 14.3px;
    line-height: 1.5;
}
.fluentform .frm-fluent-form.fluent_form_10 .ff-custom_html p span {
    color: #2b7abf !important;
}
.fluentform .frm-fluent-form.fluent_form_10 .ff-el-form-control {
    font-family: "Open Sans", Arial, sans-serif;
}
.fluentform .frm-fluent-form.fluent_form_10 .ff-custom_html li,
.fluentform .frm-fluent-form.fluent_form_10 .ff-custom_html p:not([style]) {
    color: #666;
}

/* Resource Request (Fluent form 7): centred heading block, as on the FormCraft form it replaced */
.fluentform_wrapper_7,
.fluentform_wrapper_7 label,
.fluentform_wrapper_7 .ff-btn,
.fluentform .frm-fluent-form.fluent_form_7 .ff-el-form-control,
.fluentform .frm-fluent-form.fluent_form_7 .ff-custom_html,
.fluentform .frm-fluent-form.fluent_form_7 .ff-custom_html * {
    font-family: "Open Sans", Arial, sans-serif;
}
.fluentform .frm-fluent-form.fluent_form_7 .ff-custom_html p {
    text-align: center;
    color: #666;
    font-size: 13px;
    line-height: 1.5;
}
.fluentform .frm-fluent-form.fluent_form_7 .ff-custom_html:nth-of-type(1) p {
    font-size: 19.5px;
    font-weight: 500;
}
.fluentform .frm-fluent-form.fluent_form_7 .ff-custom_html:nth-of-type(2) p {
    font-weight: 700;
}

/* Field text on the other forms: Fluent's system font stack, where the FormCraft forms used Roboto */
.fluentform .frm-fluent-form .ff-el-form-control {
    font-family: Roboto, Arial, sans-serif;
}
