:root {
    --ink:        #14213D;
    --ink-2:      #1F3A63;
    --ink-3:      #0B1526;
    --gold:       #C9973E;
    --gold-dark:  #A97A2E;
    --gold-soft:  #F3E4C4;
    --teal:       #1D7874;
    --teal-dark:  #145956;
    --teal-soft:  #E1F1EF;
    --rose:       #B5533C;
    --rose-soft:  #F6E4DE;

    --primary: var(--teal);
    --primary-dark: var(--teal-dark);
    --primary-light: var(--teal-soft);
    --success: #1D7874;
    --danger: #B5533C;
    --warning: #C9973E;
    --info: #2E6E8E;

    --bg: #F8F4EA;
    --surface: #FFFFFF;
    --text: #212636;
    --muted: #6B7280;

    --card-radius: 14px;
    --sidebar-w: 264px;
    --shadow-sm: 0 1px 3px rgba(20,33,61,.07), 0 1px 2px rgba(20,33,61,.05);
    --shadow-md: 0 6px 20px rgba(20,33,61,.10);
    --shadow-lg: 0 16px 40px rgba(20,33,61,.18);
}

@font-face {
    font-family: 'Vazir';
    src: url('../fonts/Vazir.eot');
    src: url('../fonts/Vazir.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Vazir.woff') format('woff'),
         url('../fonts/Vazir.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazir';
    src: url('../fonts/Vazir-Bold.eot');
    src: url('../fonts/Vazir-Bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Vazir-Bold.woff') format('woff'),
         url('../fonts/Vazir-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

* { font-family: 'Vazir', Tahoma, sans-serif !important; }
html { scroll-behavior: smooth; }
body { background: var(--bg); color: var(--text); }

a { text-decoration: none; }
a:hover { text-decoration: none; }

:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

.pattern-trellis {
    background-image:
        linear-gradient(45deg,  rgba(201,151,62,.14) 1px, transparent 1px),
        linear-gradient(-45deg, rgba(201,151,62,.14) 1px, transparent 1px);
    background-size: 30px 30px;
}

.brand-star {
    position: relative; display: inline-block;
    width: 32px; height: 32px; vertical-align: middle;
}
.brand-star::before, .brand-star::after {
    content: ''; position: absolute; inset: 2px;
    background: var(--gold); border-radius: 6px;
}
.brand-star::before { transform: rotate(0deg); }
.brand-star::after  { transform: rotate(45deg); }
.brand-star.lg { width: 56px; height: 56px; }
.brand-star.lg::before, .brand-star.lg::after { inset: 3px; border-radius: 10px; }

.brand-logo-img {
    width: 32px; height: 32px; object-fit: contain;
    border-radius: 8px; vertical-align: middle;
    background: rgba(255,255,255,.9); padding: 3px;
}
.brand-logo-img.lg { width: 64px; height: 64px; border-radius: 14px; padding: 6px; }

.logo-preview {
    width: 64px; height: 64px; border-radius: 14px;
    background: var(--bg); border: 1px solid #E4DCC6;
    display: flex; align-items: center; justify-content: center;
    overflow: hidden; flex-shrink: 0;
}
.logo-preview img { width: 100%; height: 100%; object-fit: contain; }

/* ===== Topbar ===== */
.topbar {
    background: linear-gradient(100deg, var(--ink-3) 0%, var(--ink) 55%, var(--ink-2) 100%);
    box-shadow: 0 2px 16px rgba(11,21,38,.35);
    border-bottom: 2px solid var(--gold);
    position: sticky; top: 0; z-index: 1030;
    min-height: 64px;
    flex-wrap: nowrap !important;
}
.topbar::before {
    content: ''; position: absolute; inset: 0;
    background-image:
        linear-gradient(45deg,  rgba(201,151,62,.10) 1px, transparent 1px),
        linear-gradient(-45deg, rgba(201,151,62,.10) 1px, transparent 1px);
    background-size: 26px 26px;
    pointer-events: none;
    z-index: 0;
}
.topbar > * { position: relative; z-index: 1; }
.topbar .navbar-brand {
    font-weight: 800; letter-spacing: -.3px; color: #fff !important;
    display: inline-flex; align-items: center; gap: .55rem;
    min-width: 0; flex-shrink: 1;
    overflow: hidden;
}
.topbar .navbar-brand .brand-text {
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.topbar .icon-btn {
    width: 40px; height: 40px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,.08); color: #fff; transition: .2s;
    border: 1px solid rgba(255,255,255,.08);
    flex-shrink: 0;
}
.topbar .icon-btn:hover { background: rgba(201,151,62,.22); border-color: rgba(201,151,62,.4); transform: translateY(-1px); }
.today-badge {
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(201,151,62,.35);
    border-radius: 999px;
    color: var(--gold-soft);
    font-size: .78rem;
    padding: .35rem .9rem;
    white-space: nowrap;
}
.topbar .dropdown-toggle { color: #fff !important; white-space: nowrap; }
.topbar .dropdown-toggle::after { display: none; }
.topbar .dropdown-toggle span { max-width: 96px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; vertical-align: middle; }

/* Bootstrap dropdown menu — themed so it never looks like a blank box */
.dropdown-menu {
    border: 1px solid #EFE6CE;
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    padding: .4rem;
    min-width: 190px;
}
.dropdown-menu .dropdown-item { border-radius: 8px; font-size: .88rem; padding: .5rem .75rem; }
.dropdown-menu .dropdown-item:hover { background: var(--teal-soft); color: var(--teal-dark); }
.dropdown-menu .dropdown-item-text { padding: .35rem .75rem; }

@media (max-width: 575px) {
    .topbar { padding-left: .75rem !important; padding-right: .75rem !important; }
    .topbar .navbar-brand { font-size: .95rem; gap: .4rem; }
    .brand-star { width: 26px; height: 26px; }
    .brand-logo-img { width: 26px; height: 26px; border-radius: 6px; }
    .topbar .icon-btn { width: 36px; height: 36px; border-radius: 10px; font-size: .95rem; }
    .topbar .dropdown-toggle span { max-width: 64px; }
    .topbar .d-flex.align-items-center.gap-2 { gap: .35rem !important; }
}

/* ===== Sidebar ===== */
.sidebar {
    width: var(--sidebar-w);
    background: linear-gradient(185deg, var(--ink) 0%, var(--ink-3) 100%);
    border-left: none;
}
@media (min-width: 992px) {
    .sidebar { position: sticky; top: 64px; height: calc(100vh - 64px); overflow-y: auto; }
}
.sidebar .nav { padding: 1.1rem .8rem; }
.sidebar .nav-link {
    color: #A9B4CC;
    padding: .68rem 1rem;
    border-radius: 10px;
    margin-bottom: 3px;
    display: flex; align-items: center; gap: .65rem;
    font-size: .92rem;
    transition: background .15s, color .15s, border-color .15s;
    border-right: 3px solid transparent;
}
.sidebar .nav-link i { font-size: 1.05rem; width: 20px; text-align: center; color: #7C89A8; transition: color .15s; }
.sidebar .nav-link:hover { background: rgba(255,255,255,.05); color: #fff; }
.sidebar .nav-link:hover i { color: var(--gold); }
.sidebar .nav-link.active {
    background: linear-gradient(90deg, rgba(201,151,62,.16), rgba(201,151,62,.02));
    color: #fff;
    font-weight: 700;
    border-right-color: var(--gold);
}
.sidebar .nav-link.active i { color: var(--gold); }
.sidebar-section-label {
    font-size: .7rem; color: #5C6B8C; font-weight: 700;
    padding: .8rem 1rem .3rem; letter-spacing: .3px;
}

.main-content { min-height: calc(100vh - 64px); padding: 1.25rem !important; }
@media (min-width: 768px) { .main-content { padding: 1.75rem 2rem !important; } }

/* ===== Cards ===== */
.card {
    border: none;
    border-radius: var(--card-radius);
    box-shadow: var(--shadow-sm);
    transition: box-shadow .2s, transform .2s;
}
.card:hover { box-shadow: var(--shadow-md); }
.page-title {
    font-weight: 800; font-size: 1.35rem; letter-spacing: -.3px;
    display: flex; align-items: center; gap: .5rem;
    color: var(--ink);
}
.page-title i { color: var(--gold-dark); }

/* ===== Stat cards ===== */
.stat-card {
    border: none; border-radius: 16px; color: #fff; position: relative; overflow: hidden;
    box-shadow: var(--shadow-md);
    min-height: 104px;
    display: flex;
}
.stat-card > .d-flex { width: 100%; }
.stat-card::after {
    content: ''; position: absolute; inset: 0;
    background-image:
        linear-gradient(45deg,  rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(-45deg, rgba(255,255,255,.06) 1px, transparent 1px);
    background-size: 22px 22px;
    pointer-events: none;
}
.stat-card .small.opacity-75 { position: relative; z-index: 1; }
.stat-card .fs-3, .stat-card .fs-4, .stat-card .fs-5 { position: relative; z-index: 1; font-variant-numeric: tabular-nums; font-weight: 800; }
.stat-value {
    position: relative; z-index: 1;
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    font-size: 1.55rem;
    line-height: 1.2;
}
.stat-value.stat-value-money { font-size: 1.05rem; }
@media (max-width: 767px) {
    .stat-value { font-size: 1.25rem; }
    .stat-value.stat-value-money { font-size: .92rem; }
}

.icon-circle {
    width: 50px; height: 50px;
    position: relative;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.3rem;
    background: none !important;
}
.icon-circle::before, .icon-circle::after {
    content: ''; position: absolute; inset: 4px;
    background: rgba(255,255,255,.20);
    border: 1px solid rgba(255,255,255,.30);
    border-radius: 9px;
}
.icon-circle::before { transform: rotate(0deg); }
.icon-circle::after  { transform: rotate(45deg); }
.icon-circle i { position: relative; z-index: 2; }

.bg-purple { background: linear-gradient(135deg, var(--ink-2), var(--ink-3)); }
.bg-teal   { background: linear-gradient(135deg, #23928D, var(--teal-dark)); }
.bg-orange { background: linear-gradient(135deg, var(--gold), var(--gold-dark)); }
.bg-pink   { background: linear-gradient(135deg, #C6674C, #7A3624); }
.bg-sky    { background: linear-gradient(135deg, #3D85A8, #1B4A61); }

/* ===== Buttons ===== */
.btn { border-radius: 9px; font-weight: 600; font-size: .88rem; }
.btn-primary { background: var(--primary); border-color: var(--primary); }
.btn-primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); }
.btn-outline-primary { color: var(--primary); border-color: var(--primary); }
.btn-outline-primary:hover { background: var(--primary); border-color: var(--primary); }
.text-primary { color: var(--primary) !important; }
.btn-sm { border-radius: 7px; }
.btn-warning { background: var(--gold); border-color: var(--gold); color: #fff; }
.btn-warning:hover { background: var(--gold-dark); border-color: var(--gold-dark); color: #fff; }

/* ===== Tables ===== */
.table-responsive { border-radius: 12px; }
.table thead th {
    background: var(--gold-soft); font-weight: 700; font-size: .78rem; color: var(--gold-dark);
    white-space: nowrap; text-transform: none; border-bottom: 1px solid #eee1c4;
    padding: .85rem .75rem;
}
.table td { padding: .75rem; vertical-align: middle; font-size: .9rem; }
.table-hover tbody tr:hover { background: #FBF8F0; }

.badge-rating, .badge-group {
    border-radius: 20px; padding: .35em .85em; font-size: .74rem; color: #fff; font-weight: 600;
}
.badge { font-weight: 600; border-radius: 8px; padding: .4em .7em; }

/* ===== Forms ===== */
.form-control, .form-select {
    border-radius: 9px; border-color: #E4DCC6; font-size: .9rem;
    padding: .55rem .85rem;
}
.form-control:focus, .form-select:focus {
    border-color: var(--primary); box-shadow: 0 0 0 .2rem rgba(29,120,116,.13);
}
.form-label { font-size: .85rem; font-weight: 600; color: #3A3F52; margin-bottom: .4rem; }

/* ===== Nav pills / tabs ===== */
.nav-pills .nav-link { border-radius: 9px; font-weight: 600; font-size: .85rem; color: var(--muted); }
.nav-pills .nav-link.active { background: var(--primary); }
.nav-tabs .nav-link { border: none; border-radius: 9px 9px 0 0; font-weight: 600; color: var(--muted); }
.nav-tabs .nav-link.active { color: var(--ink); border-bottom: 3px solid var(--gold); background: transparent; }

/* ===== Login ===== */
.login-wrapper {
    min-height: 100vh; display: flex; align-items: center; justify-content: center;
    background: radial-gradient(circle at 15% 15%, var(--ink-2), var(--ink-3) 65%);
    padding: 1rem;
    position: relative; overflow: hidden;
}
.login-wrapper::before {
    content: ''; position: absolute; inset: 0;
    background-image:
        linear-gradient(45deg,  rgba(201,151,62,.09) 1px, transparent 1px),
        linear-gradient(-45deg, rgba(201,151,62,.09) 1px, transparent 1px);
    background-size: 34px 34px;
    pointer-events: none;
}
.login-card { border-radius: 20px; max-width: 400px; width: 100%; box-shadow: var(--shadow-lg); border-top: 4px solid var(--gold) !important; }

/* ===== Public form ===== */
.public-form-wrapper {
    min-height: 100vh;
    background: linear-gradient(165deg, var(--ink-3), var(--ink) 55%, var(--ink-2));
    padding: 30px 12px;
    position: relative; overflow: hidden;
}
.public-form-wrapper::before {
    content: ''; position: absolute; inset: 0;
    background-image:
        linear-gradient(45deg,  rgba(201,151,62,.08) 1px, transparent 1px),
        linear-gradient(-45deg, rgba(201,151,62,.08) 1px, transparent 1px);
    background-size: 30px 30px;
    pointer-events: none;
}
.public-form-card { max-width: 640px; margin: 0 auto; border-radius: 20px; box-shadow: var(--shadow-lg); border-top: 4px solid var(--gold); position: relative; z-index: 1; }

/* ===== Invoice print ===== */
.invoice-box { max-width: 900px; margin: 0 auto; }
@media print {
    .no-print { display: none !important; }
    .invoice-box { box-shadow: none !important; }
    body { background: #fff !important; }
}

/* ===== Jalali datepicker ===== */
.jalali-dp-wrapper { position: relative; }
.jalali-dp-popup {
    position: absolute; z-index: 2000; top: calc(100% + 6px); right: 0;
    background: #fff; border-radius: 14px; box-shadow: var(--shadow-lg);
    width: 280px; padding: .75rem; display: none; border: 1px solid #eee1c4;
}
.jalali-dp-popup.show { display: block; animation: dpFade .12s ease-out; }
@keyframes dpFade { from { opacity:0; transform: translateY(-4px);} to {opacity:1; transform:none;} }
.jalali-dp-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; }
.jalali-dp-header button { border: none; background: var(--gold-soft); width: 30px; height: 30px; border-radius: 8px; cursor: pointer; color: var(--gold-dark); }
.jalali-dp-header button:hover { background: var(--teal-soft); color: var(--teal-dark); }
.jalali-dp-title { font-weight: 700; font-size: .88rem; color: var(--ink); }
.jalali-dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.jalali-dp-grid .dow { text-align: center; font-size: .68rem; color: #94a3b8; padding: 4px 0; font-weight: 700; }
.jalali-dp-grid .day {
    text-align: center; padding: 6px 0; border-radius: 8px; cursor: pointer; font-size: .8rem;
}
.jalali-dp-grid .day:hover { background: var(--teal-soft); }
.jalali-dp-grid .day.today { border: 1px solid var(--gold); }
.jalali-dp-grid .day.selected { background: var(--primary); color: #fff; font-weight: 700; }
.jalali-dp-grid .day.empty { cursor: default; }
.jalali-dp-time { display: flex; gap: .4rem; margin-top: .6rem; border-top: 1px solid #f1f5f9; padding-top: .6rem; }
.jalali-dp-time select { flex: 1; border-radius: 8px; border: 1px solid #e2e8f0; padding: .3rem; font-size: .82rem; }
.jalali-dp-today-btn { width: 100%; margin-top: .5rem; padding: .4rem; font-size: .78rem; border-radius: 8px; border: none; background: var(--gold-soft); color: var(--gold-dark); font-weight: 700; cursor: pointer; }

/* ===== Misc ===== */
.empty-state { text-align: center; padding: 3rem 1rem; color: #94a3b8; }
.empty-state i { font-size: 2.5rem; margin-bottom: .75rem; display: block; color: var(--gold); }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #D8CBA8; border-radius: 10px; }

/* ===== Responsive tweaks ===== */
@media (max-width: 767px) {
    .page-title { font-size: 1.1rem; }
    .stat-card .fs-3 { font-size: 1.4rem !important; }
    .table td, .table th { font-size: .82rem; padding: .55rem; }
    .card { border-radius: 12px; }
    .jalali-dp-popup { width: 92vw; right: 50%; transform: translateX(50%); }
}

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