/*
 * Speedpro – jen úvodní stránka (načítá inc/speedpro-vzhled.php jen na úvodu, za css/speedpro.css).
 * Barvy viz proměnné v css/speedpro.css.
 */

/* Úvodní slider: karty jako v sekci NOVINKY. Stejnou výšku karet zajišťuje „Equalize Items“ v UX Builderu. */
.hp-sec1 .row-slider .flickity-slider > .col > .col-inner { padding: 10px; }
.hp-sec1 .row-slider .product-small .box-text { padding: 10px 0 20px !important; }
.hp-sec1 .row-slider .add-to-cart-button .button { width: 100% !important; }
/* Šipky slideru: tmavé kolečko s bílou šipkou, při najetí červené (dřív bílé/černé, na fotce nebyly vidět). */
.hp-sec1 .row-slider .flickity-prev-next-button svg { background: rgba(0, 0, 0, .55); border-radius: 50%; padding: 6px; box-sizing: border-box; transition: background-color .2s; }
.hp-sec1 .row-slider .flickity-prev-next-button svg,
.hp-sec1 .row-slider .flickity-prev-next-button .arrow { fill: #fff !important; }
.hp-sec1 .row-slider .flickity-prev-next-button:hover svg { background: var(--sp-cervena); }
.hp-sec1 .row-slider:hover .flickity-prev-next-button { opacity: 1; }
/* Karty jako samostatná vrstva: zaoblené, bez stínu (tmavý stín pod kartami byl na fotce rušivý); fotka v pozadí
   lehce ztmavená, ať karty a červené prvky vyniknou. Obrázek a tlačítko řeší společná pravidla karet (speedpro-karty-css). */
.hp-sec1 .section-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .45) 0%, rgba(0, 0, 0, .25) 100%); pointer-events: none; }
.hp-sec1 .row-slider .flickity-slider > .col > .col-inner { border-radius: 8px; overflow: hidden; box-shadow: none; transition: transform .2s; }
.hp-sec1 .row-slider .flickity-slider > .col > .col-inner:hover { transform: translateY(-3px); }
/* Když je rozbalené menu kategorií, slider ustoupí do pozadí (ztmavne), aby se karty s menu „nebily“. */
.hp-sec1 .row-slider { transition: filter .2s; }
body:has(#mega-menu-primary > li.mega-toggle-on) .hp-sec1 .row-slider { filter: brightness(.45) saturate(.6); }
/* Bannery značek nad patičkou (OMP, Alpinestars, Goodridge) bez tečkovaného rámečku.
   Rámeček dává pravidlo v Doplňujícím CSS „.hp-sec3 .row:first-child .col > .col-inner { border: 2px dotted #ccc }“,
   které jde místo toho i rovnou smazat. */
.hp-sec3 .row:first-child .col > .col-inner { border: 0 !important; }