/* assets/css/style.css */

@font-face {
    font-family: 'Yekan';
    src: url('../fonts/Yekan.woff2') format('woff2'),
         url('../fonts/Yekan.woff') format('woff'),
         url('../fonts/Yekan.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Yekan';
    src: url('../fonts/Yekan-Bold.woff2') format('woff2'),
         url('../fonts/Yekan-Bold.woff') format('woff'),
         url('../fonts/Yekan-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

:root{
    --navy:#1f4e78;
    --blue:#2e75b6;
    --light-blue:#ddebf7;
    --yellow:#fff2cc;
    --gray:#f2f2f2;
    --border:#d9d9d9;
    --text:#222;
    --danger:#c0392b;
}

*{ box-sizing:border-box; }

body{
    margin:0;
    font-family:'Yekan','Tahoma',sans-serif;
    background:#f5f6f8;
    color:var(--text);
    direction:rtl;
    text-align:right;
    font-size:15px;
    line-height:1.7;
}

a{ color:var(--blue); text-decoration:none; }
a:hover{ text-decoration:underline; }

.container{
    max-width:960px;
    margin:0 auto;
    padding:12px;
}

/* ---- top nav ---- */
.topbar{
    background:var(--navy);
    color:#fff;
    padding:10px 14px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:8px;
}
.topbar .brand{ font-weight:bold; font-size:18px; color:#fff; }
.topbar nav{ display:flex; gap:6px; flex-wrap:wrap; }
.topbar nav a{
    color:#fff;
    background:rgba(255,255,255,0.12);
    padding:7px 12px;
    border-radius:6px;
    font-size:14px;
}
.topbar nav a.active{ background:var(--blue); }
.topbar nav a:hover{ text-decoration:none; background:var(--blue); }

/* ---- cards / boxes ---- */
.card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:10px;
    padding:16px;
    margin-bottom:16px;
}
.card h2{
    margin-top:0;
    font-size:18px;
    color:var(--navy);
    border-bottom:2px solid var(--light-blue);
    padding-bottom:8px;
}

/* ---- forms ---- */
label{ display:block; font-weight:bold; margin:10px 0 4px; font-size:14px; }
input[type=text], input[type=number], input[type=password],
input[type=date], input[type=file], select, textarea{
    width:100%;
    padding:10px;
    border:1px solid var(--border);
    border-radius:6px;
    font-family:inherit;
    font-size:15px;
    background:#fffdf5;
}
input:focus, select:focus, textarea:focus{
    outline:2px solid var(--blue);
    background:#fff;
}
textarea{ resize:vertical; min-height:70px; }
.form-row{ display:flex; gap:12px; flex-wrap:wrap; }
.form-row > div{ flex:1; min-width:200px; }
.help{ color:#777; font-size:12.5px; margin-top:2px; }

.checkbox-row{ display:flex; align-items:center; gap:8px; margin:10px 0; }
.checkbox-row input{ width:auto; }
.checkbox-row label{ margin:0; font-weight:normal; }

/* ---- buttons ---- */
.btn{
    display:inline-block;
    padding:10px 18px;
    border-radius:7px;
    border:none;
    background:var(--blue);
    color:#fff;
    font-family:inherit;
    font-size:15px;
    cursor:pointer;
    text-align:center;
}
.btn:hover{ background:var(--navy); text-decoration:none; color:#fff; }
.btn.secondary{ background:#7f8c8d; }
.btn.secondary:hover{ background:#5f6a6a; }
.btn.danger{ background:var(--danger); }
.btn.danger:hover{ background:#922b21; }
.btn.success{ background:#27ae60; }
.btn.success:hover{ background:#1e8449; }
.btn.small{ padding:6px 12px; font-size:13px; }
.btn-row{ display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }

/* ---- tables ---- */
table{ width:100%; border-collapse:collapse; margin-top:10px; }
th, td{ border:1px solid var(--border); padding:8px; font-size:14px; text-align:right; }
th{ background:var(--light-blue); color:var(--navy); }
tr:nth-child(even) td{ background:#fafbfc; }
.table-wrap{ overflow-x:auto; }

.empty-note{ color:#888; text-align:center; padding:20px; }

/* ---- flash message ---- */
.flash{
    background:#d4edda; border:1px solid #b6dfc0; color:#215732;
    padding:10px 14px; border-radius:8px; margin-bottom:14px;
}
.flash.error{ background:#f8d7da; border-color:#f1b0b7; color:#7d1d28; }

/* ---- invoice item rows (builder) ---- */
.item-row{
    display:flex; gap:8px; flex-wrap:wrap; align-items:flex-end;
    border:1px solid var(--border); border-radius:8px; padding:10px; margin-bottom:8px;
    background:#fafbfc;
}
.item-row .field{ flex:1; min-width:120px; }
.item-row .qty-field{ max-width:100px; }
.item-row .line-total{ min-width:120px; font-weight:bold; text-align:center; }
.item-row .remove-btn{ align-self:center; }

.totals-box{
    max-width:420px; margin-inline-start:auto; margin-top:10px;
}
.totals-box .row{ display:table; width:100%; padding:6px 0; }
.totals-box .row > span, .totals-box .row > strong{ display:table-cell; }
.totals-box .row > strong{ text-align:left; }
.totals-box .row.final{ font-weight:bold; font-size:18px; color:var(--navy); border-top:2px solid var(--light-blue); padding-top:10px; }
.totals-box input[type=number]{ width:90px; display:inline-block; }

/* ---- invoice print page ---- */
.invoice-sheet{
    background:#fff; border:2px solid var(--navy); border-radius:6px;
    padding:22px; max-width:800px; margin:0 auto;
}
.invoice-head{ display:table; width:100%; table-layout:auto; }
.invoice-head .logo-box{ display:table-cell; width:170px; vertical-align:top; }
.invoice-head .logo-box img{ max-height:90px; max-width:160px; }
.invoice-head .company-info{ display:table-cell; vertical-align:top; text-align:right; }
.invoice-head .company-info h1{ margin:0 0 4px; font-size:22px; color:var(--navy); }
.invoice-head .company-info p{ margin:2px 0; font-size:13px; color:#555; }
.invoice-title-bar{
    background:var(--navy); color:#fff; text-align:center; padding:10px;
    font-size:20px; font-weight:bold; border-radius:6px; margin:16px 0;
}
.meta-grid{ margin-bottom:14px; font-size:14px; }
.meta-grid div{ background:var(--gray); padding:8px 12px; border-radius:6px; margin-bottom:6px; }
.sig-row{ display:table; width:100%; table-layout:fixed; border-spacing:20px 0; margin-top:40px; }
.sig-box{ display:table-cell; width:50%; border-top:1px solid #999; text-align:center; padding-top:6px; font-size:13px; color:#555; }
.print-actions{ text-align:center; margin:16px 0; }

@media print{
    body{ background:#fff; }
    .no-print{ display:none !important; }
    .invoice-sheet{ border:1px solid #000; box-shadow:none; margin:0; max-width:100%; }
    .container{ max-width:100%; padding:0; }
    * { -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important; color-adjust:exact !important; }
}

@media (max-width:600px){
    .invoice-head, .invoice-head .logo-box, .invoice-head .company-info{ display:block; width:auto; text-align:center; }
    .item-row{ flex-direction:column; align-items:stretch; }
    .topbar{ flex-direction:column; align-items:flex-start; }
}