/* ========================================================================== Pregled mladenaca — kroj kartica (`/mladenci/`) -------------------------------------------------------------------------- Izvuceno iz `templates/couple/dashboard.html` 27.8.2026. (Vedran, mjereno nad produkcijom): predlozak je nosio 88 kB inline CSS-a, a odgovor pregleda ide s `Cache-Control: no-store` — dakle tih 88 kB putovalo je na SVAKI otvor pregleda, uz nula izgleda da ih preglednik zadrzi. Kao datoteka pod `/static/` dobivaju `max-age=604800` i drugi otvor ih ne placa. REZ je povucen tocno ondje gdje prestaje staticki CSS: `plan_list_css()` makro i grana `if onboarding` OSTAJU inline u predlosku, jer ovise o podacima. `` na ovu datoteku stoji NEPOSREDNO iza tog inline bloka — redoslijed kaskade je time identican zatecenom, sto je i uvjet da rez bude samo transport, a ne promjena izgleda: `.cp-next .cp-plan--kartice` i `.cp-next .cp-plan--kartice .cp-plan-row` deklarirani su na OBA mjesta i pravila odavde moraju i dalje dolaziti POSLIJE inline pravila. Mijenjas li ovu datoteku, bumpaj `?v=` na oba mjesta u dashboard.html (preload u i u tijelu) i pokreni `python scripts/update_asset_version_manifest.py`. ========================================================================== */ /* „Od čega želite krenuti?" (cp-start-*) je VAN (onboarding wizard 2026-08-11): fazu organizacije trajno drži weddings.planning_stage iz wizarda, prijedlog računa services/next_step — session anketa je umrla. */ /* ══ NEDAVNO ════════════════════════════════════════════════════════ Samo stvarni događaji (routes/couple._activity_feed). Prazna lista = sekcija se ne renderira uopće (Bruno t.6). */ .cp-act{ display: flex; flex-direction: column; gap: 0; flex: 1; min-height: 0; overflow-y: auto; } .cp-act-row{ display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: baseline; padding: 11px 2px; border-bottom: 1px dashed rgba(107,78,113,0.15); text-decoration: none; color: inherit; min-height: 44px; } .cp-act-row:last-child{ border-bottom: none; } .cp-act-row:hover .cp-act-text{ color: var(--dash-ink-plum); } .cp-act-text{ font-family: var(--font-display); font-size: 17px; color: var(--dash-ink-strong); line-height: 1.3; } .cp-act-when{ font-family: var(--font-body); font-size: 12px; color: var(--dash-stone); white-space: nowrap; } .diary-gallery{ margin-top: 14px; flex: 1; display: flex; flex-direction: column; align-items: center; gap: 10px; min-height: 0; /* issue 619: polaroid-stog se mjeri prema ŠIRINI KARTICE, ne prema viewportu. */ container-type: inline-size; } .diary-gallery .gal-title{ font-family: var(--font-script); font-size: 22px; color: var(--dash-ink-plum); display: flex; align-items: center; gap: 10px; align-self: stretch; flex-shrink: 0; } .diary-gallery .gal-title::before, .diary-gallery .gal-title::after{ content: ''; flex: 1; height: 1px; background: rgba(200,159,176,0.35); } .diary-gallery .stack{ position: relative; width: 100%; max-width: 380px; flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; } .polaC{ position: absolute; /* issue 619: bio clamp(210px, 20vw, 290px) — širina vezana na VIEWPORT, uz 210px pod. Uz fiksne ±72/70px pomake to je minimalni otisak stoga držalo na 352px, a kartica se na 2-stupčanom rasporedu (≤980px) suzi i ispod 300px → stog je izlazio iz kartice u susjednu i preko sidebara. Sad se mjeri prema kartici (cqw), pa se cijela kompozicija skalira umjesto da se reže. Prva deklaracija je fallback za preglednike bez container queryja. */ width: clamp(150px, 20vw, 290px); width: min(290px, 55cqw); background: var(--dash-surface); padding: 10px 10px 38px; box-shadow: 0 12px 28px -8px rgba(74,52,80,0.45), 0 2px 0 rgba(255,255,255,0.5) inset; border-radius: 4px; transition: transform 0.55s cubic-bezier(.34,.05,.2,1), box-shadow 0.4s cubic-bezier(.34,.05,.2,1); cursor: pointer; text-decoration: none; will-change: transform; } /* Klik-stage: lift + bring forward odmah, transform animira do nove pozicije */ .polaC.shuffling{ z-index: var(--z-bloom) !important; box-shadow: 0 24px 50px -10px rgba(74,52,80,0.55), 0 2px 0 rgba(255,255,255,0.5) inset; } /* Bruno 2026-05-29: bočna slika na hover dolazi NAPRIJED na SVOJU stranu (lijeva dalje lijevo, desna dalje desno) — ne na sredinu (prije je skakala u centar pa je kursor padao s nje → flicker). Digne se, poveća, iznad glavne → poziva na klik. */ .polaC.back1:hover{ transform: rotate(-1deg) translate(-29.7%, -12px) scale(1.14) !important; z-index: var(--z-topbar) !important; opacity: 1 !important; box-shadow: 0 22px 48px -12px rgba(74,52,80,0.48), 0 2px 0 rgba(255,255,255,0.5) inset !important; } .polaC.back2:hover{ transform: rotate(1deg) translate(29%, -12px) scale(1.14) !important; z-index: var(--z-topbar) !important; opacity: 1 !important; box-shadow: 0 22px 48px -12px rgba(74,52,80,0.48), 0 2px 0 rgba(255,255,255,0.5) inset !important; } .polaC .ph{ width: 100%; aspect-ratio: 4/5; overflow: hidden; border-radius: 2px; background: var(--dash-paper); } .polaC .ph img, .polaC .ph svg{ width: 100%; height: 100%; object-fit: cover; display: block; } .polaC .cap{ position: absolute; left: 0; right: 0; bottom: 10px; text-align: center; font-family: var(--font-script); font-size: 18px; color: var(--dash-ink-plum); } /* S7 (Bruno 2026-05-23): paralel slide animacija (manje rotation, više horizontal translate) — kao listanje slika u pravom životu. */ /* issue 619: pomaci u % vlastite širine, ne u px — 24.8%/24.1% su točno onih 72/70px na 290px polaroidu, pa je fan na širokoj kartici nepromijenjen, a na uskoj se steže zajedno s fotografijom umjesto da probije karticu. */ .polaC.back1{ transform: rotate(-2.5deg) translate(-24.8%, 6px); z-index: var(--z-content); opacity: 0.78; } .polaC.back2{ transform: rotate(2.5deg) translate(24.1%, -4px); z-index: calc(var(--z-content) + 1); opacity: 0.92; } .polaC.front{ transform: rotate(-0.5deg) translate(0, 0); z-index: calc(var(--z-content) + 2); opacity: 1; } /* Rosa "tape" iznad polaroida MAKNUTA (Bruno: "dizajn na papiru se ne vidi"). */ /* Strelice i brojač („N od M") su maknuti — strelice 2026-05-29 (listanje ide klikom na bočni polaroid), brojač nikad nije ni dobio markup: renderira se samo `.gal-dots` za ≤7 fotki. Njihov CSS je stajao mrtav do 2026-08-27. */ .gal-nav{ display: flex; align-items: center; gap: 14px; flex-shrink: 0; margin-top: 14px; position: relative; z-index: var(--z-sticky); } .gal-dots{ display: flex; gap: 8px; align-items: center; } .gal-dots .d{ width: 9px; height: 9px; border-radius: 50%; background: rgba(107,78,113,0.22); border: none; padding: 0; cursor: pointer; transition: all 0.25s; flex-shrink: 0; } .gal-dots .d.on{ background: var(--dash-ink-plum); transform: scale(1.15); } .gal-dots .d:hover{ background: var(--dash-amp); } /* S11 (Bruno 2026-05-22): mobile poboljšanje smart dots — tap target bigger (12×12 + 8px hit area), counter veći i čitljiviji na touch. */ @media (max-width: 640px) { .gal-dots { gap: 10px; } .gal-dots .d { width: 10px; height: 10px; /* hit area expansion bez vizualne promjene */ position: relative; } .gal-dots .d::before { content: ''; position: absolute; inset: -7px; } } /* S9 (Bruno 2026-05-22): flex row s .cd-cell segmentima — broj + label u flex-column; labeli garantirano centrirani ispod vrijednosti. */ .diary-timer{ margin-top: clamp(18px, 3vh, 28px); padding: 10px 22px; background: var(--dark-sunk, rgba(250,246,255,0.75)); /* lilac-50 dašak umjesto papir-bež */ border: 1px solid rgba(182,146,212,0.28); /* lilac-400 tint */ border-radius: 100px; /* S10 (Bruno 2026-05-22): "centriraj sve u sredinu pilla, previse lijevo je otislo". Inline-flex pretvoren u centered flex + auto margins. */ display: flex; align-items: center; justify-content: center; gap: 14px; flex-shrink: 0; width: max-content; margin-left: auto; margin-right: auto; } .diary-timer .cd-cell{ display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 38px; } .diary-timer .tn{ font-family: var(--font-display); font-weight: 500; font-size: clamp(20px, 2vw, 24px); line-height: 1; color: var(--dash-ink-strong); letter-spacing: -0.02em; text-align: center; font-variant-numeric: tabular-nums; } /* Rasmus 2026-06-11 (Bruno odobrio): script je igrao dvije uloge na kartici (datum + labeli) — labeli prelaze u tihi Manrope uppercase. */ .diary-timer .tl{ font-family: var(--font-body, 'Manrope', system-ui, sans-serif); font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--dash-meta); text-align: center; line-height: 1; } .diary-timer .tdiv{ width: 5px; height: 5px; border-radius: 50%; background: var(--dash-amp); box-shadow: 0 0 0 3px rgba(200,159,176,0.2); align-self: center; margin-bottom: 14px; /* visually align with numbers (label takes ~14px space) */ } /* R8 (Bruno deep session 2026-05-27): .diary-phrase CSS obrisan. Phrase- aware countdown rečenica je već uklonjena iz template-a (S10K4 superseded Sprint 10 K8 koji vraća triplet kao primary countdown). Klase su bile dead code 8 dana — orphaned po L848 komentaru u prethodnom commit-u. */ @media (max-width: 1024px) { /* WP3 (2026-07-29): odbrojavanje se više NE skriva ispod 979px — Bruno traži "broj dana do dogadjaja" u heroju, a hero je na mobitelu prvi ekran. Blok ≤720px ga steže na kompaktni "N dana". Gal-title hidden. */ /* Odbrojavanje NA NASLOVNOJ više nema pravila ovdje (Vedran 2026-08-09: „ovo odbrojavanje meni piše 365 dana, a ne brojanje dana s lijepim razmakom, tu je stisnuo"). Ova su pravila gasila dvije od tri ćelije i ostavljala jednu zbijenu brojku, a pisana su za STARU parovu naslovnu koje više nema — kartica je sada ista kao gostova i njezino odbrojavanje živi u `dalia-hero-vjencanje.css` s punim tripletom. `.diary-timer` izvan naslovne (ako se ikad pojavi) ostaje netaknut. */ .diary-gallery .gal-title{ display: none; } /* Isti razlog i za naslov karte gostiju: na mobitelu vrpca sklapanja (`.dc-strip--mob`) već nosi ime plohe, pa bi ovaj naslov bio drugi put ista riječ preko slike. */ .logi-title{ display: none; } } /* ── MIDDLE COLUMN ── */ /* Klasika: prijave odmah uz identitet (2,1). Onboarding: TREĆI stupac drugog reda, UZ .cp-next (1/3) — WP3 je ovdje imao grid-column: 2 pa su se Prijave fizički PREKLAPALE s pripreme railom čim profil ima prijave (produkcijski kvar 2026-08-01; na praznim profilima maskirao ga je .cp-next--wide). */ .mid-top{ grid-column: 2; grid-row: 1; } /* WP3 (2026-07-29): stara "Pripreme" kartica u mid-topu (`.pp-card .ch`, `.pp-card-count`, `.pp-card-next*`) obrisana; 2026-08-12 je i pripreme rail otišao s početne (to-do lista u .cp-next), a s punom listom na /mladenci/pripreme rail komponenta je obrisana iz repoa — `.pp-card*` imena više ne postoje nigdje. Klasični fallback "Pripreme" pointer (kad nema ni prijava ni novosti) i dalje koristi svoje `.cp-prep-*` klase. */ .mid-bot{ grid-column: 2; grid-row: 2; } /* Klasični "Pripreme" pokazivač u mid-topu (fallback bez prijava/novosti). */ .cp-prep-next{ display: flex; flex-direction: column; gap: 4px; margin: 6px 0 auto; } .cp-prep-label{ font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase; color: var(--dash-ink-plum); } .cp-prep-title{ font-family: var(--font-display); font-weight: 500; font-size: 20px; line-height: 1.15; color: var(--dash-ink-strong); } .cp-prep-title a{ color: inherit; text-decoration: none; } .cp-prep-title a:hover{ color: var(--dash-mauve); } .cp-prep-desc{ font-family: var(--font-body); font-size: 13.5px; line-height: 1.45; color: var(--dash-stone); } /* Sprint 10 K6 (Bruno 2026-05-19): RSVP urgency border kad phase je urgency/panic AND pending > 0. Gold 2px top — diskretno-stress signal, ne crveni alarm. Mobile recent rows kapiraju na 3 (4. red bio šum ispod CTA "Pošaljite podsjetnik"). */ .mid-top--urgent{ border-top: 2px solid var(--gold); } @media (max-width: 768px) { .recent .r:nth-child(n+5){ display: none; } /* R5 (Rasmus deep session 2026-05-27): tap target bump za checklist iz padding: 7px 6px (~36px) na padding: 10px 8px (~44px iOS standard). */ .cli{ padding: 10px 8px; } /* R6 (Rasmus deep session 2026-05-27): "more" link tap target bump iz padding-top: 6px (~28px) na padding: 10px 0 6px (~44px iOS standard). */ .more-c{ padding: 10px 0 6px; } } /* ── PHASE-AWARE CONDITIONAL UI ── Bruno Q1 odluka (deep session 2026-05-27): `` atribut iz handler-a omogućava per-phase UI varijacije. Aktivirano za final-week persona (phase ∈ {urgency, panic, today}) — Ana je 100% mobile u zadnjem tjednu i treba sat-broj + manje šuma. Stage B (Luka) ožičava data-attribute u routes/couple.py. CSS ovdje je defensive: ako data-phase nije set ili je u {ease, building, active, memory}, ponašanje je isto kao prije ove izmjene. */ /* (B1) Diary-timer triplet — show na mobile kad je phase final-week. Inače hidden (postojeći @ 979px hide se preserva za ne-urgency phase). Smell test #7 — final-week Ana treba sat-broj u zadnja 24h. */ @media (max-width: 1024px) { body[data-phase="urgency"] .diary-timer, body[data-phase="panic"] .diary-timer, body[data-phase="today"] .diary-timer { display: flex; } } /* (B2) R4 — Wishlist phase-hide UKINUT (Bruno 2026-05-29): right-bot sad drži vinyl gramofon koji mora biti UVIJEK vidljiv (i u zadnjem tjednu — triaža pjesama traje do kraja). Prije se cijeli right-bot skrivao u final-week fazama pa vinyl nije bio vidljiv kad je datum blizu. */ /* (B3) Final-week (urgency/panic/today): Prijave odmah ispod heroja — Ana 3 dana prije zna "gdje je", treba "tko još nije potvrdio" (Bruno Q1). WP3 korekcija: hero OSTAJE prvi (nosi odbrojavanje, koje je u zadnjem tjednu najvažnija brojka) — mijenja se samo tko dolazi drugi. `.cp-grid` prefiks NUŽAN: diže specifičnost na (0,3,1) da nadjača base mobilni order block (.cp-grid .mid-top = (0,2,0)) niže u fajlu — inače je phase swap mrtav (Rasmus gate 2026-06-04). */ @media (max-width: 768px) { body[data-phase="urgency"] .cp-grid .mid-top, body[data-phase="panic"] .cp-grid .mid-top, body[data-phase="today"] .cp-grid .mid-top { order: 2; } body[data-phase="urgency"] .cp-grid .cp-next, body[data-phase="panic"] .cp-grid .cp-next, body[data-phase="today"] .cp-grid .cp-next { order: 3; } } /* ── RSVP CARD ── */ .rs{ display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 0; overflow: hidden; } .rs .big{ display: flex; align-items: baseline; gap: 10px; justify-content: center; letter-spacing: -0.02em; flex-shrink: 0; } .rs .num{ font-family: var(--font-display); font-weight: 500; font-size: clamp(40px, 4.5vw, 56px); color: var(--dash-ink-plum); line-height: 0.9; letter-spacing: -0.03em; } .rs .sep{ font-family: var(--font-script); font-size: 24px; color: var(--dash-amp); } .rs .total{ font-family: var(--font-display); font-weight: 400; font-size: 32px; color: var(--dash-meta); } .rs .sub{ text-align: center; font-family: var(--font-script); font-size: 18px; color: var(--dash-meta); margin-top: -4px; } .rs .bar{ display: flex; height: 6px; border-radius: 100px; overflow: hidden; background: rgba(184,165,204,0.18); } .rs .bar .y{ background: linear-gradient(90deg, var(--dash-done), var(--dash-done-ink)); } .rs .bar .n{ background: var(--dash-amp); } .rs .bar .p{ background: rgba(184,165,204,0.4); } .rs .recent{ margin-top: 4px; padding-top: 8px; border-top: 1px dashed rgba(107,78,113,0.2); display: flex; flex-direction: column; gap: 2px; flex: 1; min-height: 0; overflow-y: auto; } .rs .rsub{ font-family: var(--font-script); font-size: 16px; color: var(--dash-amp); } /* Redizajn 2026-06-06: bez "online" točkice — status je RIJEČ uz ime. Grid: ime (raste) · status · gumbi. */ /* Bruno 2026-06-06: avatar gosta + veći redovi (~4 stану), da se lijepo vidi tko je. */ .rs .r{ display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 11px; padding: 7px 0; align-items: center; } /* Identitet je JEDAN klik-cilj (Rasmus §2, 2026-08-02): avatar i ime su prije stajali kao dva susjedna elementa od kojih nijedan nije vodio nikamo. Grid je zato izgubio prvi 38px stupac — nosi ga sam link. */ .rs .r .ident{ display: grid; grid-template-columns: 38px minmax(0,1fr); gap: 11px; align-items: center; min-width: 0; text-decoration: none; color: inherit; } .rs .r .ident:hover .nm{ color: var(--dark-ink-plum); text-decoration: underline; text-underline-offset: 3px; } .rs .r .ident:focus-visible{ outline: 2px solid var(--color-deep-mauve); outline-offset: 3px; border-radius: 8px; } .rs .r .rav{ width: 38px; height: 38px; border-radius: 50%; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 15px; font-weight: 500; background: rgba(184,165,204,0.18); color: var(--dash-ink-plum); border: 1px solid rgba(107,78,113,0.15); text-transform: uppercase; flex-shrink: 0; } .rs .r .rav img{ width: 100%; height: 100%; object-fit: cover; display: block; } .rs .r .nm{ font-family: var(--font-display); font-size: 18px; color: var(--dash-ink-strong); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .rs .r .rsvp-btns{ display: flex; gap: 4px; } .rs .r .rb{ width: 26px; height: 26px; border-radius: 50%; border: 1.3px solid rgba(107,78,113,0.2); background: var(--dark-sunk, rgba(253,251,247,0.5)); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s; padding: 0; } .rs .r .rb:hover{ transform: scale(1.12); } /* „Poslije" nije odluka nego njezino odgađanje — bez boje odluke, tiši rub. */ .rs .r .rb.later{ border-color: rgba(107,78,113,0.14); } .rs .r .rb.later:hover{ background: rgba(154,143,166,0.12); border-color: var(--dash-later); } .rs .r .rb.tick.on{ background: rgba(156,174,156,0.25); border-color: var(--dash-done); } .rs .r .rb.x.on{ background: rgba(200,159,176,0.25); border-color: var(--dash-amp); } .rs .r .rb svg{ width: 13px; height: 13px; } .rs .r .rb[disabled]{ cursor: default; } .rs .r .rb[disabled]:hover{ transform: none; } /* Najodlučnija kontrola na decku bila je i najmanja meta u portalu — 26 px (Rasmus §2, STANDARD §e#9). Metu širi nevidljivi ::after, pa vidljivi krug ostaje 26 px i visina reda se ne mijenja. Vodoravno se širi SAMO do polovice razmaka (−6 px uz gap 12 px): ✓ i ✕ su suprotne odluke, pa se njihova dodirna polja ne smiju preklapati. */ .rs .r .rb{ position: relative; } @media (max-width: 768px){ .rs .r .rsvp-btns{ gap: 12px; } .rs .r .rb::after{ content: ''; position: absolute; inset: -9px -6px; } } /* Prelijevanje reda (>4 prijave): tiha linija u tipografiji `.more-c`, bez pilule i bez boje — hijerarhija veličinom. */ .rs .rs-more{ display: block; margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(107,78,113,0.08); font-family: var(--font-script); font-size: 14px; color: var(--text-tertiary); text-decoration: none; } .rs .rs-more:hover{ color: var(--dark-ink-plum); } /* All-clear (sve prijave obrađene) → poziv na akciju (Bruno 2026-06-06). */ .rsvp-allclear{ display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 18px 8px 6px; margin: auto 0; } .rsvp-allclear .ac-spark{ font-size: 22px; color: var(--dash-amp); line-height: 1; } .rsvp-allclear .ac-title{ font-family: var(--font-display); font-size: 20px; color: var(--dash-ink); } .rsvp-allclear .ac-sub{ font-family: var(--font-script); font-size: 15px; color: var(--dash-meta); max-width: 30ch; line-height: 1.35; } .rsvp-allclear .more-c--cta{ margin-top: 6px; } .rsvp-allclear .ac-remind{ background: none; border: none; cursor: pointer; font-family: var(--font-script); font-size: 14px; color: var(--dash-later-soft); text-decoration: underline; text-underline-offset: 3px; padding: 4px; } .rsvp-allclear .ac-remind.is-confirming{ color: var(--dash-ink-plum); } /* ── Karta gostiju (Bruno 2026-06-06, finalno) — STATIČNA slika-teaser (live mapa se nereproducibilno gasila + 502). Slika puni cijelu karticu; header+chip plivaju iznad; klik na karticu → prava /logistika. */ a.logi-card{ text-decoration: none; color: inherit; position: relative; display: block; padding: 0; overflow: hidden; min-height: 220px; } /* padding:0 → slika puni karticu; min-height jamči visinu i na mobilnom gridu (grid-auto-rows:auto) gdje je slika absolute */ a.logi-card:hover .logi-open{ opacity: 1; } a.logi-card:hover .logi-map-img{ transform: scale(1.04); } /* blagi zoom na hover — pozivnica na klik */ /* Preview karte je statična svijetla slika; u dark modu je prigušimo da ne bude jedina bijela ploha na ekranu (živa karta na /logistika ima pravi tamni bazemap). */ body.dark-mode .logi-map-img{ filter: brightness(.72) saturate(.85) contrast(1.04); } .logi-card .ch{ margin: 0; } /* Halo iza teksta — diže naslov sa svijetle, šarene mape (mauve script + sive labele). */ .logi-card-top .ch span{ text-shadow: 0 1px 4px rgba(253,251,247,0.95), 0 0 2px rgba(253,251,247,0.9); } .logi-card .ch .logi-open{ font-family: var(--font-script); font-size: 16px; color: var(--dash-ink-plum); opacity: 0.85; transition: opacity .2s; } .logi-map-img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 52% 40%; /* drži venue pin + cluster u kadru pri cropu na širu karticu */ display: block; background: var(--dash-track); transition: transform .4s ease; } /* Header pliva iznad mape — jači + viši gradijent (drži cream kroz cijeli naslov pa fade). */ .logi-card-top{ position: absolute; top: 0; left: 0; right: 0; z-index: var(--z-lightbox); padding: 13px 16px 30px; pointer-events: none; background: linear-gradient(to bottom, rgba(253,251,247,0.98) 0%, rgba(253,251,247,0.94) 48%, rgba(253,251,247,0.55) 75%, rgba(253,251,247,0)); } /* z-index 600 bio Leaflet ostatak (live-mapa era; Leaflet kontrole 400+). Karta je odavno statična slika, a 600 u root stacking contextu je probijao KROZ vendors dock (z-sticky 10) kad se panel digne preko kartice (Vedran 2026-08-01). Chipu treba samo sloj iznad slike unutar vlastite kartice. */ /* ── Naslov karte gostiju na DESKTOPU (12.9.2026.) ──────────────────── Vrpca sklapanja (`.dc-strip--mob`) je iznad 900 px `display:none`, pa je kartica ondje bila samo siva slika: bez naslova, bez poveznice, i sama nije ``. Galerija taj razred rješava vlastitim `.gal-title`; ovo je njezin parnjak. Pliva iznad slike s istim papirnatim gradijentom kojim `.logi-card-top` diže tekst sa šarene mape. Na mobitelu se gasi, ondje vrpca već nosi isto ime. */ .logi-title{ position: absolute; top: 0; left: 0; right: 0; z-index: calc(var(--z-content) + 1); display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 13px 16px 26px; pointer-events: none; font-family: var(--font-script); font-size: 22px; color: var(--dash-ink-plum); background: linear-gradient(to bottom, rgba(253,251,247,0.98) 0%, rgba(253,251,247,0.94) 48%, rgba(253,251,247,0.55) 75%, rgba(253,251,247,0)); } .logi-title em{ font-style: italic; } .logi-title-open{ font-family: var(--font-script); font-size: 16px; color: var(--dash-ink-plum); opacity: .85; text-decoration: none; pointer-events: auto; flex: 0 0 auto; } .logi-title-open:hover{ opacity: 1; } /* Tamni mod: isti papirnati veo, ali iz tokena plohe, da naslov ne sjedi na svijetloj traci preko prigušene mape. */ body.dark-mode .logi-title{ background: linear-gradient(to bottom, var(--cpl-dark-surface-2) 0%, var(--cpl-dark-surface-2) 48%, rgba(0,0,0,0) 100%); } .logi-overlay{ position: absolute; left: 12px; bottom: 12px; z-index: calc(var(--z-content) + 1); pointer-events: none; } .logi-chip{ font-family: var(--font-script); font-size: 14px; color: var(--dash-ink); background: var(--dark-surface, rgba(253,251,247,0.93)); border: 1px solid rgba(107,78,113,0.15); padding: 4px 13px; border-radius: 100px; box-shadow: 0 2px 8px -3px rgba(74,52,80,0.28); } .logi-venue-pin span{ display: block; width: 14px; height: 14px; border-radius: 50%; background: var(--dash-ink-plum); border: 2.5px solid var(--dash-surface); box-shadow: 0 0 0 3px rgba(184,165,204,0.45), 0 2px 6px rgba(74,52,80,0.4); } /* ── CHECKLIST ── */ .cl{ display: flex; flex-direction: column; gap: 0; flex: 1; min-height: 0; overflow-y: auto; } .cli{ display: grid; grid-template-columns: 24px 1fr auto; gap: 12px; align-items: center; padding: 7px 6px; border-bottom: 1px dashed rgba(107,78,113,0.15); color: inherit; text-decoration: none; border-radius: 6px; transition: background 0.15s; } a.cli:hover{ background: rgba(232,197,212,0.18); } a.cli:hover .cn{ color: var(--dash-ink-plum); } .cli:last-child{ border: none; } .cli .cb{ width: 22px; height: 22px; border-radius: 50%; border: 1.8px solid rgba(200,159,176,0.55); display: flex; align-items: center; justify-content: center; background: var(--dark-sunk, rgba(253,251,247,0.4)); } .cli.done .cb{ background: rgba(156,174,156,0.2); border-color: var(--dash-done); } .cli .cb svg{ width: 14px; height: 14px; } .cli .cn{ font-family: var(--font-display); font-size: 16px; color: var(--dash-ink-strong); } /* Bruno 2026-05-29: bez precrtavanja — radnje se uvijek mogu uređivati; samo checkmark + blaga boja označavaju gotovo. */ .cli.done .cn{ color: var(--dash-ink-plum); } .cli .cv{ font-family: var(--font-script); font-size: 16px; color: var(--dash-meta); } .cl-sub{ font-family: var(--font-script); font-size: 16px; color: var(--dash-amp); margin: 6px 0 2px; display: flex; align-items: center; gap: 8px; } .cl-sub::before, .cl-sub::after{ content: ''; flex: 1; height: 1px; background: rgba(200,159,176,0.35); } /* Sprint 10 K5 (Rasmus 2026-05-19): metric strip — passive readings, ne tasks. Ista grid struktura kao `.cli`, ali `.ci` ikona container je bez bordera / bg / radiusa. Razmak (margin-top 18px) je separator, label-a ne treba. */ .cl-metrics{ display: flex; flex-direction: column; gap: 0; margin-top: 18px; } .cli--metric .ci{ width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; } .cli--metric .ci svg{ width: 16px; height: 16px; } .cli--metric:last-child{ border: none; } /* ── RIGHT COLUMN ── */ /* Bruno 2026-06-06: Pjesme kartica (gramofon) VRAĆENA na pregled — korisna za pregled+triažu na licu mjesta. Floating player (_vinyl_player.html) se sad pojavljuje SAMO izvan pregleda kad pjesma svira/čeka triažu (handoff preko sessionStorage dwVinylState). Na pregledu floating baila (vidi komponentu). */ /* WP3 (2026-07-29): `.right-top` (velika kartica dvorane) je maknuta s decka — njezin identitet (naziv + grad) sad stoji u heroju, fotografija u kartici "Dvorana" u nizu priprema, a kontakti/karta su u /mladenci/logistika. Tri prikaza iste dvorane na jednom ekranu bila su duplikat, a deck od 8 ploha protivi se "manje kartica, više fotografija". Inspiracija (venue showcase) živi dalje kao jedno od četiri stanja kartice dvorane; od 12.9.2026. ta kartica ima svoju ćeliju u OBA moda i više ne posuđuje `.mid-bot` (karta gostiju je ondje uvijek). */ .right-top{ grid-column: 3; grid-row: 1; } .right-bot{ grid-column: 3; grid-row: 2; display: grid; grid-template-rows: 1fr; gap: 14px; min-height: 0; } /* ── IMENA U HERO KARTICI: JEDAN KROJ ZA OBA MODA ───────────────── Ovdje je stajalo pravilo koje je imena u vodiču polagalo U RED, jer je vodičeva naslovna bila ŠIROKA (1 / -1) ali NISKA (.85fr), pa se složeni stupac rezao. Od 12.9.2026. naslovna je i u vodiču obična ćelija iste širine kao svaka druga kartica (Vedran: „običan 3-2 grid"), dakle uska i visoka, točno onakva kakvu složeni stupac traži. Pravilo odlazi zajedno s razlogom zbog kojeg je nastalo; kroj imena dolazi iz `dalia-hero-vjencanje.css`, isti kao kod gosta. ── */ /* ── VODIČ: kartice bogatog plana i zbijanje ploha (≥1025px) ──────── */ @media (min-width: 1025px){ /* BOGATI PLAN (Vedran 2026-08-12) — ćelija decka je NIŽA od stranice priprema (jedan red mreže od tri), pa se ploha ovdje zbija: 76→62px i razmak 10→8. Tap-cilj ostaje ≥44px, a mobitel se ne dira (ondje kartica raste koliko treba). Pravilo stoji u OVOM bloku jer je to jedini blok ove datoteke koji nosi raspored decka (#1525 je iznad dodao još jedan ≥981px blok, ali samo za imena u hero kartici). */ .cp-next .cp-plan--kartice{ gap: 8px; } /* 10.9.2026.: uspravna ispuna 10→8. Ploha je time 62px umjesto 66, pa u oknu od 218px (1440×900) stanu DVIJE cijele plohe umjesto jedne — razlika je točno tih 8px. Vodoravna ostaje 14, kroj se ne mijenja. */ .cp-next .cp-plan--kartice .cp-plan-row{ min-height: 62px; padding: 8px 14px; } /* Naslov sekcije na decku nosi manje zraka nego na stranici priprema (13.8.2026.): dvije sekcije su same jele 60 px ćelije koja ih drži. 10.9.2026.: još 3px, iz istog razloga kao ploha iznad. */ .cp-next .cp-plan-grp{ padding: 4px 0 3px; } /* ── POPIS PRIPREMA KLIZI, BEZ OKNA (registar: cp-priprema-klizac) ── Vedran 12.9.2026.: „zašto je prikaži više pod pripremama, neka sve bude prikazano i da se scrolla." 10.9. je ovdje živjelo OKNO: skripta je mjerila koliko cijelih ploha stane u ćeliju, ostatak sklanjala pod `hidden` i na dno stavljala „Prikaži više (N)". Rješavalo je pravi kvar (treća ploha presječena po sredini), ali krivim sredstvom — par je u kartici koja obećava CIJELI popis dobivao izrezak i još jedan tap do onoga što je 8.9. tražio da vidi odmah. Okno, njegove klase (`is-okno`, `is-otvoreno`) i njegova skripta su obrisani. Rez sprječava `scroll-snap`, ne skrivanje: klizač se zaustavlja na VRHU plohe ili naslova grupe, pa se red ne može zaustaviti prepolovljen. Magla na dnu kaže da popis ide dalje, a tračnica (mauve obitelj niže, `.cp-plan-groups` u custom scrollbar popisu) da se po njemu klizi. Mobitel ne ulazi ovamo: ondje kartica raste koliko treba. */ /* Tračnica se rezervira uvijek (`scrollbar-gutter`), pa dolazak i odlazak klizača ne pomiče tekst ulijevo ondje gdje klizač jede širinu (Windows, Linux). Na macOS-u je klizač preklopni i ne jede ništa — izmjereno `offsetWidth - clientWidth` = 0. */ .cp-next .cp-plan-groups{ scrollbar-gutter: stable; scroll-snap-type: y proximity; /* 34px, ne 22: plića magla ostavlja tvrdi gornji rub sljedeće plohe kao vidljivu crtu — točno ono što je Vedran 10.9. nazvao broken. Ispod magle stoji crtkana nit podnožja (`.more-c`), pa popis ima i nacrtan kraj, ne samo izblijedjeli. */ -webkit-mask-image: linear-gradient(to bottom, black calc(100% - 34px), transparent); mask-image: linear-gradient(to bottom, black calc(100% - 34px), transparent); } .cp-next .cp-plan-grp, .cp-next .cp-plan-row{ scroll-snap-align: start; } /* Makrov „Prikaži više" (dobavljači preko budžeta, Vedran 8.9.) ostaje i na decku nosi 36px umjesto 44: pravilo vrijedi od 1025px naviše, gdje je pokazivač miš, a svaki oduzeti piksel je piksel manje za pripreme. Mobilnih 44 ostaje netaknuto. */ .cp-next .cp-plan-vise{ min-height: 36px; padding: 4px 2px; } } /* ── Bilješke (Vedran 2026-08-08) ────────────────────────────────── Živi u istoj ćeliji kao gramofon (`.right-bot`), kao drugi red visine `auto` — deck ostaje jedan ekran jer kartica nosi jedan redak polja i popis koji se skrola U SEBI, ne gura stranicu. */ /* ── DVORANA ⇄ BILJEŠKE u istom utoru (Vedran 2026-08-08) ───────── Na DESKTOPU je `.cp-swap` prava ploha: jedno lice vidljivo, drugo sklonjeno, strelice i točkice dolje desno. Na MOBITELU je `display:contents` — omotač nestaje iz stabla okvira i obje kartice padnu u tok kao i sve ostale. To nije trik nego pravilo: izmjena rješava oskudicu visine koja na mobitelu ne postoji. */ /* ⚠️ NIKAD `display:contents` OVDJE (Vedran 2026-08-09: „prva kartica je UVIJEK kartica vjenčanja", a bile su restoran i bilješke ispred nje). `display:contents` miče OKVIR omotača, ali NE i njegovo mjesto u DOM-u. Mobilni redoslijed se pak piše kao `.cp-grid > *{ order:9 }` + izuzeci — dakle po DOM-djeci. Kad omotač nema okvir, grid stavkama postaju njegova DJECA, a ona nisu `.cp-grid > *` i ostaju bez `order`-a. `order:0` je manji od `.cp-hero{order:1}`, pa su dvorana i bilješke skočile PRIJE naslovne. Ista zamka vrijedi za svaki budući omotač u ovom gridu. Zato je `.cp-swap` na mobitelu OBIČAN grid element (jedna stavka, svoj `order` preko `.right-top`), a oba lica su unutra jedno ispod drugoga. */ .cp-swap{ display: flex; flex-direction: column; gap: 10px; min-width: 0; } .cp-swap-nav{ display: none; } @media (min-width: 1025px){ .cp-swap{ display: block; position: relative; min-height: 0; overflow: hidden; } .cp-swap-face{ display: none; height: 100%; } .cp-swap-face.is-on{ display: block; } /* Kartica unutar lica mora popuniti utor — inače bi bilješke (niske) ostavile rupu ondje gdje dvorana (visoka) puni cijelu ćeliju. */ .cp-swap-face > .paperC{ height: 100%; } /* Strelice idu NA BOKOVE, na sredinu visine (Vedran 2026-08-08: „stavi ih normalno sa strane na sredinu"). Bile su skupljene u donjem desnom kutu i sjele točno na `.venue-hero-overlay` — traku s nazivom restorana, adresom i tipkom za poruku. Kartica dvorane svoj sadržaj drži DOLJE (overlay) i GORE DESNO (`.vh-photo-attrib`, atribucija Places fotke), pa je jedina ploha koja je stvarno prazna okomita sredina bokova. Tamo strelica ne pokriva ništa ni na jednoj od dvije kartice. `display:contents` na `.cp-swap-nav` — sam okvir ne postoji, troje djece se pozicionira samostalno. Time strelice nemaju zajedničku pozadinsku plohu koja bi opet nešto prekrila. */ .cp-swap-nav{ display: contents; } .cp-swap-arrow{ position: absolute; top: 50%; transform: translateY(-50%); z-index: var(--z-content); width: 26px; height: 26px; padding: 0; border: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: var(--dash-ink-plum); cursor: pointer; font-size: 16px; line-height: 1; background: color-mix(in srgb, var(--paper) 78%, transparent); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); opacity: 0; transition: opacity .18s var(--ease); } [data-swap-prev]{ left: 6px; } [data-swap-next]{ right: 6px; } /* Mirno stoje dok ruka nije na kartici — izmjena je ionako automatska, strelica je za onoga tko je htio prije. Fokus tipkovnicom ih otkriva jednako kao miš. */ .cp-swap:hover .cp-swap-arrow, .cp-swap:focus-within .cp-swap-arrow{ opacity: 1; } .cp-swap-arrow:hover{ color: var(--dash-mauve); } .cp-swap-arrow:focus-visible{ opacity: 1; outline: var(--focus-ring-width) solid var(--focus-ring-color); outline-offset: var(--focus-ring-offset); } /* Točkice GORE LIJEVO: desno gore je atribucija Places fotke, dolje je overlay. Gornji lijevi kut je jedini prazan na obje kartice. */ .cp-swap-dots{ position: absolute; left: 12px; top: 12px; z-index: var(--z-content); display: inline-flex; gap: 4px; align-items: center; padding: 4px 6px; border-radius: 999px; background: color-mix(in srgb, var(--paper) 70%, transparent); } .cp-swap-dots i{ width: 5px; height: 5px; border-radius: 50%; background: rgba(107,78,113,0.28); display: block; } .cp-swap-dots i.on{ background: var(--dash-mauve); } @media (prefers-reduced-motion: reduce){ .cp-swap-arrow{ transition: none; opacity: 1; } } } .notes-card{ display: flex; flex-direction: column; min-height: 0; } .notes-form{ position: relative; display: flex; flex-direction: column; gap: 7px; } .notes-input{ width: 100%; resize: none; box-sizing: border-box; padding: 9px 11px; border-radius: 10px; border: 1px solid var(--dash-ivory); background: var(--dash-surface); font-family: var(--font-sans); /* ⚠️ NIKAD ISPOD 16px NA POLJU (Vedran 2026-08-09: „kad stisnem da ću napisati nešto u bilješke, previše se zumira, ne bude full screen više"). iOS Safari zumira CIJELU stranicu kad fokusirano polje ima font manji od 16px, i s tog zuma se ne vraća sam. Bilo je 13.5px. Pravilo je zapisano i u kanonu uz `--fs-base` (dalia-portal.css). */ font-size: var(--fs-base); line-height: 1.45; color: var(--charcoal); outline: none; } .notes-input:focus{ border-color: var(--dash-mauve); } .notes-add{ align-self: flex-end; padding: 7px 15px; border-radius: 9px; border: none; background: var(--dash-mauve); color: white; cursor: pointer; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; } .notes-add:disabled{ opacity: .5; cursor: default; } /* Ponuda za `@` ide u FIXED sloj, ne u karticu (Vedran 2026-08-09: „@ izbornik nije lijep… ružna kockasta lista bez dizajna i nije vidljiva, odudara se gore"). Izmjereno: pri 12 pogodaka panel je počinjao 156px IZNAD gornjeg ruba kartice, a `.paperC` ima `overflow:hidden` — pa je gornji dio bio odrezan iz slike I iz hit-testa (`elementFromPoint` na prvoj stavci vraćao je karticu iza, tap se nije dao izvesti). „Lijepo tek kad ostane jedna osoba" je bilo doslovno: samo je jedna stavka stala unutar ruba. `fixed` bježi iz `overflow:hidden` jer nijedan predak nema `transform`/`filter`/`contain` (provjeren cijeli lanac do ). ⚠️ Ako se `.paperC` ili `.cp-swap-face` ikad animira transformom, kvar se vraća — tada ponuda ide u portalom, ne natrag u karticu. Koordinate postavlja `postavi()` u couple-notes.js. */ .notes-sug{ position: fixed; z-index: var(--z-dropdown); background: var(--dash-surface); border: 1px solid var(--dash-ivory); border-radius: 14px; box-shadow: 0 10px 30px -8px rgba(74,52,80,.28), 0 2px 8px -2px rgba(74,52,80,.14); padding: 4px; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; } .notes-sug[hidden]{ display: none; } .notes-sug button{ display: flex; align-items: baseline; gap: 8px; width: 100%; padding: 0 12px; min-height: 44px; border: none; background: none; border-radius: 10px; cursor: pointer; text-align: left; font-family: var(--font-sans); font-size: 14.5px; color: var(--charcoal); } .notes-sug button:hover, .notes-sug button.is-on{ background: rgba(181,107,141,.10); } .notes-sug .sg-hint{ margin-left: auto; font-size: 11px; color: var(--stone); flex-shrink: 0; } .notes-list{ list-style: none; margin: 10px 0 0; padding: 0; overflow-y: auto; min-height: 0; } .notes-list li{ display: flex; align-items: flex-start; gap: 8px; padding: 7px 0; border-top: 1px solid var(--dash-ivory); font-family: var(--font-sans); font-size: 13px; line-height: 1.45; color: var(--charcoal); } .notes-list li:first-child{ border-top: none; } .notes-list .nt-body{ flex: 1; min-width: 0; overflow-wrap: anywhere; } /* Spomen unutar bilješke — samo naglasak, ne link: bilješka sprema tekst, a ne vezu (odredište spomena je sljedeći korak, ne ovaj). */ .notes-list .nt-at{ color: var(--dash-mauve); font-weight: 600; } .notes-del{ flex-shrink: 0; border: none; background: none; cursor: pointer; color: var(--stone); font-size: 15px; line-height: 1; padding: 2px 4px; } .notes-del:hover{ color: var(--dash-ink-strong); } /* ── Vinyl pjesme kartica (gramofon) ───────────────────────────── */ .vinyl-card{ overflow: hidden; } .vinyl-stage{ position: relative; display: flex; flex-direction: column; align-items: center; gap: 7px; flex: 1; min-height: 0; justify-content: flex-start; text-align: center; padding-top: 2px; transition: opacity 0.3s, transform 0.3s; } /* Bruno 2026-05-29: disc-wrap stacionaran (drži iglu + play); rotira samo .vinyl-disc. Veličina 164 (balans: velika ploča ALI ✕/✓ akcije ostaju unutar kartice). */ .vinyl-disc-wrap{ position: relative; width: 164px; height: 164px; flex-shrink: 0; } .vinyl-disc{ position: absolute; inset: 0; width: 164px; height: 164px; border-radius: 50%; background: radial-gradient(circle at 50% 50%, var(--dash-vinyl-label) 0 14%, var(--dash-vinyl-black) 14% 100%); box-shadow: 0 10px 26px -8px rgba(0,0,0,0.55), inset 0 0 0 1px rgba(255,255,255,0.07); } /* Vidljive brazde (linije) na ploči. */ .vinyl-grooves{ position: absolute; inset: 9px; border-radius: 50%; background: repeating-radial-gradient(circle at 50% 50%, rgba(255,255,255,0.14) 0 1px, rgba(255,255,255,0.02) 1px 4.5px); pointer-events: none; } .vinyl-disc.spinning{ animation: vinylspin 3.2s linear infinite; } @keyframes vinylspin{ to{ transform: rotate(360deg); } } .vinyl-label{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 78px; height: 78px; border-radius: 50%; overflow: hidden; z-index: calc(var(--z-content) + 1); background: var(--dash-mauve); display: flex; align-items: center; justify-content: center; box-shadow: inset 0 0 0 3px rgba(0,0,0,0.25), 0 0 0 5px rgba(20,16,22,0.55); } .vinyl-label::after{ /* rupa u sredini ploče */ content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 9px; height: 9px; border-radius: 50%; background: var(--dash-vinyl-black); z-index: calc(var(--z-content) + 2); } .vinyl-label img{ width: 100%; height: 100%; object-fit: cover; } /* Igla / tonearm — stacionaran, pivot gore-desno; spušta se na ploču kad svira. */ .vinyl-tonearm{ position: absolute; top: 2px; right: -2px; width: 16px; height: 16px; z-index: calc(var(--z-content) + 3); pointer-events: none; transform-origin: 50% 50%; transform: rotate(-18deg); transition: transform 0.45s cubic-bezier(0.22,1,0.36,1); } .vinyl-tonearm::before{ /* pivot baza */ content: ''; position: absolute; top: 0; right: 0; width: 16px; height: 16px; border-radius: 50%; background: linear-gradient(135deg,var(--dash-vinyl-disc-hi),var(--dash-vinyl-disc-lo)); box-shadow: 0 1px 4px rgba(0,0,0,0.4); } .vinyl-tonearm::after{ /* ruka igle */ content: ''; position: absolute; top: 11px; right: 6px; width: 4px; height: 70px; border-radius: 3px; background: linear-gradient(180deg,var(--dash-vinyl-arm-hi),var(--dash-vinyl-arm-lo)); transform-origin: top center; transform: rotate(20deg); box-shadow: 0 1px 3px rgba(0,0,0,0.3); } .vinyl-disc-wrap.is-playing .vinyl-tonearm{ transform: rotate(8deg); } /* Play gumb — stacionaran (izvan rotacije), nevidljiv po defaultu, vidi se na hover. */ .vinyl-play{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 48px; height: 48px; border-radius: 50%; z-index: calc(var(--z-content) + 4); background: var(--dark-surface, rgba(255,255,255,0.97)); border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--dash-ink-strong); box-shadow: 0 2px 10px rgba(0,0,0,0.4); opacity: 0; visibility: hidden; transition: opacity 0.15s, transform 0.12s, visibility 0.15s; } .vinyl-disc-wrap:hover .vinyl-play, .vinyl-play:focus-visible{ opacity: 1; visibility: visible; } .vinyl-play:hover{ transform: translate(-50%,-50%) scale(1.08); } .vinyl-play.is-loading{ opacity: 1; visibility: visible; } .vinyl-play .v-ico{ width: 21px; height: 21px; } .vinyl-play .v-play{ margin-left: 2px; } .vinyl-play.is-disabled{ opacity: 0; } .vinyl-meta{ width: 100%; min-width: 0; } /* Naziv + strelice u jednom redu (Bruno 2026-06-14): strelice listaju pjesme. */ .vinyl-titlerow{ display: flex; align-items: center; justify-content: center; gap: 4px; min-width: 0; } .vinyl-title{ font-family: var(--font-display); font-weight: 500; font-size: 16px; color: var(--dash-ink-strong); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.25; /* max-width ostavlja mjesta za obje strelice → na dugom naslovu (ellipsis) grupa [‹ naziv ›] ostaje centrirana, strelice grle naziv (Rasmus 2026-06-14: prije je › "lebdio" desno jer je naslov razvukao red). */ flex: 0 1 auto; min-width: 0; max-width: calc(100% - 68px); } /* Naslov pjesme vodi u Pjesme (Bruno 2026-07-16) — nenametljivo, underline tek na hover. */ a.vinyl-title{ text-decoration: none; } a.vinyl-title:hover, a.vinyl-title:focus-visible{ text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(107,78,113,0.55); } .vinyl-artist{ font-size: 12.5px; color: var(--dash-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .vinyl-guest{ font-family: var(--font-script); font-size: 15px; color: var(--dash-ink-plum); margin-top: 2px; } .vinyl-ch-group{ display: inline-flex; align-items: center; gap: 9px; } .vinyl-ch-link{ color: inherit; text-decoration: none; } .vinyl-ch-link:hover{ text-decoration: underline; text-underline-offset: 3px; } .vinyl-am-badge{ display: inline-flex; align-items: center; gap: 5px; width: max-content; margin: 0; padding: 3px 10px; border-radius: 8px; background: var(--dash-vinyl-badge); color: white; font-size: 10.5px; font-weight: 600; text-decoration: none; flex-shrink: 0; } .vinyl-am-badge:hover{ background: black; } /* "Pjesme" + count pill grupirani lijevo; Apple Music badge ide desno (space-between). */ .vinyl-ch-title{ display: inline-flex; align-items: center; gap: 8px; min-width: 0; } .vinyl-comment{ /* Izvorno `var(--dark-ink, #4a3f33)`: smeda u svijetlom, #D4C4B0 u tamnom. `--dash-ink` je plava-sljiva (#4A3450) pa je svijetli ton odlutao; zato `--dash-ink-brown`, koji u tamnoj temi prati isti preokret. */ font-size: 12px; color: var(--dash-ink-brown); font-style: italic; line-height: 1.4; margin-top: 5px; padding: 6px 10px; border-radius: 8px; background: rgba(184,165,204,0.14); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .vinyl-comment::before{ content: '„'; } .vinyl-comment::after{ content: '"'; } /* Bruno 2026-05-29: prazni komentar se NE smije vidjeti. `.vinyl-comment` ima display:-webkit-box koji je nadjačavao UA [hidden]{display:none} pa su se prikazivali prazni navodnici. Eksplicitni override. */ .vinyl-comment[hidden]{ display: none !important; } .vinyl-actions{ display: flex; gap: 10px; margin-top: 4px; align-items: center; justify-content: center; } /* display:flex nadjačava UA [hidden]{display:none} (kao .vinyl-comment) — bez ovog je triage ostao vidljiv i za vlastite pjesme iako je actions.hidden=true. */ .vinyl-actions[hidden]{ display: none !important; } .vinyl-act{ width: 40px; height: 40px; border-radius: 50%; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; background: var(--dash-surface); transition: transform 0.12s, background 0.15s, border-color 0.15s; } .vinyl-act svg{ width: 17px; height: 17px; } .vinyl-act:hover{ transform: scale(1.08); } .vinyl-x{ border: 1px solid rgba(200,159,176,0.6); color: var(--dash-amp); } .vinyl-x:hover{ background: var(--dash-amp); color: white; } .vinyl-ok{ border: 1px solid rgba(110,129,112,0.6); color: var(--dash-done-ink); } .vinyl-ok:hover{ background: var(--dash-done-ink); color: white; } /* Već odobreno → ✓ ispunjeno (zeleno). */ .vinyl-ok.is-on{ background: var(--dash-done-ink); color: white; border-color: var(--dash-done-ink); } /* Browse strelice (‹ ›) — diskretne, uz odluku. */ .vinyl-nav{ width: 26px; height: 26px; border-radius: 50%; cursor: pointer; border: none; background: transparent; color: var(--dash-muted); font-size: 19px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; transition: color 0.15s, background 0.15s; } .vinyl-nav:hover{ color: var(--dash-ink-plum); background: rgba(184,165,204,0.16); } .vinyl-empty-msg{ font-size: 12.5px; color: var(--dash-muted); margin-top: 2px; } .vinyl-stage.is-leaving{ opacity: 0; transform: translateY(-10px) scale(0.96); transition: opacity 0.32s, transform 0.32s; } .vinyl-stage.is-entering{ opacity: 0; transform: translateY(8px); } /* WP3 (2026-07-29): deck ima tri reda umjesto dva, pa je ćelija pjesama niža. Ploča se stisne da odluka (✓/✕) ostane VIDLJIVA — skrivena odluka je gora od manje ploče. Ispod 981px deck slobodno raste pa ostaje puna veličina. */ @media (min-width: 1025px){ .vinyl-disc-wrap{ width: 140px; height: 140px; } .vinyl-disc{ width: 140px; height: 140px; } .vinyl-label{ width: 66px; height: 66px; } .vinyl-tonearm::after{ height: 58px; } .vinyl-play{ width: 42px; height: 42px; } } /* ── VENUE / DVORANA (right-top u klasici + showcase) ── Velika kartica dvorane VRAĆENA (Vedran 2026-08-01, klasični deck) — s njom se vraćaju `.venue-hero-actions` i `.venue-hero--empty` koje je WP3 obrisao. Showcase (inspiracija) dijeli iste temeljne klase. */ .venue-hero{ padding: 0 !important; overflow: hidden; position: relative; } .venue-hero-photo{ position: absolute; inset: 0; } .venue-hero-photo img{ width: 100%; height: 100%; object-fit: cover; display: block; } /* D1 (Rasmus 2026-08-01): PAPIRNATI veo umjesto tamne plohe (rgba(42,31,46,.93)) — s akvarel identitetom dvorana je jedina fotografija prvog reda, pa bi tamni overlay vukao oko prije imena. Isti pattern kao .cp-hero-veil; tekst je --ink. */ .venue-hero-overlay{ position: absolute; inset: auto 0 0 0; padding: 34px 18px 14px; background: linear-gradient(0deg, var(--paper) 0%, color-mix(in srgb, var(--paper) 86%, transparent) 46%, color-mix(in srgb, var(--paper) 38%, transparent) 78%, transparent 100%); color: var(--dash-ink-strong); display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; } .venue-hero-overlay .vt{ font-family: var(--font-display); font-weight: 500; font-size: clamp(20px, 2.2vw, 26px); margin: 0 0 3px; } .venue-hero-overlay .va{ display: inline-flex; align-items: center; gap: 7px; font-family: var(--font-script); font-size: 19px; color: var(--dash-ink-plum); background: none; border: none; padding: 3px 0; cursor: pointer; text-decoration: none; } .venue-hero-overlay .va:hover{ color: var(--dash-ink-strong); } .venue-hero-overlay .va svg{ width: 15px; height: 15px; } .venue-hero-actions{ display: flex; gap: 8px; flex-shrink: 0; } .venue-hero-actions a, .venue-hero-actions button{ width: 36px; height: 36px; border-radius: 50%; background: rgba(107,78,113,0.07); border: 1px solid rgba(107,78,113,0.26); color: var(--dash-ink-plum); cursor: pointer; display: flex; align-items: center; justify-content: center; text-decoration: none; padding: 0; } .venue-hero-actions a:hover, .venue-hero-actions button:hover{ background: rgba(107,78,113,0.14); } .venue-hero-actions svg{ width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; } /* Kartica se od 2026-08-06 otvara u pregled prostora. Signal je pokazivač i tihi podignuti sloj na hoveru — bez natpisa „klikni" i bez ikone: ploha koja se cijela ponaša kao gumb ne traži naljepnicu (IK#2, izravna manipulacija na objektu). Fokus prsten dolazi iz `*:focus-visible` (`dalia-portal.css`), pa ga ovdje ne treba ponavljati. */ .venue-hero.is-clickable{ cursor: pointer; } @media (hover: hover) and (pointer: fine){ .venue-hero.is-clickable:hover .venue-hero-photo img{ transform: scale(1.02); } } .venue-hero.is-clickable .venue-hero-photo img{ transition: transform .32s var(--ease, cubic-bezier(0.22, 1, 0.36, 1)); } @media (prefers-reduced-motion: reduce){ .venue-hero.is-clickable .venue-hero-photo img{ transition: none; } .venue-hero.is-clickable:hover .venue-hero-photo img{ transform: none; } } /* ── WISHLIST ── */ .ws{ display: flex; flex-direction: column; flex: 1; min-height: 0; overflow-y: auto; } .ws .w{ display: grid; grid-template-columns: 20px 1fr auto; gap: 10px; padding: 4px 0; align-items: center; border-bottom: 1px dashed rgba(107,78,113,0.15); } .ws .w:last-child{ border: none; } .ws .w-c{ width: 18px; height: 18px; border-radius: 50%; border: 1.6px solid rgba(200,159,176,0.55); display: flex; align-items: center; justify-content: center; } .ws .w.done .w-c{ background: rgba(156,174,156,0.2); border-color: var(--dash-done); } .ws .w-c svg{ width: 12px; height: 12px; } .ws .w-n{ font-family: var(--font-display); font-size: 16px; color: var(--dash-ink-strong); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ws .w-p{ font-family: var(--font-script); font-size: 16px; color: var(--dash-meta); } /* ── SONGS ── */ .sg{ display: flex; flex-direction: column; flex: 1; min-height: 0; overflow-y: auto; } .sg .s{ display: grid; grid-template-columns: 1fr auto; gap: 10px; padding: 4px 0; border-bottom: 1px dashed rgba(107,78,113,0.15); align-items: center; } .sg .s:last-child{ border: none; } .sg .t{ font-family: var(--font-display); font-weight: 500; font-size: 16px; color: var(--dash-ink-strong); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .sg .a{ font-family: var(--font-script); font-size: 16px; color: var(--dash-meta); } .sg .btns{ display: flex; gap: 5px; } .sg .sb{ width: 26px; height: 26px; border-radius: 50%; border: 1.3px solid rgba(107,78,113,0.2); background: var(--dark-sunk, rgba(253,251,247,0.5)); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s; padding: 0; } .sg .sb:hover{ transform: scale(1.1); } .sg .sb.tick.on{ background: rgba(156,174,156,0.22); border-color: var(--dash-done); } .sg .sb.x.on{ background: rgba(200,159,176,0.22); border-color: var(--dash-amp); } .sg .sb svg{ width: 14px; height: 14px; } .empty-line{ font-family: var(--font-script); font-size: 18px; color: var(--dash-meta); padding: 12px 0; text-align: center; } /* ── EMPTY STATES (Commit A, 2026-05-17) ── RASMUS: "Dnevnik koji se tek otvara ima bijele stranice s pozivom, ne lažne unose." Empty card collapses na vertical-centered CTA (~88px) umjesto full paperC visine. .more-c--cta je primary verzija CTA linka — bez dashed border-top, veći weight. */ .card-cp.is-empty-cta{ justify-content: center; min-height: 88px; } .card-cp.is-empty-cta .ch{ margin: 0 0 10px; } .more-c--cta{ border-top: none !important; padding-top: 0 !important; margin-top: 0 !important; font-size: 19px !important; color: var(--dash-ink) !important; justify-content: center; align-self: center; } .more-c--cta:hover{ color: var(--dash-ink-strong) !important; } /* Recent RSVP — remind CTA umjesto "Još nema prijava gostiju." labele */ .rsvp-remind{ padding: 14px 0 6px; display: flex; justify-content: center; } /* Dvorana — TIHO stanje (D2, Rasmus 2026-08-01): akvarel + grančica + poziv na razgovor. Stari empty bar ("još nije upisano" na praznoj plohi) se NE vraća — prazan pravokutnik je WP3 zabranio. */ .venue-hero--quiet{ display: flex; align-items: center; justify-content: center; } .vh-quiet-art{ position: absolute; inset: 0; background-image: var(--aq-3); background-size: cover; background-position: center; opacity: var(--aq-empty, .16); } .vh-quiet-in{ position: relative; z-index: var(--z-content); display: flex; flex-direction: column; gap: 6px; align-items: center; text-align: center; padding: 18px 22px; } .vh-quiet-eyebrow{ font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase; color: var(--dash-ink-plum); } .vh-quiet-title{ font-family: var(--font-display); font-size: 18px; color: var(--dash-ink); line-height: 1.35; } .vh-quiet-cta{ font-size: 17px !important; } /* Kartica s dvoranom koju je par UPISAO (13.8.2026.). Prva izvedba je posudila `.vh-quiet-title` (18 px) i drugi `.vh-quiet-eyebrow` za grad — pa je njihova dvorana bila manja od tuđe (ploha prijedloga piše ime u 20–26 px), a grad je nosio kostim oznake kategorije umjesto svoj. Ime je ovdje glavni sadržaj kartice: mjera prati `.venue-hero-overlay .vt`, grad ide u tihi rukopis ispod njega. */ .vh-named-title{ font-family: var(--font-display); font-weight: 500; font-size: clamp(20px, 2.2vw, 26px); line-height: 1.25; color: var(--dash-ink-strong); } .vh-named-city{ font-family: var(--font-script); font-size: 19px; color: var(--dash-ink-plum); margin-top: 2px; } /* Diary polaroid empty state — jedan polaroid, bez stack, bez shadow shuffle */ .stack.stack-empty, .stack.stack-solo{ max-width: 240px; } .stack.stack-empty .polaC, .stack.stack-solo .polaC{ position: relative !important; /* override .polaC absolute */ transform: rotate(-1.5deg) !important; } .polaC.polaC-cta{ cursor: pointer; } .polaC.polaC-cta:hover{ transform: rotate(-1.5deg) translate(0, -4px) !important; } .ph.ph-empty{ background: var(--dash-sunk) !important; display: flex; align-items: center; justify-content: center; text-align: center; } .ph-empty-inner{ display: flex; flex-direction: column; gap: 2px; padding: 14px 12px; font-family: var(--font-script); color: var(--dash-meta); } .ph-empty-line1{ font-size: 17px; line-height: 1.3; } .cap.cap-cta{ color: var(--dash-ink-plum) !important; font-size: 19px !important; } /* Commit B (2026-05-17) `.diary-panel .names-empty*` / `.date-cta` obrisani — identitet-kartica je zamijenjena herojem, a prazno stanje imena/datuma sad nose `.cp-hero-names--empty` i `.cp-hero-add` (WP3, 2026-07-29). */ /* prep_rail_css() + dalia_card_css() VAN (Vedran 2026-08-12) — rail i Dalia kartica su otišli s početne; /mladenci/pripreme emitira svoj. */ /* ── Custom scrollbar (Dalia paleta) ── `.cp-plan-groups` je 10.9.2026. ušao u ovu obitelj umjesto da dobije vlastite boje: otvoreno okno priprema mora imati VIDLJIVU tračnicu (to je „jasan rub" koji kaže da popis ide dalje), a deck već ima jedan izgled klizača i jedno mjesto gdje piše. `overflow-x` je izdvojen jer se tiče samo kartica s hover-skaliranjem — popis priprema na mobitelu ne smije promijeniti nijedno svoje ponašanje. */ .rs .recent, .cl, .ws, .sg, .cp-plan-groups{ scrollbar-width: thin; scrollbar-color: rgba(184,165,204,0.55) transparent; } .rs .recent, .cl, .ws, .sg{ overflow-x: hidden; /* hover scale na tick/x je zalo triggerao h-scrollbar */ } .rs .recent::-webkit-scrollbar, .cl::-webkit-scrollbar, .ws::-webkit-scrollbar, .sg::-webkit-scrollbar, .cp-plan-groups::-webkit-scrollbar{ width: 6px; } .rs .recent::-webkit-scrollbar-track, .cl::-webkit-scrollbar-track, .ws::-webkit-scrollbar-track, .sg::-webkit-scrollbar-track, .cp-plan-groups::-webkit-scrollbar-track{ background: transparent; } .rs .recent::-webkit-scrollbar-thumb, .cl::-webkit-scrollbar-thumb, .ws::-webkit-scrollbar-thumb, .sg::-webkit-scrollbar-thumb, .cp-plan-groups::-webkit-scrollbar-thumb{ background: linear-gradient(180deg, rgba(184,165,204,0.55), rgba(200,159,176,0.6)); border-radius: 100px; } .rs .recent::-webkit-scrollbar-thumb:hover, .cl::-webkit-scrollbar-thumb:hover, .ws::-webkit-scrollbar-thumb:hover, .sg::-webkit-scrollbar-thumb:hover, .cp-plan-groups::-webkit-scrollbar-thumb:hover{ background: linear-gradient(180deg, var(--dash-lilac-hi), var(--dash-ink-plum)); } /* ── Status banner ── */ .cp-status-banner{ background: var(--dark-surface, rgba(253,251,247,0.85)); border: 1px solid rgba(107,78,113,0.18); border-radius: 10px; padding: 10px 14px; margin: 0; flex-shrink: 0; font-family: var(--font-display); font-size: 16px; color: var(--dash-ink); } /* Note modal CSS uklonjen (Bruno 2026-06-06) — "Napomena restoranu" CTA maknut. */ /* ── Responsive ── 3-col grid drži se do 980px. Ispod toga se uplitamo u stack i puštamo prirodan scroll (uska ekranska situacija). */ @media (max-width: 1024px){ .cp-stage{ height: auto; min-height: 0; overflow: visible; display: block; } /* diary-split 2026-06-03: auto-flow za 6 kartica. Identitet (banner) + vinyl pune širine; galerija/RSVP/checklist/venue se slažu u 2 stupca. */ .cp-grid{ grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: auto; flex: none; min-height: 0; } .cp-grid > * { overflow: visible; grid-row: auto; grid-column: auto; } .right-bot { overflow: visible; } /* Identitet bez fotografije = content-driven visina (stari diary-panel duh); banner preko obje kolone u oba moda. */ .cp-hero{ grid-column: 1 / -1; min-height: 0; } /* Rail treba širinu prije nego visinu — na 2 stupca ide punom širinom. */ .cp-next{ grid-column: 1 / -1; } .gallery-panel{ min-height: 280px; } .mid-bot{ min-height: 240px; } .right-top{ min-height: 260px; } .right-bot{ grid-column: 1 / -1; grid-template-rows: auto; grid-template-columns: 1fr; } /* Bruno 2026-05-29: vinyl je jedna kartica → puna širina (ne pola), inače sadržaj (✓/✕) bi se rezao na overflow-hidden paperC. */ .right-bot--single{ grid-template-columns: 1fr; } .right-bot--single .vinyl-card{ max-width: 460px; margin: 0 auto; width: 100%; } .rs, .cl, .ws, .sg, .rs .recent { overflow: visible; } } @media (max-width: 768px){ .cp-stage{ margin: -1rem -0.5rem 0; padding: 12px; padding-bottom: calc(12px + env(safe-area-inset-bottom, 20px)); } .cp-grid{ grid-template-columns: 1fr; } /* BOGATI PLAN (Vedran 2026-08-12) — na 390px svaki piksel ide naslovu: ploha diše uže margine (16→8) i rub retka je uži (14→10). Izmjereno headlessom: bez toga „Partner još nije prihvatio poziv" završi na „…". Pomiče se CIJELA kartica (naslov, sekcije, redovi, „sve pripreme"), pa ništa ne ispada iz vertikale. */ .cp-next{ padding-left: 8px; padding-right: 8px; } .cp-next .cp-plan--kartice .cp-plan-row{ padding: 12px 10px; } .cp-hero, .cp-next, .mid-top, .mid-bot, .right-top, .right-bot, .gallery-panel{ grid-column: 1; grid-row: auto; } .right-bot{ grid-template-columns: 1fr; } /* Veličine imena na mobitelu su u `dalia-hero-vjencanje.css` (vrpca, 23px u jednom redu) — iste kao gostove. */ /* per RASMUS_MOBILE_AUDIT /mladenci/ 2026-05-21: carousel nav van — stack bez navigacije na 375px */ .gal-nav{ display: none; } } /* ═══════════════════════════════════════════════════════════════ SKLOPIVE KARTICE — SAMO MOBITEL (Vedran 2026-08-08) ═══════════════════════════════════════════════════════════════ Mehanika (`.dc-strip` / `.dc-more` / `.dc-chev`, pamćenje izbora, 900px guard) živi u `static/css/dalia-collapse.css` + `.js` koje uvoze OBA shella — isti obrazac nosi i gostova naslovna, pa se izmjena vrpce radi na jednom mjestu. Ovdje stoji samo ono što je specifično za ovaj pregled: gdje sjeda šiljak i koliko papira ostaje kad je kartica sklopljena. Iznad 900px nijedan od ovih redaka ne postoji — desktop se ne dira („takve stvari ne uvoditi na desktopu"). */ @media (max-width: 900px){ /* Naslovna nema pravila OVDJE — cijela je u `dalia-hero-vjencanje.css`, zajedno s gostovom. Svaki redak koji bi joj se ovdje dopisao ponovno bi otvorio dva kroja za istu karticu. /* PJESME — `.ch` nosi i Apple Music značku, pa vrpca ne smije biti `width:100%` (odgurala bi značku pod šiljak). Jedina kartica kojoj zaglavlje nosi još nešto uz naziv. */ .vinyl-card .ch{ padding: 0 16px 0 0; min-height: 56px; } .vinyl-card .dc-strip{ width: auto; padding-right: 8px; } /* Apple Music lijevo od šiljka. */ .vinyl-card .vinyl-am-badge{ margin-right: 30px; } /* Apple Music značka ne smije dizati redak. */ .vinyl-card .vinyl-am-badge{ padding: 4px 9px; } /* SKLOPLJENA KARTICA JE VRPCA, NE PRAZAN KVADRAT (Vedran 2026-08-09: „bilješke su ogroman prazan veliki kvadrat, čemu to?"). Nedostajali su i `.notes-card` i `.venue-hero` u ovom popisu, a `min-height` im je dolazio iz `.card-cp` / `.cp-grid > *` — pa je kartica bez sadržaja i dalje držala punu visinu. `!important` je nužan: `.right-bot--single .vinyl-card` je (0,2,0) i inače pobjeđuje. Popis je NAMJERNO iscrpan i abecedan — sljedeća sklopiva kartica koja se ovdje ne upiše ponovi isti kvar. Guard: tests/test_sklopive_kartice.py */ .cp-hero:not(.is-open), .gallery-panel:not(.is-open), .mid-top:not(.is-open), .notes-card:not(.is-open), .right-top:not(.is-open), .venue-hero:not(.is-open), .vinyl-card:not(.is-open){ min-height: 0 !important; height: auto; } /* Zadnji redak sklopljene kartice ne smije nositi razmak za sadržaj kojeg nema. */ .notes-card:not(.is-open) .ch{ margin-bottom: 0; } /* GALERIJA — zaglavlje s „otvori →" postoji SAMO na mobitelu (na desktopu ga nosi rukopisni naslov unutar kartice, koji na mobitelu pada). Redak: [vrpca s naslovom] [otvori →], šiljak između. */ .gal-head{ align-items: baseline; justify-content: space-between; gap: 8px; padding: 0 0 6px; } .gal-head .dc-strip{ width: auto; } .gal-head .ch{ margin: 0; } /* „otvori →" lijevo od šiljka. */ .gal-open{ position: absolute; right: 48px; top: 17px; } /* Karta gostiju: slika je apsolutna (inset:0) i treba visinu od otvorenog dijela, ne od kartice — inače bi u sklopljenom stanju legla na vrpcu. */ .logi-more{ position: relative; min-height: 190px; } .logi-card:not(.is-open) .logi-card-top, .logi-card:not(.is-open) .logi-overlay{ display: none; } .gal-open{ font-family: var(--font-script); font-size: 16px; color: var(--dash-ink-plum); opacity: .85; text-decoration: none; flex-shrink: 0; } .gallery-panel:not(.is-open) .gal-head{ padding-bottom: 0; } /* DVORANA — sklopljena je JEDAN redak: naziv + tipka za poruku. Vrpca i tipka su susjedi, ne ugniježđeni: