/* Generated: 2026-10-22 18:07:57 */ /* Phase 99 / VZ — vzhled „Akční s důvěrou" (zadání P. Beneše 21. 10. 2026; docs/phase-99-mobilni-redesign/vzhledy/zadani-benes-2026-10-22/ANALYZA.md). Načítá se JEN ve vzhledu akčním (@layout.latte, Vzhled::jeAkcni) — ve vzhledu „zakladni" tenhle soubor na stránce vůbec není. Třídy jsou nové (.ds-pdp__extra, .ds-akce-termin, .ds-cena-kod, .ds-buy-bar__kod, .ds-duvera-odznak, .ds-mega__side); jediný zásah do dosavadních prvků: běžná cena .ceny na kartě produktu se schová, když je vedle blok EXTRA CENA (zůstává v DOM kvůli microdatům a přepočtu atributů). Barvy jen z tokenů (--ds-akce-*, --ds-duvera-*). Selektory karty produktu nesou #productDetailRight jako pdp.css (legacy pravidla na kartě jsou na id). */ /* ---------- Karta produktu: blok EXTRA CENA (Z3) ---------- */ :is(html.ds-mobile, html.ds-karta) #productDetailRight .detail-blok-in .ceny-obal--extra > .ceny { display: none; } :is(html.ds-mobile, html.ds-karta) #productDetailRight .ds-pdp__extra { display: grid; gap: 12px; margin: 16px 0; /* stejná mezera nad i pod — viz pravidlo „P. Beneš 22. 10. 17:27" níž */ padding: 16px 18px; border-radius: var(--ds-radius-sm); background: var(--ds-akce-bg); color: var(--ds-akce-fg); } /* desktop: ceny vlevo a termín vpravo, jen když se oba vejdou (termín potřebuje ~330 px, aby se datum ani odpočet nezalomily); v užším nákupním boxu (1440 px okno = ~520 px) pod sebou */ /* P. Beneš 22. 10. 17:27 („Produktová karta mobil BIBIK extra sleva") + vlastník téhož dne (i desktop): stejná mezera nad blokem (od „Možnosti doručení") i pod ním (k řádku množství a Do košíku, nebo k náhledům variant) — dřív 12 px nad a 4 px pod. Náhledy variant mají z legacy padding-top 24 px (stylesheet.css .barevne_varianty) → pod blokem by bylo 40 px; vynulováno jen tam, kde nad nimi blok je. Telefon, tablet i desktop. */ :is(html.ds-mobile, html.ds-karta) #productDetailRight:has(.ds-pdp__extra) .barevne_varianty { padding-top: 0; } html.ds-karta #productDetailRight .ds-pdp__extra { grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr)); align-items: center; gap: 14px 16px; } :is(html.ds-mobile, html.ds-karta) #productDetailRight .ds-pdp__extra-ceny { display: flex; flex-direction: column; gap: 2px; min-width: 0; } :is(html.ds-mobile, html.ds-karta) #productDetailRight .ds-pdp__extra-titulek { font-size: 18px; font-weight: 700; line-height: 24px; letter-spacing: .02em; text-transform: uppercase; } :is(html.ds-mobile, html.ds-karta) #productDetailRight .ds-pdp__extra-bez { font-size: 14px; line-height: 20px; } :is(html.ds-mobile, html.ds-karta) #productDetailRight .ds-pdp__extra-cena { font-size: 40px; font-weight: 700; line-height: 46px; white-space: nowrap; } html.ds-mobile #productDetailRight .ds-pdp__extra-cena { font-size: clamp(34px, 11vw, 48px); line-height: 1.15; } :is(html.ds-mobile, html.ds-karta) #productDetailRight .ds-pdp__extra-kod { font-size: 18px; line-height: 24px; } :is(html.ds-mobile, html.ds-karta) #productDetailRight .ds-pdp__extra-pozn { font-size: 14px; line-height: 20px; } /* ---------- Termín a odpočet akce (Z4 karta produktu, Z8 karta ve výpisu) ---------- */ .ds-akce-termin { display: flex; flex-direction: column; gap: 6px; font-variant-numeric: tabular-nums; } .ds-akce-termin[hidden] { display: none; } .ds-akce-termin__datum, .ds-akce-termin__odpocet { display: flex; align-items: center; gap: 8px; font-weight: 700; } .ds-akce-termin__ikona { flex: 0 0 auto; width: 20px; height: 20px; } /* karta produktu — desktop: jeden vínový rámeček se dvěma řádky (návrh cena-1) */ :is(html.ds-mobile, html.ds-karta) #productDetailRight .ds-akce-termin--detail { padding: 12px 14px; border: 2px solid var(--ds-akce-termin-border); border-radius: var(--ds-radius-sm); background-color: var(--ds-akce-termin-bg); color: var(--ds-akce-termin-fg); font-size: 16px; line-height: 22px; } :is(html.ds-mobile, html.ds-karta) #productDetailRight .ds-akce-termin--detail .ds-akce-termin__odpocet { color: var(--ds-akce-odpocet-fg); font-size: 17px; } /* karta produktu — telefon a tablet: dvě lišty pod sebou, vínová s datem a zlatá s odpočtem (návrh cena-3) */ html.ds-mobile #productDetailRight .ds-akce-termin--detail { gap: 8px; padding: 0; border: 0; background: none; } html.ds-mobile #productDetailRight .ds-akce-termin--detail .ds-akce-termin__datum { padding: 10px 12px; border: 2px solid var(--ds-akce-termin-border); border-radius: var(--ds-radius-sm); background-color: var(--ds-akce-termin-bg); font-size: 16px; line-height: 22px; } html.ds-mobile #productDetailRight .ds-akce-termin--detail .ds-akce-termin__odpocet { padding: 10px 12px; border-radius: var(--ds-radius-sm); background: var(--ds-akce-odpocet-bar-bg); color: var(--ds-akce-odpocet-bar-fg); font-size: 18px; line-height: 24px; } /* Motiv „vanoce" (vzhled_motiv): zvonky vpravo u termínu. Dočasně výřez z návrhu P. Beneše (rozhodnutí D6), vložený jako data: — CSS se v produkčním režimu kopíruje do /css_temp/, relativní cesta k souboru by se tam rozbila (CssLoader). Levý okraj výřezu se prolíná maskou do vínové. */ /* text smí zajet nad prolnutý levý okraj zvonků — jinak by se „Platí do neděle 25. 10." na telefonu zalomilo */ html.ds-karta #productDetailRight .ds-akce-termin--detail.ds-akce-termin--motiv-vanoce, html.ds-mobile #productDetailRight .ds-akce-termin--detail.ds-akce-termin--motiv-vanoce .ds-akce-termin__datum { position: relative; padding-right: 56px; } html.ds-karta #productDetailRight .ds-akce-termin--detail.ds-akce-termin--motiv-vanoce > *, html.ds-mobile #productDetailRight .ds-akce-termin--detail.ds-akce-termin--motiv-vanoce .ds-akce-termin__datum > * { position: relative; z-index: 1; } html.ds-karta #productDetailRight .ds-akce-termin--detail.ds-akce-termin--motiv-vanoce::after, html.ds-mobile #productDetailRight .ds-akce-termin--detail.ds-akce-termin--motiv-vanoce .ds-akce-termin__datum::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 84px; border-radius: 0 var(--ds-radius-sm) var(--ds-radius-sm) 0; background: url("data:image/webp;base64,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") right center / cover no-repeat; -webkit-mask-image: linear-gradient(to right, transparent, black 35%); mask-image: linear-gradient(to right, transparent, black 35%); pointer-events: none; } /* karta ve výpisu a v karuselech: slot s termínem stojí tam, kde box s kupónem a VIP box — pod cenou a dostupností (listing.css řadí bloky karty přes order; tyhle selektory jsou jeho dvojčata pro nový slot) */ html.ds-desktop.ds-vypis .productListing .centerBoxContentsProducts-in > .product-info--out > .product-info:has(> .ds-akce-termin:not([hidden])), html.ds-desktop .ds-karty .centerBoxContentsProducts-in > .product-info--out > .product-info:has(> .ds-akce-termin:not([hidden])), html.ds-jednotna-karta .productListing .centerBoxContentsProducts-in > .product-info--out > .product-info:has(> .ds-akce-termin:not([hidden])), html.ds-jednotna-karta .ds-karty .centerBoxContentsProducts-in > .product-info--out > .product-info:has(> .ds-akce-termin:not([hidden])) { order: 6; margin-top: 12px; } /* cena s kódem má dva řádky — dostupnost pod ní bez záporného okraje, který listing.css počítá pro jednořádkovou cenu */ html.ds-desktop.ds-vypis .productListing .centerBoxContentsProducts-in:has(.ds-cena-kod) > .ds-card__stock, html.ds-desktop .ds-karty .centerBoxContentsProducts-in:has(.ds-cena-kod) > .ds-card__stock, html.ds-jednotna-karta .productListing .centerBoxContentsProducts-in:has(.ds-cena-kod) > .ds-card__stock, html.ds-jednotna-karta .ds-karty .centerBoxContentsProducts-in:has(.ds-cena-kod) > .ds-card__stock { margin-top: 4px; } /* karta ve výpisu a v karuselech — desktop: světle červený rámeček (návrh cena-2) */ .ds-akce-termin--karta { text-align: left; gap: 2px; padding: 8px 10px; border: 1.5px solid var(--ds-price-discount); border-radius: var(--ds-radius-sm); background: var(--ds-akce-karta-bg); color: var(--ds-price-discount); font-size: 14px; line-height: 19px; } /* .product-info je řádkový flex (listing.css) a box v něm měl flex: 0 1 auto → smrskl se na šířku textu (na desktopu 213 z 234,5 px, vlastník 22. 10.); přes celou šířku karty jako box s kupónem a VIP box */ .product-info > .ds-akce-termin--karta { flex: 1 1 auto; } .ds-akce-termin--karta .ds-akce-termin__ikona { width: 18px; height: 18px; } /* desktop (návrh cena-2): kalendář větší a svisle uprostřed přes oba řádky, odpočet pod datem bez vlastní ikony a v normální tučnosti — tučné je jen „Platí do …" */ html.ds-desktop .ds-akce-termin--karta { position: relative; padding-left: 44px; } html.ds-desktop .ds-akce-termin--karta .ds-akce-termin__datum .ds-akce-termin__ikona { position: absolute; top: 50%; left: 12px; width: 24px; height: 24px; transform: translateY(-50%); } html.ds-desktop .ds-akce-termin--karta .ds-akce-termin__odpocet { font-weight: 400; } html.ds-desktop .ds-akce-termin--karta .ds-akce-termin__odpocet .ds-akce-termin__ikona { display: none; } /* telefon a tablet: nahoře datum na světle červené, dole červená lišta s odpočtem (návrh cena-4) */ html.ds-mobile .ds-akce-termin--karta { gap: 0; padding: 0; overflow: hidden; } html.ds-mobile .ds-akce-termin--karta .ds-akce-termin__datum { padding: 7px 10px; font-size: 13px; line-height: 17px; } html.ds-mobile .ds-akce-termin--karta .ds-akce-termin__odpocet { padding: 6px 10px; background: var(--ds-price-discount); color: var(--ds-akce-fg); } /* jen telefon (P. Beneš 22. 10. večer, „Mobil Bibik červený blok EXTRA CENA"; varianta B vlastníka): „Platí do …" netučně a bez ikony kalendáře, aby se datum vešlo na jeden řádek a box byl nižší (82 → 65 px při 393–402 px). Bez ikony zbývá na text 144 px, „Platí do pondělí 26. 10." potřebuje 141 px; na telefonu 375 px (iPhone mini, SE) se pořád zalomí — vlastník to přijal. Tablet (html.ds-tablet) zůstává beze změny. */ html.ds-mobile:not(.ds-tablet) .ds-akce-termin--karta .ds-akce-termin__datum { font-weight: 400; } html.ds-mobile:not(.ds-tablet) .ds-akce-termin--karta .ds-akce-termin__datum .ds-akce-termin__ikona { display: none; } /* ---------- Karta ve výpisu: cena s kódem jako hlavní cena (Z7) ---------- */ /* legacy .nase-cena centruje text — šířku bloku dává delší řádek „s kódem EXTRA", cena by byla odsazená */ :is(.productListing, .ds-karty) .centerBoxContentsProducts-in .ds-cena-kod { text-align: left; } :is(.productListing, .ds-karty) .centerBoxContentsProducts-in .ds-cena-kod__hodnota { color: var(--ds-price-discount); font-size: 20px; font-weight: 700; line-height: 26px; white-space: nowrap; } :is(.productListing, .ds-karty) .centerBoxContentsProducts-in .ds-cena-kod__kod { color: var(--ds-price-discount); font-size: 14px; font-weight: 700; line-height: 18px; } /* jen telefon (P. Beneš 22. 10. večer): „s kódem EXTRA" netučně a blíž k ceně (řádek ceny 26 → 22 px) */ html.ds-mobile:not(.ds-tablet) :is(.productListing, .ds-karty) .centerBoxContentsProducts-in .ds-cena-kod__hodnota { line-height: 22px; } html.ds-mobile:not(.ds-tablet) :is(.productListing, .ds-karty) .centerBoxContentsProducts-in .ds-cena-kod__kod { font-weight: 400; } /* zvolená velikost bez kupónu (main.js cardVariantQuickAdd): cena bez kódu, tedy ne červeně */ :is(.productListing, .ds-karty) .centerBoxContentsProducts-in .ds-cena-kod--bez .ds-cena-kod__hodnota { color: var(--ds-text-primary); } /* ---------- Lišta Koupit na telefonu: cena s kódem (Z6) ---------- */ .ds-buy-bar__price--kod .ds-buy-bar__price-now { color: var(--ds-price-discount); } .ds-buy-bar__kod { display: block; color: var(--ds-price-discount); font-size: 14px; font-weight: 700; line-height: 18px; } /* ---------- Lišta sekcí nového desktopu: cena s kódem (Z6, nález 7B 22. 10. — tlačítko vkládá s kódem) ---------- */ html.ds-desktop.ds-karta .ds-sekce__cena--kod { color: var(--ds-price-discount); } html.ds-desktop.ds-karta .ds-sekce__kod { margin-left: 8px; font-size: 14px; font-weight: 700; } /* Kód („EXTRA") v řádcích s tučností 700: / má `bolder` → 900, řez, který neposíláme (fonts_link.latte), a návrh má kód ve stejné tučnosti jako řádek — zůstává tučnost řádku. */ .ds-cena-kod__kod strong, .ds-buy-bar__kod strong, .ds-sekce__kod b { font-weight: inherit; } /* ---------- Odznak důvěry v menu (Z1 desktop, Z2 telefon; předloha usp-3-odznak.png) ---------- */ /* jeden řádek jako v návrhu (usp-3) se vejde od ~290 px šířky odznaku (telefon 375 px, mega menu 300 px od ~1280 px okna); v užším (telefon 320 px, mega menu 260 px při 1025–1279 px) spadne text pod hodnocení místo přetečení — flex-wrap, bez vlastního breakpointu (změřeno 7B 22. 10.) */ .ds-duvera-odznak { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 10px; padding: 10px 12px; border-radius: var(--ds-radius-sm); background: var(--ds-duvera-bg); color: var(--ds-text-primary); } .ds-duvera-odznak__hodnoceni { display: grid; grid-template-areas: "medaile cislo" "hvezdy hvezdy"; align-items: center; column-gap: 4px; row-gap: 2px; } .ds-duvera-odznak__medaile { grid-area: medaile; width: 32px; height: 32px; } .ds-duvera-odznak__procenta { grid-area: cislo; color: var(--ds-duvera-cislo); font-size: 30px; font-weight: 700; line-height: 34px; white-space: nowrap; } .ds-duvera-odznak__hvezdy { display: flex; grid-area: hvezdy; justify-content: center; gap: 2px; } .ds-duvera-odznak__text { display: flex; flex-direction: column; align-items: center; text-align: center; } .ds-duvera-odznak__pocet { font-size: 24px; font-weight: 700; line-height: 28px; white-space: nowrap; } .ds-duvera-odznak__popisek { font-size: 11px; font-weight: 700; line-height: 15px; white-space: nowrap; /* návrh usp-3: „spokojených zákazníků" na jednom řádku */ } .ds-duvera-odznak__overeno { color: var(--ds-duvera-overeno); font-size: 12px; line-height: 16px; } /* desktop: pravý sloupec panelu mega menu — karta nápovědy a pod ní odznak (dsDesktopMenu.latte, .ds-mega__side jen ve vzhledu akčním) */ html.ds-desktop .ds-mega__side { display: flex; flex-direction: column; gap: 16px; min-width: 0; } /* telefon a tablet: pod tlačítky Přihlásit se / Vytvořit účet */ html.ds-mobile .mm-menu .ds-hub__telo .ds-duvera-odznak { margin-top: 14px; } /* jen telefon (P. Beneš 22. 10. 17:22, „Mobil BIBIK a baner 99% na střed a je menší"; návrh: střed odznaku = střed okna, šířka ~261 místo 312 pt, výška ~68 místo 79): odznak na šířku obsahu, na středu PANELU (ne sloupce textu — ten je odsazený o ikonu účtu 28 px + mezeru 14 px z menu.css, posun o polovinu), písmo ~85 %, mezery nad a pod odznakem stejné (12 px). Tablet (boční panel) a desktop beze změny. */ html.ds-mobile:not(.ds-tablet) .mm-menu .mm-listview > li.ds-hub__ucet:has(.ds-duvera-odznak) > span.ds-hub__blok { padding-bottom: 12px; } html.ds-mobile:not(.ds-tablet) .mm-menu .ds-hub__telo .ds-duvera-odznak { position: relative; left: calc((28px + 14px) / -2); width: fit-content; max-width: 100%; margin: 12px auto 0; padding: 8px 16px; gap: 2px 10px; } html.ds-mobile:not(.ds-tablet) .mm-menu .ds-duvera-odznak__medaile { width: 28px; height: 28px; } html.ds-mobile:not(.ds-tablet) .mm-menu .ds-duvera-odznak__procenta { font-size: 26px; line-height: 30px; } html.ds-mobile:not(.ds-tablet) .mm-menu .ds-duvera-odznak__hvezdy svg { width: 12px; height: 12px; } html.ds-mobile:not(.ds-tablet) .mm-menu .ds-duvera-odznak__pocet { font-size: 21px; line-height: 24px; } html.ds-mobile:not(.ds-tablet) .mm-menu .ds-duvera-odznak__popisek { font-size: 10px; line-height: 13px; } html.ds-mobile:not(.ds-tablet) .mm-menu .ds-duvera-odznak__overeno { font-size: 11px; line-height: 14px; }