/* JUMBO GLOBAL V6.1 - jumbo-officeprint.ro
   Incarcat pe TOATE paginile, dupa custom.css (structura/header.tpl).
   1) aceeasi latime si aceleasi margini pe home, categorii, produse, cont, cos
   2) meniul vertical "Categorii" si sidebar-ul din categorii: aceeasi latime, aceeasi tipografie
   3) meniul de pe mobil: zone de atingere de 48px, text pe mai multe randuri
   Nu modifica culorile pe categorii (raman din blocul <style> din header). */

:root {
    --jg-max: 1720px;
    --jg-gutter: clamp(18px, 3.2vw, 64px);
    --jg-menu: 300px;
    --jg-ink: #14171C;
    --jg-muted: #5F656E;
    --jg-line: #E3DED4;
    --jg-acc: #F5C400;
}
@media (max-width: 1350px) { :root { --jg-gutter: clamp(18px, 3vw, 42px); --jg-menu: 280px; } }
@media (max-width: 1199px) { :root { --jg-menu: 250px; } }
@media (max-width: 720px)  { :root { --jg-gutter: 18px; } }
@media (max-width: 430px)  { :root { --jg-gutter: 14px; } }

/* ---------- 1. latime comuna ---------- */
.wrapper .container {
    width: 100% !important;
    max-width: var(--jg-max) !important;
    padding-left: var(--jg-gutter) !important;
    padding-right: var(--jg-gutter) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
.wrapper .container .container { max-width: none !important; padding-left: 0 !important; padding-right: 0 !important; }

/* ---------- 2. bara de meniu (desktop) ---------- */
@media (min-width: 992px) {
    .header-bottom .main-fix > .row { display: flex; align-items: stretch; margin-left: 0; margin-right: 0; }
    .header-bottom .main-fix > .row::before, .header-bottom .main-fix > .row::after { display: none; }
    .header-bottom .vertical-menu { flex: 0 0 var(--jg-menu); width: var(--jg-menu) !important; max-width: var(--jg-menu); padding: 0 !important; float: none; }
    .header-bottom .magicmenu { flex: 1 1 auto; min-width: 0; float: none; width: auto; }

    .vmagicmenu,
    .vmagicmenu .block-vmagicmenu-content { width: var(--jg-menu) !important; min-width: 0 !important; }

    /* titlul "Categorii" / numele categoriei */
    .vmagicmenu .block-title { cursor: pointer; }
    .vmagicmenu .block-title strong { display: flex; align-items: center; gap: 12px; }
    .vmagicmenu .block-title .vmagicmenu-subtitle { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 14px; letter-spacing: .6px; }
    .vmagicmenu .block-title:focus-visible { outline: 3px solid var(--jg-acc); outline-offset: -3px; }

    /* lista: toate elementele vizibile (tema ascundea de la al 10-lea / al 14-lea) */
    .vmagicmenu .vmagicmenu-narrow > li,
    .vertical-menu .vmagicmenu .vmagicmenu-narrow > li:nth-child(n+10),
    .vertical-menu .vmagicmenu .vmagicmenu-narrow > li:nth-child(n+14) { display: block !important; }
    .vmagicmenu .block-vmagicmenu-content { padding: 6px 0 10px !important; box-shadow: 0 18px 40px rgba(20,23,28,.14); }
    .vmagicmenu .level0 .level-top {
        position: relative;
        margin: 0 18px !important;
        padding: 11px 24px 11px 0 !important;
        border-bottom: 1px solid var(--jg-line) !important;
        font-size: 14px !important;
        line-height: 1.35 !important;
    }
    .vmagicmenu .level0:last-child .level-top { border-bottom: 0 !important; }
    .vmagicmenu .level0 .level-top > span:first-child {
        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
        text-transform: none !important; letter-spacing: 0;
    }
    .vmagicmenu .level0.hasChild .level-top::after { position: absolute; right: 0; top: 50%; margin-top: -9px; line-height: 18px; }
    .vmagicmenu .level0:hover > .level-top > span:first-child { text-decoration: underline; text-decoration-style: dashed; text-underline-offset: 4px; }

    /* panoul lateral (mega): latime proportionala, 3 coloane egale */
    .vmagicmenu .level0 .level-top-mega {
        width: min(920px, calc(100vw - var(--jg-menu) - 2 * var(--jg-gutter))) !important;
        padding: 18px 26px 10px !important;
        box-shadow: 18px 18px 40px rgba(20,23,28,.14);
    }
    .vmagicmenu .level0 .level-top-mega .content-mega-horizontal > ul.cat-mega {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0 28px;
        width: 100% !important;
        float: none !important;
    }
    .vmagicmenu .level0 .level-top-mega .children.level1 { width: auto !important; height: auto !important; float: none !important; padding: 0 !important; margin: 0 0 6px !important; }
    .vmagicmenu .level0 .level-top-mega .children.level1.hidden_children[style*="block"] { display: block !important; }
    .vmagicmenu .level0 .level-top-mega .children.level1 > a {
        padding: 12px 0 7px !important; font-size: 14px; line-height: 1.3 !important; height: auto !important;
    }
    .vmagicmenu .level0 .level-top-mega .children.level1 > a span { font-weight: 700; }
    .vmagicmenu .level0 .level-top-mega ul.level1 a { padding: 4px 0 !important; font-size: 13.5px; line-height: 1.35; }
    .vmagicmenu .subcat_name { height: auto !important; }

    /* pe homepage meniul e inchis si se deschide la hover / tastatura (nu mai acopera imaginea principala) */
    body:has(.jh) .vertical-menu .vmagicmenu .block-vmagicmenu-content { display: none !important; position: absolute; left: 0; top: 100%; z-index: 9999; }
    body:has(.jh) .vertical-menu .vmagicmenu:hover .block-vmagicmenu-content,
    body:has(.jh) .vertical-menu .vmagicmenu:focus-within .block-vmagicmenu-content { display: block !important; }
    body:has(.jh) .vmagicmenu .all-cat { display: none; }
}

/* ---------- 2b. sidebar categorii (aceeasi latime ca meniul) ---------- */
@media (min-width: 992px) {
    .col2-left-layout .page-main-pal > .main > .row { display: flex; align-items: flex-start; }
    .col2-left-layout .page-main-pal > .main > .row::before,
    .col2-left-layout .page-main-pal > .main > .row::after { display: none; }
    .col2-left-layout .col-left.sidebar { flex: 0 0 var(--jg-menu); width: var(--jg-menu) !important; max-width: var(--jg-menu); float: none; padding-left: 0; padding-right: 0; }
    .col2-left-layout .col-main { flex: 1 1 auto; min-width: 0; width: auto !important; float: none; padding-left: clamp(20px, 2vw, 36px); padding-right: 0; }
}
.sidebar .anav-container .nav-accordion { padding: 6px 18px 4px; }
ul.nav-accordion { line-height: 1.35; }
ul.nav-accordion li a { font-size: 14px; line-height: 1.35; }
ul.nav-accordion li a.level-top { padding: 11px 22px 11px 0; border-bottom: 1px solid var(--jg-line); }
ul.nav-accordion li a span { font-size: 14px; text-transform: none; }
ul.nav-accordion ul li a { padding-top: 6px; padding-bottom: 6px; }
ul.nav-accordion li ul li a:before { padding-right: 9px; }
.block-anav .block-title strong span { font-size: 14px; letter-spacing: .6px; }

/* ---------- 3. mobil ---------- */
@media (max-width: 991px) {
    .mean-container .mean-nav ul li a,
    .mean-container .mean-nav ul li span.level-top {
        padding: 13px 52px 13px 18px !important;
        font-size: 15px !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        text-transform: none !important;
        width: auto !important;
        float: none !important;
    }
    .mean-container .mean-nav ul li li a { padding-left: 32px !important; font-size: 14px !important; opacity: 1 !important; }
    .mean-container .mean-nav ul li li li a { padding-left: 46px !important; }
    .mean-container .mean-nav ul li a.mean-expand { width: 48px !important; height: 48px !important; padding: 0 !important; line-height: 48px !important; text-align: center; }
    .header-container .top-mobile-menu-content a { display: block; padding: 12px 16px; font-size: 15px; }
}

/* ---------- 4. V8: pret fara TVA + pret cu TVA, pe toate listele si pe pagina de produs ---------- */
.jh-tva { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; margin: 6px 0 4px; line-height: 1.3; font-family: inherit; }
.jh-tva-l { color: #5F656E; font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; }
.jh-tva-c { display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 6px; padding: 4px 9px; border: 1.5px dashed #D9A900; border-radius: 5px; background: #FFF8D6; color: #14171C; font-size: 12px; }
.jh-tva-c strong { font-size: 15px; font-weight: 800; color: #14171C; white-space: nowrap; }
.jh-tva-mare { margin: 10px 0 12px; }
.jh-tva-mare .jh-tva-l { font-size: 12px; }
.jh-tva-mare .jh-tva-c { padding: 7px 12px; font-size: 14px; }
.jh-tva-mare .jh-tva-c strong { font-size: 20px; }
.products-grid .jh-tva, .products-list .jh-tva { align-items: center; }
@media print { .jh-tva-c { border-style: solid; background: none; } }

/* ---------- 5. V8.2: panou de pret pe pagina de produs ---------- */
.jhp {
    --jhp-ink: #14171C; --jhp-muted: #5F656E; --jhp-line: #E3DED4; --jhp-acc: #F5C400; --jhp-red: #C62828;
    position: relative; max-width: 560px; margin: 8px 0 18px; overflow: hidden;
    border: 1px solid var(--jhp-line); border-radius: 12px; background: #fff;
    box-shadow: 0 8px 24px rgba(20,23,28,.06); font-family: inherit; color: var(--jhp-ink);
}
.jhp [hidden] { display: none !important; }
.jhp-ribbon { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; padding: 10px 18px; background: var(--jhp-red); color: #fff; }
.jhp-badge { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 4px; background: #fff; color: var(--jhp-red); font-size: 13px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; line-height: 1.4; }
.jhp-save { font-size: 14px; line-height: 1.4; }
.jhp-save strong { font-weight: 800; }
.jhp-save .jhp-muted { opacity: .85; }
.jhp-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
.jhp-col { padding: 16px 18px 14px; min-width: 0; }
.jhp-brut { border-left: 2px dashed var(--jhp-line); background: #FFFBEA; }
.jhp-lbl { margin-bottom: 6px; color: var(--jhp-muted); font-size: 12px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.jhp-val { display: flex; align-items: baseline; gap: 6px; white-space: nowrap; }
.jhp-n { font-size: clamp(30px, 2.6vw, 40px); font-weight: 800; line-height: 1; letter-spacing: -.5px; font-variant-numeric: tabular-nums; }
.jhp-brut .jhp-n { font-size: clamp(24px, 2vw, 30px); }
.jhp-cur { font-size: 16px; font-weight: 700; color: var(--jhp-muted); }
.jhp-old { margin-top: 6px; color: var(--jhp-muted); font-size: 13px; }
.jhp-old s { color: #8A9099; }
.jhp-promo .jhp-net .jhp-n, .jhp-promo .jhp-brut .jhp-n { color: var(--jhp-red); }
.jhp-promo .jhp-brut { background: #FFF4F3; }
.jhp-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 16px; padding: 10px 18px; border-top: 1px solid var(--jhp-line); background: #FAF9F6; font-size: 13px; color: var(--jhp-muted); }
.jhp-tick { position: relative; padding-left: 18px; }
.jhp-tick::before { content: ''; position: absolute; left: 0; top: 50%; width: 10px; height: 5px; margin-top: -5px; border-left: 2px solid #1F8A4C; border-bottom: 2px solid #1F8A4C; transform: rotate(-45deg); }
.jhp-vol { margin-left: auto; color: var(--jhp-ink) !important; font-weight: 700; text-decoration: none; border-bottom: 2px dashed var(--jhp-acc); }
.jhp-vol:hover { border-bottom-style: solid; }
@media (max-width: 480px) {
    .jhp-col { padding: 14px 14px 12px; }
    .jhp-n { font-size: 28px; }
    .jhp-brut .jhp-n { font-size: 22px; }
    .jhp-cur { font-size: 14px; }
    .jhp-vol { margin-left: 0; }
}

/* liste: promotiile in rosu, cu pretul vechi cu TVA taiat */
.jh-tva-promo .jh-tva-l { color: #C62828; }
.jh-tva-promo .jh-tva-c { border-color: #C62828; background: #FFF1F0; }
.jh-tva-c s { color: #8A9099; font-size: 12px; font-weight: 500; }