/* Glass 4 Home – sīkdatņu piekrišanas banneris un iegultā satura vietturi */

.consent-banner {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2000;
    background: var(--white, #fff);
    border-top: 3px solid var(--navy, #12223E);
    box-shadow: 0 -8px 30px rgba(12, 35, 64, 0.18);
    padding: 1.5rem 1rem 1.75rem;
    max-height: 88vh;
    max-height: 88dvh;
    display: flex;
}

.consent-banner__inner {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.consent-banner__title {
    font-family: 'Newsreader', Georgia, serif;
    font-size: 1.25rem;
    color: var(--text-dark, #12223E);
    margin: 0 0 0.5rem;
}

.consent-banner__text {
    font-size: 0.95rem;
    line-height: 1.65;
    color: var(--text-dark, #12223E);
    margin: 0 0 1.1rem;
    max-width: 75ch;
}

/* DVI vadlīnijas: "Piekrītu" un "Nepiekrītu" vienādi noformētas –
   viena krāsa, viens šrifts, viens izmērs, bez izcēluma vienai no tām. */
.consent-banner__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    flex: 0 0 auto;
}

.consent-btn {
    font-family: 'Karla', system-ui, sans-serif;
    font-size: 0.95rem;
    font-weight: 500;
    line-height: 1.2;
    padding: 0.8rem 1.6rem;
    min-width: 11rem;
    text-align: center;
    color: var(--white, #fff);
    background: var(--navy, #12223E);
    border: 2px solid var(--navy, #12223E);
    border-radius: 8px;
    text-decoration: none;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.consent-btn:hover { opacity: 0.85; }

.consent-btn:focus-visible {
    outline: 3px solid var(--navy, #12223E);
    outline-offset: 2px;
}

/* Piekrišanas maiņas poga ir kājenē pie abām politikām un izskatās kā to
   kaimiņi – tā ir saite pēc izskata, poga pēc uzvedības. */
.juridiska-poga {
    font: inherit;
    /* Tās pašas vērtības, kas .kajene a – poga nedrīkst izcelties starp abām
       politikām, jo tā ir tāda paša svara izvēle. */
    color: rgba(255, 255, 255, .7);
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    text-decoration: none;
    transition: color .25s;
}

.juridiska-poga:hover { color: #fff; }

.juridiska-poga:focus-visible {
    outline: 3px solid var(--navy, #12223E);
    outline-offset: 2px;
}

/* ---- Saite uz politiku ----
   Iepriekš tā bija ieslēpta rindkopas beigās. Uzraugi grib to redzēt uzreiz,
   un cilvēks, kurš meklē detaļas, to atrod bez lasīšanas. */
.consent-saite {
    display: inline-block;
    font-family: 'Karla', system-ui, sans-serif;
    font-size: 0.88rem;
    color: var(--text-light, #5E6470);
    text-underline-offset: 3px;
}

.consent-saite:hover { color: var(--primary-navy, #12223E); }

.consent-banner__teksts { min-width: 0; }

/* Virsraksts un saite uz politiku vienā rindā. Atsevišķā rindā saite maksāja
   29 px bannera augstuma, un tieši to pietrūka, lai hero pogas paliktu redzamas. */
.consent-banner__augsa {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 1rem;
    margin-bottom: 0.35rem;
}

.consent-banner__augsa .consent-banner__title { margin: 0; }

/* ---- Nolūku izvēle (izvēršas ar pogu „Izvēlēties") ----
   Bez paneļa un bez kastēm. Iepriekš te bija trīs gaišu toņu slāņi viens virs
   otra – balts banneris, smilškrāsas panelis, gaiši kartīšu foni –, un tie cīnījās
   savā starpā, nedodot nekādu hierarhiju. Tagad nolūki stāv tieši uz bannera,
   atdalīti ar to pašu smalko līniju, kas lietota visā pārējā vietnē. */
.consent-izvele {
    margin: 0 0 1.15rem;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0;
    border: 0;
    background: none;
}

.consent-izvele__saraksts {
    display: grid;
    gap: 1rem;
}

.consent-rinda {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin: 0;
    font-family: 'Karla', system-ui, sans-serif;
    font-size: 0.88rem;
    line-height: 1.55;
    color: var(--text-dark, #12223E);
    cursor: pointer;
}

.consent-teksts { min-width: 0; }

/* ---- Slēdzis ----
   Īstā rūtiņa ir vizuāli paslēpta, bet fokusējama; šis ir tās attēls.
   Pseidoelementi uz <input> ir aizstājamais elements, un pārlūki tos renderē
   nekonsekventi, tāpēc slēdzis ir atsevišķs <span>. */
.consent-sledzis {
    flex: 0 0 auto;
    position: relative;
    width: 40px;
    height: 22px;
    margin-top: 0.12rem;
    box-sizing: border-box;
    border: 1px solid var(--linija, rgba(13, 28, 60, .14));
    border-radius: 999px;
    background: var(--stikls-g, #D1D3D5);
    transition: background 0.18s ease, border-color 0.18s ease;
}

.consent-sledzis::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 2px;
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(18, 34, 62, 0.3);
    transition: left 0.18s ease;
}

.consent-rinda input:checked + .consent-sledzis {
    background: var(--primary-navy, #12223E);
    border-color: var(--primary-navy, #12223E);
}

.consent-rinda input:checked + .consent-sledzis::after { left: 20px; }

/* Obligātās nav izvēle – slēdzis ir ieslēgts, bet klusināts un nespiežams. */
.consent-rinda input:disabled + .consent-sledzis { opacity: 0.4; }
.consent-rinda:has(input:disabled) { cursor: default; }

.consent-rinda input:focus-visible + .consent-sledzis {
    outline: 3px solid var(--navy, #12223E);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .consent-sledzis, .consent-sledzis::after { transition: none; }
}

/* ---- Vizuāli paslēpts, bet ekrānlasītājam pieejams ---- */
.vizuali-slepts {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* ---- Iegultā satura vietturis (click-to-load) ---- */
.embed-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.9rem;
    height: 100%;
    min-height: 260px;
    padding: 2rem 1.5rem;
    text-align: center;
    background: linear-gradient(135deg, #E9EBEC 0%, #D1D3D5 100%);
    border-radius: 12px;
}

.embed-placeholder__text {
    margin: 0;
    max-width: 42ch;
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--text-dark, #12223E);
}

.embed-placeholder__hint {
    margin: 0;
    font-size: 0.8rem;
    color: var(--text-light, #5E6470);
}

.embed-placeholder__btn {
    font-family: 'Karla', system-ui, sans-serif;
    font-size: 0.95rem;
    font-weight: 500;
    padding: 0.7rem 1.5rem;
    color: #fff;
    background: var(--navy, #12223E);
    border: none;
    border-radius: 8px;
    cursor: pointer;
}

.embed-placeholder__btn:hover { opacity: 0.88; }

.embed-placeholder__btn:focus-visible {
    outline: 3px solid var(--navy, #12223E);
    outline-offset: 2px;
}

[data-embed-src] iframe {
    width: 100%;
    height: 100%;
    min-height: 260px;
    border: 0;
    border-radius: 12px;
}

@media (max-width: 600px) {
    /* Divas pogas rindā, ne katra savā. Pa vienai tās aizņēma 168 px no 844 px
       ekrāna, un banneris sanāca 44 % no redzamā laukuma. Visas trīs paliek
       vienādi noformētas – mainās tikai izkārtojums, ne izcēlums. */
    .consent-btn {
        flex: 1 1 calc(50% - 0.375rem);
        min-width: 0;
        padding-left: 0.6rem;
        padding-right: 0.6rem;
    }
}


/* ---- Plati ekrāni: viena rinda, ne divas ----
   Uz 1440x900 divrindu banneris bija 226 px augsts un pilnībā aizsedza abas
   hero pogas – „Pieteikties konsultācijai" un „Apskati mūsu darbus". Vienā rindā
   tas ir ap 120 px, un pogas paliek redzamas. Izvēršot nolūku sarakstu, atgriežamies
   kolonnā, jo sarakstam vajag pilnu platumu. */
@media (min-width: 900px) {
    .consent-banner {
        padding: 1.05rem 1rem 1.15rem;
    }

    .consent-banner__inner:not(.ir-izversts) {
        flex-direction: row;
        align-items: center;
        gap: 2.5rem;
    }

    .consent-banner__inner:not(.ir-izversts) .consent-banner__text {
        margin-bottom: 0;
    }

    .consent-banner__inner:not(.ir-izversts) .consent-banner__actions {
        flex-wrap: nowrap;
    }

    .consent-banner__inner:not(.ir-izversts) .consent-btn {
        min-width: 9.5rem;
    }

    .consent-izvele__saraksts {
        grid-template-columns: repeat(3, 1fr);
        gap: 0;
    }

    .consent-rinda { padding: 0 1.75rem; }
    .consent-rinda:first-child { padding-left: 0; }
    .consent-rinda:last-child { padding-right: 0; }
    .consent-rinda + .consent-rinda {
        border-left: 1px solid var(--linija, rgba(13, 28, 60, .14));
    }
}


/* ---- Kamēr banneris ir atvērts, lapa tam atbrīvo vietu ----
   Banneris ir fiksēts pie apakšas, un zem tā atrodas divas svarīgas lietas:
   hero aicinājuma pogas (saturs ir pielīmēts pie hero apakšas) un mobilā lipīgā
   josla (bottom: 0, z-index 70 pret bannera 2000).

   Fiksēti pikseļi te neder: bannera augstums atkarīgs no teksta aplaušanās, un
   uz 1280x720 starpība bija tieši 0 px. Tāpēc banneris pats nomēra savu augstumu
   un ieraksta to mainīgajā --consent-augstums. */
/* Hero saturu ceļam tikai uz platiem ekrāniem. Uz 390 px banneris ir 369 px –
   gandrīz puse ekrāna –, un, ceļot saturu par tik, virsraksta uzraksts uzskrien
   virsū logo galvenē. Uz šaura ekrāna banneris hero apakšu aizsedz, un tas ir
   normāli: izvēle ir viens klikšķis, un pēc tās hero ir vesels. Lipīgā josla
   tiek pacelta abos gadījumos – tā ir vienīgā aicinājuma poga, kas mobilajā
   paliek redzama, kamēr banneris ir atvērts. */
@media (min-width: 900px) {
    .g4h-piekrisana-atverta .hero > .ietvars,
    .g4h-piekrisana-atverta .lapas-hero > .ietvars {
        /* Griesti 22vh: izvēršot nolūku sarakstu, banneris kļūst 341 px, un,
           ceļot saturu par tik, hero uzraksts atdūrās ekrāna augšmalā (top: 0).
           Saliktais banneris ir 117 px un griestos neieskrienas, tāpēc pirmais
           iespaids nemainās. Izvēršot – hero apakšu banneris aizsedz, un tas ir
           pareizi: tajā brīdī cilvēks izvēlas, nevis lasa hero. */
        padding-bottom: calc(var(--hero-apaksa, 56px)
                             + min(var(--consent-augstums, 0px), 22vh)
                             + 1rem);
    }
}

.g4h-piekrisana-atverta .lipiga {
    bottom: var(--consent-augstums, 0px);
}
