/* * Site skin — the new home's look on every Flatsome page (inc/gadxy-site-skin.php; loaded only where the skin applies, * so the protected ₹99 product, cart and checkout never see it). Tokens come from gx_chrome_css_tokens() (printed * just before this file): --paper --card --ink --ink-2 --mute --line --lime --olive --d-* --font --r1/2/3 --ease. * Colour rule (shez 2026-10-09: "lime buttons do not fit on white backgrounds"): on paper/white the main button is * charcoal; lime only on dark surfaces (header, dark sections) or as a small fill behind charcoal text (badges). */ /* ---------- 1. page base ---------- */ body.gx-skin{background:var(--paper);color:var(--ink-2);font-family:var(--font);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility} body.gx-skin #wrapper,body.gx-skin #main,body.gx-skin #main.dark,body.gx-skin .page-wrapper{background:transparent} body.gx-skin #main{padding-bottom:24px} body.gx-skin :is(h1,h2,h3,h4,h5,h6,.heading-font,.nav,.button,button,input,select,textarea,.off-canvas-center .nav-vertical li>a,.alt-font){font-family:var(--font)} body.gx-skin :is(h1,h2,h3,h4,h5,h6){color:var(--ink);font-weight:700;letter-spacing:-.02em;line-height:1.15;text-wrap:balance} body.gx-skin #main :is(h1,h2,h3,h4,h5,h6).uppercase,body.gx-skin #main .uppercase:is(h1,h2,h3,h4){text-transform:none;letter-spacing:-.015em} body.gx-skin #wrapper a:not(.button):not(.btn){color:var(--ink)} body.gx-skin #wrapper a:not(.button):not(.btn):hover{color:var(--olive)} body.gx-skin ::selection{background:var(--lime);color:var(--ink)} body.gx-skin :focus-visible{outline:2px solid var(--olive);outline-offset:3px} body.gx-skin .container,body.gx-skin .row:not(.row-collapse):not(.row-full-width){max-width:1200px} /* phones: the header's 20px side gutter for the content too (Flatsome's is 15px); small-gap grids keep theirs */ @media(max-width:549px){ body.gx-skin .container,body.gx-skin .container-width{padding-left:20px;padding-right:20px} body.gx-skin .row:not(.row-small):not(.row-xsmall):not(.row-collapse)>.col{padding-left:20px;padding-right:20px} body.gx-skin :is(.row,.container) .row:not(.row-small):not(.row-xsmall):not(.row-collapse){margin-left:-20px;margin-right:-20px} } body.gx-skin .is-divider{height:2px;max-width:32px;background:var(--lime);opacity:1;border-radius:2px} body.gx-skin hr{border-color:var(--line)} /* The chrome hides WP's admin toolbar (as on the home): drop the space WP reserves for it, or the page shows through above the header */ html:has(body.gx-skin){margin-top:0!important} /* ---------- 2. the home header/footer inside Flatsome's base CSS ---------- */ /* Flatsome styles bare button/li/p/ul; the chrome's own rules set what it needs, these clear the rest. Same weight as Flatsome's element rules (this file loads last), so the chrome's class rules still win. */ :where(.bar,footer[data-ctawatch],.sheet) button{margin:0;text-transform:none;letter-spacing:normal;line-height:1.2;text-shadow:none;vertical-align:middle;min-height:0} :where(.bar,footer[data-ctawatch],.sheet) :is(p,ul,ol,li){margin-bottom:0} :where(.bar,footer[data-ctawatch],.sheet) :is(ul,ol){padding:0;margin-left:0} :where(.bar,footer[data-ctawatch],.sheet) li{margin-left:0} :where(.bar,footer[data-ctawatch]) a:hover{color:inherit} :where(.bar,footer[data-ctawatch],.sheet) :is(h1,h2,h3,p){font-family:var(--font)} .bar img,footer[data-ctawatch] img{max-width:none} .bar .mnav summary{font-family:var(--font)} /* Flatsome's own .primary rule clears the lime Book button: put it back */ body.gx-skin .bar .btn.primary{background:var(--lime);color:var(--ink);white-space:nowrap} body.gx-skin .bar .btn.primary:hover{background:#e0f53a;color:var(--ink)} footer[data-ctawatch] .ft-cols a:hover,footer[data-ctawatch] .ft-soc a:hover{color:var(--d-1)} /* a