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

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

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

.navgan-app {
    --ui-primary: #7e160d;
    --ui-primary-2: #a52c20;
    --ui-navy: #102a43;
    --ui-accent: #326ea6;
    --ui-bg: #f4f6f9;
    --ui-surface: #ffffff;
    --ui-surface-soft: #f8fafc;
    --ui-border: #e1e7ef;
    --ui-text: #1f2a3d;
    --ui-muted: #68758a;
    --ui-success: #16794d;
    --ui-warning: #a35f00;
    --ui-danger: #b42318;
    --ui-radius: 16px;
    --ui-shadow: 0 10px 30px rgba(16, 42, 67, .07);
    --ui-shadow-sm: 0 3px 12px rgba(16, 42, 67, .06);
    color: var(--ui-text);
    font-family: 'Vazir', Tahoma, sans-serif;
}

.navgan-app *,
.navgan-app *::before,
.navgan-app *::after {
    box-sizing: border-box;
}

.navgan-app #content > .container-fluid {
    max-width: 1680px;
    margin-inline: auto;
    padding-inline: 0;
}

.navgan-app #content a {
    text-underline-offset: 3px;
}

/* ---------- Page headings ---------- */
.navgan-app #content .navgan-page-title,
.navgan-app #content > .container-fluid > h1,
.navgan-app #content > .container-fluid > h2,
.navgan-app #content > .container-fluid > h3,
.navgan-app #content > .container-fluid > h4 {
    position: relative;
    margin: 0 0 22px !important;
    padding: 15px 18px 15px 56px !important;
    min-height: 58px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--ui-border) !important;
    border-radius: var(--ui-radius) !important;
    background: linear-gradient(135deg, #fff, #fbfcfe) !important;
    color: var(--ui-navy) !important;
    box-shadow: var(--ui-shadow-sm);
    font-weight: 700 !important;
    line-height: 1.65;
    text-align: right !important;
}

.navgan-app #content .navgan-page-title::before {
    content: '';
    width: 5px;
    align-self: stretch;
    min-height: 28px;
    border-radius: 10px;
    background: linear-gradient(180deg, var(--ui-primary), var(--ui-primary-2));
    margin-left: 3px;
}

.navgan-app #content .navgan-page-title .btn,
.navgan-app #content .navgan-page-title a.btn {
    margin-right: auto;
}

/* Old inline page headings are normalized safely. */
.navgan-app #content h4[style*="background-color"].navgan-page-title {
    background: linear-gradient(135deg, #fff, #fbfcfe) !important;
    color: var(--ui-navy) !important;
}

/* ---------- Data entry forms ---------- */

.navgan-app #content .navgan-form-column {
    width: 100% !important;
    max-width: 1040px;
    margin-inline: auto !important;
    float: none !important;
}
.navgan-app #content .navgan-data-form {
    width: min(100%, 980px);
    margin: 0 auto 26px;
    padding: clamp(18px, 2.4vw, 30px);
    background: var(--ui-surface);
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius);
    box-shadow: var(--ui-shadow);
}

.navgan-app #content .navgan-data-form > p:last-child,
.navgan-app #content .navgan-data-form > div:last-child {
    margin-bottom: 0;
}

.navgan-app #content .form-group,
.navgan-app #content .mb-3,
.navgan-app #content .navgan-data-form > p {
    margin-bottom: 1rem;
}

.navgan-app #content label:not(.form-check-label) {
    color: #344054;
    font-size: .9rem;
    font-weight: 600;
    margin-bottom: .42rem;
}

.navgan-app #content input.form-control,
.navgan-app #content textarea.form-control,
.navgan-app #content select.form-select,
.navgan-app #content .navgan-data-form input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="reset"]):not([type="button"]),
.navgan-app #content .navgan-data-form textarea,
.navgan-app #content .navgan-data-form select {
    min-height: 44px;
    width: 100%;
    border: 1px solid #d7dee9;
    border-radius: 10px;
    background-color: #fff;
    color: var(--ui-text);
    padding: .62rem .78rem;
    font: inherit;
    transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.navgan-app #content textarea.form-control,
.navgan-app #content .navgan-data-form textarea {
    min-height: 105px;
    resize: vertical;
}

.navgan-app #content input.form-control:focus,
.navgan-app #content textarea.form-control:focus,
.navgan-app #content select.form-select:focus,
.navgan-app #content .navgan-data-form input:focus,
.navgan-app #content .navgan-data-form textarea:focus,
.navgan-app #content .navgan-data-form select:focus {
    border-color: #b67069;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(126, 22, 13, .10);
    background: #fff;
}

.navgan-app #content input[disabled],
.navgan-app #content select[disabled],
.navgan-app #content textarea[disabled],
.navgan-app #content input[readonly] {
    background-color: #f1f4f8;
    color: #667085;
}

.navgan-app #content .form-text,
.navgan-app #content .helptext,
.navgan-app #content small.text-muted {
    color: var(--ui-muted) !important;
    font-size: .78rem;
    line-height: 1.7;
}

.navgan-app #content .invalid-feedback,
.navgan-app #content .errorlist,
.navgan-app #content .text-danger {
    font-size: .82rem;
}

.navgan-app #content .errorlist {
    list-style: none;
    padding: 8px 10px;
    margin: 6px 0;
    color: var(--ui-danger);
    background: #fff3f2;
    border-radius: 8px;
}

.navgan-app #content input[type="file"]::file-selector-button {
    border: 0;
    border-radius: 8px;
    padding: .45rem .75rem;
    margin-left: .65rem;
    background: #eef2f7;
    color: #344054;
    font: inherit;
    cursor: pointer;
}

.navgan-app #content .form-check-input {
    width: 1.1rem;
    height: 1.1rem;
    border-color: #c8d0dc;
}

.navgan-app #content .form-check-input:checked {
    background-color: var(--ui-primary);
    border-color: var(--ui-primary);
}

/* ---------- Select2 / DAL ---------- */
.navgan-app #content .select2-container {
    width: 100% !important;
    max-width: 100%;
}

.navgan-app #content .select2-container .select2-selection--single,
.navgan-app #content .select2-container .select2-selection--multiple {
    min-height: 44px;
    border: 1px solid #d7dee9;
    border-radius: 10px;
    background: #fff;
    display: flex;
    align-items: center;
}

.navgan-app #content .select2-container--default.select2-container--focus .select2-selection--multiple,
.navgan-app #content .select2-container--default.select2-container--open .select2-selection--single {
    border-color: #b67069;
    box-shadow: 0 0 0 3px rgba(126, 22, 13, .10);
}

.navgan-app #content .select2-selection__rendered {
    padding-right: 12px !important;
    padding-left: 34px !important;
    line-height: 42px !important;
    color: var(--ui-text) !important;
}

.navgan-app #content .select2-selection--multiple .select2-selection__rendered {
    line-height: 1.5 !important;
    padding: 5px 8px !important;
}

.navgan-app #content .select2-selection__choice {
    border: 0 !important;
    border-radius: 7px !important;
    background: #f2e9e7 !important;
    color: #6f2018 !important;
    padding: 4px 8px !important;
    margin: 2px !important;
}

.select2-dropdown {
    border-color: #d7dee9 !important;
    border-radius: 12px !important;
    overflow: hidden;
    box-shadow: 0 14px 32px rgba(16, 42, 67, .14);
    direction: rtl;
}

.select2-search--dropdown {
    padding: 8px !important;
}

.select2-search--dropdown .select2-search__field {
    min-height: 40px;
    border: 1px solid #d7dee9 !important;
    border-radius: 9px;
    padding: 6px 9px;
    font-family: 'Vazir', Tahoma, sans-serif;
}

/* ---------- Filter/search forms ---------- */
.navgan-app #content .navgan-filter-form {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 10px;
    width: 100%;
    padding: 13px;
    margin: 0 0 18px;
    border: 1px solid var(--ui-border);
    border-radius: 13px;
    background: rgba(255,255,255,.82);
    box-shadow: var(--ui-shadow-sm);
}

.navgan-app #content .navgan-filter-form > * {
    min-width: 0;
}

.navgan-app #content .navgan-filter-form input:not([type="hidden"]):not([type="submit"]),
.navgan-app #content .navgan-filter-form select {
    min-height: 40px;
    max-width: 100%;
    border: 1px solid #d7dee9;
    border-radius: 9px;
    padding: .5rem .7rem;
    background: #fff;
    font: inherit;
}

/* ---------- Buttons ---------- */
.navgan-app #content .btn,
.navgan-app #topbar .btn {
    border-radius: 9px;
    font-weight: 600;
    line-height: 1.45;
    box-shadow: none;
    transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease, border-color .16s ease;
}

.navgan-app #content .btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 12px rgba(16, 42, 67, .11);
}

.navgan-app #content .btn-primary {
    background: var(--ui-primary);
    border-color: var(--ui-primary);
}

.navgan-app #content .btn-primary:hover,
.navgan-app #content .btn-primary:focus {
    background: #681109;
    border-color: #681109;
}

.navgan-app #content .btn-success {
    background: var(--ui-success);
    border-color: var(--ui-success);
}

.navgan-app #content .btn-info {
    background: #edf5fb;
    border-color: #cfe2f2;
    color: #18567c;
}

.navgan-app #content .btn-warning {
    background: #fff4d6;
    border-color: #f0d28b;
    color: #7a4c00;
}

.navgan-app #content .btn-danger {
    background: var(--ui-danger);
    border-color: var(--ui-danger);
}

.navgan-app #content input[type="submit"].btn,
.navgan-app #content input[type="reset"].btn,
.navgan-app #content button.btn {
    min-height: 40px;
}

/* ---------- Tables ---------- */
.navgan-app #content .navgan-table-scroll,
.navgan-app #content .table-responsive {
    position: relative;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius);
    background: #fff;
    box-shadow: var(--ui-shadow-sm);
    margin-bottom: 20px;
    scrollbar-width: thin;
    scrollbar-color: #bac5d3 transparent;
}

.navgan-app #content .navgan-table-scroll::-webkit-scrollbar {
    height: 8px;
}

.navgan-app #content .navgan-table-scroll::-webkit-scrollbar-thumb {
    background: #bac5d3;
    border-radius: 10px;
}

.navgan-app #content table.navgan-table {
    width: 100%;
    min-width: 760px;
    margin: 0 !important;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    color: var(--ui-text);
    vertical-align: middle;
}

.navgan-app #content table.navgan-table thead,
.navgan-app #content table.navgan-table .thead-dark {
    background: linear-gradient(135deg, #102a43, #173d5e) !important;
    color: #fff !important;
}

.navgan-app #content table.navgan-table thead th,
.navgan-app #content table.navgan-table thead td {
    padding: 13px 12px;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    white-space: nowrap;
    font-size: .94rem;
    font-weight: 700;
    text-align: right;
}

.navgan-app #content table.navgan-table tbody td,
.navgan-app #content table.navgan-table tbody th {
    padding: 12px;
    border: 0;
    border-bottom: 1px solid #edf0f4;
    font-size: .98rem;
    line-height: 1.68;
    background: #fff;
    color: var(--ui-text);
    text-align: right;
}

.navgan-app #content table.navgan-table tbody tr:nth-child(even) td {
    background: #fbfcfe;
}

.navgan-app #content table.navgan-table tbody tr:hover td {
    background: #f5f8fc;
}

.navgan-app #content table.navgan-table tbody tr:last-child td {
    border-bottom: 0;
}

.navgan-app #content table.navgan-table img {
    max-width: 78px;
    height: auto;
}

.navgan-app #content table.navgan-table .btn {
    font-size: .84rem;
    padding: .4rem .64rem;
    margin: 2px;
    white-space: nowrap;
}

.navgan-app #content table.navgan-table a:not(.btn) {
    color: #235f91;
    font-weight: 500;
    text-decoration: none;
}

.navgan-app #content table.navgan-table a:not(.btn):hover {
    text-decoration: underline;
}

/* ---------- Cards / alerts / pagination ---------- */
.navgan-app #content .card:not(.cmr-card) {
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius);
    box-shadow: var(--ui-shadow-sm);
}

.navgan-app #content .alert {
    border: 0;
    border-right: 4px solid currentColor;
    border-radius: 11px;
    box-shadow: var(--ui-shadow-sm);
}

.navgan-app #content .pagination {
    gap: 5px;
    flex-wrap: wrap;
}

.navgan-app #content .pagination .page-link {
    min-width: 38px;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px !important;
    border-color: var(--ui-border);
    color: #40536a;
}

.navgan-app #content .pagination .page-item.active .page-link {
    background: var(--ui-primary);
    border-color: var(--ui-primary);
    color: #fff;
}

.navgan-app #content hr {
    border-color: #e6ebf1;
    opacity: 1;
}

/* ---------- Permission / empty states ---------- */
.navgan-app #content .navgan-access-message {
    padding: 22px !important;
    border: 1px solid #f4c7c3 !important;
    border-radius: var(--ui-radius) !important;
    background: #fff5f4 !important;
    color: #922820 !important;
    box-shadow: var(--ui-shadow-sm);
}

/* ---------- Responsive ---------- */
@media (max-width: 991.98px) {
    .navgan-app #content .navgan-data-form {
        width: 100%;
    }

    .navgan-app #content .col-md-6:has(> .navgan-data-form),
    .navgan-app #content .col-lg-6:has(> .navgan-data-form) {
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 767.98px) {
    .navgan-app #content .navgan-page-title,
    .navgan-app #content > .container-fluid > h1,
    .navgan-app #content > .container-fluid > h2,
    .navgan-app #content > .container-fluid > h3,
    .navgan-app #content > .container-fluid > h4 {
        padding: 12px 14px !important;
        min-height: 50px;
        font-size: 1.04rem;
        flex-wrap: wrap;
    }

    .navgan-app #content .navgan-page-title .btn,
    .navgan-app #content .navgan-page-title a.btn {
        width: 100%;
        margin-right: 0;
        margin-top: 7px;
    }

    .navgan-app #content .navgan-data-form {
        padding: 16px;
        border-radius: 13px;
    }

    .navgan-app #content .navgan-filter-form {
        align-items: stretch;
    }

    .navgan-app #content .navgan-filter-form > * {
        flex: 1 1 100%;
        width: 100%;
    }

    .navgan-app #content .navgan-filter-form .btn {
        width: 100%;
    }

    .navgan-app #content table.navgan-table {
        min-width: 690px;
    }

    .navgan-app #content table.navgan-table thead th,
    .navgan-app #content table.navgan-table tbody td {
        padding: 10px 9px;
        font-size: .8rem;
    }
}

@media (max-width: 480px) {
    .navgan-app #content table.navgan-table {
        min-width: 640px;
    }

    .navgan-app #content .btn:not(.btn-sm) {
        padding-inline: .7rem;
    }
}