/* =========================================================
   OPPIO – ZÁKLAD ÚČTU
   Pôvodné pravidlá zo sin-oppio__my-accout.css.
   Odstránené: natvrdo tučné „Predplatné“ v menu – zvýrazňovalo
   sa aj vtedy, keď bol zákazník na inej stránke.
   ========================================================= */

/* Pätička je na účte skrytá, takže obsah končí presne poslednou kartou
   a pod ňou nie je nič. Doplňujeme spodný priestor, aby stránka
   nekončila „odseknuto“. */
.woocommerce-account .elementor-location-footer {
    display: none !important;
}

/* Odsadenie pod lepivou hlavičkou. Bolo 175 px natvrdo pre všetky
   veľkosti – na mobile to bola prázdna obrazovka, na monitore diera. */
.woocommerce-account #content {
    padding-top: 170px !important;
    padding-bottom: 120px !important;
}
@media (max-width: 1024px) {
    .woocommerce-account #content {
        padding-top: 140px !important;
        padding-bottom: 90px !important;
    }
}
@media (max-width: 767px) {
    .woocommerce-account #content {
        padding-top: 110px !important;
        padding-bottom: 70px !important;
    }
}

/* Hlavička je lepivá, takže pri skoku na kotvu prekryje nadpis.
   Toto jej necháva miesto. */
.woocommerce-account h1,
.woocommerce-account h2,
.woocommerce-account [id] {
    scroll-margin-top: 190px;
}

.home .user-icon,
.home .user-icon svg,
.home .user-icon span {
    fill: var(--project-light);
    color: var(--project-light);
}
.user-icon span {
    color: #1a1a1a;
}

/* =========================================================
   OPPIO – PREHĽAD V ÚČTE (úvodná obrazovka)
   Pridané pri prestavbe účtu. Farby, typografia a ostré hrany
   sú zhodné s novými stránkami webu.
   ========================================================= */

.oppio-prehlad {
    --op-green: #123F32;
    --op-deep:  #092A21;
    --op-ink:   #111111;
    --op-body:  #4A544E;
    --op-soft:  #626C67;
    --op-rule:  #D7CDB9;
    --op-line:  #E3DCCE;
    --op-paper: #FAF7F0;
    --op-paper2:#F3EEE3;
    color: var(--op-ink);
    font-size: 16px;
    line-height: 1.55;
}

.oppio-prehlad * { box-sizing: border-box; }

.oppio-prehlad .oppio-prehlad-pozdrav {
    margin: 0 0 8px;
    font-style: italic;
    font-size: clamp(26px, 2.6vw, 36px);
    font-weight: 800;
    line-height: 1.06;
    letter-spacing: -.03em;
    color: var(--op-ink);
}

/* --- Karta --- */
.oppio-prehlad .oppio-karta {
    margin: 0 0 14px;
    padding: 24px 26px;
    background: var(--op-paper);
    border: 1px solid var(--op-rule);
    border-radius: 0;
}

.oppio-prehlad .oppio-karta-hlavna {
    background: var(--op-green);
    border-color: var(--op-green);
    color: #FFFFFF;
}

.oppio-prehlad .oppio-karta-hore {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.oppio-prehlad .oppio-label {
    margin: 0 0 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--op-soft);
}
.oppio-prehlad .oppio-karta-hlavna .oppio-label {
    color: rgba(255, 255, 255, .68);
}

.oppio-prehlad .oppio-velke {
    margin: 0 0 6px;
    font-size: clamp(20px, 2vw, 26px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -.02em;
}

.oppio-prehlad .oppio-mini {
    margin: 0;
    font-size: 14px;
    color: var(--op-body);
}
.oppio-prehlad .oppio-karta-hlavna .oppio-mini {
    color: rgba(255, 255, 255, .82);
}
.oppio-prehlad .oppio-mini .amount,
.oppio-prehlad .oppio-mini bdi {
    color: inherit;
    font-weight: 700;
}

/* --- Štítok stavu --- */
.oppio-prehlad .oppio-stav {
    flex: 0 0 auto;
    padding: 6px 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    white-space: nowrap;
}
.oppio-prehlad .oppio-stav-ok {
    background: #FFFFFF;
    color: var(--op-green);
}
.oppio-prehlad .oppio-stav-pauza {
    background: var(--op-paper2);
    color: var(--op-soft);
    border: 1px solid var(--op-rule);
}
.oppio-prehlad .oppio-stav-info {
    background: var(--op-green);
    color: #FFFFFF;
}
.oppio-prehlad .oppio-stav-koniec {
    background: var(--op-paper2);
    color: var(--op-soft);
    border: 1px solid var(--op-rule);
}

/* Svetlá karta – posledná objednávka */
.oppio-prehlad .oppio-karta-svetla {
    background: #FFFFFF;
    border-color: var(--op-line);
}

/* --- Zoznam fliaš --- */
.oppio-prehlad .oppio-obsah {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, .22);
}
.oppio-prehlad .oppio-fl {
    padding: 5px 11px;
    background: rgba(255, 255, 255, .12);
    font-size: 13px;
    line-height: 1.3;
    color: #FFFFFF;
}

/* --- Tlačidlo --- */
.oppio-prehlad .oppio-akcie {
    margin-top: 22px;
}
.oppio-prehlad .oppio-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 28px;
    background: #FFFFFF;
    color: var(--op-green) !important;
    border: 1px solid #FFFFFF;
    border-radius: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .11em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
}
.oppio-prehlad .oppio-btn:hover {
    background: transparent;
    color: #FFFFFF !important;
}
.oppio-prehlad .oppio-karta:not(.oppio-karta-hlavna) .oppio-btn {
    background: var(--op-green);
    color: #FFFFFF !important;
    border-color: var(--op-green);
}
.oppio-prehlad .oppio-karta:not(.oppio-karta-hlavna) .oppio-btn:hover {
    background: var(--op-deep);
    border-color: var(--op-deep);
    color: #FFFFFF !important;
}

/* --- Rýchle odkazy --- */
.oppio-prehlad .oppio-rychle {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 26px;
}
.oppio-prehlad .oppio-rychle a {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 18px 20px;
    background: #FFFFFF;
    border: 1px solid var(--op-line);
    text-decoration: none;
    color: var(--op-ink);
    transition: border-color .15s ease;
}
.oppio-prehlad .oppio-rychle a:hover {
    border-color: var(--op-green);
}
.oppio-prehlad .oppio-rychle span {
    font-size: 15px;
    font-weight: 600;
}
.oppio-prehlad .oppio-rychle b {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--op-green);
}

/* --- Pomoc --- */
.oppio-prehlad .oppio-pomoc {
    margin: 26px 0 0;
    padding-top: 20px;
    border-top: 1px solid var(--op-line);
    font-size: 14px;
    color: var(--op-soft);
}
.oppio-prehlad .oppio-pomoc a {
    color: var(--op-green);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* --- Mobil --- */
@media (max-width: 767px) {
    .oppio-prehlad .oppio-karta {
        padding: 22px 20px;
    }
    /* column-reverse = štítok stavu ide nad text, nie pod cenu */
    .oppio-prehlad .oppio-karta-hore {
        flex-direction: column-reverse;
        align-items: flex-start;
        gap: 14px;
    }
    .oppio-prehlad .oppio-stav {
        align-self: flex-start;
    }
    .oppio-prehlad .oppio-btn {
        width: 100%;
    }
    .oppio-prehlad .oppio-rychle {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .oppio-prehlad * { transition: none !important; }
}

/* --- Pozdrav a podnadpis --- */
.oppio-prehlad .oppio-prehlad-podnadpis {
    margin: 0 0 22px;
    font-size: 16px;
    line-height: 1.6;
    color: var(--op-soft);
    max-width: 56ch;
}

/* --- Kontaktná karta namiesto pätičky --- */
.oppio-prehlad .oppio-pomoc-karta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;
    margin-top: 18px;
    padding: 20px 24px;
    background: var(--op-paper2);
    border: 1px solid var(--op-rule);
}
.oppio-prehlad .oppio-pomoc-karta .oppio-label { margin: 0 0 4px; }
.oppio-prehlad .oppio-pomoc-text {
    margin: 0;
    font-size: 15px;
    color: var(--op-body);
}
.oppio-prehlad .oppio-pomoc-odkazy {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.oppio-prehlad .oppio-pomoc-odkazy a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 20px;
    background: #FFFFFF;
    border: 1px solid var(--op-rule);
    font-size: 14px;
    font-weight: 600;
    color: var(--op-green);
    text-decoration: none;
    white-space: nowrap;
    transition: border-color .15s ease;
}
.oppio-prehlad .oppio-pomoc-odkazy a:hover { border-color: var(--op-green); }

/* Viac vzduchu medzi kartami – účet nemá pôsobiť ako natlačený formulár */
.oppio-prehlad .oppio-karta { margin-bottom: 14px; }
.oppio-prehlad .oppio-rychle { gap: 12px; margin-top: 18px; }
.oppio-prehlad .oppio-rychle a { padding: 18px 22px; }

@media (max-width: 767px) {
    .oppio-prehlad .oppio-pomoc-karta {
        flex-direction: column;
        align-items: stretch;
        padding: 22px 20px;
    }
    .oppio-prehlad .oppio-pomoc-odkazy a { flex: 1 1 100%; justify-content: center; }
}

/* =========================================================
   OPPIO – MENU ÚČTU
   WooCommerce dáva aktívnej položke triedu .is-active.
   Predtým sa nepoužívala vôbec – zvýraznené bolo natvrdo
   Predplatné, takže zákazník nevedel, kde sa nachádza.
   ========================================================= */

.woocommerce-account .woocommerce-MyAccount-navigation {
    --op-green: #123F32;
    --op-deep:  #092A21;
    --op-ink:   #111111;
    --op-body:  #4A544E;
    --op-soft:  #626C67;
    --op-rule:  #D7CDB9;
    --op-line:  #E3DCCE;
    --op-paper: #FAF7F0;
    --op-paper2:#F3EEE3;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    margin: 0;
    padding: 0;
    list-style: none;
    border: 1px solid var(--op-line);
    background: #FFFFFF;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    margin: 0;
    padding: 0;
    list-style: none;
    border-bottom: 1px solid var(--op-line);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child { border-bottom: 0; }

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 14px 18px;
    font-size: 15px;
    font-weight: 500;
    color: var(--op-body);
    text-decoration: none;
    border-left: 3px solid transparent;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    background: var(--op-paper);
    color: var(--op-ink);
}

/* Aktívna položka – jediné miesto, kde sa zvýrazňuje */
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    background: var(--op-paper);
    border-left-color: var(--op-green);
    color: var(--op-green);
    font-weight: 700;
}

/* Odhlásiť sa oddelíme – nie je to rovnaká akcia ako ostatné */
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a {
    color: var(--op-soft);
    font-size: 14px;
}
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a:hover { color: #8A2E2E; }

/* --- Mobil: menu ako vodorovný pás záložiek ---
   Sedem položiek pod sebou zabralo celú obrazovku a zákazník musel
   scrollovať, kým sa vôbec dostal k obsahu. Vodorovný pás sa zmestí
   do jedného riadku a dá sa v ňom posúvať prstom. --- */
@media (max-width: 767px) {
    .woocommerce-account .woocommerce-MyAccount-navigation {
        margin: 0 0 24px;
        /* Bez min-width:0 flex/grid rodič nedovolí pásu zmenšiť sa
           a stránka dostane vodorovné posúvanie. */
        min-width: 0;
        max-width: 100%;
    }
    .woocommerce-account .woocommerce-MyAccount-navigation ul {
        display: flex;
        gap: 8px;
        overflow-x: auto;
        border: 0;
        background: transparent;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }

    .woocommerce-account .woocommerce-MyAccount-navigation ul li {
        flex: 0 0 auto;
        border: 0;
    }
    .woocommerce-account .woocommerce-MyAccount-navigation ul li a {
        padding: 11px 16px;
        background: #FFFFFF;
        border: 1px solid var(--op-line);
        border-left: 1px solid var(--op-line);
        font-size: 14px;
        white-space: nowrap;
    }
    .woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
        background: var(--op-green);
        border-color: var(--op-green);
        color: #FFFFFF;
    }
    .woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a {
        background: transparent;
        border-color: transparent;
    }
}


/* =========================================================
   OPPIO – FORMULÁRE A OBSAH ÚČTU
   Adresy, Spôsoby platby, Moje údaje.
   Meníme len vzhľad – polia, validácia aj ukladanie
   zostávajú WooCommerce.
   ========================================================= */

.woocommerce-account .woocommerce-MyAccount-content {
    --op-green: #123F32;
    --op-deep:  #092A21;
    --op-ink:   #111111;
    --op-body:  #4A544E;
    --op-soft:  #626C67;
    --op-rule:  #D7CDB9;
    --op-line:  #E3DCCE;
    --op-paper: #FAF7F0;
    --op-paper2:#F3EEE3;
    color: var(--op-ink);
    font-size: 16px;
    line-height: 1.55;
}

/* Bez toho polia aj tlačidlá pretekajú na mobile o šírku
   vlastného vnútorného odsadenia. */
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account .woocommerce-MyAccount-content *,
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-navigation * {
    box-sizing: border-box;
}

/* Úvodná veta nad obsahom */
.woocommerce-account .woocommerce-MyAccount-content > p:first-child {
    margin: 0 0 24px;
    font-size: 15px;
    color: var(--op-soft);
}

/* --- Nadpisy --- */
/* Pozor: platí len pre nadpisy WooCommerce formulárov.
   Naše vlastné nadpisy (Prehľad, Predplatné) sú vyňaté – inak by
   z privítania „Ahoj Andrea“ bol drobný štítok verzálkami. */
.woocommerce-account .woocommerce-MyAccount-content h2:not([class*="oppio"]):not([class*="opk"]):not([class*="opo"]):not([class*="opd"]),
.woocommerce-account .woocommerce-MyAccount-content h3:not([class*="oppio"]):not([class*="opk"]):not([class*="opo"]):not([class*="opd"]),
.woocommerce-account .woocommerce-Address-title h3 {
    margin: 0 0 16px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--op-soft);
    line-height: 1.4;
}
.woocommerce-account .woocommerce-MyAccount-content legend {
    padding: 0;
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--op-soft);
}

/* --- Adresy: dve karty vedľa seba ---
   WooCommerce ich stavia na float (.u-column1 / .u-column2 so šírkou 48 %).
   Float musíme zrušiť aj na rodičovi, inak sa karty rozhádžu. */
.woocommerce-account .woocommerce-Addresses,
.woocommerce-account .woocommerce-Addresses.col2-set {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    margin: 0;
}
.woocommerce-account .woocommerce-Addresses::before,
.woocommerce-account .woocommerce-Addresses::after { content: none !important; display: none !important; }

.woocommerce-account .woocommerce-Addresses > .u-column1,
.woocommerce-account .woocommerce-Addresses > .u-column2,
.woocommerce-account .woocommerce-Addresses > div {
    flex: 1 1 300px;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    float: none !important;
}
/* WooCommerce dáva obe triedy na ten istý element
   (<div class="u-column1 col-1 woocommerce-Address">), takže nulovanie
   odsadenia stĺpca zabíjalo odsadenie karty a text sa lepil na okraj. */
.woocommerce-account .woocommerce-Addresses > div:not(.woocommerce-Address) {
    padding: 0 !important;
}

.woocommerce-account .woocommerce-Address {
    /* Karta je flex-stĺpec. Nadpis, adresa a tlačidlo sú tri prvky
       pod sebou – žiadne absolútne pozicovanie, takže sa nič
       neprekryje ani pri dlhšej adrese. */
    display: flex;
    flex-direction: column;
    height: 100%;
    width: auto !important;
    float: none !important;
    padding: 30px 32px 32px !important;
    background: #FFFFFF;
    border: 1px solid var(--op-line);
    box-shadow: 0 1px 2px rgba(9, 42, 33, .04);
}

/* display:contents vytiahne nadpis aj odkaz priamo do flexu karty,
   takže ich vieme poskladať v ľubovoľnom poradí. */
.woocommerce-account .woocommerce-Address-title {
    display: contents;
}
.woocommerce-account .woocommerce-Address-title h3 {
    order: 1;
    margin: 0 0 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--op-line);
    text-align: left !important;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--op-soft);
}

.woocommerce-account .woocommerce-Address address {
    order: 2;
    flex: 1 1 auto;
    margin: 0 0 22px;
    font-style: normal;
    font-size: 17px;
    line-height: 1.8;
    color: var(--op-ink);
}

.woocommerce-account .woocommerce-Address-title .edit {
    order: 3;
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 22px;
    background: transparent;
    color: var(--op-green);
    border: 1px solid var(--op-green);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s ease, color .15s ease;
}
.woocommerce-account .woocommerce-Address-title .edit:hover {
    background: var(--op-green);
    color: #FFFFFF;
}

/* --- Polia formulárov --- */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-form-row,
.woocommerce-account .woocommerce-MyAccount-content p.form-row {
    margin: 0 0 18px;
}
.woocommerce-account .woocommerce-MyAccount-content label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--op-body);
}
.woocommerce-account .woocommerce-MyAccount-content label .required {
    color: #8A2E2E;
    text-decoration: none;
    border: 0;
}
.woocommerce-account .woocommerce-MyAccount-content input.input-text,
.woocommerce-account .woocommerce-MyAccount-content textarea,
.woocommerce-account .woocommerce-MyAccount-content select,
.woocommerce-account .woocommerce-MyAccount-content .select2-container .select2-selection--single {
    width: 100%;
    min-height: 48px;
    padding: 11px 14px;
    background: #FFFFFF;
    border: 1px solid var(--op-rule);
    border-radius: 0;
    font-family: inherit;
    font-size: 15px;
    color: var(--op-ink);
    box-shadow: none;
    transition: border-color .15s ease;
}
.woocommerce-account .woocommerce-MyAccount-content input.input-text:focus,
.woocommerce-account .woocommerce-MyAccount-content textarea:focus,
.woocommerce-account .woocommerce-MyAccount-content select:focus {
    border-color: var(--op-green);
    outline: 2px solid rgba(18, 63, 50, .18);
    outline-offset: 0;
}
.woocommerce-account .woocommerce-MyAccount-content .select2-container .select2-selection--single {
    display: flex;
    align-items: center;
}
.woocommerce-account .woocommerce-MyAccount-content span.description,
.woocommerce-account .woocommerce-MyAccount-content em {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    font-style: normal;
    color: var(--op-soft);
}

/* Skupina „Zmena hesla“ */
.woocommerce-account .woocommerce-MyAccount-content fieldset {
    margin: 26px 0 0;
    padding: 24px 26px;
    background: var(--op-paper);
    border: 1px solid var(--op-line);
    border-radius: 0;
}

/* --- Tlačidlá --- */
/* !important preto, že téma dáva vlastné farby tlačidlám
   s vyššou špecificitou a inak zostanú krémové. */
.woocommerce-account .woocommerce-MyAccount-content button.woocommerce-Button,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button,
.woocommerce-account .woocommerce-MyAccount-content button[type="submit"],
.woocommerce-account .woocommerce-MyAccount-content a.button,
.woocommerce-account .woocommerce-MyAccount-content .button {
    background-color: var(--op-green) !important;
    color: #FFFFFF !important;
    border-color: var(--op-green) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 28px;
    background: var(--op-green);
    color: #FFFFFF;
    border: 1px solid var(--op-green);
    border-radius: 0;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
}
.woocommerce-account .woocommerce-MyAccount-content button.woocommerce-Button:hover,
.woocommerce-account .woocommerce-MyAccount-content button[type="submit"]:hover,
.woocommerce-account .woocommerce-MyAccount-content .button:hover {
    background: var(--op-deep);
    border-color: var(--op-deep);
}
/* Vymazať kartu – tichšie, je to nezvratné */
.woocommerce-account .woocommerce-MyAccount-content .button.delete {
    background-color: transparent !important;
    color: #8A2E2E !important;
    border-color: var(--op-rule) !important;
    min-height: 40px;
    padding: 0 18px;
}
.woocommerce-account .woocommerce-MyAccount-content .button.delete:hover {
    background: transparent;
    border-color: #8A2E2E;
}

/* --- Spôsoby platby --- */
.woocommerce-account .woocommerce-MyAccount-paymentMethods {
    width: 100%;
    margin: 0 0 20px;
    border: 1px solid var(--op-line);
    border-collapse: collapse;
    background: #FFFFFF;
}
.woocommerce-account .woocommerce-MyAccount-paymentMethods thead { display: none; }
.woocommerce-account .woocommerce-MyAccount-paymentMethods td {
    padding: 18px 20px;
    border: 0;
    border-top: 1px solid var(--op-line);
    font-size: 15px;
    vertical-align: middle;
}
.woocommerce-account .woocommerce-MyAccount-paymentMethods tr:first-child td { border-top: 0; }
.woocommerce-account .woocommerce-MyAccount-paymentMethods .payment-method-method { font-weight: 600; }
.woocommerce-account .woocommerce-MyAccount-paymentMethods .payment-method-expires { color: var(--op-soft); }
.woocommerce-account .woocommerce-MyAccount-paymentMethods .payment-method-actions { text-align: right; }

/* --- Hlášky --- */
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-info,
.woocommerce-account .woocommerce-error {
    position: relative;
    /* WooCommerce si sem absolútne umiestňuje ikonu ::before.
       Bez ľavého odsadenia prekryje prvé písmeno textu. */
    padding: 16px 20px 16px 52px;
    margin: 0 0 22px;
    border: 1px solid var(--op-rule);
    border-left: 3px solid var(--op-green);
    border-radius: 0;
    background: var(--op-paper);
    color: var(--op-ink);
    font-size: 15px;
    list-style: none;
}
.woocommerce-account .woocommerce-error {
    border-left-color: #8A2E2E;
    background: #F8E4E4;
}
.woocommerce-account .woocommerce-message::before,
.woocommerce-account .woocommerce-info::before,
.woocommerce-account .woocommerce-error::before {
    left: 20px;
    top: 18px;
    color: var(--op-green);
}
.woocommerce-account .woocommerce-error::before { color: #8A2E2E; }
/* Tlačidlo vnútri hlášky nemá byť roztiahnuté cez celý riadok */
.woocommerce-account .woocommerce-message .button { float: none; margin-left: 14px; }

@media (max-width: 767px) {
    .woocommerce-account .woocommerce-Addresses > .u-column1,
    .woocommerce-account .woocommerce-Addresses > .u-column2,
    .woocommerce-account .woocommerce-Addresses > div { flex: 1 1 100%; }
    .woocommerce-account .woocommerce-Address { padding: 24px 22px !important; }
    .woocommerce-account .woocommerce-Address-title .edit { align-self: stretch; }
    .woocommerce-account .woocommerce-MyAccount-content fieldset { padding: 20px; }
    .woocommerce-account .woocommerce-MyAccount-content button.woocommerce-Button,
    .woocommerce-account .woocommerce-MyAccount-content .button { width: 100%; }
    .woocommerce-account .woocommerce-MyAccount-paymentMethods td { padding: 14px 16px; }
    .woocommerce-account .woocommerce-MyAccount-paymentMethods .payment-method-actions { text-align: left; }
}

/* =========================================================
   OPPIO – ÚPRAVA PREDPLATNÉHO (výber produktov)
   /moj-ucet/upravit-predplatne/

   Plugin sem vypisuje tabuľku s inline štýlmi. Tabuľku
   nechávame v HTML (visí na nej ukladanie mixu), ale
   zobrazujeme ju ako zoznam kariet. Preto tie !important –
   inak by inline štýly vyhrali.
   ========================================================= */

.woocommerce-MyAccount-content table.shop_table:has(#oppio-products-tbody),
.woocommerce-MyAccount-content #oppio-products-tbody {
    display: block !important;
    width: 100% !important;
    border: 0 !important;
    background: transparent !important;
}
.woocommerce-MyAccount-content table.shop_table:has(#oppio-products-tbody) thead {
    display: none !important;
}

/* Riadok = karta produktu */
.woocommerce-MyAccount-content #oppio-products-tbody tr {
    display: flex !important;
    align-items: center;
    gap: 16px;
    margin-bottom: 8px;
    padding: 14px 18px;
    background: #FFFFFF !important;
    border: 1px solid #E3DCCE !important;
    transition: border-color .15s ease, background .15s ease;
}
.woocommerce-MyAccount-content #oppio-products-tbody tr:hover {
    border-color: #D7CDB9 !important;
}

/* Vybraný produkt – zelený pás vľavo, aby bolo vidno, čo je v mixe */
.woocommerce-MyAccount-content #oppio-products-tbody tr.oppio-row-selected {
    background: #FAF7F0 !important;
    border-color: #123F32 !important;
    box-shadow: inset 3px 0 0 #123F32;
}

.woocommerce-MyAccount-content #oppio-products-tbody td {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    text-align: left !important;
}
.woocommerce-MyAccount-content .oppio-bunka-prazdna { display: none !important; }

/* Fotka + názov + cena */
.woocommerce-MyAccount-content .oppio-bunka-produkt {
    display: flex !important;
    align-items: center;
    gap: 14px;
    flex: 1 1 auto;
    min-width: 0;
}
.woocommerce-MyAccount-content .oppio-foto {
    flex: 0 0 auto;
    width: 62px;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F3EEE3;
    border: 1px solid #E3DCCE;
    overflow: hidden;
}
.woocommerce-MyAccount-content .oppio-foto img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.woocommerce-MyAccount-content .oppio-info {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}
.woocommerce-MyAccount-content .oppio-nazov {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.3;
    color: #111111;
}
.woocommerce-MyAccount-content .oppio-cena {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0 5px;
    font-size: 14px;
    color: #626C67;
}
/* Téma dáva niektorým značkám blokové zobrazenie a „/ ks“ padalo
   na nový riadok. */
.woocommerce-MyAccount-content .oppio-cena s,
.woocommerce-MyAccount-content .oppio-cena b,
.woocommerce-MyAccount-content .oppio-cena em,
.woocommerce-MyAccount-content .oppio-cena .amount,
.woocommerce-MyAccount-content .oppio-cena bdi {
    display: inline !important;
    margin: 0 !important;
}
.woocommerce-MyAccount-content .oppio-cena s {
    color: #9AA39E;
    text-decoration-thickness: 1px;
}
.woocommerce-MyAccount-content .oppio-cena s .amount,
.woocommerce-MyAccount-content .oppio-cena s bdi { color: inherit !important; }
.woocommerce-MyAccount-content .oppio-cena b .amount,
.woocommerce-MyAccount-content .oppio-cena b bdi { color: inherit !important; }
.woocommerce-MyAccount-content .oppio-cena b {
    font-size: 15px;
    font-weight: 700;
    color: #123F32;
}
.woocommerce-MyAccount-content .oppio-cena em { font-style: normal; }

/* Množstvo: − hodnota + */
.woocommerce-MyAccount-content .oppio-bunka-mnozstvo { flex: 0 0 auto; }
.woocommerce-MyAccount-content .oppio-stepper {
    display: inline-flex;
    align-items: stretch;
    background: #FFFFFF;
    border: 1px solid #D7CDB9;
}
.woocommerce-MyAccount-content tr.oppio-row-selected .oppio-stepper { border-color: #123F32; }

.woocommerce-MyAccount-content .oppio-stepper button {
    width: 44px;
    min-height: 46px;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    font-family: inherit;
    font-size: 19px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: #123F32 !important;
    cursor: pointer;
    min-width: 0;
}
.woocommerce-MyAccount-content .oppio-stepper button:hover { background: #F3EEE3 !important; }
.woocommerce-MyAccount-content .oppio-stepper button:disabled {
    color: #C9CFCB !important;
    cursor: default;
    background: transparent !important;
}

.woocommerce-MyAccount-content .oppio-qty-input {
    width: 46px !important;
    min-height: 46px;
    padding: 0 4px !important;
    background: transparent !important;
    border: 0 !important;
    border-left: 1px solid #E3DCCE !important;
    border-right: 1px solid #E3DCCE !important;
    border-radius: 0 !important;
    font-family: inherit;
    font-size: 17px;
    font-weight: 700;
    text-align: center;
    color: #111111;
    -moz-appearance: textfield;
}
.woocommerce-MyAccount-content .oppio-qty-input::-webkit-outer-spin-button,
.woocommerce-MyAccount-content .oppio-qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.woocommerce-MyAccount-content .oppio-qty-input:focus {
    outline: 2px solid rgba(18, 63, 50, .18);
    outline-offset: -2px;
}
.woocommerce-MyAccount-content tr.oppio-row-selected .oppio-qty-input { color: #123F32; }

@media (max-width: 600px) {
    .woocommerce-MyAccount-content #oppio-products-tbody tr {
        flex-wrap: wrap;
        padding: 14px 16px;
    }
    .woocommerce-MyAccount-content .oppio-bunka-produkt { flex: 1 1 100%; }
    .woocommerce-MyAccount-content .oppio-bunka-mnozstvo {
        flex: 1 1 100%;
        margin-top: 12px;
    }
    .woocommerce-MyAccount-content .oppio-stepper { display: flex; width: 100%; }
    .woocommerce-MyAccount-content .oppio-stepper button { flex: 1 1 auto; width: auto; }
    .woocommerce-MyAccount-content .oppio-qty-input { flex: 1 1 auto; width: auto !important; }
}

/* --- Úprava predplatného: hlavička, súčet, tlačidlá --- */

.woocommerce-MyAccount-content .oppio-mix-hlavicka { margin: 0 0 24px; }
.woocommerce-MyAccount-content .oppio-mix-hlavicka h2 {
    margin: 0 0 8px !important;
    font-style: italic !important;
    font-size: clamp(24px, 2.4vw, 32px) !important;
    font-weight: 800 !important;
    line-height: 1.08 !important;
    letter-spacing: -.03em !important;
    text-transform: none !important;
    color: #111111 !important;
}
.woocommerce-MyAccount-content .oppio-mix-hlavicka p {
    margin: 0;
    max-width: 62ch;
    font-size: 15px;
    line-height: 1.6;
    color: #626C67;
}
/* Termín, dokedy sa dá mix zmeniť. Nie je to varovanie, len fakt,
   ktorý má byť viditeľnejší než zvyšok úvodného textu. */
.woocommerce-MyAccount-content .oppio-mix-hlavicka .oppio-mix-termin {
    margin: 12px 0 0 !important;
    padding: 10px 14px;
    border-left: 2px solid #123F32;
    background: #F3EEE3;
    font-size: 14px;
    line-height: 1.5;
    color: #123F32;
}

/* Formulár okolo produktov – zbavíme sa sivého rámu z pluginu */
.woocommerce-MyAccount-content form[action*="upravit-predplatne"] {
    max-width: none !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    margin-bottom: 0 !important;
}

/* Súčet */
.woocommerce-MyAccount-content .oppio-mix-sucet {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;
    margin: 16px 0 20px;
    padding: 22px 26px;
    background: #123F32;
    color: #FFFFFF;
    border: 0;
    border-radius: 0;
}
.woocommerce-MyAccount-content .oppio-mix-sucet .oppio-label {
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(255,255,255,.68);
}
.woocommerce-MyAccount-content .oppio-mix-suma {
    margin: 0;
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1.1;
}
.woocommerce-MyAccount-content .oppio-mix-pred {
    margin: 6px 0 0;
    font-size: 13px;
    color: rgba(255,255,255,.7);
}
.woocommerce-MyAccount-content .oppio-mix-pred span:first-child { text-decoration: line-through; }
.woocommerce-MyAccount-content .oppio-mix-zlava {
    margin-left: 6px;
    padding: 2px 8px;
    background: rgba(255,255,255,.16);
    font-weight: 700;
    text-decoration: none !important;
}
.woocommerce-MyAccount-content .oppio-mix-doprava strong { color: #FFFFFF; font-weight: 700; }
.woocommerce-MyAccount-content .oppio-mix-doprava {
    margin: 8px 0 0;
    font-size: 13px;
    color: rgba(255,255,255,.82);
    /* Doprava má motivovať, nie strašiť – žiadna červená. */
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* Tlačidlá */
.woocommerce-MyAccount-content .oppio-mix-akcie {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 4px;
}
.woocommerce-MyAccount-content .oppio-mix-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 28px !important;
    background: transparent !important;
    color: #123F32 !important;
    border: 1px solid #D7CDB9 !important;
    border-radius: 0 !important;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
}
.woocommerce-MyAccount-content .oppio-mix-btn:hover { border-color: #123F32 !important; }
.woocommerce-MyAccount-content .oppio-mix-btn-hlavne {
    background: #123F32 !important;
    color: #FFFFFF !important;
    border-color: #123F32 !important;
}
.woocommerce-MyAccount-content .oppio-mix-btn-hlavne:hover {
    background: #092A21 !important;
    border-color: #092A21 !important;
}

@media (max-width: 600px) {
    .woocommerce-MyAccount-content .oppio-mix-sucet {
        flex-direction: column;
        align-items: stretch;
        padding: 20px;
    }
    .woocommerce-MyAccount-content .oppio-mix-akcie { flex-direction: column; }
    .woocommerce-MyAccount-content .oppio-mix-btn { width: 100%; }
}

/* =========================================================
   OPPIO – PREDPLATNÉ V ÚČTE (karty)
   Nahrádza pôvodnú tabuľku. Jedna karta = jedno predplatné.
   ========================================================= */

.oppio-predplatne {
    --op-green: #123F32;
    --op-deep:  #092A21;
    --op-ink:   #111111;
    --op-body:  #4A544E;
    --op-soft:  #626C67;
    --op-rule:  #D7CDB9;
    --op-line:  #E3DCCE;
    --op-paper: #FAF7F0;
    --op-paper2:#F3EEE3;
    color: var(--op-ink);
    font-size: 16px;
    line-height: 1.55;
}
.oppio-predplatne * { box-sizing: border-box; }

.oppio-predplatne .opk-hlavicka {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 22px;
}
.oppio-predplatne .opk-hlavicka h2 {
    margin: 0;
    font-style: italic;
    font-size: clamp(26px, 2.6vw, 36px);
    font-weight: 800;
    line-height: 1.06;
    letter-spacing: -.03em;
}

/* --- Prepínač Aktuálne / Ukončené --- */
.oppio-predplatne .opk-prepinac { display: flex; gap: 6px; }
.oppio-predplatne .opk-tab {
    padding: 7px 14px;
    border: 1px solid var(--op-line);
    background: #FFFFFF;
    color: var(--op-soft);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}
.oppio-predplatne .opk-tab:hover { border-color: var(--op-green); color: var(--op-green); }
.oppio-predplatne .opk-tab-aktivny {
    background: var(--op-green);
    border-color: var(--op-green);
    color: #FFFFFF;
}

/* --- Karta --- */
.oppio-predplatne .opk-karta {
    margin: 0 0 18px;
    padding: 26px 28px;
    background: var(--op-paper);
    border: 1px solid var(--op-rule);
    border-radius: 0;
}
.oppio-predplatne .opk-karta-hlavna {
    background: var(--op-green);
    border-color: var(--op-green);
    color: #FFFFFF;
}

.oppio-predplatne .opk-hore {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.oppio-predplatne .opk-label {
    margin: 0 0 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--op-soft);
}
.oppio-predplatne .opk-karta-hlavna .opk-label { color: rgba(255,255,255,.68); }

.oppio-predplatne .opk-velke {
    margin: 0 0 6px;
    font-size: clamp(20px, 2vw, 26px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -.02em;
}

.oppio-predplatne .opk-mini { margin: 0; font-size: 14px; color: var(--op-body); }
.oppio-predplatne .opk-karta-hlavna .opk-mini { color: rgba(255,255,255,.82); }
.oppio-predplatne .opk-mini .amount,
.oppio-predplatne .opk-mini bdi { color: inherit; font-weight: 700; }

.oppio-predplatne .opk-dodavka {
    margin: 16px 0 0;
    font-size: 14px;
    color: var(--op-body);
}
.oppio-predplatne .opk-karta-hlavna .opk-dodavka { color: rgba(255,255,255,.9); }

/* --- Štítok stavu --- */
.oppio-predplatne .opk-stav {
    flex: 0 0 auto;
    padding: 6px 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    white-space: nowrap;
}
.oppio-predplatne .opk-stav-ok      { background:#FFFFFF; color:var(--op-green); }
.oppio-predplatne .opk-stav-pauza   { background:var(--op-paper2); color:#6B5A22; border:1px solid var(--op-rule); }
.oppio-predplatne .opk-stav-problem { background:#F8E4E4; color:#8A2E2E; }
.oppio-predplatne .opk-stav-koniec  { background:var(--op-paper2); color:var(--op-soft); border:1px solid var(--op-rule); }
.oppio-predplatne .opk-stav-neznamy { background:var(--op-paper2); color:var(--op-soft); border:1px solid var(--op-rule); }

/* --- Zoznam fliaš --- */
.oppio-predplatne .opk-obsah {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--op-line);
}
.oppio-predplatne .opk-karta-hlavna .opk-obsah { border-top-color: rgba(255,255,255,.22); }
.oppio-predplatne .opk-fl {
    padding: 5px 11px;
    background: var(--op-paper2);
    font-size: 13px;
    line-height: 1.3;
}
.oppio-predplatne .opk-karta-hlavna .opk-fl { background: rgba(255,255,255,.12); color:#FFFFFF; }

/* --- Tlačidlá --- */
.oppio-predplatne .opk-akcie {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}
.oppio-predplatne .opk-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 20px;
    background: transparent;
    color: var(--op-green);
    border: 1px solid var(--op-rule);
    border-radius: 0;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.oppio-predplatne .opk-btn:hover { border-color: var(--op-green); }
.oppio-predplatne .opk-btn-hlavne {
    background: var(--op-green);
    border-color: var(--op-green);
    color: #FFFFFF;
}
.oppio-predplatne .opk-btn-hlavne:hover { background: var(--op-deep); border-color: var(--op-deep); }
.oppio-predplatne .opk-btn-zrusit { color: #8A2E2E; }
.oppio-predplatne .opk-btn-zrusit:hover { border-color: #8A2E2E; }

/* Na tmavej karte sa farby prehadzujú */
.oppio-predplatne .opk-karta-hlavna .opk-btn {
    color: #FFFFFF;
    border-color: rgba(255,255,255,.42);
}
.oppio-predplatne .opk-karta-hlavna .opk-btn:hover { border-color:#FFFFFF; }
.oppio-predplatne .opk-karta-hlavna .opk-btn-hlavne {
    background: #FFFFFF;
    border-color: #FFFFFF;
    color: var(--op-green);
}
.oppio-predplatne .opk-karta-hlavna .opk-btn-hlavne:hover { background: var(--op-paper2); border-color: var(--op-paper2); }
.oppio-predplatne .opk-karta-hlavna .opk-btn-zrusit { color: rgba(255,255,255,.75); }

/* --- Drobnosti --- */
.oppio-predplatne .opk-technicke {
    margin: 18px 0 0;
    font-size: 11px;
    color: var(--op-soft);
}
.oppio-predplatne .opk-karta-hlavna .opk-technicke { color: rgba(255,255,255,.5); }
.oppio-predplatne .opk-technicke code { font-size: 11px; background: none; padding: 0; }

.oppio-predplatne .opk-prazdne { color: var(--op-soft); }

.oppio-predplatne .opk-pomoc {
    margin: 26px 0 0;
    padding-top: 20px;
    border-top: 1px solid var(--op-line);
    font-size: 14px;
    color: var(--op-soft);
}
.oppio-predplatne .opk-pomoc a { color: var(--op-green); text-decoration: underline; text-underline-offset: 2px; }

/* --- Mobil --- */
@media (max-width: 767px) {
    .oppio-predplatne .opk-karta { padding: 22px 20px; }
    .oppio-predplatne .opk-hore { flex-direction: column-reverse; align-items: flex-start; gap: 14px; }
    .oppio-predplatne .opk-akcie { flex-direction: column; }
    .oppio-predplatne .opk-btn { width: 100%; }
    .oppio-predplatne .opk-prepinac { width: 100%; }
    .oppio-predplatne .opk-tab { flex: 1; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
    .oppio-predplatne * { transition: none !important; }
}

/* --- Suma a zľava (koncept: „35,70 € −15 %“) --- */
.oppio-predplatne .opk-suma {
    margin: 18px 0 0;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.01em;
}
.oppio-predplatne .opk-suma .amount,
.oppio-predplatne .opk-suma bdi { color: inherit; }
.oppio-predplatne .opk-zlava {
    margin-left: 8px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--op-green);
    background: var(--op-paper2);
    padding: 3px 9px;
    vertical-align: middle;
}
.oppio-predplatne .opk-karta-hlavna .opk-zlava {
    color: #FFFFFF;
    background: rgba(255,255,255,.16);
}

/* --- Zrušiť ako tichý odkaz pod kartou --- */
.oppio-predplatne .opk-zrusit-riadok {
    margin: -8px 0 22px;
    text-align: right;
}
.oppio-predplatne .opk-zrusit-odkaz {
    background: none;
    border: 0;
    padding: 0;
    font-family: inherit;
    font-size: 13px;
    color: var(--op-soft);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}
.oppio-predplatne .opk-zrusit-odkaz:hover { color: #8A2E2E; }

@media (max-width: 767px) {
    /* Zrušiť nechávame tiché, ale nech nie je nalepené na tlačidle nad ním. */
    .oppio-predplatne .opk-zrusit-riadok {
        text-align: center;
        margin: 4px 0 26px;
    }
    .oppio-predplatne .opk-zrusit-odkaz {
        display: inline-block;
        padding: 10px 4px;
        font-size: 14px;
    }
}

/* =========================================================
   OPPIO – ZOZNAM OBJEDNÁVOK (Môj účet → Objednávky)
   ========================================================= */

.oppio-objednavky {
    --op-green: #123F32;
    --op-deep:  #092A21;
    --op-ink:   #111111;
    --op-body:  #4A544E;
    --op-soft:  #626C67;
    --op-rule:  #D7CDB9;
    --op-line:  #E3DCCE;
    --op-paper: #FAF7F0;
    --op-paper2:#F3EEE3;
    color: var(--op-ink);
    font-size: 16px;
    line-height: 1.55;
}
.oppio-objednavky * { box-sizing: border-box; }

.oppio-objednavky .opo-riadok {
    padding: 22px 24px;
    margin-bottom: 12px;
    background: #FFFFFF;
    border: 1px solid var(--op-line);
    transition: border-color .15s ease;
}
.oppio-objednavky .opo-riadok:hover { border-color: var(--op-rule); }

.oppio-objednavky .opo-hlava {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.oppio-objednavky .opo-cislo {
    margin: 0 0 4px;
    font-size: 19px;
    font-weight: 700;
    letter-spacing: -.01em;
}
.oppio-objednavky .opo-datum {
    margin: 0;
    font-size: 14px;
    color: var(--op-soft);
}

.oppio-objednavky .opo-vpravo {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 0 0 auto;
}
.oppio-objednavky .opo-suma {
    font-size: 17px;
    font-weight: 700;
    white-space: nowrap;
}
.oppio-objednavky .opo-suma .amount,
.oppio-objednavky .opo-suma bdi { color: inherit; }

.oppio-objednavky .opk-stav {
    padding: 5px 11px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    white-space: nowrap;
}
.oppio-objednavky .opk-stav-ok      { background:#E4EDE8; color:var(--op-green); }
.oppio-objednavky .opk-stav-ide     { background:#FBF3D8; color:#6B5A22; }
.oppio-objednavky .opk-stav-koniec  { background:var(--op-paper2); color:var(--op-soft); }
.oppio-objednavky .opk-stav-neutral { background:var(--op-paper2); color:var(--op-soft); }

.oppio-objednavky .opo-povod {
    margin: 14px 0 0;
    padding-left: 13px;
    border-left: 2px solid var(--op-rule);
    font-size: 13px;
    color: var(--op-soft);
}

.oppio-objednavky .opo-akcie {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}
.oppio-objednavky .opk-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 18px;
    background: transparent;
    color: var(--op-green);
    border: 1px solid var(--op-rule);
    border-radius: 0;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.oppio-objednavky .opk-btn:hover { border-color: var(--op-green); }
.oppio-objednavky .opk-btn-hlavne {
    background: var(--op-green);
    border-color: var(--op-green);
    color: #FFFFFF;
}
.oppio-objednavky .opk-btn-hlavne:hover { background: var(--op-deep); border-color: var(--op-deep); }

.oppio-objednavky .opo-prazdne {
    padding: 40px 28px;
    background: var(--op-paper);
    border: 1px solid var(--op-rule);
    text-align: center;
}
.oppio-objednavky .opo-prazdne .opk-velke {
    margin: 0 0 6px;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -.02em;
}
.oppio-objednavky .opo-prazdne .opk-mini { margin: 0; font-size: 15px; color: var(--op-body); }
.oppio-objednavky .opo-prazdne .opk-akcie { margin-top: 22px; }

.oppio-objednavky .opo-strankovanie {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--op-line);
}
.oppio-objednavky .opo-strana { font-size: 13px; color: var(--op-soft); }

@media (max-width: 767px) {
    .oppio-objednavky .opo-riadok { padding: 20px; }
    .oppio-objednavky .opo-hlava { flex-direction: column; gap: 12px; }
    .oppio-objednavky .opo-vpravo { width: 100%; justify-content: space-between; }
    .oppio-objednavky .opo-akcie { flex-direction: column; }
    .oppio-objednavky .opk-btn { width: 100%; }
    .oppio-objednavky .opo-strankovanie { flex-direction: column; }
}

/* =========================================================
   OPPIO – DETAIL OBJEDNÁVKY (Môj účet → Objednávky → Zobraziť)
   ========================================================= */

.oppio-detail-obj {
    --op-green: #123F32;
    --op-deep:  #092A21;
    --op-ink:   #111111;
    --op-body:  #4A544E;
    --op-soft:  #626C67;
    --op-rule:  #D7CDB9;
    --op-line:  #E3DCCE;
    --op-paper: #FAF7F0;
    --op-paper2:#F3EEE3;
    color: var(--op-ink);
    font-size: 16px;
    line-height: 1.55;
}
.oppio-detail-obj * { box-sizing: border-box; }

.oppio-detail-obj .opd-spat { margin: 0 0 18px; font-size: 14px; }
.oppio-detail-obj .opd-spat a { color: var(--op-soft); text-decoration: none; }
.oppio-detail-obj .opd-spat a:hover { color: var(--op-green); }

/* --- Zhrnutie --- */
.oppio-detail-obj .opd-zhrnutie {
    padding: 24px 26px;
    margin-bottom: 16px;
    background: var(--op-green);
    border: 1px solid var(--op-green);
    color: #FFFFFF;
}
.oppio-detail-obj .opd-zhrnutie-hore {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}
.oppio-detail-obj .opd-cislo {
    margin: 0 0 4px;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -.02em;
}
.oppio-detail-obj .opd-datum { margin: 0; font-size: 14px; color: rgba(255,255,255,.75); }
.oppio-detail-obj .opd-zhrnutie .opk-stav {
    flex: 0 0 auto;
    padding: 6px 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    white-space: nowrap;
    background: #FFFFFF;
    color: var(--op-green);
}
.oppio-detail-obj .opd-povod {
    margin: 16px 0 0;
    padding-left: 13px;
    border-left: 2px solid rgba(255,255,255,.35);
    font-size: 13px;
    color: rgba(255,255,255,.82);
}

/* --- Blok --- */
.oppio-detail-obj .opd-blok {
    padding: 24px 26px;
    margin-bottom: 16px;
    background: #FFFFFF;
    border: 1px solid var(--op-line);
}
.oppio-detail-obj .opd-nadpis {
    margin: 0 0 18px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--op-soft);
}

/* --- Položky --- */
.oppio-detail-obj .opd-polozka {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 0;
    border-top: 1px solid var(--op-line);
}
.oppio-detail-obj .opd-polozka:first-of-type { border-top: 0; padding-top: 0; }
.oppio-detail-obj .opd-nazov { margin: 0; font-size: 16px; font-weight: 600; }
.oppio-detail-obj .opd-pocet { color: var(--op-soft); font-weight: 400; }
.oppio-detail-obj .opd-polozka-cena { font-weight: 700; white-space: nowrap; }
.oppio-detail-obj .opd-meta { font-size: 13px; color: var(--op-soft); }
.oppio-detail-obj .opd-meta p { margin: 4px 0 0; }
.oppio-detail-obj .opd-meta .wc-item-meta { margin: 4px 0 0; padding: 0; list-style: none; }
.oppio-detail-obj .opd-meta .wc-item-meta li { margin: 0; }
.oppio-detail-obj .opd-meta .wc-item-meta strong { font-weight: 600; }

/* --- Súčty --- */
.oppio-detail-obj .opd-sucty { padding-top: 20px; padding-bottom: 20px; }
.oppio-detail-obj .opd-sucet {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 7px 0;
    font-size: 15px;
    color: var(--op-body);
}
.oppio-detail-obj .opd-sucet-hlavny {
    margin-top: 8px;
    padding-top: 16px;
    border-top: 1px solid var(--op-rule);
    font-size: 19px;
    font-weight: 700;
    color: var(--op-ink);
}
.oppio-detail-obj .opd-sucet small { font-weight: 400; color: var(--op-soft); }

/* --- Adresy --- */
.oppio-detail-obj .opd-adresy {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.oppio-detail-obj .opd-adresy .opd-blok { margin-bottom: 0; }
.oppio-detail-obj address {
    font-style: normal;
    font-size: 15px;
    line-height: 1.7;
    color: var(--op-body);
}
.oppio-detail-obj .opd-kontakt { display: block; margin-top: 6px; font-size: 14px; }

.oppio-detail-obj .opd-pomoc {
    margin: 26px 0 0;
    padding-top: 20px;
    border-top: 1px solid var(--op-line);
    font-size: 14px;
    color: var(--op-soft);
}
.oppio-detail-obj .opd-pomoc a { color: var(--op-green); text-decoration: underline; text-underline-offset: 2px; }
.oppio-detail-obj .opd-chyba { color: var(--op-soft); }

/* Tlačidlá pluginov (Faktúra, sledovanie) do nášho štýlu */
.oppio-detail-obj .button,
.oppio-detail-obj .woocommerce-button {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 18px;
    background: transparent;
    color: var(--op-green);
    border: 1px solid var(--op-rule);
    border-radius: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    text-decoration: none;
}
.oppio-detail-obj .button:hover { border-color: var(--op-green); }

@media (max-width: 767px) {
    .oppio-detail-obj .opd-zhrnutie,
    .oppio-detail-obj .opd-blok { padding: 20px; }
    .oppio-detail-obj .opd-zhrnutie-hore { flex-direction: column-reverse; align-items: flex-start; gap: 12px; }
    .oppio-detail-obj .opd-adresy { grid-template-columns: 1fr; }
}

/* --- Vysvetľujúca veta nad zoznamom --- */
.oppio-objednavky .opo-vysvetlenie,
.oppio-predplatne .opk-vysvetlenie {
    margin: 0 0 22px;
    padding-left: 14px;
    border-left: 2px solid var(--op-rule);
    font-size: 14px;
    line-height: 1.6;
    color: var(--op-soft);
    max-width: 62ch;
}

/* =========================================================
   OPPIO – PRIHLÁSENIE A REGISTRÁCIA (/moj-ucet/ pre neprihláseného)

   Návrh D „svetlý split“: vľavo text o tom, načo účet je, vpravo úzka
   biela karta s formulárom a prepínačom „Mám účet / Som tu prvýkrát“.

   AKO TO DRŽÍ POKOPE:
   WooCommerce vypíše prepínače (my, cez hook) a hneď za nimi vlastný blok
   #customer_login. JavaScript prepínače presunie DOVNÚTRA #customer_login,
   takže na mriežku ostanú len dva prvky – úvod a karta – a tie sa
   rozdelia do stĺpcov samy. Šablónu neprepisujeme.

   BEZ JAVASCRIPTU sa prepínače schovajú a v karte sú oba formuláre pod
   sebou, každý so svojím nadpisom. Použiteľné, len bez prepínania.
   ========================================================= */

.woocommerce-account:not(.logged-in) .woocommerce {
    --op-green: #123F32;
    --op-deep:  #092A21;
    --op-ink:   #111111;
    --op-body:  #4A544E;
    --op-soft:  #626C67;
    --op-rule:  #D7CDB9;
    --op-line:  #E3DCCE;
    --op-paper2:#F3EEE3;

    display: grid;
    grid-template-columns: 1fr 400px;
    column-gap: 56px;
    /* Zarovnanie podľa HORNEJ hrany. Zvislý stred aj natiahnutie na rovnakú
       výšku vyzerali horšie – stred nelícoval nikde a natiahnutie rozhádzalo
       medzery vnútri textu. Horná hrana je to, čo oko číta ako zarovnané. */
    align-items: start;
    max-width: 980px;

    /* Vodorovne na stred stránky. */
    margin: 0 auto;

    /* Zvislé centrovanie cez 100vh tu bolo – na nižšom okne sa výpočet
       neprejavil a blok sa aj tak lepil na menu. Odsadenie preto riešime
       priamo, pravidlom nižšie. */

    color: var(--op-ink);
    font-size: 16px;
    line-height: 1.55;
}
.woocommerce-account:not(.logged-in) .woocommerce * { box-sizing: border-box; }

/* Hlásenia idú cez celú šírku nad oba stĺpce. */
.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-error,
.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-message,
.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-info {
    grid-column: 1 / -1;
}

/* Pôvodný nadpis stránky („Môj účet“) skrývame – vlastný, priateľskejší
   je v ľavom stĺpci. Selektor je overený na živej stránke: nadpis je holé
   <h1> vnútri #content. Náš nadpis je tiež <h1>, takže stránka má stále
   presne jeden hlavný nadpis. */
.woocommerce-account:not(.logged-in) #content > h1,
.woocommerce-account:not(.logged-in) #content > * > h1:not(.oppio-login-nadpis) {
    display: none !important;
}

/* ---------- ĽAVÝ STĹPEC ---------- */

.oppio-login-uvod {
    grid-column: 1;
    max-width: 440px;
}
.oppio-login-stitok {
    margin: 0 0 12px !important;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--op-soft);
}
.oppio-login-nadpis {
    margin: 0 0 12px !important;
    font-style: italic !important;
    font-size: clamp(30px, 3.4vw, 42px) !important;
    font-weight: 800 !important;
    line-height: 1.02 !important;
    letter-spacing: -.035em !important;
    text-transform: none !important;
    color: var(--op-ink) !important;
}
.oppio-login-perex {
    margin: 0 !important;
    font-size: 15.5px;
    line-height: 1.6;
    color: var(--op-body);
}

/* Načo účet je. */
.oppio-login-naco {
    margin: 28px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border-top: 1px solid var(--op-line);
}
.oppio-login-naco li {
    margin: 0 !important;
    padding: 15px 0;
    border-bottom: 1px solid var(--op-line);
    font-size: 14px;
    line-height: 1.5;
    color: var(--op-body);
    list-style: none !important;
}
.oppio-login-naco li b {
    display: block;
    margin-bottom: 3px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--op-green);
}

/* ---------- PRAVÝ STĹPEC: KARTA ---------- */

.woocommerce-account:not(.logged-in) #customer_login {
    grid-column: 2;
    width: 100%;
    margin: 0 !important;
    padding: 26px 24px 28px;
    border: 1px solid var(--op-line);
    background: #FFFFFF;
}
.woocommerce-account:not(.logged-in) #customer_login::before,
.woocommerce-account:not(.logged-in) #customer_login::after {
    content: none !important;   /* WooCommerce clearfix z čias floatov */
}
.woocommerce-account:not(.logged-in) #customer_login > div:not(.oppio-login-taby) {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
}
/* Nadpisy „Prihlásenie“ / „Vytvoriť účet“ nahradili prepínače. */
.woocommerce-account:not(.logged-in) #customer_login > div > h2 {
    display: none !important;
}

/* OPRAVA: téma (alebo Elementor) dáva formulárom vlastný rám a odsadenie,
   takže v karte vznikol druhý rám navyše. Tu ho rušíme. */
.woocommerce-account:not(.logged-in) #customer_login form.woocommerce-form {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

/* --- Prepínače (JS ich presunie do karty) --- */
.oppio-login-taby {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    margin: 0 0 24px;
}
.oppio-login-taby .oppio-tab {
    display: block;
    width: 100%;
    padding: 12px 8px;
    border: 0;
    border-radius: 0;
    background: var(--op-paper2);
    color: var(--op-soft);
    font: inherit;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .10em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.oppio-login-taby .oppio-tab:hover { color: var(--op-ink); }
.oppio-login-taby .oppio-tab.je-aktivny {
    background: var(--op-green);
    color: #FFFFFF;
}
.oppio-login-taby .oppio-tab:focus-visible {
    outline: 2px solid var(--op-green);
    outline-offset: -2px;
}

/* Prepínanie. Trieda je na <html>, aby sa nastavila skôr, než sa
   formuláre vykreslia – inak by na okamih blikli oba. */
html.oppio-login-js.oppio-login-prihlasenie .woocommerce-account:not(.logged-in) #customer_login > .u-column2,
html.oppio-login-js.oppio-login-registracia .woocommerce-account:not(.logged-in) #customer_login > .u-column1 {
    display: none !important;
}

/* Bez JavaScriptu prepínače nič nerobia – schováme ich a v karte necháme
   oba formuláre pod sebou aj s ich pôvodnými nadpismi. */
html:not(.oppio-login-js) .oppio-login-taby { display: none !important; }
html:not(.oppio-login-js) .woocommerce-account:not(.logged-in) #customer_login > .u-column2 {
    margin-top: 26px !important;
    padding-top: 26px !important;
    border-top: 1px solid var(--op-line) !important;
}
html:not(.oppio-login-js) .woocommerce-account:not(.logged-in) #customer_login > div > h2 {
    display: block !important;
    margin: 0 0 18px !important;
    font-style: italic !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    letter-spacing: -.02em !important;
    text-transform: none !important;
    color: var(--op-ink) !important;
}

/* --- Polia --- */
.woocommerce-account:not(.logged-in) .woocommerce-form .form-row {
    display: block;
    margin: 0 0 18px;
    padding: 0;
}
.woocommerce-account:not(.logged-in) .woocommerce-form label {
    display: block;
    margin: 0 0 7px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .03em;
    color: var(--op-body);
}
.woocommerce-account:not(.logged-in) .woocommerce-form .required {
    color: var(--op-soft);
    text-decoration: none;
    border: 0;
}
.woocommerce-account:not(.logged-in) .woocommerce-form .input-text {
    width: 100%;
    height: 48px;
    padding: 0 14px;
    border: 1px solid var(--op-rule);
    border-radius: 0;
    background: #FFFFFF;
    font-size: 16px;   /* pod 16px zoomuje iOS pri kliknutí do poľa */
    color: var(--op-ink);
    box-shadow: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.woocommerce-account:not(.logged-in) .woocommerce-form .input-text:focus {
    outline: none;
    border-color: var(--op-green);
    box-shadow: inset 0 0 0 1px var(--op-green);
}
.woocommerce-account:not(.logged-in) .woocommerce-form .password-input {
    display: block;
    position: relative;
    width: 100%;
}
/* Tlačidlo „zobraziť heslo“. WooCommerce mu polohu dáva vo vlastnom CSS,
   ale spoliehať sa na to nebudeme – bez position:absolute vypadne pod pole. */
.woocommerce-account:not(.logged-in) .woocommerce-form .show-password-input {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    background-color: transparent;
    box-shadow: none;
    cursor: pointer;
}

/* --- Tlačidlá --- */
.woocommerce-account:not(.logged-in) .woocommerce-form button.button {
    display: block;
    width: 100%;
    min-height: 50px;
    margin: 0;
    padding: 14px 20px;
    border: 1px solid var(--op-green);
    border-radius: 0;
    background: var(--op-green);
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .10em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .15s ease;
}
.woocommerce-account:not(.logged-in) .woocommerce-form button.button:hover {
    background: var(--op-deep);
    border-color: var(--op-deep);
}

/* Riadok s „zapamätať si ma“ a tlačidlom.
   POZOR: tento riadok NESMIE prehadzovať poradie. Predchádzajúca verzia
   ho obracala cez column-reverse a zasiahla aj riadok s heslom – ten
   obsahuje tlačidlo na zobrazenie hesla, takže sa popis „Heslo“ ocitol
   POD poľom. Preto tu vyberáme len riadok s PRIAMYM potomkom, ktorým je
   odosielacie tlačidlo, a poradie necháme tak, ako je v HTML. */
.woocommerce-account:not(.logged-in) .woocommerce-form-login p.form-row:has(> button.woocommerce-form-login__submit) {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 16px;
}
.woocommerce-account:not(.logged-in) .woocommerce-form-login__rememberme {
    display: flex !important;
    align-items: center;
    gap: 9px;
    margin: 0 !important;
    font-size: 13.5px !important;
    font-weight: 400 !important;
    color: var(--op-body);
    cursor: pointer;
}
.woocommerce-account:not(.logged-in) .woocommerce-form-login__rememberme input {
    width: 17px;
    height: 17px;
    margin: 0;
    flex: 0 0 auto;
    accent-color: var(--op-green);
}

/* --- Zabudnuté heslo --- */
.woocommerce-account:not(.logged-in) .woocommerce-LostPassword {
    margin: 0 !important;
    padding-top: 16px;
    border-top: 1px solid var(--op-line);
    text-align: center;
    font-size: 13.5px;
}
.woocommerce-account:not(.logged-in) .woocommerce-LostPassword a {
    color: var(--op-green);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.woocommerce-account:not(.logged-in) .woocommerce-LostPassword a:hover { color: var(--op-deep); }

/* --- Drobné texty v registrácii --- */
.woocommerce-account:not(.logged-in) .woocommerce-form-register p:not(.form-row):not(.oppio-login-poznamka) {
    margin: -6px 0 20px !important;
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--op-soft);
}
.oppio-login-poznamka {
    margin: 20px 0 0 !important;
    padding-top: 16px;
    border-top: 1px solid var(--op-line);
    text-align: center;
    font-size: 13px !important;
    line-height: 1.55;
    color: var(--op-soft) !important;
}

/* --- Hlásenia WooCommerce --- */
.woocommerce-account:not(.logged-in) .woocommerce-error,
.woocommerce-account:not(.logged-in) .woocommerce-message,
.woocommerce-account:not(.logged-in) .woocommerce-info {
    margin: 0 0 26px !important;
    padding: 14px 18px !important;
    border: 0 !important;
    border-left: 3px solid var(--op-green) !important;
    border-radius: 0 !important;
    background: var(--op-paper2) !important;
    color: var(--op-ink) !important;
    font-size: 14.5px;
    list-style: none;
}
.woocommerce-account:not(.logged-in) .woocommerce-error {
    border-left-color: #8A2E2E !important;
    background: #F8E4E4 !important;
}
.woocommerce-account:not(.logged-in) .woocommerce-error::before,
.woocommerce-account:not(.logged-in) .woocommerce-message::before,
.woocommerce-account:not(.logged-in) .woocommerce-info::before {
    content: none !important;
}
.woocommerce-account:not(.logged-in) .woocommerce-error a,
.woocommerce-account:not(.logged-in) .woocommerce-message a,
.woocommerce-account:not(.logged-in) .woocommerce-info a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* --- Tablet a mobil: stĺpce pod seba --- */
@media (max-width: 900px) {
    .woocommerce-account:not(.logged-in) .woocommerce {
        grid-template-columns: 1fr;
        row-gap: 26px;
        align-items: start;
    }
    .oppio-login-nadpis { font-size: 30px !important; }
    .oppio-login-uvod { grid-column: 1; max-width: none; }
    .woocommerce-account:not(.logged-in) #customer_login { grid-column: 1; }
}
@media (max-width: 520px) {
    .woocommerce-account:not(.logged-in) #customer_login { padding: 22px 18px 24px; }
    .oppio-login-taby .oppio-tab { padding: 12px 6px; letter-spacing: .06em; }
}

/* Odsadenie pod lepivou hlavičkou. Na prihlasovacej stránke je obsah krátky
   a základných 170 px ho nechávalo nalepené na menu. Tu ho zväčšujeme len
   pre neprihláseného návštevníka – v samotnom účte, kde je obsahu veľa,
   zostáva pôvodné. */
.woocommerce-account:not(.logged-in) #content {
    padding-top: 260px !important;
}
/* Na tablete a mobile je hlavička podstatne nižšia, takže tá istá hodnota
   tam vyrobí prázdnu obrazovku. Pridávame len o niečo viac, než má účet
   po prihlásení (140 a 110 px). */
@media (max-width: 1024px) {
    .woocommerce-account:not(.logged-in) #content { padding-top: 180px !important; }
}
@media (max-width: 767px) {
    .woocommerce-account:not(.logged-in) #content { padding-top: 125px !important; }
}