/* ============================================================
   DELT CHROME-CSS — single source (partials/head.html)
   Rediger header/footer/promo/drawer/tokens KUN her.
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
/* Nullstill Astras globale button-reset (border/padding/bakgrunn/farge via
   element-selektoren "button" — slår vårt universelle *{padding:0} pga.
   høyere spesifisitet). Egne knappeklasser (.btn-fill, .hs-btn osv.) setter
   sin egen stil over dette. */
button { padding: 0; border: none; background: none; color: inherit; font: inherit; }
/* Nullstill Astras globale fargepalett (default lilla #683393/blå #1863dc)
   som ellers lekker gjennom på alt vi ikke eksplisitt har egen stil for —
   bl.a. vanlige tekstlenker på sider uten egen theme-template (frakt, retur). */
a { color: #7A3D5A; }
a:hover, a:focus { color: #5E2C44; }
::selection { background-color: #7A3D5A; color: #fff; }
.current-menu-item, .current-menu-ancestor { color: #fff; border-color: #7A3D5A; background-color: #7A3D5A; }
input:focus, textarea:focus, select:focus { border-color: #7A3D5A; }
input[type="radio"]:checked, input[type="checkbox"]:checked { border-color: #7A3D5A; background-color: #7A3D5A; }
input[type="range"]::-webkit-slider-thumb { border-color: #7A3D5A; background-color: #7A3D5A; }
:root {
  --base:#FAF6F3; --surface:#F2EBE8; --surface-alt:#EDE4E0; --alt:#EDE4E0; --white:#FFFFFF;
  --cta:#7A3D5A; --cta-h:#5E2C44; --cta-dis:#C8A8B8;
  --text:#2C2420; --muted:#6B5C54; --warm:#C9A8A8; --warm-d:#7D5050; --lilla:#8B7AAD;
  --border:#DFD5D0; --footer-bg:#2C2420; --placeholder:#A08C84;
  --badge-sale:#7A3D5A; --badge-new:#2D6636; --badge-pop:#5A4A8A; --badge-low:#7A5200;
  --fh:'Playfair Display', Georgia, serif; --fb:'DM Sans','Helvetica Neue',Arial,sans-serif;
  --max:1200px;
  --sticky-header-height:116px; /* promo-stripe scroller bort; sticky = header-rad + nav-rad */
}
body { background: var(--base); color: var(--text); font-family: var(--fb); font-size: 16px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
.container { max-width: var(--max); margin: 0 auto; padding: 0 1.25rem; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.skip-link { position: absolute; left: 50%; top: 0; transform: translate(-50%,-120%); z-index: 500; background: var(--cta); color: #fff; font-weight: 600; font-size: .9375rem; padding: .625rem 1.25rem; border-radius: 0 0 10px 10px; text-decoration: none; transition: transform 150ms; }
.skip-link:focus { transform: translate(-50%,0); outline: 3px solid #fff; outline-offset: -6px; }

/* Promo-stripe */
.promo-stripe { background: var(--cta); color: rgba(255,255,255,.9); font-size: .8125rem; font-weight: 400; text-align: center; padding: .45rem 1.25rem; display: flex; align-items: center; justify-content: center; gap: 1.5rem; }
.promo-stripe span { opacity: .8; }
@media (max-width: 559px) { .promo-stripe span { display: none; } }

/* Header */
.site-header { background: var(--white); border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 200; box-shadow: 0 1px 6px rgba(44,36,32,.06); }
.header-inner { max-width: var(--max); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; height: 64px; gap: 1rem; padding: 0 1.25rem; }
.logo { text-decoration: none; display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.logo-mark { width: 36px; height: 36px; border-radius: 10px; background: rgba(122,61,90,.1); display: flex; align-items: center; justify-content: center; font-size: 1.25rem; }
.logo-text { font-family: var(--fh); font-size: 1.25rem; font-weight: 700; color: var(--text); letter-spacing: -.01em; white-space: nowrap; }
.logo-text em { color: var(--cta); font-style: italic; }
.header-actions { display: flex; align-items: center; gap: .25rem; flex-shrink: 0; }
.icon-btn { width: 44px; height: 44px; padding: 0; border: none; background: none; cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: 50%; color: var(--text); position: relative; transition: background 150ms; text-decoration: none; }
.icon-btn:hover { background: var(--surface); }
.icon-btn:focus-visible { outline: 3px solid var(--cta); outline-offset: 2px; }
.cart-badge { position: absolute; top: 6px; right: 6px; width: 16px; height: 16px; border-radius: 9999px; background: var(--cta); color: #fff; font-size: .6rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
/* Smal mobil: unngå at hamburger presses ut av skjermen (<~400px) */
@media (max-width: 400px) {
  .header-inner { padding: 0 .75rem; gap: .35rem; height: 60px; }
  .header-actions { gap: .1rem; }
  .icon-btn { width: 40px; height: 40px; }
  .logo-mark { width: 32px; height: 32px; }
  .logo-text { font-size: 1.125rem; }
}

/* Synlig søkefelt (desktop) */
.header-search { display: none; flex: 1; align-items: center; gap: .5rem; max-width: 560px; background: var(--base); border: 1.5px solid var(--border); border-radius: 9999px; padding: 0 .4rem 0 1rem; height: 46px; transition: border-color 150ms, box-shadow 150ms; overflow: hidden; }
.header-search:focus-within { border-color: var(--cta); box-shadow: 0 0 0 3px rgba(122,61,90,.12); background: #fff; }
.hs-ico { color: var(--muted); flex-shrink: 0; }
.hs-input { flex: 1; border: none; background: none; font-family: var(--fb); font-size: .9375rem; color: var(--text); min-width: 0; height: 100%; -webkit-appearance: none; appearance: none; }
.hs-input::placeholder { color: var(--muted); }
.hs-input:focus { outline: none; }
/* Fjern nettleserens innebygde dekor på type="search" (lupe/krysse-ut-knapp) som ellers stikker utenfor vår egen pille-boks */
.hs-input::-webkit-search-decoration,
.hs-input::-webkit-search-cancel-button,
.hs-input::-webkit-search-results-button,
.hs-input::-webkit-search-results-decoration { -webkit-appearance: none; appearance: none; }
.hs-btn { flex-shrink: 0; border: none; background: var(--cta); color: #fff; font-family: var(--fb); font-size: .875rem; font-weight: 600; padding: 0 1.125rem; height: 36px; border-radius: 9999px; cursor: pointer; transition: background 150ms; }
.hs-btn:hover { background: var(--cta-h); }
.hs-btn:focus-visible { outline: 3px solid var(--cta); outline-offset: 2px; }

/* Mobil søk-rad (togglet av søk-ikon) */
.mobile-search { max-height: 0; overflow: hidden; transition: max-height 260ms ease; border-top: 0 solid var(--border); }
.mobile-search.open { max-height: 80px; border-top: 1px solid var(--border); }
.mobile-search form { display: flex; align-items: center; gap: .5rem; padding: .625rem 1.25rem; background: var(--base); }
.mobile-search .hs-input { background: #fff; border: 1.5px solid var(--border); border-radius: 9999px; padding: 0 1rem; height: 44px; font-size: 1rem; }
.mobile-search .hs-ico { display: none; }

/* Hovednav-linje med megameny (desktop) */
.nav-bar { display: none; border-top: 1px solid var(--border); background: var(--white); }
.main-nav { list-style: none; max-width: var(--max); margin: 0 auto; padding: 0 1rem; display: flex; align-items: center; gap: .125rem; height: 50px; }
.nav-link { display: inline-flex; align-items: center; gap: .3rem; text-decoration: none; color: var(--muted); font-size: .9375rem; font-weight: 500; padding: .5rem .8rem; border-radius: 8px; transition: color 150ms, background 150ms; white-space: nowrap; background: none; border: none; cursor: pointer; font-family: var(--fb); }
.nav-link:hover { color: var(--text); background: var(--surface); }
.nav-link.active { color: var(--cta); font-weight: 600; }
.nav-chev { transition: transform 200ms; }
/* Megameny */
.has-mega { position: static; }
.mega { position: absolute; left: 0; right: 0; top: 100%; background: var(--white); border-top: 1px solid var(--border); box-shadow: 0 16px 32px rgba(44,36,32,.12); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity 180ms, transform 180ms, visibility 180ms; z-index: 150; }
.has-mega:hover .mega, .has-mega:focus-within .mega, .has-mega.open .mega { opacity: 1; visibility: visible; transform: translateY(0); }
.has-mega:hover .nav-chev, .has-mega:focus-within .nav-chev, .has-mega.open .nav-chev { transform: rotate(180deg); }
.mega-inner { max-width: var(--max); margin: 0 auto; padding: 1.25rem 1.25rem 1.75rem; display: block; max-height: 70vh; overflow-y: auto; }
.mega-flat { list-style: none; columns: 4; column-gap: 1.5rem; }
.mega-flat li { break-inside: avoid; }
.mega-flat a { display: flex; align-items: center; justify-content: space-between; gap: .5rem; text-decoration: none; color: var(--text); font-size: .9375rem; font-weight: 500; padding: .45rem .6rem; margin: 0 -.6rem .1rem; border-radius: 7px; transition: color 150ms, background 150ms; }
.mega-flat a:hover { color: var(--cta); background: var(--surface); }
.mega-flat-count { font-size: .75rem; color: var(--muted); font-weight: 500; }
.mega-flat a:hover .mega-flat-count { color: var(--cta); }
.mega-top { grid-column: 1 / -1; display: flex; align-items: center; gap: 1.25rem; padding-bottom: 1rem; margin-bottom: .25rem; border-bottom: 1px solid var(--border); }
.mega-seeall { display: inline-flex; align-items: center; gap: .4rem; text-decoration: none; color: var(--cta); font-weight: 700; font-size: .9375rem; }
.mega-seeall svg { transition: transform 200ms; }
.mega-seeall:hover svg { transform: translateX(3px); }
.mega-allprod { text-decoration: none; color: var(--muted); font-weight: 600; font-size: .9375rem; }
.mega-allprod:hover { color: var(--cta); }
.mega-col h3 { font-family: var(--fb); font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--warm-d); margin-bottom: .6rem; }
.mega-col ul { list-style: none; display: flex; flex-direction: column; gap: .1rem; }
.mega-col ul a { display: block; text-decoration: none; color: var(--text); font-size: .9375rem; font-weight: 500; padding: .4rem .5rem; margin-left: -.5rem; border-radius: 7px; transition: color 150ms, background 150ms; }
.mega-col ul a:hover { color: var(--cta); background: var(--surface); }
@media (min-width: 900px) {
  .header-search { display: flex; }
  .search-toggle { display: none; }
  .mobile-search { display: none; }
  .nav-bar { display: block; }
  .hamburger-btn { display: none; }
  .logo-text { font-size: 1.375rem; }
}

/* Mobil-drawer */
.drawer-overlay { display: none; position: fixed; inset: 0; background: rgba(44,36,32,.35); z-index: 300; backdrop-filter: blur(2px); }
.drawer-overlay.open { display: block; }
.drawer { position: fixed; inset: 0 0 0 auto; width: min(320px, 88vw); background: var(--white); z-index: 400; display: flex; flex-direction: column; transform: translateX(100%); transition: transform 300ms cubic-bezier(.32,.72,0,1); overflow-y: auto; }
.drawer.open { transform: translateX(0); }
.drawer-head { display: flex; align-items: center; justify-content: space-between; padding: 1.25rem 1.25rem 1rem; border-bottom: 1px solid var(--border); }
.drawer-head .d-logo { font-family: var(--fh); font-size: 1.125rem; font-weight: 700; color: var(--text); }
.drawer-head .d-logo em { color: var(--cta); font-style: italic; }
.close-btn { width: 44px; height: 44px; padding: 0; border: none; background: none; cursor: pointer; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: background 150ms; }
.close-btn:hover { background: var(--surface); }
.drawer-nav { list-style: none; padding: .5rem 0; flex: 1; }
.drawer-nav a { display: flex; align-items: center; justify-content: space-between; padding: .875rem 1.25rem; text-decoration: none; color: var(--text); font-size: 1rem; font-weight: 500; transition: background 150ms; }
.drawer-nav a:hover { background: var(--surface); }
.drawer-nav > li > a { font-size: 1rem; }
/* Drawer-accordion (Kategorier) */
.drawer-acc-btn { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: .875rem 1.25rem; background: none; border: none; cursor: pointer; font-family: var(--fb); font-size: 1rem; font-weight: 500; color: var(--text); transition: background 150ms; }
.drawer-acc-btn:hover { background: var(--surface); }
.drawer-acc-chev { transition: transform 200ms; color: var(--muted); }
.drawer-acc-btn[aria-expanded="true"] .drawer-acc-chev { transform: rotate(180deg); }
.drawer-sub { max-height: 0; overflow: hidden; transition: max-height 260ms ease; background: var(--base); }
.drawer-sub.open { max-height: 340px; }
.drawer-sub a { padding: .75rem 1.25rem .75rem 2rem; font-size: .9375rem; font-weight: 500; color: var(--muted); }
.drawer-sub a:hover { color: var(--cta); }
.drawer-sub-all { color: var(--cta) !important; font-weight: 600 !important; }
.drawer-foot { padding: 1.25rem; border-top: 1px solid var(--border); }
.drawer-foot a { display: block; text-align: center; background: var(--cta); color: #fff; font-weight: 600; font-size: .9375rem; padding: .875rem; border-radius: 9999px; text-decoration: none; }
.drawer-foot a:hover { background: var(--cta-h); }
@media (prefers-reduced-motion: reduce) { .drawer { transition: none !important; } }

/* Footer */
.site-footer { background: var(--footer-bg); color: rgba(255,255,255,.85); padding: 3rem 1.25rem 0; }
.footer-grid { display: grid; grid-template-columns: 1fr; gap: 2.25rem; padding-bottom: 2.5rem; border-bottom: 1px solid rgba(255,255,255,.1); }
@media (min-width: 600px) { .footer-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .footer-grid { grid-template-columns: 2fr 1fr 1fr 1fr; gap: 3rem; } .site-footer { padding: 3rem 3rem 0; } }
.footer-logo-wrap { font-family: var(--fh); font-size: 1.25rem; font-weight: 700; color: #fff; letter-spacing: -.01em; margin-bottom: .875rem; display: flex; align-items: center; gap: .5rem; }
.footer-logo-wrap em { color: var(--warm); font-style: italic; }
.footer-logo-mark { width: 30px; height: 30px; border-radius: 7px; background: rgba(201,168,168,.15); display: flex; align-items: center; justify-content: center; font-size: .9375rem; }
.footer-desc { font-size: .875rem; font-weight: 300; line-height: 1.7; color: rgba(255,255,255,.8); margin-bottom: 1.125rem; max-width: 26ch; }
.footer-contact { font-size: .875rem; line-height: 1.9; color: rgba(255,255,255,.8); }
.footer-contact a { color: var(--warm); text-decoration: none; }
.footer-contact a:hover { text-decoration: underline; }
.footer-hours-wrap { margin-top: 1.125rem; padding-top: 1.125rem; border-top: 1px solid rgba(255,255,255,.1); max-width: 230px; }
.footer-hours-label { display: block; font-size: .6875rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: rgba(255,255,255,.45); margin-bottom: .625rem; }
.footer-hours { font-size: .8125rem; color: rgba(255,255,255,.78); display: grid; grid-template-columns: auto 1fr; column-gap: 1rem; row-gap: .4rem; }
.footer-hours div { display: contents; }
.footer-hours dt { font-weight: 400; color: rgba(255,255,255,.58); }
.footer-hours dd { margin: 0; text-align: right; color: rgba(255,255,255,.9); font-variant-numeric: tabular-nums; }
.social-links { display: flex; gap: .4rem; margin-top: 1.125rem; }
.social-btn { width: 36px; height: 36px; border-radius: 8px; background: rgba(255,255,255,.08); border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.72); text-decoration: none; transition: background 150ms, color 150ms; }
.social-btn:hover { background: rgba(201,168,168,.2); color: var(--warm); }
.social-btn:focus-visible { outline: 3px solid var(--warm); outline-offset: 2px; }
.footer-col h4 { font-size: .72rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: rgba(255,255,255,.7); margin-bottom: .875rem; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: .45rem; }
.footer-col ul li a { font-size: .9375rem; color: rgba(255,255,255,.82); text-decoration: none; transition: color 150ms; }
.footer-col ul li a:hover { color: #fff; }
/* Footer-kolonne-header (accordion på mobil, statisk på desktop) */
.footer-col-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; background: none; border: none; padding: 0; cursor: default; color: inherit; font-family: var(--fb); text-align: left; }
.fc-chev { display: none; color: rgba(255,255,255,.5); flex-shrink: 0; transition: transform 200ms; }
@media (max-width: 599px) {
  .footer-col { border-bottom: 1px solid rgba(255,255,255,.1); }
  .footer-col-toggle { cursor: pointer; padding: .9rem 0; }
  .footer-col-toggle h4 { margin-bottom: 0; }
  .fc-chev { display: block; }
  .footer-col-toggle[aria-expanded="true"] .fc-chev { transform: rotate(180deg); }
  .footer-col ul { max-height: 0; overflow: hidden; transition: max-height 280ms ease; }
  .footer-col.open ul { max-height: 380px; padding-bottom: .9rem; }
  .footer-grid { gap: 0; }
}
.footer-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding: 1.5rem 0; font-size: .8125rem; color: rgba(255,255,255,.6); }
.payment-logos { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.pay-logo { height: 20px; padding: 0 .45rem; background: rgba(255,255,255,.1); border-radius: 4px; display: flex; align-items: center; font-size: .6rem; font-weight: 700; color: rgba(255,255,255,.6); letter-spacing: .04em; }
.footer-links { display: flex; gap: 1rem; flex-wrap: wrap; }
.footer-links a { color: rgba(255,255,255,.6); text-decoration: none; }
.footer-links a:hover { color: #fff; }

/* Handlekurv-ikonet "hopper" kort når en vare legges til, uansett side */
@keyframes cartBump{0%{transform:scale(1)}30%{transform:scale(1.25)}60%{transform:scale(.95)}100%{transform:scale(1)}}
.header-cart-link.cart-bump{animation:cartBump 420ms ease}

/* Cookie-banner (CookieYes): fast i pluginens egen mal er lenker, fokusramme, «Endre samtykke»-knapp og «Alltid aktiv» blå/grønn.
   Overstyrt til sidens egne farger (2026-11-14), så de ikke avhenger av at banneret lagres på nytt. */
.cky-notice-des a.cky-policy,.cky-notice-des button.cky-policy,
button.cky-show-desc-btn:not(:hover):not(:active),
.cky-preference-content-wrapper .cky-show-desc-btn{color:var(--cta) !important}
.cky-notice-des a.cky-policy:focus-visible,.cky-notice-des button.cky-policy:focus-visible,
.cky-footer-wrapper a:focus-visible,.cky-btn:focus-visible,.cky-show-desc-btn:focus-visible{outline:2px solid var(--cta) !important;outline-offset:2px}
.cky-switch input[type="checkbox"]:checked{background:var(--cta) !important}
.cky-btn-revisit-wrapper{background:var(--cta) !important}
.cky-accordion-header .cky-always-active{color:var(--cta-h) !important}
.cky-btn-accept:hover{background:var(--cta-h) !important;border-color:var(--cta-h) !important}