/* =====================================================
   VERO — header and footer, in the palette
   Loads after style.css. Colours only for now; the cut-out logo needs a dark
   background, so these two parts are dark from the start.
   ===================================================== */

/* Astra's focus outline is charcoal, which cannot be seen on the dark parts */
.gk-header :focus-visible, .gk-cat-nav :focus-visible, .gk-md-header :focus-visible, .gk-footer :focus-visible { outline-color: var(--vero-rose); }

/* Announcement bar: rose gold, charcoal text */
.gk-announce { background: var(--vero-rose); color: var(--vero-charcoal); }
.gk-announce a:hover { color: var(--vero-black); }
.gk-announce-pill { background: var(--vero-charcoal); color: var(--vero-ivory); }

/* Header */
.gk-header { background: var(--vero-charcoal); border-bottom-color: var(--vero-graphite); }
.gk-mobile-toggle, .gk-tools, .gk-tool-hotline, .gk-tool-hotline .gk-hot-num { color: var(--vero-ivory); }
.gk-mobile-toggle:hover, .gk-tools a:hover { color: var(--vero-highlight); }
.gk-logo-name .gk-l-green, .gk-fcol .gk-fcol-brand .gk-fb-text .gk-l-green { color: var(--vero-ivory); }
.gk-logo-name .gk-l-orange, .gk-fcol .gk-fcol-brand .gk-fb-text .gk-l-orange { color: var(--vero-rose); }
.gk-logo-tag { color: var(--vero-champagne); }
.gk-tool-shop { background: transparent; border-color: var(--vero-rose); }
.gk-tool-shop:hover { border-color: var(--vero-highlight); color: var(--vero-highlight); }
.gk-tool-hotline .gk-hot-icon { background: var(--vero-raised); color: var(--vero-rose); }
.gk-tool-hotline:hover .gk-hot-icon { background: var(--vero-rose); color: var(--vero-charcoal); }
.gk-tool-hotline .gk-hot-label, .gk-cart-btn .gk-cart-meta-label { color: var(--vero-champagne); }
.gk-cart-btn { background: var(--vero-raised); color: var(--vero-ivory); border-color: var(--vero-graphite); }
.gk-cart-btn:hover { background: var(--vero-graphite); color: var(--vero-highlight); border-color: var(--vero-rose); }
.gk-cart-btn .gk-cart-meta-total { color: var(--vero-ivory); }
.gk-cart-btn .gk-cart-count-badge { border-color: var(--vero-charcoal); }
.gk-search-mobile { border-bottom-color: var(--vero-graphite); }
.gk-search-form input:focus { border-color: var(--vero-rose); box-shadow: 0 0 0 3px rgba(200, 153, 134, .35); }

/* Category row */
.gk-cat-nav { background: var(--vero-black); border-color: var(--vero-graphite); }
.gk-cat-nav-inner nav a, .gk-cat-nav-inner nav button { color: var(--vero-ivory); }
.gk-cat-nav-inner nav a:hover, .gk-cat-nav-inner nav button:hover { color: var(--vero-highlight); }
.gk-cat-nav-inner .gk-divider { background: var(--vero-graphite); }
.gk-cat-nav-right { color: var(--vero-rose); }

/* Phone drawer: its head carries the logo */
.gk-md-header { background: var(--vero-charcoal); border-bottom-color: var(--vero-graphite); }
.gk-md-close { color: var(--vero-ivory); }
.gk-md-close:hover { color: var(--vero-highlight); }

/* Footer */
.gk-footer { background: var(--vero-charcoal); color: var(--vero-ivory); border-top-color: var(--vero-graphite); }
.gk-footer a:hover { color: var(--vero-highlight); }
.gk-footer-features, .gk-footer-bottom, .gk-fcol h4 { border-color: var(--vero-graphite); }
.gk-feature-ico { background: var(--vero-raised); color: var(--vero-rose); border-color: var(--vero-graphite); }
.gk-feature h4, .gk-fcol h4 { color: var(--vero-ivory); }
.gk-feature p, .gk-fcol-about, .gk-fcontact, .gk-copy, .gk-payments .label { color: var(--vero-champagne); }
.gk-fcol ul li a { color: var(--vero-ivory); }
.gk-fcol ul li a:hover { color: var(--vero-highlight); }
.gk-fcontact li svg { color: var(--vero-rose); }
.gk-fcol .gk-fcol-brand .gk-fb-mark { background: var(--vero-raised); border-color: var(--vero-graphite); color: var(--vero-rose); }
.gk-fcol-socials a { background: var(--vero-raised); border-color: var(--vero-graphite); color: var(--vero-ivory); }
.gk-fcol-socials a:hover { background: var(--vero-rose); border-color: var(--vero-rose); color: var(--vero-charcoal); }
.gk-payments .gk-pm { background: var(--vero-raised); border-color: var(--vero-graphite); }
.gk-payments .gk-pm.bkash, .gk-payments .gk-pm.nagad, .gk-payments .gk-pm.cod { color: var(--vero-ivory); }
