/** Shopify CDN: Minification failed Line 270:30 Expected "}" to go with "{" **/ /* ========================================================= LASTU – SHOPIFYN EVÄSTEBANNERI (#shopify-pc__banner) Siirretty sellaisenaan edellisestä live-teemasta ("Denton headings preview", assets/lastu-dynamo.css rivit 580–831) 4.8.2026. Banneri ei ole teeman oma section vaan Shopifyn natiivi Privacy Consent -banneri, joten se tyylitellään sen omilla id/class-nimillä – siksi kaikki !important. Kaksi asiaa käännetty Conceptin nimistöön: --FONT-STACK-HEADING / --FONT-STACK-BODY → --font-heading-family / --font-body-family .no-touchevents → .no-touch (Conceptin oma luokka :ssä) ========================================================= */ #shopify-pc__banner { font-family: var(--font-heading-family) !important; color: #ffef91 !important; /* LISÄYS Conceptia varten: Concept keskittää bannerin tekstin, Dynamo ei. Ilman tätä otsikko ja leipäteksti olisivat keskitettyjä eikä ulkoasu vastaisi edellistä teemaa. "Hallinnoi asetuksia" pysyy keskitettynä, koska sillä on oma text-align alempana. */ text-align: left !important; /* Kelluva 10 px gap alas ja sivuille */ position: fixed !important; inset: auto 10px 10px 10px !important; width: auto !important; max-width: 480px !important; margin: 0 auto !important; /* Lasi tarvitsee oman stacking-kontekstin pseudo-kerroksille */ isolation: isolate !important; overflow: hidden !important; /* Läpikuultava tumma tausta + lasinen vaalea sävytys päälle. Vähemmän peittävä kuin huurre → tausta näkyy lasimaisesti läpi. */ background-color: rgba(0, 26, 26, 0.42) !important; background-image: linear-gradient( 135deg, rgba(255, 239, 145, 0.10) 0%, rgba(255, 239, 145, 0.02) 40%, rgba(255, 255, 255, 0.05) 100% ) !important; /* iOS 26 -lasi: lasi on KIRKKAAMPI kuin huurre. Pienempi blur + brightness/contrast tuo taustan "lasimaisesti" läpi pelkän maitomaisen sumun sijaan. Ei raskaampi kuin pelkkä blur. */ -webkit-backdrop-filter: blur(14px) saturate(190%) brightness(1.08) contrast(1.05) !important; backdrop-filter: blur(14px) saturate(190%) brightness(1.08) contrast(1.05) !important; /* Lasiset reunat: ohut läpikuultava reuna + sisä-highlight + pehmeä varjo */ border: 1px solid rgba(255, 239, 145, 0.28) !important; border-radius: 22px !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), inset 0 -1px 1px rgba(0, 0, 0, 0.25), 0 8px 30px rgba(0, 0, 0, 0.35) !important; } /* ── Reunan linssaus (edge lensing) ── Kirkas, taittuva "lasin paksu reuna". Pelkkä gradientti-reunus, ei lisäkuormaa GPU:lle. Tämä erottaa aidon lasin huurteesta. */ #shopify-pc__banner::after { content: "" !important; position: absolute !important; inset: 0 !important; border-radius: 22px !important; padding: 1.5px !important; pointer-events: none !important; z-index: 1 !important; background: linear-gradient( 135deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 239, 145, 0.10) 28%, rgba(255, 255, 255, 0.00) 50%, rgba(255, 239, 145, 0.12) 72%, rgba(255, 255, 255, 0.40) 100% ) !important; /* Vain reuna jää näkyviin: täyttö maskataan pois */ -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important; -webkit-mask-composite: xor !important; mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important; mask-composite: exclude !important; } /* ── Spekulaarinen kiilto (specular highlight) ── Pehmeä vino valojuova lasin yläpinnalla. */ #shopify-pc__banner::before { content: "" !important; position: absolute !important; inset: 0 !important; border-radius: 22px !important; pointer-events: none !important; z-index: 0 !important; background: radial-gradient( 120% 80% at 15% -10%, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.06) 30%, rgba(255, 255, 255, 0.00) 60% ) !important; } /* Sisältö kiillon ja reunan päälle */ .shopify-pc__banner__wrapper { position: relative !important; z-index: 2 !important; } /* Saavutettavuus: kunnioita "vähennä läpinäkyvyyttä" -asetusta */ @media (prefers-reduced-transparency: reduce) { #shopify-pc__banner { background-color: rgba(0, 26, 26, 0.92) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; } } /* Wrapper – tiivis sisäpadding */ .shopify-pc__banner__wrapper { padding: 12px 16px 14px !important; } /* Teksti-alue */ .shopify-pc__banner__body { margin-bottom: 8px !important; } #shopify-pc__banner__body-title { font-family: var(--font-heading-family) !important; font-size: 0.78rem !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; color: #ffef91 !important; margin: 0 0 2px !important; padding: 0 !important; } .shopify-pc__banner__body p { font-family: var(--font-body-family) !important; font-size: 0.78rem !important; line-height: 1.4 !important; color: #ffef91 !important; margin: 0 !important; padding: 0 !important; } #shopify-pc__banner__body-policy-link { color: #ffef91 !important; text-decoration: underline !important; text-underline-offset: 2px !important; } /* Painike-rivi – flex, Hyväksy+Hylkää rinnakkain */ .shopify-pc__banner__btns { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 6px !important; align-items: center !important; } /* ── Accept: keltainen lasipilleri, tumma teksti ── */ #shopify-pc__banner__btn-accept { order: 1 !important; flex: 1 1 0 !important; width: auto !important; max-width: none !important; min-width: 0 !important; font-family: var(--font-body-family) !important; font-size: 0.8rem !important; padding: 9px 14px !important; background-color: rgba(255, 239, 145, 0.92) !important; color: #001a1a !important; border: 1px solid rgba(255, 255, 255, 0.35) !important; border-radius: 999px !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 2px 8px rgba(0, 0, 0, 0.22) !important; overflow: visible !important; transition: transform .15s cubic-bezier(.22,1,.36,1), box-shadow .15s cubic-bezier(.22,1,.36,1), background-color .15s ease !important; } .no-touch #shopify-pc__banner__btn-accept:hover { background-color: rgba(255, 239, 145, 1) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6), 0 4px 14px rgba(0, 0, 0, 0.3) !important; } #shopify-pc__banner__btn-accept:active { transform: scale(0.97) !important; transition-duration: .06s !important; } /* ── Decline: läpikuultava lasi, keltainen reuna ── */ #shopify-pc__banner__btn-decline { order: 2 !important; flex: 1 1 0 !important; width: auto !important; max-width: none !important; min-width: 0 !important; font-family: var(--font-body-family) !important; font-size: 0.8rem !important; padding: 9px 14px !important; background-color: rgba(255, 239, 145, 0.08) !important; -webkit-backdrop-filter: blur(8px) !important; backdrop-filter: blur(8px) !important; color: #ffef91 !important; border: 1px solid rgba(255, 239, 145, 0.4) !important; border-radius: 999px !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18) !important; overflow: visible !important; transition: transform .15s cubic-bezier(.22,1,.36,1), background-color .15s ease, border-color .15s ease !important; } .no-touch #shopify-pc__banner__btn-decline:hover { background-color: rgba(255, 239, 145, 0.16) !important; border-color: rgba(255, 239, 145, 0.6) !important; } #shopify-pc__banner__btn-decline:active { transform: scale(0.97) !important; transition-duration: .06s !important; } /* ── Hallinnoi asetuksia: tekstilinkki, koko rivi ── */ #shopify-pc__banner__btn-manage-prefs { order: 3 !important; width: 100% !important; flex-basis: 100% !important; font-family: var(--font-body-family) !important; font-size: 0.72rem !important; padding: 0 !important; margin-top: 2px !important; background: none !important; border: none !important; box-shadow: none !important; color: #ffef91 !important; opacity: 0.65 !important; text-decoration: underline !important; text-underline-offset: 2px !important; cursor: pointer !important; text-align: center !important; transition: opacity .15s ease !important; } .no-touch #shopify-pc__banner__btn-manage-prefs:hover { opacity: 1 !important; transform: none !important; box-shadow: none !important;