/* ================= فونت وزیرمتن (لوکال) ================= */
/* نسخهٔ ۳۳.۰.۳ — مجوز SIL OFL، متن مجوز در fonts/OFL.txt */

@font-face{font-family:'Vazirmatn';src:url('fonts/Vazirmatn-Regular.woff2') format('woff2');
    font-weight:400;font-style:normal;font-display:swap}

@font-face{font-family:'Vazirmatn';src:url('fonts/Vazirmatn-Medium.woff2') format('woff2');
    font-weight:500;font-style:normal;font-display:swap}

@font-face{font-family:'Vazirmatn';src:url('fonts/Vazirmatn-Bold.woff2') format('woff2');
    font-weight:700;font-style:normal;font-display:swap}

@font-face{font-family:'Vazirmatn';src:url('fonts/Vazirmatn-ExtraBold.woff2') format('woff2');
    font-weight:800;font-style:normal;font-display:swap}


/* ================= سند رنگ ================= */

:root{
    --primary:    #0F2537;
    --accent:     #C59A53;
    --bg:         #FAF9F6;
    --card:       #F2F5F8;
    --text:       #1E1E1E;
    --price:      #333333;
    --badge-bg:   #E8F5E9;
    --badge-text: #1B5E20;
    --dots:       #CCCCCC;
}

*{box-sizing:border-box}

body{
    margin:0;
    background:#e7e9ec;
    font-family:Vazirmatn,Tahoma,Arial,sans-serif;
    color:var(--text);
    -webkit-text-size-adjust:100%;
}


/* ================= برگهٔ A4 ================= */

.stage{
    padding:24px 12px;
    display:flex;
    justify-content:center;
    align-items:flex-start;
}

.a4{
    width:210mm;
    height:297mm;
    background:var(--bg);
    position:relative;
    flex:none;
    transform-origin:top center;
    box-shadow:0 6px 30px #00000026;
    overflow:hidden;
}

/* قاب دوخطی — حاشیه از روی --pad-mm حساب می‌شود تا با تنظیمات پنل جابه‌جا شود */
.frame{
    position:absolute;
    inset:calc(var(--pad-mm,11mm) - 5mm);
    border:1.1mm solid var(--primary);
    border-radius:5mm;
    pointer-events:none;
}

.frame.gold{
    inset:calc(var(--pad-mm,11mm) - 2.6mm);
    border:0.35mm solid var(--accent);
    border-radius:3.4mm;
    opacity:.9;
}

.inner{
    position:absolute;
    inset:var(--pad-mm,11mm);
    display:flex;
    flex-direction:column;
}


/* ================= هدر ================= */

.brand{
    text-align:center;
    flex:none;
}

.crest{
    width:var(--crest-mm,21mm);
    height:var(--crest-mm,21mm);
    margin:0 auto 2.2mm;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff;
    overflow:hidden;
}

.crest img{width:100%;height:100%;object-fit:contain;border-radius:50%}

.wreath{
    display:flex;
    flex-direction:column;
    align-items:center;
    color:var(--primary);
    line-height:1.5;
}

.wreath .nm{font-size:9pt;font-weight:700}
.wreath .yr{font-size:6.5pt;color:var(--accent)}

h1{
    margin:0 0 2.8mm;
    font-size:var(--title-pt,29pt);
    font-weight:800;
    color:var(--primary);
    letter-spacing:-.5pt;
    line-height:1.35;
}

/* خط تزیینی طلایی با لوزی و سرپیکان */
.ornament{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:4mm;
    color:var(--primary);
}

.ornament .txt{font-size:var(--subtitle-pt,11.5pt);flex:none}

.branch-line{
    margin-top:2.4mm;
    font-size:9.5pt;
    color:var(--accent);
    font-weight:700;
}

.ornament .rule{
    flex:0 0 34mm;
    height:0.3mm;
    background:var(--accent);
    position:relative;
}

.ornament .rule::before,
.ornament .rule::after{
    content:"";
    position:absolute;
    top:-1mm;
    width:2.2mm;
    height:2.2mm;
    background:var(--accent);
    transform:rotate(45deg);
}

.ornament .rule.r::before{right:0}
.ornament .rule.r::after{left:8mm;opacity:.55}
.ornament .rule.l::before{left:0}
.ornament .rule.l::after{right:8mm;opacity:.55}


/* ================= بدنه ================= */

main{
    flex:1;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap:2mm;
    padding:3mm 0 2mm;
}

.cat{flex:none}

/* نوار خاکستری با آیکون گرد در انتهای راست */
.cat-head{
    background:var(--card);
    border-radius:3mm;
    height:11.8mm;
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:relative;
    padding:0 18mm 0 5mm;
}

.cat-head h2{
    margin:0;
    font-size:17.5pt;
    font-weight:800;
    color:var(--primary);
}

/* برچسب واحد پول: یک بار، بالای ستون قیمت‌ها */
.price-unit{
    display:flex;
    justify-content:flex-end;
    margin:0 0 1mm;
    padding-left:2mm;
}

/* هم‌عرض ستون قیمت‌ها تا دقیقاً بالای آن بنشیند */
.price-unit span{
    width:28mm;
    text-align:center;
    font-size:8pt;
    color:var(--accent);
    border:0.25mm solid rgba(197,154,83,.55);
    border-radius:1.6mm;
    padding:0.5mm 2.4mm;
}

.cat-icon{
    position:absolute;
    right:1.6mm;
    top:50%;
    transform:translateY(-50%);
    width:13.6mm;
    height:13.6mm;
    border-radius:50%;
    border:0.4mm solid var(--accent);
    background:var(--bg);
    color:var(--accent);
    display:flex;
    align-items:center;
    justify-content:center;
}

.cat-icon svg{width:7.4mm;height:7.4mm}


/* ================= آیتم‌ها ================= */

.items{
    list-style:none;
    margin:0;
    padding:0.8mm 2mm 0;
}

.item{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:2.5mm;
    height:var(--row-mm,8.2mm);
    position:relative;

    /* ارتفاع خط نام و جعبهٔ برچسب — هر دو از اندازهٔ فونت نام مشتق می‌شوند
       تا با تغییر --item-pt در پنل، برچسب روی نام نیفتد. */
    --name-h:  calc(var(--item-pt,13.5pt) * 1.3);
    --badge-h: 6.2mm;
}

.item .no{
    flex:none;
    width:5.8mm;
    height:5.8mm;
    border-radius:50%;
    border:0.3mm solid var(--primary);
    color:var(--primary);
    font-size:8pt;
    display:flex;
    align-items:center;
    justify-content:center;
    line-height:1;
}

.item .name{
    flex:none;
    font-size:var(--item-pt,13.5pt);
    color:var(--text);
    white-space:nowrap;
}

.item.has-badge{
    height:calc(1mm + var(--name-h) + var(--badge-h));
    align-items:flex-start;
    padding-top:1mm;
}

.item.has-badge .no{margin-top:calc((var(--name-h) - 5.8mm) / 2)}

.item.has-badge .dots{transform:translateY(calc(var(--name-h) / 2 - 1mm))}

.item .badge{
    position:absolute;
    top:calc(1mm + var(--name-h));
    right:8.3mm;
    background:var(--badge-bg);
    color:var(--badge-text);
    border:0.25mm solid rgba(27,94,32,.35);
    border-radius:1.4mm;
    font-size:8pt;
    padding:0.4mm 2.2mm;
    line-height:1.7;
    white-space:nowrap;
}

.item .dots{
    flex:1;
    border-bottom:0.35mm dotted var(--dots);
    margin:0 1mm;
    transform:translateY(-1mm);
    min-width:6mm;
}

.item .price{
    flex:none;
    width:28mm;
    text-align:right;
    font-size:var(--price-pt,15.5pt);
    font-weight:700;
    color:var(--price);
    letter-spacing:.2pt;
}


/* ================= فوتر ================= */

footer{flex:none}

.tax{
    border:0.4mm solid var(--accent);
    border-radius:3mm;
    height:14mm;
    padding:0 4mm;
    display:flex;
    align-items:center;
    gap:4mm;
    position:relative;
    padding-left:18mm;
}

.tax p{
    margin:0;
    flex:1;
    text-align:center;
    font-size:11.5pt;
    color:var(--primary);
}

.tax b{color:var(--accent);font-size:13pt;font-weight:800}

.tax-icon{
    position:absolute;
    left:1.5mm;
    top:50%;
    transform:translateY(-50%);
    width:13mm;
    height:13mm;
    border-radius:50%;
    background:var(--primary);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
}

.tax-icon svg{width:6.5mm;height:6.5mm}

.thanks{margin-top:3mm}
.thanks .txt{font-size:10.5pt}
.thanks .rule{flex-basis:28mm}


/* ================= دکمهٔ چاپ ================= */

.print-btn{
    position:fixed;
    bottom:16px;
    left:16px;
    background:var(--primary);
    color:#fff;
    border:0;
    border-radius:10px;
    padding:12px 18px;
    font-family:inherit;
    font-size:14px;
    cursor:pointer;
    box-shadow:0 4px 16px #0003;
    z-index:10;
}

.print-btn:hover{background:#16344b}

.empty-menu{
    text-align:center;
    padding:40mm 10mm;
    color:#8a8f96;
    font-size:12pt;
}


/* ================= چاپ ================= */

@page{
    size:A4 portrait;
    margin:0;
}

@media print{

    body{background:#fff}

    .stage{padding:0;display:block;height:auto !important}

    /* ارتفاع کمی کمتر از 297 تا گِردکردنِ مرورگر صفحهٔ دوم نسازد */
    .a4{
        box-shadow:none;
        transform:none !important;
        width:210mm;
        height:296.6mm;
        margin:0;
        page-break-after:avoid;
        page-break-inside:avoid;
        break-inside:avoid;
    }

    .print-btn{display:none}

    /* اطمینان از چاپ رنگ پس‌زمینه‌ها */
    *{
        -webkit-print-color-adjust:exact;
        print-color-adjust:exact;
    }
}