/* ═══════════════════════════════════════════════════════════════
   TROFEJOVO — spoločný dizajnový základ pre košík, pokladňu a mini-košík.

   Jediné miesto, kde sú definované farby, tiene a rádiusy. Košík aj pokladňa
   z toho čerpajú, takže sa nemôžu rozísť. Predtým mal každý súbor vlastné
   hex hodnoty a pri zmene značky sa muselo hľadať na desiatkach miest.
   ═══════════════════════════════════════════════════════════════ */

:root{
    /* Značka */
    --trof-primary:      #2f196e;   /* fialová — nadpisy, sumy, akcenty */
    --trof-primary-dark: #24125a;
    --trof-primary-soft: #f8f7ff;   /* jemné fialové pozadie */
    --trof-primary-line: #e4dcf7;   /* fialový okraj */

    --trof-accent:       #00e5a0;   /* zelená — hlavné CTA */
    --trof-accent-dark:  #00cc8e;
    --trof-accent-ink:   #0d0a1e;   /* text na zelenom */

    /* Text */
    --trof-ink:          #1c1730;
    --trof-ink-2:        #4a4462;
    --trof-muted:        #7d769a;

    /* Plochy */
    --trof-bg:           #f4f3f9;
    --trof-card:         #ffffff;
    --trof-line:         #e8e5f2;
    --trof-line-strong:  #d6d0ea;

    /* Stavy skladu */
    --trof-ok:           #12a06a;
    --trof-ok-bg:        #e8f8f1;
    --trof-warn:         #c47f0a;
    --trof-warn-bg:      #fdf5e4;
    --trof-late:         #d1651a;
    --trof-late-bg:      #fdf0e6;
    --trof-bad:          #cc2f3e;
    --trof-bad-bg:       #fdecee;

    /* Tvar */
    --trof-r-sm:  8px;
    --trof-r-md:  12px;
    --trof-r-lg:  16px;
    --trof-shadow:      0 1px 2px rgba(31,20,70,.05), 0 4px 16px rgba(31,20,70,.06);
    --trof-shadow-lift: 0 2px 4px rgba(31,20,70,.07), 0 10px 28px rgba(31,20,70,.10);
}

/* ── Farebná bodka stavu (sklad) ────────────────────────────── */
.trof-dot{
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 0 3px rgba(0,0,0,.05);
}

/* ── Riadok skladu ──────────────────────────────────────────── */
.trof-stockline{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    font-size: 13.5px;
    line-height: 1.45;
}
.trof-stockline strong{ font-weight: 700; }

.trof-stockline--ok   { color: var(--trof-ok); }
.trof-stockline--warn { color: var(--trof-warn); }
.trof-stockline--late { color: var(--trof-late); }
.trof-stockline--bad  { color: var(--trof-bad); }

/* Doplňujúci text (termín) — vždy neutrálny, aby farbu nekradol stavu */
.trof-stockline__sub{
    flex: 0 0 100%;
    color: var(--trof-muted);
    font-size: 12.5px;
    font-weight: 400;
}

/* Tlačidlo „Nastaviť na max" pri nedostatku */
.trof-stockline__fix{
    border: 1px solid currentColor;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 12.5px;
    font-weight: 600;
    padding: 2px 10px;
    border-radius: 999px;
    cursor: pointer;
    transition: background .15s;
}
.trof-stockline__fix:hover{ background: rgba(0,0,0,.05); }

/* ── Zbaliteľný blok s konfiguráciou ────────────────────────── */
.trof-ci{
    border-top: 1px solid var(--trof-line);
    margin-top: 12px;
    padding-top: 10px;
}
.trof-ci > summary{
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    list-style: none;
    color: var(--trof-primary);
    font-size: 13.5px;
    font-weight: 600;
    padding: 2px 0;
    user-select: none;
}
.trof-ci > summary::-webkit-details-marker{ display: none; }
.trof-ci > summary:hover{ color: var(--trof-primary-dark); }
.trof-ci > summary:focus-visible{
    outline: 2px solid var(--trof-primary);
    outline-offset: 3px;
    border-radius: 4px;
}

/* Šípka — otočí sa pri rozbalení */
.trof-ci__chev{
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translate(-2px,-2px);
    transition: transform .18s ease;
}
.trof-ci[open] > summary .trof-ci__chev{
    transform: rotate(-135deg) translate(-2px,-2px);
}

.trof-ci__label-open{ display: none; }
.trof-ci[open] .trof-ci__label-closed{ display: none; }
.trof-ci[open] .trof-ci__label-open{ display: inline; }

.trof-ci__body{
    padding: 10px 0 2px;
}

.trof-ci__row{
    display: grid;
    grid-template-columns: minmax(110px,auto) 1fr auto;
    gap: 4px 14px;
    align-items: baseline;
    padding: 6px 0;
    font-size: 13.5px;
    border-bottom: 1px dashed var(--trof-line);
}
.trof-ci__row:last-child{ border-bottom: none; }

.trof-ci__k{ color: var(--trof-muted); }
.trof-ci__v{ color: var(--trof-ink); font-weight: 500; }
.trof-ci__p{ color: var(--trof-ink-2); white-space: nowrap; font-weight: 600; }
.trof-ci__p .woocommerce-Price-amount{ font-weight: 700; }

.trof-ci__row--base .trof-ci__k{ color: var(--trof-ink-2); font-weight: 600; }
.trof-ci__row--note .trof-ci__v{ white-space: pre-line; }

.trof-ci__foot{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--trof-line);
}
.trof-ci__sum{
    font-size: 13.5px;
    color: var(--trof-muted);
}
.trof-ci__sum strong,
.trof-ci__sum .woocommerce-Price-amount{
    color: var(--trof-primary);
    font-weight: 700;
    font-size: 15px;
}
.trof-ci__edit{
    font-size: 13px;
    font-weight: 600;
    color: var(--trof-primary);
    text-decoration: none;
    border-bottom: 1px solid var(--trof-primary-line);
}
.trof-ci__edit:hover{ border-bottom-color: var(--trof-primary); }

/* ── Stepper množstva ───────────────────────────────────────── */
.trof-qty{
    display: inline-flex;
    align-items: stretch;
    border: 1px solid var(--trof-line-strong);
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}
.trof-qty__btn{
    width: 38px;
    border: none;
    background: var(--trof-primary-soft);
    color: var(--trof-primary);
    font-size: 19px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: background .15s, color .15s;
}
.trof-qty__btn:hover:not(:disabled){ background: var(--trof-primary-line); }
.trof-qty__btn:disabled{ opacity: .35; cursor: not-allowed; }

.trof-qty__input{
    width: 54px;
    border: none !important;
    border-left: 1px solid var(--trof-line) !important;
    border-right: 1px solid var(--trof-line) !important;
    border-radius: 0 !important;
    text-align: center;
    font-size: 15px;
    font-weight: 700;
    color: var(--trof-ink);
    background: #fff;
    padding: 8px 0 !important;
    box-shadow: none !important;
    -moz-appearance: textfield;
}
.trof-qty__input::-webkit-outer-spin-button,
.trof-qty__input::-webkit-inner-spin-button{ -webkit-appearance: none; margin: 0; }
.trof-qty__input:focus{ outline: none; background: var(--trof-primary-soft); }

/* Počas AJAX prepočtu riadok mierne zosvetlíme.
   Zámerne BEZ `pointer-events:none` — zákazník musí vedieť doklikať ďalší kus
   aj kým beží request; poradie odpovedí stráži sekvenčné číslo v cart.js. */
.trof-busy{ opacity: .6; transition: opacity .12s; }

/* ── Voľba (doprava / platba) ako karta ─────────────────────── */
.trof-choice{
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.trof-choice__item{
    margin: 0;
    padding: 0;
    list-style: none;
}
.trof-choice__item::before{ content: none !important; }

.trof-choice__label{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 13px;
    border: 1.5px solid var(--trof-line);
    border-radius: var(--trof-r-md);
    background: #fff;
    cursor: pointer;
    transition: border-color .15s, background .15s, box-shadow .15s;
    font-size: 14px;
    line-height: 1.35;
    color: var(--trof-ink);
    margin: 0;
    font-weight: 500;
}
.trof-choice__label:hover{ border-color: var(--trof-line-strong); }

.trof-choice input[type="radio"]{
    appearance: none;
    -webkit-appearance: none;
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin: 0;
    border: 2px solid var(--trof-line-strong);
    border-radius: 50%;
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
    cursor: pointer;
}
.trof-choice input[type="radio"]:checked{
    border-color: var(--trof-primary);
    box-shadow: inset 0 0 0 4px var(--trof-primary);
}
.trof-choice input[type="radio"]:focus-visible{
    outline: 2px solid var(--trof-primary);
    outline-offset: 2px;
}

/* Vybraná karta — jasný vizuálny signál, nie len bodka */
.trof-choice__item.is-selected .trof-choice__label{
    border-color: var(--trof-primary);
    background: var(--trof-primary-soft);
    box-shadow: 0 0 0 3px rgba(47,25,110,.07);
}

.trof-choice__txt{
    flex: 1 1 auto;
    min-width: 0;
}
.trof-choice__name{
    display: block;
    font-weight: 600;
}
.trof-choice__note{
    display: block;
    font-size: 12.5px;
    color: var(--trof-muted);
    font-weight: 400;
    margin-top: 1px;
}
.trof-choice__price{
    flex: 0 0 auto;
    font-weight: 700;
    color: var(--trof-primary);
    white-space: nowrap;
    font-size: 14px;
}
.trof-choice__price--free{ color: var(--trof-ok); }

.trof-choice__logo{
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 4px;
}
.trof-choice__logo img{
    max-height: 22px;
    width: auto;
    display: block;
}

/* Jediná možnosť — informácia, nie ovládací prvok.
   Vyzerá ako vybraná karta, ale nedá sa na ňu klikať, lebo niet čoho iného. */
.trof-choice__label--static{
    cursor: default;
}
.trof-choice__item--only .trof-choice__label{
    border-color: var(--trof-primary-line);
    background: var(--trof-primary-soft);
    box-shadow: none;
}
.trof-choice__tick{
    flex: 0 0 auto;
    position: relative;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--trof-ok);
}
.trof-choice__tick::after{
    content: "";
    position: absolute;
    left: 6px;
    top: 3.5px;
    width: 4px;
    height: 8px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(45deg);
}

/* Rozbaliteľný obsah karty (popis brány, widget Zásielkovne) */
.trof-choice__box{
    padding: 10px 13px 12px;
    margin: -4px 0 2px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--trof-ink-2);
    background: var(--trof-primary-soft);
    border: 1px solid var(--trof-primary-line);
    border-top: none;
    border-radius: 0 0 var(--trof-r-md) var(--trof-r-md);
}
.trof-choice__box p:last-child{ margin-bottom: 0; }

/* ── „Toto ste získali" ──────────────────────────────────────
   Prečiarknutá pôvodná cena vedľa nuly. Zákazník nemá len zaplatiť menej,
   má aj vidieť, o koľko menej. */
.trof-won{
    display: inline-flex;
    align-items: baseline;
    gap: 7px;
}
.trof-won__was,
del.trof-won__was{
    color: var(--trof-muted);
    font-weight: 500;
    text-decoration: line-through;
}
.trof-won__was .woocommerce-Price-amount{
    color: inherit;
    font-weight: 500;
}
.trof-won__now{
    color: var(--trof-ok);
    font-weight: 800;
}

/* Prečiarknutá cena aj na karte dopravy */
.trof-choice__price--free del.trof-won__was{
    margin-right: 5px;
    font-size: 13px;
}
.trof-choice__price--free{
    display: inline-flex;
    align-items: baseline;
}

/* ── Nadpis sekcie v súhrne ─────────────────────────────────── */
.trof-sec{
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--trof-line);
}
.trof-sec:first-child{
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}
.trof-sec__h{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--trof-muted);
    margin: 0 0 10px;
}

/* ── Hlavné CTA ─────────────────────────────────────────────── */
.trof-cta{
    display: block;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    padding: 15px 20px;
    border: none;
    border-radius: 10px;
    background: var(--trof-accent);
    color: var(--trof-accent-ink) !important;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: .02em;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(0,229,160,.32);
    transition: background .18s, transform .12s, box-shadow .18s;
}
.trof-cta:hover{
    background: var(--trof-accent-dark);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(0,229,160,.40);
}
.trof-cta:active{ transform: translateY(0); }

/* ── Dôveryhodnostný pás pod CTA ────────────────────────────── */
.trof-trust{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 14px;
    margin-top: 14px;
    font-size: 12px;
    color: var(--trof-muted);
}
.trof-trust span{
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
