/* =========================================================
   Standard theme for the whole software (2026-10)
   Two-tone: Navy (#1b2a49 / sidebar #14213d) + Orange (#f28c28)
   Loaded last from includes/head.php so it overrides old skins.
   ========================================================= */
:root {
    --tt-navy: #1b2a49;
    --tt-navy-2: #2d4373;
    --tt-navy-soft: #eef1f7;
    --tt-orange: #f28c28;
    --tt-orange-dark: #d9761a;
    --tt-orange-soft: #fef3e7;
    --tt-muted: #6b7a90;
    --tt-line: #e3e8f1;
    --tt-page: #f4f6fb;
    --sb-bg: #14213d;
    --sb-text: #c9d2e3;
    --sb-muted: #8a99b5;
    --sb-line: rgba(255,255,255,.09);
}

/* ---- old colour skins (pink / purple / blue ...) -> standard ---- */
body[class*="theme-"] ::selection { background: var(--tt-navy); color: #fff; }
body[class*="theme-"] .page-loader-wrapper { background: var(--tt-navy) !important; }
body[class*="theme-"]:before, body[class*="theme-"]:after,
body[class*="theme-"] #wrapper:before, body[class*="theme-"] #wrapper:after { background: var(--tt-navy) !important; }
body[class*="theme-"] .navbar-nav ul.menu-icon { background: var(--tt-navy) !important; }
body[class*="theme-"] .fancy-checkbox input[type="checkbox"]:checked + span:before { background: var(--tt-navy) !important; border-color: var(--tt-navy) !important; }
body[class*="theme-"] .auth-main .btn-primary { background: var(--tt-navy) !important; border-color: var(--tt-navy) !important; }

/* ---- page background ---- */
#main-content { background: var(--tt-page) !important; }

/* ---- dark sidebar ---- */
body #left-sidebar.sidebar, body #left-sidebar .sidebar-scroll { background: var(--sb-bg) !important; border-right: 0 !important; }
#left-sidebar .user-account, #left-sidebar .user-account span, #left-sidebar .user-account small { color: var(--sb-muted) !important; }
#left-sidebar .user-account .user-name, #left-sidebar .user-account strong, #left-sidebar .user-account h6 { color: #fff !important; }
#left-sidebar .user-account hr { border-color: var(--sb-line) !important; }
#left-sidebar .user-photo { border: 2px solid rgba(255,255,255,.18) !important; }
#left-sidebar .nav-tabs { border-bottom-color: var(--sb-line) !important; }
#left-sidebar .nav-tabs .nav-link { color: var(--sb-muted) !important; background: transparent !important; border-color: transparent !important; }
#left-sidebar .nav-tabs .nav-link.active, #left-sidebar .nav-tabs .nav-link:hover { color: #fff !important; border-bottom: 2px solid var(--tt-orange) !important; }
#left-sidebar .main-menu a { color: var(--sb-text) !important; background: transparent !important; border-left-color: transparent !important; }
#left-sidebar .main-menu a i { color: var(--sb-muted) !important; }
#left-sidebar .main-menu a:hover { background: rgba(255,255,255,.06) !important; color: #fff !important; }
#left-sidebar .main-menu a:hover i { color: #fff !important; }
#left-sidebar .main-menu li.active > a { background: rgba(242,140,40,.15) !important; color: #fff !important; border-left: 4px solid var(--tt-orange) !important; font-weight: 600; }
#left-sidebar .main-menu li.active > a i { color: var(--tt-orange) !important; }
#left-sidebar .main-menu ul { background: rgba(0,0,0,.15) !important; }
#left-sidebar .main-menu ul a { color: #aab6cc !important; }
#left-sidebar .main-menu .has-arrow:after { border-color: var(--sb-muted) !important; }

/* ---- light top bar ---- */
nav.navbar { background: #fff !important; border-bottom: 1px solid var(--tt-line); box-shadow: 0 1px 2px rgba(27,42,73,.04); }
nav.navbar .navbar-nav > li > a.btn-outline-dark { border: 1px solid #d3dae8 !important; border-radius: 8px !important; color: var(--tt-navy) !important; background: #fff !important; transition: all .15s; }
nav.navbar .navbar-nav > li > a.btn-outline-dark:hover { background: var(--tt-navy) !important; border-color: var(--tt-navy) !important; color: #fff !important; }
nav.navbar .navbar-nav > li > a.icon-menu i { color: var(--tt-navy) !important; }
@media (min-width: 1200px) {
    body nav.navbar.navbar-fixed-top { background: linear-gradient(to right, var(--sb-bg) 0, var(--sb-bg) 255px, #fff 255px) !important; }
    nav.navbar .navbar-brand span { color: #fff !important; font-weight: 600; }
    nav.navbar .navbar-btn .btn-toggle-offcanvas { color: #fff !important; }
}

/* ---- headings ---- */
.block-header h2 { color: var(--tt-navy); font-weight: 700; }

/* ---- buttons (green / red / yellow keep their meaning) ---- */
.btn { border-radius: 6px; }
.btn-primary { background: var(--tt-navy) !important; border-color: var(--tt-navy) !important; color: #fff !important; }
.btn-primary:hover, .btn-primary:focus { background: var(--tt-navy-2) !important; border-color: var(--tt-navy-2) !important; }
.btn-info { background: var(--tt-orange) !important; border-color: var(--tt-orange) !important; color: #fff !important; }
.btn-info:hover, .btn-info:focus { background: var(--tt-orange-dark) !important; border-color: var(--tt-orange-dark) !important; }
.btn-outline-primary { color: var(--tt-navy) !important; border-color: var(--tt-navy) !important; }
.btn-outline-primary:hover { background: var(--tt-navy) !important; color: #fff !important; }

/* ---- cards ---- */
#main-content .card { border: 1px solid var(--tt-line); border-radius: 12px; box-shadow: 0 1px 2px rgba(16,24,40,.04); }
#main-content .card .header h2 { color: var(--tt-navy); }

/* ---- tables ---- */
#main-content .table thead th, #main-content .thead-dark th { background: var(--tt-navy) !important; color: #fff !important; border-color: var(--tt-navy) !important; }
#main-content .table-hover tbody tr:hover { background: var(--tt-navy-soft); }

/* ---- forms ---- */
.form-control:focus { border-color: var(--tt-navy-2) !important; box-shadow: 0 0 0 .15rem rgba(45,67,115,.15) !important; }

/* ---- pagination / badges / links ---- */
.page-item.active .page-link { background: var(--tt-navy) !important; border-color: var(--tt-navy) !important; }
.page-link { color: var(--tt-navy); }
.badge-primary { background: var(--tt-navy) !important; }
.badge-info { background: var(--tt-orange) !important; }
/* ---- POS screen (pos.php has its own green styles) ---- */
body .pos-main-header { background: var(--tt-navy) !important; }
body .pos-user-icon, body .product-search-icon { color: var(--tt-navy) !important; }
body .btn-green, body .badge-green, body .bg-green { background-color: var(--tt-navy) !important; border-color: var(--tt-navy) !important; color: #fff !important; }
body .btn-green:hover { background-color: var(--tt-navy-2) !important; border-color: var(--tt-navy-2) !important; }
body .text-green { color: var(--tt-navy) !important; }
body .btn-green.submit_form1, body #submit_form1 { background-color: var(--tt-orange) !important; border-color: var(--tt-orange) !important; }
body .btn-green.submit_form1:hover, body #submit_form1:hover { background-color: var(--tt-orange-dark) !important; border-color: var(--tt-orange-dark) !important; }
body .add-customer-btn { background: var(--tt-orange) !important; color: #fff !important; }
body .pos-order { border-color: #c9d3e6 !important; background-color: var(--tt-navy-soft) !important; }
body .pos-customer-select:focus, body .pos-date-input:focus { border-color: var(--tt-navy-2) !important; box-shadow: 0 0 0 3px rgba(45,67,115,.12) !important; }
body .cart-div [style*="#0d6efd"] { background: var(--tt-navy) !important; }body .product-add-btn { background: var(--tt-orange) !important; border-color: var(--tt-orange) !important; color: #fff !important; }
body .product-price, body .product-price *, body .available-qty { color: var(--tt-navy) !important; }
/* ---- View Table Status: keep the software's original colours (2026-10-09) ---- */
body #dinein_items .btn-green, body #content .btn-green { background-color: #26b68f !important; border-color: #26b68f !important; color: #fff !important; }
body #dinein_items .btn-green:hover, body #content .btn-green:hover { background-color: #179c78 !important; border-color: #179c78 !important; }
body #content .btn-primary { background-color: #ae69f5 !important; border-color: #ae69f5 !important; color: #fff !important; }
body #content .pos-order { border: 1.5px solid #26b68f !important; background-color: #e4f1ee !important; }
body .pos-main-header #active_frames, body #dinein_items .badge-green { background-color: #26b68f !important; border-color: #26b68f !important; }
body .pos-main-header #active_centuries, body #dinein_items .badge-primary { background-color: #ae69f5 !important; border-color: #ae69f5 !important; }