/*
 * Crush ERP additions to the Sarzone / Otika base theme.
 * The base visual system lives in assets/css/style.css and components.css.
 * Keep overrides intentionally small so all ERP modules retain the source theme.
 */

:root {
    --erp-primary: #6777ef;
    --erp-ink: #34395e;
    --erp-muted: #6c757d;
    --erp-border: #e9ecef;
    --erp-soft: #f6f8fb;
}

.erp-brand-mark { display: inline-block; width: 32px; height: 32px; margin-right: 8px; background: url('../img/logo.png') center / contain no-repeat; vertical-align: middle; }
.erp-brand-mark svg { display: none; }

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; appearance: textfield; }

.crush-erp-ui .main-content { background: #f7f8fb; }
.crush-erp-ui .navbar { box-shadow: 0 1px 0 rgba(52,57,94,.06); }
.crush-erp-ui .navbar .nav-link.nav-link-lg { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; color: #5b6276; }
.crush-erp-ui .navbar .nav-link.nav-link-lg:hover { color: var(--erp-primary); }
.crush-erp-ui .erp-header-control {
    gap: 7px;
    height: 42px;
    margin: 0 2px;
    padding: 0 11px !important;
    border: 0;
    border-radius: 4px;
    color: #5b6276;
    background: transparent;
    box-shadow: none;
    font-weight: 600;
    cursor: pointer;
}
.crush-erp-ui .erp-header-control:hover,
.crush-erp-ui .erp-header-control:focus { color: var(--erp-primary); background: #f4f6ff; outline: 0; }
.crush-erp-ui .erp-header-icon-only {
    width: 34px;
    height: 34px;
    min-height: 34px !important;
    padding: 0 !important;
    border-radius: 7px;
}
.crush-erp-ui .erp-header-icon-only.dropdown-toggle::after { display: none; }
.crush-erp-ui .erp-header-control svg,
.crush-erp-ui .collapse-btn svg,
.crush-erp-ui .fullscreen-btn svg { width: 18px; height: 18px; }
.erp-navbar-title { gap: 7px; min-width: 0; color: #7b8397 !important; font-size: 13px; font-weight: 600; }
.erp-navbar-module { color: var(--erp-primary); text-transform: capitalize; }
.erp-navbar-divider { color: #c3c8d4; }
.erp-navbar-shortcuts { flex: 1 1 auto; align-items: center; justify-content: end; gap: 6px; min-width: 0; margin: 0 auto; padding: 0 14px;  }
.erp-shortcut-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 74px;
    height: 32px;
    padding: 0 8px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 6px 14px rgba(15, 23, 42, .08);
    transition: transform .15s ease, box-shadow .15s ease;
}
.erp-shortcut-pill:hover { text-decoration: none; transform: translateY(-2px); box-shadow: 0 9px 18px rgba(15, 23, 42, .12); }
.erp-shortcut-clock{
        position: static;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 0 12px;
    color: #34395e;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0;
    white-space: nowrap;
    background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
    border: 1px solid #dfe6ff;
    border-radius: 8px;
    box-shadow: 0 7px 16px rgba(15, 23, 42, .08);
    pointer-events: none;
}
.erp-shortcut-green { color: #059669; background: #ecfdf5; border-color: #a7f3d0; }
.erp-shortcut-blue { color: #2563eb; background: #eff6ff; border-color: #bfdbfe; }
.erp-shortcut-amber { color: #d97706; background: #fffbeb; border-color: #fcd34d; }
.erp-shortcut-teal { color: #0f766e; background: #f0fdfa; border-color: #99f6e4; }
.erp-shortcut-purple { color: #7c3aed; background: #f5f3ff; border-color: #ddd6fe; }
.erp-shortcut-rose { color: #e11d48; background: #fff1f2; border-color: #fecdd3; }
.erp-shortcut-indigo { color: #4f46e5; background: #eef2ff; border-color: #c7d2fe; }
.erp-shortcut-clock { color: #4b5563; background: #f4f7ff; border-color: #dbe4ff; box-shadow: 0 2px 8px rgba(52,57,94,.06); }
.erp-shortcut-clock svg { width: 15px; height: 15px; color: #6777ef; }
.crush-erp-ui .nav-link-user .user-img-radious-style { width: 36px; height: 36px; object-fit: cover; box-shadow: 0 4px 12px rgba(52,57,94,.18); }

.erp-page-header { align-items: center; }
.crush-erp-ui .section .section-header {
    min-height: auto;
    margin: 0 0 18px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.crush-erp-ui .section .section-header h1 { margin-bottom: 0; color: #2d3354; font-size: 25px; font-weight: 700; }
.erp-page-header p { margin: 4px 0 0; color: #6c757d; font-size: 13px; }
.erp-page-heading p { margin: 4px 0 0; color: #6c757d; font-size: 13px; }
.crush-erp-ui .section .section-header.erp-page-header-v2 { display: flex !important; align-items: center; width: 100%; }
.erp-page-header-v2 .erp-page-heading { flex: 1 1 auto; min-width: 0; }
.erp-page-header-v2 .section-header-button { flex: 0 0 auto; margin-left: auto !important; }
.crush-erp-ui .section-header-breadcrumb {
    margin-left: auto;
    padding: 9px 14px;
    border-radius: 999px;
    background: #eef0f5;
}
.crush-erp-ui .section-header-breadcrumb .breadcrumb-item { color: #778096; font-size: 13px; font-weight: 600; }
.crush-erp-ui .section-header-breadcrumb .breadcrumb-item.active { color: #4f586f; }
.erp-sidebar-logo {
    height: 32px;
    margin-right: 10px;
    object-fit: contain;
    width: 32px;
}

/* Shared actions and record tables */
.erp-action-group { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.erp-action-group form { display: inline; margin: 0; }
.erp-action-btn {
    align-items: center;
    display: inline-flex;
    gap: 5px;
    height: 32px;
    justify-content: center;
    min-width: 34px;
    padding: 7px 10px;
}
.erp-action-btn i { line-height: 1; margin: 0; }
.erp-order-products { margin-top: 5px; }
.erp-order-products summary { display: inline-flex; align-items: center; cursor: pointer; list-style: none; }
.erp-order-products summary::-webkit-details-marker { display: none; }
.erp-order-products ul { margin: 6px 0 0; padding-left: 16px; color: #5b6276; font-size: 11px; line-height: 1.55; white-space: nowrap; }
.erp-table-toolbar,
.erp-table-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.erp-table-toolbar { margin-bottom: 18px; }
.erp-table-footer { margin-top: 18px; }
.erp-table-options,
.erp-table-search,
.erp-table-actions { display: flex; align-items: center; gap: 10px; }
.erp-table-actions { margin-left: auto; }
.erp-table-actions .btn { white-space: nowrap; }
.erp-split-page {
    align-items: flex-start;
}
.erp-split-form-card,
.erp-split-table-card {
    border: 0;
    border-radius: 10px;
    box-shadow: 0 10px 26px rgba(15, 23, 42, .08);
    overflow: hidden;
}
.erp-split-form-card .card-header,
.erp-split-table-card .card-header {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid #f0f2f7;
    display: flex;
    min-height: 48px;
    padding: 14px 18px;
}
.erp-split-form-card .card-header h4,
.erp-split-table-card .card-header h4 {
    color: #17213f;
    font-size: 18px;
    font-weight: 800;
    margin: 0;
}
.erp-split-form-card .card-body,
.erp-split-table-card .card-body {
    padding: 22px 24px;
}
.erp-split-form-card .card-footer {
    background: #fff;
    border-top: 1px solid #f0f2f7;
    padding: 14px 24px 20px;
}
.erp-split-form-card label {
    color: #26345d;
    font-size: 12px;
    font-weight: 700;
}
.erp-split-form-card .form-control {
    border-color: #dfe5ff;
    min-height: 42px;
}
.erp-split-form-card textarea.form-control {
    min-height: 86px;
}
.erp-split-table-card .erp-table-toolbar {
    margin-bottom: 16px;
}
@media (max-width: 991.98px) {
    .erp-split-form-card {
        margin-bottom: 18px;
    }
}
.erp-column-picker { position: relative; margin: 0; }
.erp-column-picker summary { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 7px 10px; border: 1px solid #e4e6fc; border-radius: 4px; color: #6777ef; background: #fff; cursor: pointer; font-size: 12px; font-weight: 600; list-style: none; }
.erp-column-picker summary::-webkit-details-marker { display: none; }
.erp-column-options { position: absolute; z-index: 20; top: calc(100% + 6px); right: 0; display: grid; min-width: 190px; max-height: 260px; padding: 8px; overflow: auto; border: 1px solid #e9ecef; border-radius: 4px; background: #fff; box-shadow: 0 4px 20px rgba(0,0,0,.12); }
.erp-column-option { display: flex; align-items: center; gap: 8px; padding: 7px; margin: 0; color: #34395e; cursor: pointer; font-size: 12px; }
.erp-column-option:hover { background: #f8f9fa; }
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select { min-height: 36px; border: 1px solid #e4e6fc; border-radius: 4px; }
.erp-selection-column { width: 42px !important; text-align: center !important; white-space: nowrap; }
.erp-selection-column input { width: 16px; height: 16px; vertical-align: middle; cursor: pointer; }

/* Forms retain Otika cards while keeping primary actions visible on long screens. */
.section-body > form.card .card-footer { position: sticky; bottom: 0; z-index: 4; border-top: 1px solid var(--erp-border); background: #fff; }
.section-body > form.card .form-group > label { font-weight: 600; }
.erp-required-marker { margin-left: 2px; color: #fc544b; }
.form-control[aria-invalid="true"],
.custom-select[aria-invalid="true"] { border-color: #fc544b !important; box-shadow: 0 0 0 .15rem rgba(252,84,75,.12) !important; }
.crush-erp-ui .select2-container { width: 100% !important; }
.crush-erp-ui .select2-container--default .select2-selection--single {
    min-height: 42px;
    border: 1px solid #e4e6fc;
    border-radius: 4px;
    background: #fff;
}
.crush-erp-ui .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-right: 32px;
    padding-left: 15px;
    color: #495057;
    line-height: 42px;
}
.crush-erp-ui .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px;
    right: 8px;
}
.crush-erp-ui .select2-container--default.select2-container--focus .select2-selection--single,
.crush-erp-ui .select2-container--default.select2-container--open .select2-selection--single {
    border-color: #6777ef;
    box-shadow: 0 0 0 .15rem rgba(103,119,239,.12);
}
.crush-erp-ui .select2-container--default .select2-selection--single .select2-selection__clear {
    height: 40px;
    margin-right: 18px;
    color: #98a6ad;
}
.crush-erp-ui .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--erp-primary);
}
.crush-erp-ui .select2-dropdown {
    z-index: 2050;
    border-color: #e4e6fc;
}
.crush-erp-ui select[aria-invalid="true"] + .select2-container .select2-selection--single {
    border-color: #fc544b !important;
    box-shadow: 0 0 0 .15rem rgba(252,84,75,.12) !important;
}

/* Compact dashboard using standard Sarzone cards rather than a bespoke hero. */
.erp-dashboard-overview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 18px;
    padding: 20px 22px;
    border: 1px solid var(--erp-border);
    border-left: 4px solid var(--erp-primary);
    border-radius: 4px;
    color: var(--erp-ink);
    background: #fff;
    box-shadow: 0 4px 18px rgba(52,57,94,.07);
}
.erp-dashboard-overview .erp-kicker { color: var(--erp-primary); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.erp-dashboard-overview h2 { margin: 5px 0 4px; color: #2d3354; font-size: 22px; font-weight: 700; }
.erp-dashboard-overview p { margin: 0; color: #6f788e; font-size: 14px; }
.erp-dashboard-balance {
    min-width: 220px;
    padding: 13px 15px;
    border: 1px solid #e4e6fc;
    border-radius: 4px;
    color: var(--erp-ink);
    background: #f8f9ff;
    text-decoration: none !important;
}
.erp-dashboard-balance:hover { color: var(--erp-primary); border-color: #cfd5ff; }
.erp-dashboard-balance > span { display: block; color: #8b93a7; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.erp-dashboard-balance strong { display: block; margin: 3px 0; color: #2d3354; font-size: 19px; line-height: 1.2; }
.erp-dashboard-balance small { display: inline-flex; align-items: center; gap: 4px; color: var(--erp-primary); font-weight: 600; }
.erp-dashboard-balance small svg { width: 13px; }
.erp-dashboard-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.erp-action-tile { display: grid; grid-template-columns: 38px minmax(0, 1fr); grid-template-areas: "icon title" "icon note"; gap: 1px 11px; align-items: center; min-height: 72px; padding: 14px; border: 1px solid #e9ecef; border-radius: 4px; color: var(--erp-ink); background: #fff; box-shadow: 0 2px 8px rgba(52,57,94,.04); text-decoration: none !important; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.erp-action-tile:hover { color: var(--erp-primary); border-color: #dfe3ff; box-shadow: 0 6px 18px rgba(52,57,94,.09); transform: translateY(-1px); }
.erp-action-tile > span { grid-area: icon; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 4px; color: #fff; background: #6777ef; }
.erp-action-tile strong { grid-area: title; color: #2d3354; font-size: 14px; line-height: 1.25; }
.erp-action-tile small { grid-area: note; color: #6c757d; font-size: 12px; }
.erp-metric-card.card {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    min-height: 88px;
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 4px 16px rgba(52,57,94,.06);
}
.erp-metric-icon {
    display: inline-flex;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 4px;
    color: #6777ef;
    background: #f1f3ff;
}
.erp-metric-icon svg { width: 20px; height: 20px; stroke-width: 2; }
.erp-metric-copy { min-width: 0; }
.erp-metric-copy span {
    display: block;
    margin-bottom: 3px;
    color: #8a94a8;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
}
.erp-metric-copy strong {
    display: block;
    color: #2d3354;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.15;
    word-break: break-word;
}
.erp-metric-amber .erp-metric-icon { color: #ffa426; background: #fff7e8; }
.erp-metric-green .erp-metric-icon { color: #47c363; background: #edf9f0; }
.erp-metric-blue .erp-metric-icon { color: #3abaf4; background: #edf8fe; }
.erp-metric-red .erp-metric-icon { color: #fc544b; background: #fff0ef; }
.erp-metric-dark .erp-metric-icon { color: #34395e; background: #f0f1f5; }
.erp-dashboard-panel { height: calc(100% - 30px); }
.erp-progress-row { margin-bottom: 18px; }
.erp-progress-row > div:first-child,
.erp-finance-list > div,
.erp-attention-list a { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.erp-finance-list > div,
.erp-attention-list a { min-height: 45px; border-bottom: 1px solid #f1f1f1; color: var(--erp-ink); }
.erp-finance-list > div:last-child,
.erp-attention-list a:last-child { border-bottom: 0; }
.erp-attention-list a:hover { text-decoration: none; }
.erp-attention-list strong,
.erp-attention-list small { display: block; }
.erp-attention-list small { color: #6c757d; }

.badge,
.badge[class*="status-"] {
    color: #fff !important;
}

.badge.badge-light {
    background-color: #6777ef !important;
    color: #fff !important;
}

/* Search, saved navigation and feedback enhancements. */
.erp-search-dialog { position: fixed; z-index: 1200; inset: 0; display: none; padding-top: 10vh; }
.erp-search-dialog.is-open { display: block; }
.erp-search-backdrop { position: absolute; inset: 0; background: rgba(52,57,94,.45); }
.erp-search-panel { position: relative; width: min(640px, calc(100% - 24px)); margin: 0 auto; padding: 22px; border-radius: 4px; background: #fff; box-shadow: 0 12px 40px rgba(0,0,0,.2); }
.erp-search-panel-heading { display: flex; align-items: flex-start; justify-content: space-between; }
.erp-search-panel h2 { margin: 4px 0 16px; font-size: 21px; }
.erp-search-field { display: flex; align-items: center; gap: 10px; padding: 0 12px; border: 1px solid #e4e6fc; border-radius: 4px; }
.erp-search-field input { width: 100%; height: 46px; border: 0; outline: 0; }
.erp-search-results { display: grid; gap: 4px; margin-top: 14px; }
.erp-search-result { display: flex; align-items: center; gap: 11px; padding: 10px; border-radius: 4px; color: #34395e; text-decoration: none !important; }
.erp-search-result:hover,
.erp-search-result.is-selected { color: #6777ef; background: #f8f9fa; }
.erp-search-result svg { width: 17px; }
.erp-search-result strong,
.erp-search-result span { display: block; }
.erp-search-result span span { color: #6c757d; font-size: 12px; }
.erp-search-empty { padding: 20px; color: #6c757d; text-align: center; }
.erp-search-hint { margin: 14px 0 0; color: #6c757d; font-size: 11px; text-align: center; }
.erp-search-hint kbd { padding: 2px 4px; border: 1px solid #dee2e6; border-radius: 3px; background: #f8f9fa; }
.erp-sidebar-search { display: flex; align-items: center; gap: 8px; margin: 7px 15px 10px; padding: 0 10px; border: 1px solid #e4e6fc; border-radius: 4px; }
.erp-sidebar-search input { width: 100%; height: 34px; border: 0; outline: 0; font-size: 12px; }
.erp-sidebar-search svg { width: 15px; color: #6c757d; }
.erp-sidebar-shortcuts { margin: 0 15px 12px; }
.erp-shortcut-title { padding: 8px 0 4px; color: #98a6ad; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.erp-shortcut-link { display: block; padding: 6px 0; color: #6c757d; font-size: 12px; text-decoration: none !important; }
.erp-shortcut-link:hover { color: #6777ef; }
.erp-favorite-toggle { position: absolute; top: 11px; right: 10px; display: none; padding: 0; border: 0; color: #c7cbd3; background: transparent; }
.main-sidebar .sidebar-menu li { position: relative; }
.main-sidebar .sidebar-menu li:hover > .erp-favorite-toggle,
.erp-favorite-toggle.is-favorite { display: inline-flex; }
.erp-favorite-toggle.is-favorite { color: #ffa426; }
.erp-alert-dismiss { position: absolute; top: 50%; right: 10px; padding: 3px; transform: translateY(-50%); border: 0; color: inherit; background: transparent; }

/* Clean document output for every table's shared Print button. */
.erp-print-only { display: none; }

@media print {
    @page { size: A4; margin: 14mm 16mm 18mm; }

    html, body,
    body.crush-erp-ui { box-sizing: border-box !important; width: 100% !important; height: auto !important; margin: 0 !important; padding: 0 6mm !important; color: #111827 !important; background: #ffffff !important; font-size: 10pt !important; }

    .loader,
    .navbar-bg,
    .navbar,
    .main-sidebar,
    .main-footer,
    .footer,
    .section-header,
    .section-header-button,
    .erp-table-toolbar,
    .erp-table-footer,
    .dataTables_length,
    .dataTables_filter,
    .dataTables_info,
    .dataTables_paginate,
    .erp-table-actions,
    .erp-column-picker,
    .erp-selection-column,
    .erp-print-actions-column,
    .btn,
    button,
    .erp-action-group,
    .erp-action-btn,
    .alert,
    .erp-search-dialog,
    .dropdown-menu,
    .swal-overlay { display: none !important; }

    .main-content .section-header { display: none !important; }

    #app,
    .main-wrapper,
    .main-wrapper-1,
    .main-content,
    .section,
    .section-body,
    .card,
    .card-body,
    .table-responsive,
    .dataTables_wrapper { display: block !important; width: 100% !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; background: transparent !important; box-shadow: none !important; }

    .erp-print-only { display: flex !important; align-items: flex-end; justify-content: space-between; gap: 16px; margin: 0 0 8mm !important; padding: 0 0 4mm !important; border-bottom: 2px solid #173f75; color: #173f75; }
    .erp-print-only strong { display: block; font-size: 16pt; letter-spacing: .08em; }
    .erp-print-only span { display: block; margin-top: 2px; color: #374151; font-size: 11pt; font-weight: 600; letter-spacing: normal; }
    .erp-print-only small { color: #6b7280; font-size: 8pt; white-space: nowrap; }

    table.dataTable,
    .table { width: 100% !important; margin: 0 !important; border: 1px solid #cbd5e1 !important; border-collapse: collapse !important; }
    table.dataTable thead th,
    .table thead th { padding: 7px 6px !important; color: #173f75 !important; background: #eaf2fb !important; border: 1px solid #cbd5e1 !important; font-size: 8pt !important; font-weight: 700 !important; vertical-align: middle !important; }
    table.dataTable tbody td,
    .table tbody td { padding: 6px !important; border: 1px solid #dbe3ed !important; font-size: 9pt !important; line-height: 1.35 !important; vertical-align: top !important; }
    table.dataTable tbody tr,
    .table tbody tr { page-break-inside: avoid; break-inside: avoid; background: #ffffff !important; }
    table.dataTable tbody tr:nth-child(even),
    .table tbody tr:nth-child(even) { background: #f8fafc !important; }
    table.dataTable thead,
    .table thead { display: table-header-group; }
    table.dataTable thead .sorting:before,
    table.dataTable thead .sorting:after,
    table.dataTable thead .sorting_asc:before,
    table.dataTable thead .sorting_asc:after,
    table.dataTable thead .sorting_desc:before,
    table.dataTable thead .sorting_desc:after { display: none !important; }
    table.dataTable tfoot,
    .table tfoot { display: table-footer-group; }
    a { color: inherit !important; text-decoration: none !important; }
}

@media (max-width: 991.98px) {
    .erp-dashboard-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
    .erp-dashboard-overview { align-items: flex-start; flex-direction: column; }
    .erp-dashboard-balance { width: 100%; min-width: 0; }
    .erp-dashboard-actions { grid-template-columns: 1fr; }
    .erp-table-actions { width: 100%; margin-left: 0; }
    .erp-table-actions .btn span,
    .erp-column-picker summary span { display: none; }
}
