/*
 * ERP UI standard layer.
 * Base scale uses the golden ratio (1.618) around a 16px / 1rem anchor.
 */
:root {
    --erp-ratio: 1.618;
    --erp-sticky-table-offset: 70px;

    --erp-space-2xs: .236rem;
    --erp-space-xs: .382rem;
    --erp-space-sm: .618rem;
    --erp-space-md: 1rem;
    --erp-space-lg: 1.618rem;
    --erp-space-xl: 2.618rem;

    --erp-font-xs: .764rem;
    --erp-font-sm: .875rem;
    --erp-font-md: 1rem;
    --erp-font-lg: 1.125rem;
    --erp-font-xl: 1.375rem;

    --erp-line-tight: 1.236;
    --erp-line-base: 1.5;
    --erp-line-relaxed: 1.618;

    --erp-radius-sm: .382rem;
    --erp-radius-md: .5rem;
    --erp-radius-pill: 999px;

    --erp-surface: #ffffff;
    --erp-surface-soft: #f8fafc;
    --erp-border-color: #e5e7eb;
    --erp-border-soft: #eef2f7;
    --erp-text: #334155;
    --erp-heading: #172033;
    --erp-muted: #64748b;
    --erp-shadow-card: 0 14px 32px -30px rgba(15, 23, 42, .42);
}

body {
    color: var(--erp-text);
    font-size: var(--erp-font-sm);
    line-height: var(--erp-line-base);
}

body,
.page-content,
.card,
.table,
.form-control,
.form-select,
.btn,
.dropdown-menu {
    letter-spacing: 0;
}

.page-content {
    padding-bottom: calc(60px + var(--erp-space-xl));
}

.page-title-box {
    padding-bottom: var(--erp-space-md);
    margin-bottom: var(--erp-space-sm);
}

.page-title-box h1,
.page-title-box h2,
.page-title-box h3,
.page-title-box h4,
.page-title-box h5,
.page-title-box h6 {
    color: var(--erp-heading);
    font-size: var(--erp-font-xl);
    line-height: var(--erp-line-tight);
    letter-spacing: 0;
}

.page-title-box .text-muted.small,
.page-title-box .small.text-muted,
.page-title-sub {
    font-size: var(--erp-font-xs);
    line-height: var(--erp-line-base);
}

.row.g-3,
.row.gy-3 {
    --bs-gutter-y: var(--erp-space-md);
}

.row.g-3,
.row.gx-3 {
    --bs-gutter-x: var(--erp-space-md);
}

.card,
.sec-card,
.report-kpi-card,
.report-filter-card,
.report-table-card,
.kpi-card {
    border-color: var(--erp-border-color);
    border-radius: var(--erp-radius-md);
    box-shadow: var(--erp-shadow-card);
}

.card-header {
    padding: var(--erp-space-sm) var(--erp-space-md);
    border-color: var(--erp-border-soft);
    background: var(--erp-surface);
    font-size: var(--erp-font-sm);
    font-weight: 700;
    line-height: var(--erp-line-tight);
}

.card-body {
    padding: var(--erp-space-md);
}

.card-title,
.card-title-desc {
    letter-spacing: 0;
}

.card-title {
    margin-bottom: var(--erp-space-sm);
    color: var(--erp-heading);
    font-size: var(--erp-font-md);
    line-height: var(--erp-line-tight);
}

.card-title-desc {
    color: var(--erp-muted);
    font-size: var(--erp-font-xs);
    line-height: var(--erp-line-base);
}

.form-label {
    margin-bottom: var(--erp-space-xs);
    color: var(--erp-muted);
    font-size: var(--erp-font-xs);
    font-weight: 700;
    line-height: var(--erp-line-tight);
    letter-spacing: 0;
}

.form-control,
.form-select {
    min-height: 2.375rem;
    border-color: #d8dee9;
    border-radius: var(--erp-radius-sm);
    font-size: var(--erp-font-sm);
    line-height: var(--erp-line-base);
}

.form-control-sm,
.form-select-sm {
    min-height: 2rem;
    padding-top: var(--erp-space-xs);
    padding-bottom: var(--erp-space-xs);
    font-size: var(--erp-font-xs);
}

.btn {
    border-radius: var(--erp-radius-sm);
    font-size: var(--erp-font-sm);
    font-weight: 600;
    line-height: var(--erp-line-tight);
}

.input-group .btn {
    min-height: 2.375rem;
}

.input-group .btn-sm {
    min-height: 2rem;
}

.btn-sm {
    padding: var(--erp-space-xs) var(--erp-space-sm);
    font-size: var(--erp-font-xs);
}

.badge {
    border-radius: var(--erp-radius-pill);
    padding: var(--erp-space-2xs) var(--erp-space-sm);
    font-size: var(--erp-font-xs);
    font-weight: 700;
    line-height: var(--erp-line-tight);
    letter-spacing: 0;
}

.table {
    margin-bottom: 0;
    color: var(--erp-text);
    font-size: var(--erp-font-sm);
    line-height: var(--erp-line-base);
}

.table > :not(caption) > * > * {
    padding: var(--erp-space-sm) var(--erp-space-md);
}

.table-sm > :not(caption) > * > * {
    padding: var(--erp-space-xs) var(--erp-space-sm);
}

.table thead th {
    font-size: var(--erp-font-xs);
    line-height: var(--erp-line-tight);
    letter-spacing: 0;
}

.kpi-card .card-body,
.report-kpi-card > .card-body {
    gap: var(--erp-space-sm);
    padding: var(--erp-space-md);
}

.kpi-label,
.exec-kpi-label {
    color: var(--erp-muted);
    font-size: var(--erp-font-xs);
    font-weight: 700;
    line-height: var(--erp-line-tight);
    letter-spacing: 0;
}

.kpi-value,
.exec-kpi-value {
    color: var(--erp-heading);
    font-size: var(--erp-font-xl);
    font-weight: 700;
    line-height: var(--erp-line-tight);
    letter-spacing: 0;
}

.kpi-value-sm {
    font-size: var(--erp-font-lg);
}

.kpi-sub {
    color: var(--erp-muted);
    font-size: var(--erp-font-xs);
    line-height: var(--erp-line-base);
}

.kpi-icon,
.kpi-icon-sm {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: var(--erp-radius-md);
}

.kpi-icon {
    width: var(--erp-space-xl);
    height: var(--erp-space-xl);
}

.kpi-icon-sm {
    width: 2rem;
    height: 2rem;
}

.erp-text-xs {
    font-size: var(--erp-font-xs);
    line-height: var(--erp-line-base);
}

.erp-w-80 {
    width: 5rem;
}

.erp-w-50 {
    width: 3.125rem;
}

.erp-w-70 {
    width: 4.375rem;
}

.erp-w-90 {
    width: 5.625rem;
}

.erp-w-100 {
    width: 6.25rem;
}

.erp-w-110 {
    width: 6.875rem;
}

.erp-w-120 {
    width: 7.5rem;
}

.erp-w-140 {
    width: 8.75rem;
}

.erp-w-150 {
    width: 9.375rem;
}

.erp-w-200 {
    width: 12.5rem;
}

.erp-min-w-120 {
    min-width: 7.5rem;
}

.erp-min-w-140 {
    min-width: 8.75rem;
}

.erp-min-w-230 {
    min-width: 14.375rem;
}

.erp-min-w-240 {
    min-width: 15rem;
}

.erp-min-w-280 {
    min-width: 17.5rem;
}

.print-header {
    display: none;
}

.erp-code-pill {
    display: inline-flex;
    align-items: center;
    min-height: 1.375rem;
    padding: var(--erp-space-2xs) var(--erp-space-sm);
    border-radius: var(--erp-radius-sm);
    background: #1e293b;
    color: #e2e8f0;
    font-family: var(--bs-font-monospace);
    font-size: var(--erp-font-xs);
    font-weight: 700;
    line-height: var(--erp-line-tight);
}

.erp-step-badge {
    background: #ede9fe;
    color: #5b21b6;
}

.erp-step-dot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.375rem;
    height: 1.375rem;
    border-radius: var(--erp-radius-pill);
    background: #5156be;
    color: #fff;
    font-size: .65rem;
    font-weight: 700;
    line-height: 1;
}

.erp-row-muted {
    opacity: .55;
}

.page-title-box .d-flex.gap-2,
.page-title-box .d-flex.gap-2.flex-wrap,
.erp-page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
}

.page-title-box .btn,
.erp-dt-toolbar .btn,
.table .btn,
.card .btn {
    border-radius: var(--erp-radius-sm);
    font-weight: 600;
}

.table td .btn,
.table td .btn-group,
.table td form.d-inline,
.table td form.d-inline-block,
.table td a.btn {
    margin-bottom: .25rem;
}

.table-responsive .table {
    border-color: var(--erp-border-color);
}

.erp-table-standard {
    border-collapse: separate;
    border-spacing: 0;
}

.table-responsive .table thead th {
    background: var(--erp-surface-soft);
    border-bottom-width: 1px;
    font-size: var(--erp-font-xs);
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
    color: var(--erp-muted);
}

.erp-table-sticky-wrap {
    position: relative;
    overflow-y: visible;
}

.erp-table-standard.erp-table-sticky thead {
    position: relative;
    z-index: 30;
}

.erp-table-standard.erp-table-sticky thead th {
    position: sticky;
    top: calc(var(--erp-sticky-table-offset, 70px) + var(--erp-sticky-row-offset, 0px));
    z-index: var(--erp-sticky-row-z, 34);
    background: var(--erp-surface-soft);
    background-clip: padding-box;
    box-shadow: inset 0 -1px 0 #dbe4ee;
}

.erp-table-standard.erp-table-sticky tbody,
.erp-table-standard.erp-table-sticky tbody tr,
.erp-table-standard.erp-table-sticky tbody td {
    position: relative;
    z-index: 1;
}

.erp-table-standard.erp-table-sticky thead th::after {
    content: "";
    position: absolute;
    inset: 0;
    background: inherit;
    z-index: -1;
}

.table-responsive .table tbody td {
    border-color: var(--erp-border-soft);
}

.card.erp-card-standard {
    border-color: var(--erp-border-color);
    box-shadow: var(--erp-shadow-card);
}

.erp-section-title {
    margin-bottom: var(--erp-space-sm);
    font-size: var(--erp-font-xs);
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
    color: var(--erp-muted);
}

.erp-filter-form {
    padding: var(--erp-space-sm) var(--erp-space-md);
    border: 1px solid var(--erp-border-color);
    border-radius: var(--erp-radius-md);
    background: linear-gradient(180deg, #fbfdff 0%, #f8fafc 100%);
}

.erp-filter-form .form-label {
    font-size: var(--erp-font-xs);
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
    color: var(--erp-muted);
}

.erp-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--erp-space-sm);
    align-items: center;
    padding-top: var(--erp-space-md);
    margin-top: var(--erp-space-md);
    border-top: 1px solid var(--erp-border-soft);
}

.erp-form-actions .btn,
.erp-form-actions input[type="submit"],
.erp-form-actions input[type="button"] {
    min-width: 112px;
}

.erp-submit-row,
.form-footer {
    padding-top: var(--erp-space-md);
    margin-top: var(--erp-space-md);
    border-top: 1px solid var(--erp-border-soft);
}

.form-footer {
    padding: var(--erp-space-md) var(--erp-space-lg) var(--erp-space-lg);
    margin-top: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--erp-space-sm);
    align-items: center;
    justify-content: space-between;
}

.erp-submit-row.d-flex,
.form-footer .d-flex {
    flex-wrap: wrap;
    align-items: center;
}

.erp-submit-row.d-flex > p,
.erp-submit-row.d-flex > .text-muted.small,
.erp-submit-row.d-flex > .small.text-muted {
    flex: 0 0 100%;
}

.erp-submit-row > .btn + .btn,
.erp-submit-row > .btn + a.btn,
.erp-submit-row > a.btn + .btn,
.erp-submit-row > a.btn + a.btn {
    margin-left: var(--erp-space-xs);
}

.erp-submit-row > p,
.erp-submit-row > .text-muted.small,
.erp-submit-row > .small.text-muted {
    margin-bottom: 0;
}

.erp-table-standard th.erp-table-action-col,
.erp-table-standard td.erp-table-action-col {
    white-space: nowrap;
}

.erp-table-standard th.erp-table-action-col {
    text-align: right;
}

.erp-table-standard td.erp-table-actions {
    text-align: right;
}

.erp-table-standard td.erp-table-actions .btn,
.erp-table-standard td.erp-table-actions .btn-group,
.erp-table-standard td.erp-table-actions form.d-inline,
.erp-table-standard td.erp-table-actions form.d-inline-block {
    margin-left: var(--erp-space-2xs);
}

.erp-table-standard td.erp-table-actions .btn:first-child,
.erp-table-standard td.erp-table-actions form.d-inline:first-child,
.erp-table-standard td.erp-table-actions form.d-inline-block:first-child {
    margin-left: 0;
}

.erp-table-hint {
    display: flex;
    align-items: center;
    gap: var(--erp-space-xs);
    margin: 0 0 var(--erp-space-sm);
    padding: var(--erp-space-xs) var(--erp-space-sm);
    border: 1px dashed #cbd5e1;
    border-radius: var(--erp-radius-md);
    background: var(--erp-surface-soft);
    color: #475569;
    font-size: var(--erp-font-xs);
}

.erp-table-hint i {
    font-size: 1rem;
    color: #2563eb;
}

.erp-table-standard .text-end .btn,
.erp-table-standard td.text-end .btn {
    min-width: 72px;
}

.erp-table-action-stack {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--erp-space-2xs);
}

.erp-table-action-stack form {
    display: inline-flex;
    margin: 0;
}

.erp-table-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 72px;
    height: 2rem;
    padding: var(--erp-space-xs) var(--erp-space-sm);
    text-align: center;
    white-space: nowrap;
    line-height: 1;
}

.erp-table-standard .btn-outline-secondary,
.erp-table-standard .btn-outline-primary,
.erp-table-standard .btn-outline-danger,
.erp-table-standard .btn-success,
.erp-table-standard .btn-primary {
    box-shadow: none;
}

body[data-layout-mode="dark"] .erp-table-standard.erp-table-sticky thead th {
    background: #2f353b;
    color: #cbd5e1;
    box-shadow: inset 0 -1px 0 #475569;
}

body[data-layout-mode="dark"] {
    --erp-surface: #23272a;
    --erp-surface-soft: #2f353b;
    --erp-border-color: #363d44;
    --erp-border-soft: #30363d;
    --erp-text: #cbd5e1;
    --erp-heading: #e6edf3;
    --erp-muted: #9aa4b2;
    --erp-shadow-card: none;
}

body[data-layout-mode="dark"] .card-header,
body[data-layout-mode="dark"] .card,
body[data-layout-mode="dark"] .sec-card,
body[data-layout-mode="dark"] .report-kpi-card,
body[data-layout-mode="dark"] .report-filter-card,
body[data-layout-mode="dark"] .report-table-card,
body[data-layout-mode="dark"] .kpi-card {
    background-color: var(--erp-surface);
    border-color: var(--erp-border-color);
}

body[data-layout-mode="dark"] .form-label,
body[data-layout-mode="dark"] .card-title-desc,
body[data-layout-mode="dark"] .kpi-label,
body[data-layout-mode="dark"] .kpi-sub,
body[data-layout-mode="dark"] .exec-kpi-label {
    color: var(--erp-muted);
}

body[data-layout-mode="dark"] .table {
    color: var(--erp-text);
}

body[data-layout-mode="dark"] .page-title-box h1,
body[data-layout-mode="dark"] .page-title-box h2,
body[data-layout-mode="dark"] .page-title-box h3,
body[data-layout-mode="dark"] .page-title-box h4,
body[data-layout-mode="dark"] .page-title-box h5,
body[data-layout-mode="dark"] .page-title-box h6,
body[data-layout-mode="dark"] .card-title,
body[data-layout-mode="dark"] .kpi-value,
body[data-layout-mode="dark"] .exec-kpi-value {
    color: var(--erp-heading);
}

@media (max-width: 767.98px) {
    .page-title-box .btn,
    .erp-page-actions .btn,
    .erp-form-actions .btn,
    .erp-submit-row .btn,
    .form-footer .btn {
        width: 100%;
    }

    .erp-table-hint {
        align-items: flex-start;
    }

    .erp-filter-form {
        padding: var(--erp-space-sm);
    }

    .form-footer {
        padding: var(--erp-space-md) var(--erp-space-md) var(--erp-space-lg);
    }

    .erp-submit-row > .btn + .btn,
    .erp-submit-row > .btn + a.btn,
    .erp-submit-row > a.btn + .btn,
    .erp-submit-row > a.btn + a.btn {
        margin-left: 0;
    }
}

@media print {
    @page {
        size: A4 landscape;
        margin: 10mm;
    }

    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .navbar-header,
    .vertical-menu,
    .vertical-overlay,
    #sidebar-menu,
    .app-menu,
    .leftside-menu,
    .card-body form,
    .btn,
    button,
    a.btn,
    footer,
    .footer,
    .topbar,
    #topnav,
    .navbar,
    .no-print {
        display: none !important;
    }

    .page-title-box .btn,
    .page-title-box button,
    .page-title-box a.btn,
    .page-title-box .erp-page-actions,
    .page-title-box > .d-flex,
    .erp-dt-toolbar,
    .dataTables_length,
    .dataTables_filter,
    .dataTables_info,
    .dataTables_paginate,
    .dt-buttons,
    .erp-module-tabs,
    #erp-module-tabs-template,
    .nav-tabs,
    .nav-pills,
    .breadcrumb,
    .erp-table-hint,
    .erp-dt-resize-handle {
        display: none !important;
    }

    #layout-wrapper,
    .main-content,
    .page-content,
    .container-fluid,
    .page-title-box {
        display: block !important;
    }

    body,
    .main-content,
    .page-content,
    .container-fluid,
    #page-wrapper,
    .content-page,
    .content {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .card {
        border: none !important;
        box-shadow: none !important;
        background: #fff !important;
    }

    .card-body {
        padding: 0 !important;
    }

    .table-responsive,
    .erp-dt-responsive,
    .erp-dt-shell,
    .dataTables_wrapper {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
        overflow-x: visible !important;
        overflow-y: visible !important;
        -webkit-overflow-scrolling: auto !important;
        scrollbar-width: none !important;
    }

    .table-responsive::-webkit-scrollbar,
    .erp-dt-responsive::-webkit-scrollbar,
    .erp-dt-shell::-webkit-scrollbar {
        display: none !important;
    }

    table,
    .table,
    .dataTable {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
        font-size: 9px !important;
        border-collapse: collapse !important;
        border-spacing: 0 !important;
        color: #111827 !important;
    }

    col,
    colgroup,
    table th,
    table td,
    .table th,
    .table td {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
        border: 1px solid #cbd5e1 !important;
        padding: 4px 5px !important;
        vertical-align: top !important;
        color: #111827 !important;
        background-clip: padding-box !important;
    }

    table thead th,
    .table thead th,
    .dataTable thead th {
        background: #1e3a5f !important;
        color: #ffffff !important;
        border-color: #1e3a5f !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
    }

    table tbody tr:nth-child(even) td,
    .table tbody tr:nth-child(even) td,
    .dataTable tbody tr:nth-child(even) td {
        background: #f8fafc !important;
    }

    table tbody tr:nth-child(odd) td,
    .table tbody tr:nth-child(odd) td,
    .dataTable tbody tr:nth-child(odd) td {
        background: #ffffff !important;
    }

    table tfoot td,
    .table tfoot td,
    .dataTable tfoot td {
        background: #e2e8f0 !important;
        color: #0f172a !important;
        border-top: 2px solid #475569 !important;
        font-weight: 700 !important;
    }

    .badge {
        border: 1px solid #94a3b8 !important;
        color: #111827 !important;
        background: #e2e8f0 !important;
    }

    .text-end,
    .gl-col-money,
    .tb-col-money {
        white-space: nowrap !important;
    }

    .gl-col-date,
    .gl-col-source,
    .gl-col-doc,
    .gl-col-account,
    .tb-col-code {
        white-space: normal !important;
    }

    .print-header {
        display: block !important;
        margin-bottom: 12px;
    }

    .print-header h1,
    .print-header h2,
    .print-header h3,
    .print-header h4,
    .print-header h5,
    .print-header h6 {
        margin: 0 0 2px;
    }

    .print-meta {
        color: #666;
        font-size: 11px;
    }

    .print-meta-strong {
        color: #111;
        font-size: 12px;
    }

    table {
        width: 100%;
        border-collapse: collapse;
        font-size: 11px;
    }

    th,
    td {
        border: 1px solid #999;
        padding: 4px 6px;
    }

    thead {
        background: #eee !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .badge {
        border: 1px solid #999;
        background: none !important;
        color: #000 !important;
    }
}
