/* =====================================================================
   Golden Star theme: layered on top of the DreamsPOS template (style.css)
   Palette: deep gold on charcoal-navy, airy slate surfaces.
   ===================================================================== */
:root {
    --gs-gold: #B4892A;
    --gs-gold-600: #9A7322;
    --gs-gold-400: #D4AF37;
    --gs-gold-200: #EBD9A8;
    --gs-gold-50: #FBF6EA;
    --gs-gold-grad: linear-gradient(135deg, #C9A227 0%, #B4892A 55%, #9A7322 100%);
    --gs-ink: #0F172A;
    --gs-ink-2: #1E293B;
    --gs-text: #334155;
    --gs-muted: #64748B;
    --gs-line: #E8ECF2;
    --gs-surface: #FFFFFF;
    --gs-bg: #F5F6FA;
    --gs-success: #12B76A;
    --gs-danger: #F04438;
    --gs-warning: #F79009;
    --gs-info: #2E90FA;
    --gs-radius: 14px;
    --gs-radius-sm: 9px;
    --gs-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 6px 18px rgba(16, 24, 40, .05);
    --gs-shadow-lg: 0 20px 50px rgba(15, 23, 42, .18);
    --gs-font: "Inter", "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* ---------- Base ---------- */
body {
    font-family: var(--gs-font);
    background-color: var(--gs-bg);
    color: var(--gs-text);
    -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 { font-family: var(--gs-font); color: var(--gs-ink); letter-spacing: -.01em; }
a { color: var(--gs-gold); }
a:hover { color: var(--gs-gold-600); }
::selection { background: var(--gs-gold); color: #fff; }
.text-primary { color: var(--gs-gold) !important; }
.bg-primary { background-color: var(--gs-gold) !important; }
.border-primary { border-color: var(--gs-gold) !important; }

/* Loader */
#global-loader { background: var(--gs-bg); }
.whirly-loader { color: var(--gs-gold) !important; }

/* ---------- Header ---------- */
.header {
    background: rgba(255, 255, 255, .92);
    backdrop-filter: saturate(160%) blur(10px);
    border-bottom: 1px solid var(--gs-line);
    box-shadow: 0 1px 0 rgba(16, 24, 40, .02), 0 4px 18px rgba(16, 24, 40, .04);
}
.header .header-left {
    background: var(--gs-ink);
    border-right: 1px solid rgba(255, 255, 255, .06);
    border-bottom: 1px solid rgba(255, 255, 255, .06);
}
.header .header-left .logo img { width: 158px; }
.header .header-left .logo-small img { width: 38px; }
.header .header-left .gs-logo-uploaded {
    background: #fff;
    border-radius: 10px;
    padding: 4px 10px;
    max-height: 50px;
    object-fit: contain;
}
.header .header-left #toggle_btn {
    color: var(--gs-gold-400);
    background: rgba(255, 255, 255, .06);
    border-radius: 8px;
    width: 26px; height: 26px;
    display: flex; align-items: center; justify-content: center;
}
.header .header-left #toggle_btn svg { color: var(--gs-gold-400); }
.header .user-menu .user-info .user-name { color: var(--gs-ink); font-weight: 600; }
.header .user-menu .user-info .user-role { color: var(--gs-muted); text-transform: capitalize; }
.header .user-menu .user-letter img { border: 2px solid var(--gs-gold-200); }
.header .dropdown-menu { border-radius: 12px; box-shadow: var(--gs-shadow-lg); }

/* Header quick actions */
.header .user-menu .gs-quick { align-items: center; gap: 10px; margin-right: 14px; }
.gs-quick .gs-date {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 13px; color: var(--gs-muted); font-weight: 500;
    padding: 7px 12px; border-radius: 999px; background: #F1F5F9;
}
.gs-quick .gs-date svg, .gs-quick-btn svg { width: 15px; height: 15px; }
.gs-quick-btn {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: 13px; font-weight: 600; color: var(--gs-ink-2) !important;
    padding: 7px 14px; border-radius: 999px;
    border: 1px solid var(--gs-line); background: #fff;
    transition: all .18s ease;
}
.gs-quick-btn:hover { border-color: var(--gs-gold-200); background: var(--gs-gold-50); color: var(--gs-gold-600) !important; }
.gs-quick-btn.gs-quick-primary { background: var(--gs-gold-grad); color: #fff !important; border-color: transparent; box-shadow: 0 6px 14px rgba(180, 137, 42, .28); }
.gs-quick-btn.gs-quick-primary:hover { filter: brightness(1.05); color: #fff !important; }

@media (max-width: 991.98px) {
    .header { background: var(--gs-ink); border-bottom: 0; }
    .header .header-left { background: transparent; border: 0; }
    .header .mobile_btn .bar-icon span { background-color: #fff !important; }
    .header .mobile-user-menu > a { color: #fff !important; }
}

/* ---------- Sidebar ---------- */
.sidebar, .sidebars {
    background-color: var(--gs-ink);
    border-right: 0;
    box-shadow: 4px 0 24px rgba(15, 23, 42, .08);
}
.sidebar .sidebar-menu { padding: 18px 14px; }
.sidebar .sidebar-menu > ul > li.submenu-open ul {
    border-bottom: 1px solid rgba(255, 255, 255, .06);
    padding: 0 0 12px 0;
    margin-bottom: 14px;
}
.sidebar .sidebar-menu > ul > li.submenu-open:last-child ul { border-bottom: 0; }
.sidebar .sidebar-menu > ul > li.submenu-open .submenu-hdr {
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: #64748B;
    margin: 0 0 8px 10px;
}
.sidebar .sidebar-menu > ul > li.submenu-open ul li a {
    padding: 9px 12px;
    margin-bottom: 2px;
    border-radius: 10px;
    color: #CBD5E1;
    transition: background .18s ease, color .18s ease;
}
.sidebar .sidebar-menu > ul > li.submenu-open ul li a span {
    color: #CBD5E1;
    font-size: 13.5px;
    font-weight: 500;
}
.sidebar .sidebar-menu > ul > li svg,
.sidebar .sidebar-menu > ul > li.submenu-open ul li a svg {
    color: #94A3B8;
    width: 17px; height: 17px;
}
.sidebar .sidebar-menu > ul > li.submenu-open ul li a:hover {
    background: rgba(255, 255, 255, .05);
    color: #fff;
}
.sidebar .sidebar-menu > ul > li.submenu-open ul li a:hover span,
.sidebar .sidebar-menu > ul > li.submenu-open ul li a:hover svg { color: #fff; }
.sidebar .sidebar-menu > ul > li.submenu-open ul > li.active a {
    background: linear-gradient(90deg, rgba(212, 175, 55, .22) 0%, rgba(212, 175, 55, .05) 100%);
    color: #F3D77A;
    position: relative;
}
.sidebar .sidebar-menu > ul > li.submenu-open ul > li.active a::before {
    content: "";
    position: absolute;
    left: -14px; top: 8px; bottom: 8px;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: var(--gs-gold-400);
}
.sidebar .sidebar-menu > ul > li.submenu-open ul > li.active a span,
.sidebar .sidebar-menu > ul > li.submenu-open ul > li.active a svg { color: #F3D77A; }
.slimScrollBar { background: rgba(255, 255, 255, .25) !important; }

/* collapsed (mini) sidebar */
.mini-sidebar .sidebar .sidebar-menu { padding: 18px 8px; }
.mini-sidebar .sidebar .sidebar-menu > ul > li.submenu-open ul > li.active a::before { left: -8px; }
.mini-sidebar.expand-menu .sidebar .sidebar-menu { padding: 18px 14px; }

/* ---------- Page ---------- */
.page-wrapper .content { padding: 26px 26px 30px; }
.page-header { margin-bottom: 22px; }
.page-header .page-title h4 { font-size: 21px; font-weight: 700; color: var(--gs-ink); }
.page-header .page-title h6 { font-size: 13.5px; font-weight: 400; color: var(--gs-muted); }
.page-header .btn-added,
.btn-added {
    background: var(--gs-gold-grad);
    border: 0;
    border-radius: 10px;
    padding: 9px 16px;
    font-weight: 600;
    box-shadow: 0 6px 16px rgba(180, 137, 42, .28);
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.page-header .btn-added:hover { filter: brightness(1.05); transform: translateY(-1px); box-shadow: 0 10px 22px rgba(180, 137, 42, .32); color: #fff; }
.page-header .btn-added svg { width: 17px; height: 17px; }
.table-top-head li a {
    border: 1px solid var(--gs-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
}

/* ---------- Cards ---------- */
.card {
    border: 1px solid var(--gs-line);
    border-radius: var(--gs-radius);
    box-shadow: var(--gs-shadow);
}
.card .card-header { background: transparent; border-bottom: 1px solid var(--gs-line); }
.card .card-header .card-title { font-weight: 700; color: var(--gs-ink); }

/* ---------- Buttons ---------- */
.btn { border-radius: var(--gs-radius-sm); font-weight: 600; }
.btn-primary, .btn-submit {
    background: var(--gs-gold-grad) !important;
    border-color: transparent !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(180, 137, 42, .22);
}
.btn-primary:hover, .btn-primary:focus, .btn-submit:hover {
    filter: brightness(1.06);
    color: #fff !important;
}
.btn-primary:disabled, .btn-submit:disabled { filter: grayscale(.4); opacity: .6; box-shadow: none; }
.btn-outline-primary { color: var(--gs-gold); border-color: var(--gs-gold); }
.btn-outline-primary:hover { background: var(--gs-gold); border-color: var(--gs-gold); color: #fff; }
.btn-cancel {
    background: #F1F5F9;
    color: var(--gs-ink-2);
    border: 1px solid var(--gs-line);
}
.btn-cancel:hover { background: #E2E8F0; color: var(--gs-ink); }
.btn-dark-gs { background: var(--gs-ink); color: #fff; }
.btn-dark-gs:hover { background: var(--gs-ink-2); color: #fff; }

/* ---------- Forms ---------- */
.form-control, .form-select {
    border-color: #DFE4EC;
    border-radius: var(--gs-radius-sm);
    color: var(--gs-ink-2);
    min-height: 40px;
    font-size: 14px;
}
.form-control:focus, .form-select:focus {
    border-color: var(--gs-gold);
    box-shadow: 0 0 0 3px rgba(180, 137, 42, .14);
}
.form-control-sm, .form-select-sm { min-height: 32px; }
.input-blocks label, .form-label { color: var(--gs-ink-2); font-weight: 600; font-size: 13px; }
.form-check-input:checked { background-color: var(--gs-gold); border-color: var(--gs-gold); }
.form-check-input:focus { box-shadow: 0 0 0 3px rgba(180, 137, 42, .14); border-color: var(--gs-gold); }
.form-switch .form-check-input:focus { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23B4892A'/%3e%3c/svg%3e"); }
.form-switch .form-check-input:checked:focus { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e"); }

/* ---------- Select2 ---------- */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border: 1px solid #DFE4EC !important;
    border-radius: var(--gs-radius-sm) !important;
    min-height: 40px;
    background: #fff;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 38px !important;
    color: var(--gs-ink-2) !important;
    padding-left: 12px !important;
    padding-right: 30px !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 38px !important; right: 6px !important; }
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: #98A2B3 !important; }
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--gs-gold) !important;
    box-shadow: 0 0 0 3px rgba(180, 137, 42, .14);
}
.select2-dropdown {
    border: 1px solid var(--gs-line) !important;
    border-radius: 12px !important;
    box-shadow: 0 16px 40px rgba(15, 23, 42, .14);
    overflow: hidden;
    z-index: 2000;
}
.select2-search--dropdown .select2-search__field {
    border: 1px solid #DFE4EC !important;
    border-radius: 8px;
    padding: 7px 10px !important;
}
.select2-results__option { padding: 8px 12px; font-size: 13.5px; }
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background: var(--gs-gold-50) !important;
    color: var(--gs-ink) !important;
}
.select2-container--default .select2-results__option[aria-selected=true],
.select2-container--default .select2-results__option--selected {
    background: var(--gs-gold) !important;
    color: #fff !important;
}
.select2-container--default .select2-results__group { color: var(--gs-muted); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; padding: 8px 12px 4px; }
.select2-sm + .select2-container .select2-selection--single { min-height: 32px; }
.select2-sm + .select2-container .select2-selection--single .select2-selection__rendered { line-height: 30px !important; }
.select2-sm + .select2-container .select2-selection--single .select2-selection__arrow { height: 30px !important; }

/* ---------- Tables ---------- */
.table thead tr th,
.table thead th {
    background: #F8FAFC !important;
    color: var(--gs-muted) !important;
    font-size: 11.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    border-bottom: 1px solid var(--gs-line) !important;
    padding: 12px 14px;
    white-space: nowrap;
}
.table tbody tr td {
    color: var(--gs-text);
    border-color: #F0F2F6;
    padding: 12px 14px;
    vertical-align: middle;
}
.table tbody tr:hover td { background: #FCFAF4; }
.table-list-card .table-top { padding: 4px 0 14px; }
.dataTables_filter input, .search-set .search-input input[type=search] {
    border: 1px solid #DFE4EC !important;
    border-radius: 10px !important;
    min-height: 38px;
}
.dataTables_filter input:focus { border-color: var(--gs-gold) !important; box-shadow: 0 0 0 3px rgba(180, 137, 42, .14); }
.dataTables_paginate .pagination li a.page-link { border-radius: 8px !important; }
.dataTables_paginate .pagination li.active a.page-link,
.page-item.active .page-link {
    background: var(--gs-gold) !important;
    border-color: var(--gs-gold) !important;
    color: #fff !important;
}
.edit-delete-action a {
    border: 1px solid var(--gs-line);
    border-radius: 8px;
    background: #fff;
    transition: all .15s ease;
}
.edit-delete-action a:hover { border-color: var(--gs-gold-200); background: var(--gs-gold-50); }

/* ---------- Badges ---------- */
.badge { font-weight: 600; letter-spacing: .01em; border-radius: 6px; padding: 5px 8px; }
.badge-soft-gold { background: var(--gs-gold-50); color: var(--gs-gold-600); border: 1px solid var(--gs-gold-200); }
.badge-soft-ink { background: #EEF2F7; color: var(--gs-ink-2); }
.badge-soft-success { background: #ECFDF3; color: #027A48; }
.badge-soft-danger { background: #FEF3F2; color: #B42318; }
.badge-soft-warning { background: #FFFAEB; color: #B54708; }
.badge-soft-info { background: #EFF8FF; color: #175CD3; }

/* ---------- Modals ---------- */
.modal-content {
    border: 0;
    border-radius: 18px;
    box-shadow: var(--gs-shadow-lg);
    overflow: hidden;
}
.modal-backdrop.show { opacity: .45; }
.modal-backdrop { background-color: var(--gs-ink); }
.custom-modal-header {
    background: #fff !important;
    border-bottom: 1px solid var(--gs-line) !important;
    padding: 18px 24px !important;
    position: relative;
}
.custom-modal-header::before {
    content: "";
    position: absolute; left: 0; top: 0; right: 0;
    height: 3px;
    background: var(--gs-gold-grad);
}
.custom-modal-header .page-title h4 { font-size: 17px; font-weight: 700; color: var(--gs-ink); }
.custom-modal-header .close, .custom-modal-header .btn-close {
    background: #F1F5F9;
    border-radius: 50%;
    width: 30px; height: 30px;
    color: var(--gs-muted);
    border: 0;
    display: flex; align-items: center; justify-content: center;
}
.custom-modal-header .close:hover { background: #FEE4E2; color: var(--gs-danger); }
.custom-modal-body { padding: 22px 24px !important; }

/* ---------- Toastr ---------- */
#toast-container > div.toast { border-radius: 12px !important; box-shadow: 0 12px 30px rgba(15, 23, 42, .22) !important; }
#toast-container > div.toast-success { background-color: #067647 !important; }
#toast-container > div.toast-error { background-color: #B42318 !important; }
#toast-container > div.toast-warning { background-color: #B54708 !important; }
#toast-container > div.toast-info { background-color: var(--gs-ink-2) !important; }

/* SweetAlert */
.swal2-popup { border-radius: 18px !important; font-family: var(--gs-font) !important; }
.swal2-styled.swal2-confirm { background: var(--gs-gold) !important; border-radius: 10px !important; }
.swal2-styled.swal2-cancel { border-radius: 10px !important; }

/* =====================================================================
   Golden Star components (new screens)
   ===================================================================== */
.gs-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; margin-bottom: 22px; }
.gs-stat {
    background: #fff;
    border: 1px solid var(--gs-line);
    border-radius: var(--gs-radius);
    box-shadow: var(--gs-shadow);
    padding: 18px;
    display: flex; align-items: center; gap: 14px;
    position: relative; overflow: hidden;
}
.gs-stat::after {
    content: ""; position: absolute; right: -30px; top: -30px;
    width: 90px; height: 90px; border-radius: 50%;
    background: radial-gradient(circle, rgba(212, 175, 55, .12), transparent 70%);
}
.gs-stat .gs-stat-icon {
    width: 46px; height: 46px; border-radius: 12px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    background: var(--gs-gold-50); color: var(--gs-gold);
}
.gs-stat .gs-stat-icon svg { width: 22px; height: 22px; }
.gs-stat .gs-stat-icon.ink { background: #EEF2F7; color: var(--gs-ink-2); }
.gs-stat .gs-stat-icon.green { background: #ECFDF3; color: #039855; }
.gs-stat .gs-stat-icon.red { background: #FEF3F2; color: #D92D20; }
.gs-stat .gs-stat-label { font-size: 12.5px; color: var(--gs-muted); font-weight: 500; margin-bottom: 2px; }
.gs-stat .gs-stat-value { font-size: 21px; font-weight: 800; color: var(--gs-ink); line-height: 1.2; }
.gs-stat .gs-stat-sub { font-size: 12px; color: var(--gs-muted); }

.gs-chip {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 12px; font-weight: 600;
    padding: 4px 10px; border-radius: 999px;
    background: #F1F5F9; color: var(--gs-ink-2);
}
.gs-chip.gold { background: var(--gs-gold-50); color: var(--gs-gold-600); }
.gs-muted { color: var(--gs-muted) !important; }
.gs-name { font-weight: 600; color: var(--gs-ink); }
.gs-sku { font-size: 12px; color: var(--gs-muted); }

/* Recipe builder */
.gs-recipe {
    border: 1px dashed var(--gs-gold-200);
    background: linear-gradient(180deg, #FFFDF8 0%, #FFFFFF 100%);
    border-radius: 14px;
    padding: 16px;
}
.gs-recipe-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.gs-recipe-head h6 { margin: 0; font-weight: 700; font-size: 14px; }
.gs-recipe-head small { color: var(--gs-muted); }
.gs-recipe-row { display: grid; grid-template-columns: 1fr 120px 110px 38px; gap: 10px; align-items: center; margin-bottom: 10px; }
.gs-recipe-row .btn-remove {
    width: 38px; height: 38px; border-radius: 10px;
    border: 1px solid #FEE4E2; background: #FEF3F2; color: #D92D20;
    display: flex; align-items: center; justify-content: center; padding: 0;
}
.gs-recipe-empty { text-align: center; color: var(--gs-muted); font-size: 13px; padding: 10px; }
.gs-recipe-hint { font-size: 12px; color: var(--gs-muted); margin-top: 4px; }
@media (max-width: 575.98px) {
    .gs-recipe-row { grid-template-columns: 1fr 1fr; }
    .gs-recipe-row > :first-child { grid-column: 1 / -1; }
}

/* Manufactured toggle card */
.gs-toggle-card {
    display: flex; align-items: center; gap: 12px;
    border: 1px solid var(--gs-line);
    border-radius: 12px;
    padding: 12px 14px;
    background: #FAFBFC;
    margin-bottom: 14px;
}
.gs-toggle-card .form-check-input { width: 2.6em; height: 1.35em; margin: 0; cursor: pointer; }
.gs-toggle-card strong { color: var(--gs-ink); font-size: 14px; display: block; }
.gs-toggle-card span { color: var(--gs-muted); font-size: 12.5px; }

/* ---------- Make Product modal ---------- */
#makeProductModal .modal-dialog { max-width: 640px; }
.gs-make-top { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }
.gs-capacity {
    border-radius: 14px;
    padding: 14px 16px;
    background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
    color: #fff;
    position: relative;
    overflow: hidden;
}
.gs-capacity::after {
    content: "★"; position: absolute; right: 14px; top: 4px;
    font-size: 54px; color: rgba(212, 175, 55, .16);
}
.gs-capacity .lbl { font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: #94A3B8; font-weight: 600; }
.gs-capacity .val { font-size: 30px; font-weight: 800; color: #F3D77A; line-height: 1.15; }
.gs-capacity .val small { font-size: 14px; color: #CBD5E1; font-weight: 600; margin-left: 4px; }
.gs-capacity .sub { font-size: 12px; color: #94A3B8; }
.gs-qty-box { border: 1px solid var(--gs-line); border-radius: 14px; padding: 12px 14px; }
.gs-qty-box .lbl { font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--gs-muted); font-weight: 600; margin-bottom: 6px; }
.gs-stepper { display: flex; align-items: stretch; }
.gs-stepper button {
    width: 42px; border: 1px solid #DFE4EC; background: #F8FAFC; color: var(--gs-ink);
    font-size: 20px; font-weight: 600; line-height: 1;
}
.gs-stepper button:first-child { border-radius: 10px 0 0 10px; }
.gs-stepper button:last-child { border-radius: 0 10px 10px 0; }
.gs-stepper button:hover { background: var(--gs-gold-50); color: var(--gs-gold-600); }
.gs-stepper input {
    flex: 1; min-width: 0; text-align: center; font-size: 22px; font-weight: 800; color: var(--gs-ink);
    border: 1px solid #DFE4EC; border-left: 0; border-right: 0; border-radius: 0 !important; min-height: 46px;
}
.gs-stepper input:focus { outline: none; box-shadow: none; border-color: #DFE4EC; }
.gs-qty-box .gs-max-link { font-size: 12px; font-weight: 600; cursor: pointer; }

.gs-section-title {
    display: flex; align-items: center; justify-content: space-between;
    font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--gs-muted);
    font-weight: 700; margin: 20px 0 8px;
}
.gs-section-title a { text-transform: none; letter-spacing: 0; font-size: 12px; }
.gs-mat-list { border: 1px solid var(--gs-line); border-radius: 14px; overflow: hidden; }
.gs-mat-row {
    display: grid; grid-template-columns: 1fr 150px 1fr; gap: 12px; align-items: center;
    padding: 10px 14px; border-bottom: 1px solid #F0F2F6;
}
.gs-mat-row:last-child { border-bottom: 0; }
.gs-mat-row .mat-name { font-weight: 600; color: var(--gs-ink); font-size: 14px; }
.gs-mat-row .mat-recipe { font-size: 11.5px; color: var(--gs-muted); }
.gs-mat-row .mat-input { position: relative; }
.gs-mat-row .mat-input input { padding-right: 46px; text-align: right; font-weight: 700; min-height: 36px; }
.gs-mat-row .mat-input input.edited { border-color: var(--gs-gold); background: var(--gs-gold-50); }
.gs-mat-row .mat-input .u {
    position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
    font-size: 11px; font-weight: 700; color: var(--gs-muted);
}
.gs-mat-row .mat-stock { display: flex; align-items: center; justify-content: flex-end; gap: 8px; font-size: 13px; font-weight: 600; color: var(--gs-ink-2); }
.gs-mat-row .ok, .gs-mat-row .bad {
    width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 800; flex-shrink: 0;
}
.gs-mat-row .ok { background: #ECFDF3; color: #039855; }
.gs-mat-row .bad { background: #FEF3F2; color: #D92D20; }
.gs-mat-row.short { background: #FFFBFA; }
.gs-mat-row.short .mat-stock { color: #D92D20; }
.gs-mat-head { background: #F8FAFC; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--gs-muted); font-weight: 700; padding: 8px 14px; }
.gs-cost-line { display: flex; justify-content: space-between; font-size: 13px; color: var(--gs-muted); padding: 2px 0; }
.gs-cost-line strong { color: var(--gs-ink); }
.gs-empty-state { text-align: center; padding: 28px 10px; color: var(--gs-muted); }
.gs-empty-state svg { width: 34px; height: 34px; color: var(--gs-gold-200); margin-bottom: 8px; }
@media (max-width: 575.98px) {
    .gs-make-top { grid-template-columns: 1fr; }
    .gs-mat-row { grid-template-columns: 1fr 1fr; }
    .gs-mat-row > :first-child { grid-column: 1 / -1; }
}

/* ---------- Login ---------- */
.gs-auth {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    background: #fff;
    font-family: var(--gs-font);
}
.gs-auth-brand {
    background:
        radial-gradient(circle at 20% 20%, rgba(212, 175, 55, .18), transparent 45%),
        radial-gradient(circle at 80% 85%, rgba(212, 175, 55, .12), transparent 40%),
        linear-gradient(160deg, #0B1222 0%, #0F172A 50%, #1E293B 100%);
    color: #fff;
    padding: 56px;
    display: flex; flex-direction: column; justify-content: space-between;
    position: relative; overflow: hidden;
}
.gs-auth-brand::after {
    content: "★"; position: absolute; right: -40px; bottom: -90px;
    font-size: 420px; line-height: 1; color: rgba(212, 175, 55, .06);
}
.gs-auth-brand img { width: 210px; }
.gs-auth-brand h1 { color: #fff; font-size: 38px; font-weight: 800; line-height: 1.15; max-width: 460px; }
.gs-auth-brand h1 span { color: #E9C866; }
.gs-auth-brand p { color: #94A3B8; max-width: 420px; font-size: 15px; }
.gs-auth-points { list-style: none; padding: 0; margin: 26px 0 0; display: grid; gap: 12px; }
.gs-auth-points li { display: flex; align-items: center; gap: 10px; color: #CBD5E1; font-size: 14px; }
.gs-auth-points li i { color: #E9C866; width: 18px; }
.gs-auth-form { display: flex; align-items: center; justify-content: center; padding: 40px 24px; background: var(--gs-bg); }
.gs-auth-card {
    width: 100%; max-width: 420px; background: #fff; border-radius: 20px;
    border: 1px solid var(--gs-line); box-shadow: 0 24px 60px rgba(15, 23, 42, .08);
    padding: 36px 32px;
}
.gs-auth-card h3 { font-weight: 800; font-size: 24px; margin-bottom: 4px; }
.gs-auth-card .sub { color: var(--gs-muted); font-size: 14px; margin-bottom: 26px; }
.gs-auth-card .form-control { min-height: 46px; padding-left: 42px; }
.gs-auth-card .gs-field { position: relative; margin-bottom: 16px; }
.gs-auth-card .gs-field > i, .gs-auth-card .gs-field > svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: #98A2B3; }
.gs-auth-card .gs-field .toggle-password { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); color: #98A2B3; cursor: pointer; left: auto; }
.gs-auth-card .btn-login { width: 100%; min-height: 48px; font-size: 15px; border-radius: 12px; }
.gs-auth-foot { text-align: center; color: var(--gs-muted); font-size: 12.5px; margin-top: 22px; }
.gs-auth-mobile-logo { display: none; text-align: center; margin-bottom: 18px; }
.gs-auth-mobile-logo img { width: 180px; }
@media (max-width: 991.98px) {
    .gs-auth { grid-template-columns: 1fr; }
    .gs-auth-brand { display: none; }
    .gs-auth-mobile-logo { display: block; }
}

/* ---------- Fixes for template specifics ---------- */
.sidebar .slimScrollDiv, .sidebars .slimScrollDiv,
.sidebar .sidebar-inner, .sidebar .sidebar-menu { background: var(--gs-ink) !important; }
.header .user-menu.nav > li.gs-quick > a.gs-quick-btn {
    display: inline-flex; padding: 7px 14px; line-height: 1.2; color: var(--gs-ink-2);
}
.header .user-menu.nav > li.gs-quick > a.gs-quick-btn.gs-quick-primary { color: #fff; }
.header .user-menu.nav > li.gs-quick { margin-right: 18px; }

/* Dashboard count cards: one premium family instead of mixed brights */
.dash-count {
    border-radius: var(--gs-radius) !important;
    border: 0 !important;
    box-shadow: var(--gs-shadow);
    background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%) !important;
    position: relative; overflow: hidden;
}
.dash-count.das1 { background: linear-gradient(135deg, #7A1F1F 0%, #B42318 100%) !important; }
.dash-count.das2 { background: linear-gradient(135deg, #1E293B 0%, #334155 100%) !important; }
.dash-count.das3 { background: var(--gs-gold-grad) !important; }
.dash-count h4, .dash-count h4.text-danger, .dash-count h4.text-warning, .dash-count h5 { color: #fff !important; }
.dash-count .dash-imgs svg { color: rgba(255, 255, 255, .85); }
.dash-widget { border-radius: var(--gs-radius) !important; border: 1px solid var(--gs-line) !important; box-shadow: var(--gs-shadow); }

/* Modal footers align right */
.modal-footer { justify-content: flex-end; gap: 8px; }
.modal .modal-footer { justify-content: flex-end !important; }
.input-blocks label .unit-lbl { color: inherit !important; font-weight: 700; }
.edit-delete-action a svg, .action-table-data .edit-delete-action a svg { width: 16px !important; height: 16px !important; }
/* respect Bootstrap width utilities on Select2 (template forces min-width:100%) */
select.w-25 + .select2-container, select.w-50 + .select2-container,
select.w-75 + .select2-container, select.w-auto + .select2-container { min-width: 0 !important; }

/* =====================================================================
   POS (premium)
   ===================================================================== */
.gs-pos .content { padding-bottom: 18px; }
.gs-pos-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.gs-pos-head h4 { font-size: 21px; font-weight: 800; margin: 0; }
.gs-pos-sub { font-size: 13px; color: var(--gs-muted); display: flex; align-items: center; gap: 6px; }
.gs-pos-live { width: 8px; height: 8px; border-radius: 50%; background: #12B76A; box-shadow: 0 0 0 4px rgba(18, 183, 106, .15); display: inline-block; }
.gs-pos-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.gs-pos-chip {
    display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 14px;
    border: 1px solid var(--gs-line); border-radius: 10px; background: #fff;
    font-size: 13px; font-weight: 600; color: var(--gs-ink-2); transition: all .15s ease;
}
.gs-pos-chip svg { width: 16px; height: 16px; color: var(--gs-gold); }
.gs-pos-chip:hover { border-color: var(--gs-gold-200); background: var(--gs-gold-50); }
.gs-pos-count { background: var(--gs-ink); color: #F3D77A; border-radius: 999px; padding: 1px 8px; font-size: 11.5px; }

.gs-pos-panel, .gs-pos-cart {
    background: #fff; border: 1px solid var(--gs-line); border-radius: 18px; box-shadow: var(--gs-shadow);
    height: calc(100vh - 66px - 26px - 70px); min-height: 560px; display: flex; flex-direction: column; overflow: hidden;
}
.gs-pos-toolbar { display: grid; grid-template-columns: 1fr 230px; gap: 10px; padding: 14px 14px 10px; }
.gs-pos-search, .gs-pos-scan {
    position: relative; display: flex; align-items: center;
    border: 1px solid #DFE4EC; border-radius: 12px; background: #F8FAFC; transition: all .15s ease;
}
.gs-pos-search:focus-within, .gs-pos-scan:focus-within { border-color: var(--gs-gold); background: #fff; box-shadow: 0 0 0 3px rgba(180, 137, 42, .14); }
.gs-pos-search svg, .gs-pos-scan svg { width: 18px; height: 18px; color: #98A2B3; margin-left: 12px; flex-shrink: 0; }
.gs-pos-search input, .gs-pos-scan input { border: 0; background: transparent; outline: none; width: 100%; height: 44px; padding: 0 12px 0 10px; font-size: 14px; color: var(--gs-ink); }
.gs-pos-scan { border-style: dashed; border-color: var(--gs-gold-200); background: var(--gs-gold-50); }
.gs-pos-scan svg { color: var(--gs-gold); }

.gs-pos-mode { display: flex; align-items: center; gap: 10px; padding: 0 14px 12px; border-bottom: 1px solid var(--gs-line); font-size: 12.5px; }
.gs-pos-mode > span { font-weight: 700; color: var(--gs-muted); text-transform: uppercase; letter-spacing: .08em; font-size: 11px; }
.gs-seg { display: inline-flex; background: #F1F5F9; border-radius: 10px; padding: 3px; }
.gs-seg button { display: inline-flex; align-items: center; gap: 6px; border: 0; background: transparent; padding: 6px 14px; border-radius: 8px; font-size: 13px; font-weight: 700; color: var(--gs-muted); }
.gs-seg button svg { width: 15px; height: 15px; }
.gs-seg button.active { background: var(--gs-ink); color: #F3D77A; box-shadow: 0 4px 10px rgba(15, 23, 42, .2); }

.gs-pos-products { flex: 1; overflow-y: auto; padding: 14px; background: #FAFBFD; }
.gs-pos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(178px, 1fr)); gap: 12px; }
.gs-pc {
    position: relative; height: 100%; cursor: pointer; user-select: none;
    background: #fff; border: 1px solid var(--gs-line); border-radius: 14px; padding: 12px;
    transition: transform .12s ease, box-shadow .15s ease, border-color .15s ease;
}
.gs-pc:hover { border-color: var(--gs-gold-200); box-shadow: 0 10px 24px rgba(15, 23, 42, .08); transform: translateY(-2px); }
.gs-pc:active { transform: translateY(0) scale(.98); }
.gs-pc.is-out { opacity: .55; }
.gs-pc-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.gs-pc-avatar {
    width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #0F172A, #1E293B); color: #F3D77A; font-weight: 800; font-size: 14px; letter-spacing: .04em;
}
.gs-pc-pc {
    border: 1px solid var(--gs-line); background: #fff; color: var(--gs-ink-2);
    font-size: 11.5px; font-weight: 700; padding: 4px 9px; border-radius: 999px;
}
.gs-pc-pc:hover { background: var(--gs-gold-50); border-color: var(--gs-gold-200); color: var(--gs-gold-600); }
.gs-pc-name { font-weight: 700; color: var(--gs-ink); font-size: 14px; line-height: 1.3; min-height: 36px; }
.gs-pc-sku { font-size: 11.5px; color: #98A2B3; margin-bottom: 8px; }
.gs-pc-price b { color: var(--gs-gold-600); font-size: 16px; font-weight: 800; }
.gs-pc-price span { color: var(--gs-muted); font-size: 11.5px; margin-left: 3px; }
.gs-pc-sub { font-size: 12px; color: var(--gs-muted); margin-bottom: 8px; }
.gs-pc-stock { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 3px 8px; border-radius: 6px; background: #ECFDF3; color: #027A48; }
.gs-pc-stock.out { background: #FEF3F2; color: #B42318; }

/* Cart */
.gs-pos-cart-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 16px; background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%); color: #fff;
}
.gs-pos-cart-head .lbl { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: #94A3B8; font-weight: 700; }
.gs-pos-cart-head .ttl { font-size: 17px; font-weight: 800; color: #fff; }
.gs-pos-items { background: rgba(212, 175, 55, .16); color: #F3D77A; border: 1px solid rgba(212, 175, 55, .35); padding: 4px 12px; border-radius: 999px; font-weight: 700; font-size: 13px; }
.gs-pos-who { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--gs-line); }
.gs-pos-who .form-label { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--gs-muted); margin-bottom: 4px; }
.gs-pos-lines { flex: 1; overflow-y: auto; padding: 12px 14px; background: #FAFBFD; }

.gs-pos .pos-cart-item { border-radius: 12px; border: 1px solid var(--gs-line); border-left: 3px solid #CBD5E1; padding: 10px 12px; box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
.gs-pos .pos-cart-item.is-carton { border-left-color: var(--gs-gold); }
.gs-pos .pos-cart-item-title { color: var(--gs-ink); font-weight: 700; max-width: 260px; }
.gs-unit-select {
    height: 26px; font-size: 11.5px; font-weight: 700; border-radius: 7px; padding: 0 22px 0 8px;
    border: 1px solid var(--gs-gold-200); background-color: var(--gs-gold-50); color: var(--gs-gold-600);
    appearance: auto;
}
.gs-pos .pos-qty-btn { border-color: #DFE4EC !important; color: var(--gs-ink) !important; background: #F8FAFC; }
.gs-pos .pos-qty-btn:hover { background: var(--gs-gold-50) !important; color: var(--gs-gold-600) !important; }
.gs-pos .pos-line-total { color: var(--gs-ink); font-weight: 800; }

.gs-pos-sum { padding: 12px 16px 16px; border-top: 1px solid var(--gs-line); background: #fff; }
.gs-pos-sum-row { display: flex; align-items: center; justify-content: space-between; font-size: 13.5px; color: var(--gs-muted); padding: 3px 0; }
.gs-pos-sum-row b { color: var(--gs-ink); }
.gs-pos-disc { display: flex; align-items: center; border: 1px solid #DFE4EC; border-radius: 8px; overflow: hidden; }
.gs-pos-disc input { width: 70px; border: 0; outline: none; text-align: right; padding: 4px 6px; font-weight: 700; color: var(--gs-ink); }
.gs-pos-disc em { font-style: normal; background: #F1F5F9; padding: 4px 9px; font-weight: 700; color: var(--gs-muted); }
.gs-pos-total {
    display: flex; align-items: center; justify-content: space-between; margin: 10px 0 12px;
    padding: 12px 14px; border-radius: 12px; background: var(--gs-gold-50); border: 1px solid var(--gs-gold-200);
}
.gs-pos-total span { font-weight: 700; color: var(--gs-ink-2); }
.gs-pos-total b { font-size: 24px; font-weight: 800; color: var(--gs-gold-600); }
.gs-pos-btns { display: grid; grid-template-columns: 1fr 2fr; gap: 10px; }
.gs-pos-btns .btn, .gs-btn-pay { height: 50px; border-radius: 12px; font-size: 15px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.gs-pos-btns svg, .gs-btn-pay svg { width: 18px; height: 18px; }
.gs-btn-hold { background: #fff; border: 1px solid #DFE4EC; color: var(--gs-ink-2); }
.gs-btn-hold:hover { background: #F1F5F9; }
.gs-btn-pay { background: var(--gs-gold-grad); color: #fff !important; border: 0; box-shadow: 0 8px 20px rgba(180, 137, 42, .32); padding: 0 22px; }
.gs-btn-pay:hover { filter: brightness(1.06); }
.gs-btn-pay:disabled, .gs-btn-hold:disabled { opacity: .5; box-shadow: none; }

.gs-pos-mhead { background: var(--gs-ink) !important; color: #fff; border-bottom: 2px solid var(--gs-gold) !important; padding: 14px 18px; }
.gs-pos-mhead .modal-title { color: #fff; font-weight: 700; font-size: 16px; display: flex; align-items: center; }
.gs-pos-mhead .modal-title svg { color: #F3D77A; }
.gs-pos-paybox { text-align: center; padding: 16px; border-radius: 14px; background: linear-gradient(135deg, #0F172A, #1E293B); }
.gs-pos-paybox span { font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; color: #94A3B8; font-weight: 700; }
.gs-pos-paybox h2 { color: #F3D77A; font-weight: 800; margin: 4px 0 0; font-size: 30px; }

@media (max-width: 991.98px) {
    .gs-pos-panel, .gs-pos-cart { height: auto; min-height: 0; }
    .gs-pos-products { max-height: 520px; }
    .gs-pos-lines { max-height: 420px; }
    .gs-pos-toolbar { grid-template-columns: 1fr; }
}

/* =====================================================================
   Dashboard
   ===================================================================== */
.gs-hero {
    display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
    padding: 22px 24px; margin-bottom: 22px; border-radius: 18px; color: #fff; position: relative; overflow: hidden;
    background: radial-gradient(circle at 85% 20%, rgba(212, 175, 55, .22), transparent 40%), linear-gradient(135deg, #0B1222 0%, #0F172A 55%, #1E293B 100%);
    box-shadow: 0 16px 40px rgba(15, 23, 42, .18);
}
.gs-hero::after { content: "★"; position: absolute; right: 26%; top: -38px; font-size: 170px; color: rgba(212, 175, 55, .07); line-height: 1; }
.gs-hero-kicker { font-size: 11.5px; text-transform: uppercase; letter-spacing: .14em; color: #E9C866; font-weight: 700; }
.gs-hero h3 { color: #fff; font-weight: 800; font-size: 24px; margin: 4px 0 2px; }
.gs-hero p { color: #94A3B8; margin: 0; }
.gs-hero-actions { display: flex; gap: 10px; flex-wrap: wrap; position: relative; z-index: 1; }
.gs-hero-actions .btn { height: 44px; display: inline-flex; align-items: center; gap: 8px; border-radius: 12px; font-weight: 700; padding: 0 18px; }
.gs-hero-actions svg { width: 17px; height: 17px; }
.gs-hero-btn { background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .16); color: #fff; }
.gs-hero-btn:hover { background: rgba(255, 255, 255, .14); color: #fff; }

.gs-kpi-title { font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; color: var(--gs-muted); margin: 0 0 10px 2px; }
.gs-stat-link { color: inherit; transition: transform .15s ease, box-shadow .15s ease; }
.gs-stat-link:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(15, 23, 42, .08); color: inherit; }
.gs-stat .gs-stat-value small { font-size: 13px; color: var(--gs-muted); font-weight: 600; }
.gs-up { color: #039855; font-weight: 700; }
.gs-down { color: #D92D20; font-weight: 700; }

.gs-legend { font-size: 12px; color: var(--gs-muted); display: flex; align-items: center; gap: 6px; }
.gs-legend .sw { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.gs-legend .sw.gold { background: #B4892A; }
.gs-legend .sw.ink { background: #0F172A; }

.gs-pl-row { display: flex; justify-content: space-between; padding: 7px 0; border-bottom: 1px dashed #EEF1F5; font-size: 13.5px; color: var(--gs-muted); }
.gs-pl-row b { color: var(--gs-ink); }
.gs-pl-row.strong span, .gs-pl-row.strong b { color: var(--gs-ink); font-weight: 800; }
.gs-pl-net { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; padding: 12px 14px; border-radius: 12px; background: linear-gradient(135deg, #0F172A, #1E293B); }
.gs-pl-net span { color: #CBD5E1; font-weight: 600; }
.gs-pl-net b { color: #F3D77A; font-size: 20px; font-weight: 800; }
.gs-pl-net.neg b { color: #FDA29B; }

.gs-icon-link { display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center; border-radius: 8px; border: 1px solid var(--gs-line); color: var(--gs-ink-2); }
.gs-icon-link svg { width: 15px; height: 15px; }
.gs-icon-link:hover { background: var(--gs-gold-50); border-color: var(--gs-gold-200); color: var(--gs-gold-600); }

.gs-bar-row { margin-bottom: 14px; font-size: 13px; }
.gs-bar-row b { color: var(--gs-ink); }
.gs-bar { height: 7px; border-radius: 999px; background: #F1F5F9; margin: 6px 0 3px; overflow: hidden; }
.gs-bar span { display: block; height: 100%; border-radius: 999px; background: var(--gs-gold-grad); }

.gs-feed { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px dashed #EEF1F5; font-size: 13px; }
.gs-feed:last-child { border-bottom: 0; }
.gs-feed b { color: var(--gs-ink); white-space: nowrap; }
.gs-feed-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--gs-gold); box-shadow: 0 0 0 4px var(--gs-gold-50); flex-shrink: 0; }
.gs-feed-dot.red { background: #D92D20; box-shadow: 0 0 0 4px #FEF3F2; }
.gs-feed-avatar { width: 34px; height: 34px; border-radius: 10px; background: var(--gs-gold-50); color: var(--gs-gold-600); font-weight: 800; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
td.gs-empty-state { padding: 26px 10px !important; }

/* Receipt popup */
#receiptModal .modal-dialog { max-width: 540px !important; }
#receiptModal .modal-header { background: var(--gs-ink) !important; border-bottom: 2px solid var(--gs-gold); }
#receiptModal .modal-header .modal-title { color: #fff; font-weight: 700; }
#receiptModal .modal-footer { justify-content: space-between !important; flex-wrap: nowrap; }
#receiptModal .modal-footer .btn { white-space: nowrap; }
#receiptModal .modal-footer { flex-wrap: wrap !important; gap: 8px; }
#receiptModal .modal-footer .btn { padding: 8px 12px; font-size: 13px; }
#receiptModal .modal-footer { flex-wrap: nowrap !important; }
#receiptModal .modal-footer .btn { min-width: 0 !important; }

/* =====================================================================
   Claims
   ===================================================================== */
.gs-claim-lines { border: 1px solid var(--gs-line); border-radius: 14px; overflow: visible; }
.gs-claim-row { display: grid; grid-template-columns: minmax(0, 2.2fr) 130px 90px 120px 120px 38px; gap: 10px; align-items: start; padding: 10px 12px; border-bottom: 1px solid #F0F2F6; }
.gs-claim-row:last-child { border-bottom: 0; }
.gs-claim-head { background: #F8FAFC; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--gs-muted); font-weight: 700; padding: 8px 12px; border-radius: 14px 14px 0 0; }
.gs-claim-row .form-control, .gs-claim-row .cl-unit { min-height: 38px; height: 38px; }
.gs-claim-row .cl-unit { width: 100%; border: 1px solid #DFE4EC; border-radius: var(--gs-radius-sm); padding: 0 8px; font-size: 13px; font-weight: 600; color: var(--gs-ink-2); background: #fff; }
.gs-claim-row .cl-amount { line-height: 38px; color: var(--gs-ink); }
.gs-claim-row .cl-hint { font-size: 11px; color: var(--gs-gold-600); margin-top: 3px; }
.gs-claim-row .btn-remove { width: 38px; height: 38px; border-radius: 10px; border: 1px solid #FEE4E2; background: #FEF3F2; color: #D92D20; display: flex; align-items: center; justify-content: center; padding: 0; }

.gs-claim-billlines { margin-top: 14px; padding: 12px; border-radius: 14px; background: var(--gs-gold-50); border: 1px dashed var(--gs-gold-200); display: flex; flex-wrap: wrap; gap: 8px; }
.gs-claim-billlines .form-label { width: 100%; margin: 0; }
.gs-claim-chip { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--gs-gold-200); background: #fff; border-radius: 10px; padding: 7px 10px; text-align: left; font-size: 12.5px; }
.gs-claim-chip b { color: var(--gs-ink); }
.gs-claim-chip span { color: var(--gs-muted); }
.gs-claim-chip i { color: var(--gs-gold); }
.gs-claim-chip:hover:not(:disabled) { border-color: var(--gs-gold); box-shadow: 0 4px 12px rgba(180, 137, 42, .15); }
.gs-claim-chip:disabled { opacity: .5; }

.gs-claim-side { border: 1px solid var(--gs-line); border-radius: 16px; overflow: hidden; position: sticky; top: 0; }
.gs-claim-acct { padding: 16px; background: linear-gradient(135deg, #0F172A, #1E293B); color: #fff; }
.gs-claim-acct .lbl { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: #94A3B8; font-weight: 700; }
.gs-claim-acct .val { font-size: 24px; font-weight: 800; color: #fff; margin-top: 2px; }
.gs-claim-acct .sub { font-size: 12.5px; color: #CBD5E1; }
.gs-claim-acct.owes .val { color: #FDA29B; }
.gs-claim-acct.credit .val { color: #6CE9A6; }
.gs-claim-extra { margin-top: 12px; padding: 12px; border-radius: 12px; background: #FFFAEB; border: 1px solid #FEDF89; }
.gs-radio { display: flex; gap: 10px; align-items: flex-start; padding: 6px 0; cursor: pointer; margin: 0; }
.gs-radio input { margin-top: 4px; accent-color: var(--gs-gold); }
.gs-radio b { display: block; color: var(--gs-ink); font-size: 13.5px; }
.gs-radio small { color: var(--gs-muted); font-size: 12px; }
.gs-pl-net.neg b { color: #FDA29B; }
@media (max-width: 767.98px) {
    .gs-claim-row { grid-template-columns: 1fr 1fr; }
    .gs-claim-row > :first-child { grid-column: 1 / -1; }
    .gs-claim-head { display: none; }
}

/* Claim line condition + salvage */
.gs-claim-cond { grid-column: 1 / -1; margin-top: -2px; }
.gs-seg-sm { padding: 2px; border-radius: 9px; flex-wrap: wrap; }
.gs-seg-sm button { padding: 4px 10px; font-size: 12px; border-radius: 7px; }
.gs-seg-sm button svg { width: 13px; height: 13px; }
.gs-seg-sm button.active[data-c="write_off"] { background: #B42318; color: #fff; }
.gs-seg-sm button.active[data-c="salvage"] { background: var(--gs-gold-grad); color: #fff; }
.gs-seg-sm button.active[data-c="restock"] { background: #175CD3; color: #fff; }
.gs-seg-sm button:disabled { opacity: .4; cursor: not-allowed; }
.cl-salvage { margin-top: 8px; padding: 10px 12px; border-radius: 12px; background: var(--gs-gold-50); border: 1px dashed var(--gs-gold-200); }
.cl-salv-title { font-size: 12px; font-weight: 700; color: var(--gs-gold-600); margin-bottom: 6px; }
.cl-salv-row { display: grid; grid-template-columns: minmax(0, 1fr) 120px 150px 48px 100px; gap: 10px; align-items: center; padding: 4px 0; font-size: 13px; }
.cl-salv-row .nm { font-weight: 600; color: var(--gs-ink); }
.cl-salv-row .mx { color: var(--gs-muted); font-size: 12px; }
.cl-salv-row .mat-input { position: relative; }
.cl-salv-row .mat-input input { min-height: 34px; height: 34px; padding-right: 40px; font-weight: 700; }
.cl-salv-row .mat-input .u { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-size: 11px; font-weight: 700; color: var(--gs-muted); }
.cl-salv-row .cl-rec-all { border: 1px solid var(--gs-gold-200); background: #fff; color: var(--gs-gold-600); border-radius: 7px; font-size: 11.5px; font-weight: 700; height: 30px; }
.cl-salv-row .vl { text-align: right; font-weight: 700; color: var(--gs-ink-2); }
.cl-salv-row.over .mat-input input { border-color: #D92D20; background: #FEF3F2; }
@media (max-width: 767.98px) { .cl-salv-row { grid-template-columns: 1fr 1fr; } }

/* Process goods rows */
.pg-row { grid-template-columns: minmax(0, 260px) minmax(0, 1fr) !important; align-items: start; }
.pg-row .gs-claim-cond { grid-column: auto; margin-top: 0; }
.pg-row.is-done { background: #FAFBFC; }
.gs-seg-sm button.active[data-c="pending"] { background: #B54708; color: #fff; }
@media (max-width: 767.98px) { .pg-row { grid-template-columns: 1fr !important; } }

/* =====================================================================
   HR: employees, attendance, payroll
   ===================================================================== */
.att-badge {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 4px 10px; border-radius: 999px; border: 1px solid transparent;
    font-size: 12px; font-weight: 600; white-space: nowrap; line-height: 1.3;
}
.att-present { background: #ECFDF3; color: #027A48; border-color: #ABEFC6; }
.att-late { background: #FFFAEB; color: #B54708; border-color: #FEDF89; }
.att-absent { background: #FEF3F2; color: #B42318; border-color: #FECDCA; }
.att-absent-soft { background: #fff; color: #B42318; border-color: #FDA29B; border-style: dashed; }
.att-leave { background: #EFF8FF; color: #175CD3; border-color: #B2DDFF; }
.att-off { background: #F2F4F7; color: #667085; border-color: #EAECF0; }
.att-holiday { background: #F4F3FF; color: #5925DC; border-color: #D9D6FE; }
.att-review { background: #fff; color: #B54708; border-color: #FEC84B; border-style: dashed; }
.att-pending { background: #fff; color: #667085; border-color: #D0D5DD; border-style: dashed; }
.att-src { display: inline-block; margin-left: 4px; padding: 1px 6px; border-radius: 6px; font-size: 10.5px; font-weight: 700; letter-spacing: .02em; vertical-align: middle; }
.att-src.device { background: var(--gs-ink); color: #F3D77A; }
.att-src.manual { background: #F1F5F9; color: var(--gs-muted); }

/* Date bar */
.att-datebar {
    display: flex; flex-wrap: wrap; align-items: center; gap: 16px;
    background: #fff; border: 1px solid var(--gs-line); border-radius: var(--gs-radius);
    box-shadow: var(--gs-shadow); padding: 14px 18px; margin-bottom: 16px; position: relative; overflow: hidden;
}
.att-datebar::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--gs-gold-grad); }
.att-datebar .lbl { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--gs-muted); font-weight: 700; margin-bottom: 4px; }
.att-datebar .att-date-nav { display: flex; align-items: center; gap: 6px; }
.att-datebar .att-date-nav .btn-icon {
    width: 38px; height: 38px; border-radius: 10px; border: 1px solid #DFE4EC; background: #F8FAFC; color: var(--gs-ink);
    display: inline-flex; align-items: center; justify-content: center; padding: 0;
}
.att-datebar .att-date-nav .btn-icon:hover:not(:disabled) { background: var(--gs-gold-50); color: var(--gs-gold-600); border-color: var(--gs-gold-200); }
.att-datebar .att-date-nav .btn-icon:disabled { opacity: .4; }
.att-datebar .att-date-nav .btn-icon svg { width: 16px; height: 16px; }
.att-datebar input[type="date"] { min-width: 170px; font-weight: 700; height: 38px; }
.att-datebar .att-date-big { font-size: 20px; font-weight: 800; color: var(--gs-ink); line-height: 1.2; }
.att-datebar .att-date-tag { display: inline-block; margin-top: 4px; font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 999px; }
.att-datebar .att-date-tag.past { background: #FFFAEB; color: #B54708; }
.att-datebar .att-date-tag.today { background: #ECFDF3; color: #027A48; }
.att-holiday-bar {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
    background: #F9F8FF; border: 1px solid #D9D6FE; border-radius: 12px; padding: 10px 14px; margin-bottom: 14px; color: #42307D;
}
.att-holiday-bar.d-none { display: none !important; }
.att-holiday-bar .ttl { font-weight: 800; font-size: 15px; color: #5925DC; }
.att-holiday-bar .btn { font-size: 12.5px; font-weight: 700; padding: 4px 12px; border-radius: 8px; }
/* Weekly off day picker (employee form) */
.emp-days { display: flex; flex-wrap: wrap; gap: 6px; }
.emp-days .btn { min-width: 52px; font-weight: 700; font-size: 12.5px; padding: 6px 10px; }
.emp-days .btn-check:checked + .btn { background: var(--gs-ink); border-color: var(--gs-ink); color: #F3D77A; }
.emp-off-change { background: #FFFAEB; border: 1px solid #FEDF89; border-radius: 10px; padding: 10px 12px; }
.emp-off-change.d-none { display: none !important; }

/* Filter cards */
.att-stats { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.att-stat {
    background: #fff; border: 1px solid var(--gs-line); border-radius: 12px; padding: 10px 14px;
    cursor: pointer; text-align: left; transition: border-color .15s, box-shadow .15s;
}
.att-stat:hover { border-color: var(--gs-gold-200); }
.att-stat.active { border-color: var(--gs-gold); box-shadow: 0 0 0 3px rgba(180, 137, 42, .14); }
.att-stat .t { font-size: 11.5px; color: var(--gs-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; display: flex; align-items: center; gap: 6px; }
.att-stat .t i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.att-stat .v { font-size: 22px; font-weight: 800; line-height: 1.2; color: var(--gs-ink); margin-top: 2px; }
@media (max-width: 1199.98px) { .att-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .att-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Bulk bar */
.att-bulkbar {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
    background: var(--gs-ink); color: #fff; border-radius: 12px; padding: 8px 12px; margin-bottom: 12px;
}
.att-bulkbar.d-none { display: none !important; }
.att-bulkbar .muted { color: #94A3B8; font-size: 13px; }
.att-bulkbar .btn { font-size: 12.5px; font-weight: 700; padding: 5px 12px; border-radius: 8px; }
.att-bulkbar .btn-link { color: #CBD5E1; text-decoration: none; }

/* Daily sheet */
#attendanceTable td { vertical-align: middle; }
#attendanceTable > thead > tr > th, #attendanceTable > tbody > tr > td { padding-left: 6px; padding-right: 6px; }
#attendanceTable .att-src { margin: 3px 0 0; display: table; }
#attendanceTable .att-seg { flex-wrap: nowrap; }
#attendanceTable .att-seg button { padding: 5px 9px; }
#attendanceTable .att-seg button.active[data-v="present"] { background: #067647; color: #fff; }
#attendanceTable .att-seg button.active[data-v="absent"] { background: #B42318; color: #fff; }
#attendanceTable .att-seg button.active[data-v="leave"] { background: #175CD3; color: #fff; }
#attendanceTable .att-time { width: 108px; min-width: 108px; padding-left: 8px; padding-right: 6px; height: 34px; min-height: 34px; font-weight: 600; }
#attendanceTable .att-remarks { min-width: 80px; height: 34px; min-height: 34px; }
#attendanceTable .att-calc { min-width: 105px; font-size: 12.5px; }
#attendanceTable tr.att-dirty > td { background: #FFFBEB !important; }
#attendanceTable tr.att-dirty > td:first-child { box-shadow: inset 4px 0 0 var(--gs-gold); }
#attendanceTable tr.att-error > td:first-child { box-shadow: inset 4px 0 0 #D92D20; }
#attendanceTable .att-row-error { color: #B42318; font-weight: 600; margin-top: 3px; }
.att-hint { font-size: 12.5px; color: var(--gs-muted); margin-bottom: 10px; }
.att-hint b { color: var(--gs-ink-2); }

/* Calendar */
.att-calendar { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.att-cal-head { text-align: center; font-size: 11.5px; font-weight: 700; color: var(--gs-muted); text-transform: uppercase; letter-spacing: .06em; padding: 4px 0; }
.att-cal-day { min-height: 82px; border: 1px solid var(--gs-line); border-radius: 10px; padding: 6px 8px; font-size: 11px; background: #fff; }
.att-cal-day.clickable { cursor: pointer; transition: border-color .15s, transform .1s; }
.att-cal-day.clickable:hover { border-color: var(--gs-gold); transform: translateY(-1px); }
.att-cal-day .n { font-weight: 800; font-size: 13px; color: var(--gs-ink); display: flex; justify-content: space-between; align-items: center; }
.att-cal-day .s { font-weight: 700; margin-top: 2px; }
.att-cal-day .m { color: var(--gs-muted); margin-top: 1px; }
.att-cal-day.s-present { background: #F6FEF9; border-color: #ABEFC6; }
.att-cal-day.s-present .s { color: #027A48; }
.att-cal-day.s-late { background: #FFFCF5; border-color: #FEDF89; }
.att-cal-day.s-late .s { color: #B54708; }
.att-cal-day.s-absent, .att-cal-day.s-unmarked { background: #FFFBFA; border-color: #FECDCA; }
.att-cal-day.s-absent .s, .att-cal-day.s-unmarked .s { color: #B42318; }
.att-cal-day.s-unmarked { border-style: dashed; }
.att-cal-day.s-leave { background: #F5FAFF; border-color: #B2DDFF; }
.att-cal-day.s-leave .s { color: #175CD3; }
.att-cal-day.s-off_day, .att-cal-day.s-not_tracked { background: #F8FAFC; color: #98A2B3; }
.att-cal-day.s-holiday { background: #F9F8FF; border-color: #D9D6FE; }
.att-cal-day.s-no_activity { background: #FFFCF5; border-color: #FEC84B; border-style: dashed; }
.att-cal-day.s-no_activity .s { color: #B54708; }
.att-holiday-bar.review { background: #FFFCF5; border-color: #FEC84B; color: #7A2E0E; }
.att-holiday-bar.review .ttl { color: #B54708; }
.att-cal-day.s-holiday .s { color: #5925DC; }
.att-cal-day .h { color: #6941C6; margin-top: 1px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.att-cal-day.s-upcoming, .att-cal-day.s-pending { border-style: dashed; color: #98A2B3; }
.att-cal-day.today { box-shadow: inset 0 0 0 2px var(--gs-gold); }
.att-sum { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.att-sum > div { border: 1px solid var(--gs-line); border-radius: 10px; padding: 8px 10px; }
.att-sum .t { font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--gs-muted); font-weight: 700; }
.att-sum .v { font-size: 17px; font-weight: 800; color: var(--gs-ink); }
@media (max-width: 991.98px) { .att-sum { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 767.98px) {
    .att-cal-day { min-height: 54px; padding: 4px; font-size: 10px; }
    .att-cal-day .m { display: none; }
}

/* Mark modal */
.att-status-pick { display: flex; gap: 8px; }
.att-status-pick .btn { flex: 1; font-weight: 700; border-radius: 10px; }
.att-status-pick .btn-check:checked + .btn-outline-success { background: #067647; border-color: #067647; color: #fff; }
.att-status-pick .btn-check:checked + .btn-outline-danger { background: #B42318; border-color: #B42318; color: #fff; }
.att-status-pick .btn-check:checked + .btn-outline-info { background: #175CD3; border-color: #175CD3; color: #fff; }
.att-status-pick .btn-check:checked + .btn-outline-secondary { background: #5925DC; border-color: #5925DC; color: #fff; }
.att-status-pick .btn-check:disabled + .btn { opacity: .35; }
#holidayForm .att-status-pick .btn { font-size: 12.5px; padding-left: 6px; padding-right: 6px; }
.att-preview { border-radius: 10px; padding: 10px 14px; font-size: 13px; background: #F8FAFC; border: 1px solid var(--gs-line); }

/* Employee form sections */
.emp-section { font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--gs-gold-600); font-weight: 700; margin: 6px 0 10px; display: flex; align-items: center; gap: 8px; }
.emp-section::after { content: ""; flex: 1; height: 1px; background: var(--gs-line); }
.emp-hint { font-size: 12px; color: var(--gs-muted); margin-top: 4px; }

/* Generate salary */
#generateSalaryModal .modal-dialog { max-width: min(1400px, 96vw); }
#generateSalaryModal .modal-content { max-height: calc(100vh - 3.5rem); }
#generateSalaryForm { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; overflow: hidden; }
#generateSalaryForm .modal-body { overflow-y: auto; }
#generateTable th { white-space: nowrap; font-size: 12px; }
#generateTable input.form-control { height: 34px; min-height: 34px; text-align: right; font-weight: 600; min-width: 100px; }
#generateTable tr.gen-generated > td { opacity: .55; }
.gen-review { font-size: 11.5px; font-weight: 600; border: 0; background: none; padding: 0; color: var(--gs-gold-600); }
.gen-review:disabled { color: var(--gs-muted); cursor: default; }
.gen-detail > td { background: #FAFBFC !important; }
.gen-detail table td, .gen-detail table th { font-size: 12.5px; }
.gen-detail tr.waived td { color: #98A2B3; }
.gen-detail tr.waived .desc, .gen-detail tr.waived .amt { text-decoration: line-through; }
.pay-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.pay-tiles > div { border: 1px solid var(--gs-line); border-radius: 10px; padding: 8px 12px; }
.pay-tiles .t { font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--gs-muted); font-weight: 700; }
.pay-tiles .v { font-size: 16px; font-weight: 800; }
@media (max-width: 767.98px) { .pay-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* =====================================================================
   Cash & Bank accounts, Daily Book
   ===================================================================== */
.gs-acct-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; }
.gs-acct {
    background: #fff; border: 1px solid var(--gs-line); border-radius: var(--gs-radius); box-shadow: var(--gs-shadow);
    padding: 16px 18px; display: flex; flex-direction: column; gap: 14px; position: relative; overflow: hidden;
    border-top: 3px solid var(--gs-ink-2);
}
.gs-acct.gs-acct-cash { border-top-color: var(--gs-gold); }
.gs-acct.is-inactive { opacity: .6; }
.gs-acct-head { display: flex; align-items: center; gap: 12px; }
.gs-acct-icon, .gs-acct-dot {
    width: 42px; height: 42px; border-radius: 12px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center; background: #EEF2F7; color: var(--gs-ink-2);
}
.gs-acct-icon svg { width: 20px; height: 20px; }
.gs-acct-cash .gs-acct-icon, .gs-acct-dot.gs-acct-cash { background: var(--gs-gold-50); color: var(--gs-gold-600); }
.gs-acct-dot { width: 32px; height: 32px; border-radius: 9px; }
.gs-acct-dot svg { width: 15px; height: 15px; }
.gs-acct-name { font-weight: 700; color: var(--gs-ink); font-size: 15px; line-height: 1.3; }
.gs-acct-bal { display: flex; flex-direction: column; }
.gs-acct-bal span { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--gs-muted); font-weight: 700; }
.gs-acct-bal b { font-size: 26px; font-weight: 800; color: var(--gs-ink); line-height: 1.2; }
.gs-acct-bal b.neg { color: #D92D20; }
.gs-acct-moves { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.gs-acct-moves > div { background: #F8FAFC; border-radius: 10px; padding: 8px 10px; display: flex; flex-wrap: wrap; gap: 2px 8px; font-size: 12.5px; }
.gs-acct-moves span { width: 100%; font-size: 11px; color: var(--gs-muted); font-weight: 600; }
.gs-acct-link { font-size: 13px; font-weight: 600; display: inline-flex; align-items: center; gap: 4px; margin-top: -4px; }
.gs-acct-link svg { width: 14px; height: 14px; }
.gs-acct-add {
    border: 1.5px dashed var(--gs-gold-200); background: var(--gs-gold-50); box-shadow: none; border-top-width: 1.5px;
    align-items: center; justify-content: center; text-align: center; gap: 4px; min-height: 210px; color: var(--gs-gold-600);
}
.gs-acct-add svg { width: 26px; height: 26px; }
.gs-acct-add b { color: var(--gs-ink); }
.gs-acct-add span { font-size: 12.5px; color: var(--gs-muted); }
.gs-acct-add:hover { border-color: var(--gs-gold); }

.gs-transfer { display: grid; grid-template-columns: 1fr 34px 1fr; gap: 10px; align-items: start; padding: 14px; border-radius: 14px; background: #F8FAFC; border: 1px solid var(--gs-line); }
.gs-transfer-arrow { display: flex; align-items: center; justify-content: center; height: 34px; width: 34px; margin-top: 28px; border-radius: 50%; background: var(--gs-ink); color: #F3D77A; }
.gs-transfer-arrow svg { width: 16px; height: 16px; }
@media (max-width: 575.98px) { .gs-transfer { grid-template-columns: 1fr; } .gs-transfer-arrow { margin: 0 auto; transform: rotate(90deg); } }

/* Period filter (statements, dashboard) */
.gs-period-bar {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
    background: #fff; border: 1px solid var(--gs-line); border-radius: var(--gs-radius); box-shadow: var(--gs-shadow); padding: 10px 14px;
}
.gs-period-presets { display: flex; flex-wrap: wrap; gap: 6px; }
.gs-period-presets .gs-chip { border: 1px solid transparent; }
.gs-period-presets .gs-chip:hover { border-color: var(--gs-gold-200); color: var(--gs-gold-600); }
.gs-period-range { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--gs-muted); }
.gs-period-range input { width: 150px; }
a.gs-chip:hover { color: var(--gs-gold-600); }

/* Daily book filter bar */
.gs-book-bar { justify-content: space-between; align-items: flex-start; }
.gs-book-filters { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.gs-book-filters input[type="date"] { min-width: 0; width: 150px; height: 40px; }
.gs-book-filter-wide { width: 190px; }
@media (max-width: 767.98px) { .gs-book-filters > div, .gs-book-filter-wide, .gs-book-filters input[type="date"] { width: 100%; } }

.gs-book-table td { font-size: 13px; }
.gs-book-table .gs-book-opening td { background: #F8FAFC; font-weight: 700; color: var(--gs-ink-2); }
.gs-book-table tfoot td, .gs-book-total td { background: #F8FAFC; font-weight: 800; color: var(--gs-ink); border-top: 2px solid var(--gs-line); padding: 12px 14px; }
.gs-bar.gs-bar-in span { background: linear-gradient(90deg, #32D583, #12B76A); }
.gs-bar.gs-bar-out span { background: linear-gradient(90deg, #FDA29B, #F04438); }
a.gs-bar-row:hover .gs-name { color: var(--gs-gold-600); }

/* Dashboard: snapshot, cash card, donuts, tabs */
.gs-dash-period { font-size: 16px; font-weight: 800; color: var(--gs-ink); line-height: 1.2; }
.gs-card-link { font-size: 13px; font-weight: 600; display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.gs-card-link svg { width: 14px; height: 14px; }
.card .card-header .gs-sku { margin-top: 2px; }

.gs-snap-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.gs-snap {
    display: block; color: inherit; border: 1px solid var(--gs-line); border-radius: 12px; padding: 14px;
    background: linear-gradient(180deg, #fff 0%, #FBFCFE 100%); transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.gs-snap:hover { color: inherit; border-color: var(--gs-gold-200); box-shadow: 0 10px 24px rgba(15, 23, 42, .07); transform: translateY(-1px); }
.gs-snap-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.gs-snap-icon { width: 36px; height: 36px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--gs-gold-50); color: var(--gs-gold-600); }
.gs-snap-icon svg { width: 18px; height: 18px; }
.gs-snap-icon.green { background: #ECFDF3; color: #039855; }
.gs-snap-icon.red { background: #FEF3F2; color: #D92D20; }
.gs-snap-icon.ink { background: #EEF2F7; color: var(--gs-ink-2); }
.gs-snap-label { font-size: 12px; color: var(--gs-muted); font-weight: 600; }
.gs-snap-value { font-size: 19px; font-weight: 800; color: var(--gs-ink); line-height: 1.25; margin: 2px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-trend { font-size: 11px; font-weight: 700; padding: 3px 7px; border-radius: 999px; white-space: nowrap; }
.gs-trend.good { background: #ECFDF3; color: #027A48; }
.gs-trend.bad { background: #FEF3F2; color: #B42318; }
@media (max-width: 1399.98px) { .gs-snap-value { font-size: 17px; } }
@media (max-width: 767.98px) { .gs-snap-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.gs-cash-total {
    border-radius: 14px; padding: 16px; margin-bottom: 10px; color: #fff; position: relative; overflow: hidden;
    background: radial-gradient(circle at 90% 10%, rgba(212, 175, 55, .22), transparent 45%), linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
}
.gs-cash-total > span { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #94A3B8; font-weight: 700; }
.gs-cash-total > b { display: block; font-size: 26px; font-weight: 800; color: #F3D77A; line-height: 1.2; margin: 2px 0 10px; }
.gs-cash-total > b.neg { color: #FDA29B; }
.gs-cash-flow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; border-top: 1px solid rgba(255, 255, 255, .1); padding-top: 10px; }
.gs-cash-flow small { display: block; font-size: 10.5px; color: #94A3B8; text-transform: uppercase; letter-spacing: .06em; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-cash-flow em { font-style: normal; font-weight: 800; font-size: 14px; }
.gs-cash-flow em.in { color: #6CE9A6; }
.gs-cash-flow em.out { color: #FDA29B; }

.gs-donut { margin: -6px auto 6px; max-width: 260px; }
.gs-legend-row { display: grid; grid-template-columns: 1fr auto 42px; gap: 8px; align-items: center; padding: 7px 0; border-bottom: 1px dashed #EEF1F5; font-size: 13px; }
.gs-legend-row:last-child { border-bottom: 0; }
.gs-legend-row span { display: inline-flex; align-items: center; gap: 8px; color: var(--gs-text); }
.gs-legend-row i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.gs-legend-row b { color: var(--gs-ink); }
.gs-legend-row small { color: var(--gs-muted); text-align: right; }
a.gs-legend-row:hover span { color: var(--gs-gold-600); }

.gs-mini-table thead th { padding: 9px 14px; font-size: 10.5px; }
.gs-mini-table tbody td { padding: 9px 14px; font-size: 13px; }
.gs-ledger-sum { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-bottom: 1px solid var(--gs-line); }
.gs-ledger-sum small { display: block; font-size: 11px; color: var(--gs-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; }
.gs-ledger-sum b { font-size: 18px; font-weight: 800; }

.gs-stock-values { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.gs-stock-values a { display: block; background: #F8FAFC; border: 1px solid var(--gs-line); border-radius: 10px; padding: 8px 10px; color: inherit; }
.gs-stock-values a:hover { border-color: var(--gs-gold-200); }
.gs-stock-values small { display: block; font-size: 11px; color: var(--gs-muted); font-weight: 600; }
.gs-stock-values b { color: var(--gs-ink); font-size: 14px; }
.gs-feed-avatar.red { background: #FEF3F2; color: #D92D20; }
.gs-rank { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 6px; background: var(--gs-ink); color: #F3D77A; font-size: 11px; font-weight: 800; margin-right: 8px; }
.gs-flow-dot { width: 30px; height: 30px; border-radius: 9px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; }
.gs-flow-dot svg { width: 15px; height: 15px; }
.gs-flow-dot.in { background: #ECFDF3; color: #039855; }
.gs-flow-dot.out { background: #FEF3F2; color: #D92D20; }
.min-w-0 { min-width: 0; }
.gs-acct-preview { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; padding: 10px 12px; border-radius: 10px; background: var(--gs-gold-50); border: 1px dashed var(--gs-gold-200); }
.gs-acct-preview span { font-size: 12px; color: var(--gs-muted); font-weight: 600; }
.gs-acct-preview b { color: var(--gs-ink); font-size: 13.5px; }