/* =====================================================================
   GCL System - Genar theme on top of AdminLTE 3
   Colours come from CSS variables set in the layout (Company Setup > Appearance)
   Defaults follow the Genar document sample: blue #3f48cc, orange #ff7f27, navy #223c90
   ===================================================================== */
:root {
  --gcl-primary: #3f48cc; --gcl-primary-dark: #333ba7; --gcl-primary-light: #eceefa;
  --gcl-accent: #ff7f27;  --gcl-accent-dark: #d96c21;  --gcl-accent-light: #ffeee2;
  --gcl-sidebar: #223c90; --gcl-sidebar-dark: #1a2f70; --gcl-sidebar-text: #ffffff;
}

body { font-family: "Source Sans Pro", "Segoe UI", -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif; }
a { color: var(--gcl-primary); }
a:hover { color: var(--gcl-primary-dark); }

/* ---------- Buttons / utilities ---------- */
.btn-primary { background: var(--gcl-primary); border-color: var(--gcl-primary); }
.btn-primary:hover, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled):active { background: var(--gcl-primary-dark); border-color: var(--gcl-primary-dark); }
.btn-accent { background: var(--gcl-accent); border-color: var(--gcl-accent); color: #fff; }
.btn-accent:hover, .btn-accent:focus { background: var(--gcl-accent-dark); border-color: var(--gcl-accent-dark); color: #fff; }
.btn-outline-primary { color: var(--gcl-primary); border-color: var(--gcl-primary); }
.btn-outline-primary:hover { background: var(--gcl-primary); border-color: var(--gcl-primary); }
.btn-outline-accent { color: var(--gcl-accent); border-color: var(--gcl-accent); }
.btn-outline-accent:hover { background: var(--gcl-accent); color: #fff; }
.bg-primary, .badge-primary { background-color: var(--gcl-primary) !important; }
.bg-accent { background-color: var(--gcl-accent) !important; color: #fff !important; }
.bg-accent-light { background-color: var(--gcl-accent-light) !important; }
.text-primary { color: var(--gcl-primary) !important; }
.text-accent { color: var(--gcl-accent) !important; }
.border-accent { border-color: var(--gcl-accent) !important; }
.card-primary.card-outline { border-top: 3px solid var(--gcl-primary); }
.card-accent.card-outline { border-top: 3px solid var(--gcl-accent); }
.card-primary:not(.card-outline) > .card-header { background: var(--gcl-primary); }
.card-accent:not(.card-outline) > .card-header { background: var(--gcl-accent); color: #fff; }
.custom-control-input:checked ~ .custom-control-label::before { background-color: var(--gcl-primary); border-color: var(--gcl-primary); }
.custom-switch .custom-control-input:checked ~ .custom-control-label::before { background-color: var(--gcl-accent); border-color: var(--gcl-accent); }
.page-item.active .page-link { background-color: var(--gcl-primary); border-color: var(--gcl-primary); }
.page-link { color: var(--gcl-primary); }
.form-control:focus, .custom-select:focus { border-color: var(--gcl-accent); box-shadow: 0 0 0 .15rem rgba(255,127,39,.2); }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background-color: var(--gcl-primary); }
.nav-tabs .nav-link.active { border-top: 3px solid var(--gcl-accent); font-weight: 600; }

/* ---------- Navbar ---------- */
.main-header { border-bottom: 3px solid var(--gcl-accent) !important; }
.gcl-navbar-primary { background: var(--gcl-primary); }
.gcl-navbar-dark { background: var(--gcl-sidebar-dark); }
.gcl-slogan { font-style: italic; color: var(--gcl-accent) !important; font-weight: 600; }
.gcl-avatar { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%;
  background: var(--gcl-accent); color: #fff; font-weight: 700; font-size: 12px; }
.gcl-avatar-lg { width: 72px; height: 72px; font-size: 26px; border: 3px solid rgba(255,255,255,.5); }
.gcl-user-header { background: var(--gcl-primary) !important; color: #fff; height: auto !important; padding: 15px !important; }
.user-menu .dropdown-menu > li.user-header > p { color: #fff; }

/* ---------- Sidebar ---------- */
.gcl-sidebar, .gcl-sidebar .sidebar { background: var(--gcl-sidebar); }
.gcl-sidebar.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link,
.gcl-sidebar.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link,
.gcl-sidebar.sidebar-dark-primary .nav-header { color: var(--gcl-sidebar-text); }
.gcl-sidebar .nav-header { opacity: .65; font-size: .75rem; letter-spacing: .08em; }
.gcl-sidebar .nav-sidebar > .nav-item > .nav-link.active,
.gcl-sidebar.sidebar-light-primary .nav-sidebar > .nav-item > .nav-link.active { background: var(--gcl-accent) !important; color: #fff !important; box-shadow: 0 2px 6px rgba(0,0,0,.2); }
.gcl-sidebar .nav-treeview > .nav-item > .nav-link.active { background: rgba(255,255,255,.14) !important; color: #fff !important; border-left: 3px solid var(--gcl-accent); }
.gcl-sidebar.sidebar-light-primary .nav-treeview > .nav-item > .nav-link.active { background: var(--gcl-accent-light) !important; color: #333 !important; }
.gcl-sidebar .nav-sidebar .nav-link:hover { background: rgba(255,255,255,.08); }
/* Sidebar brand: logo on top, company name below */
.gcl-brand { background: #fff !important; border-bottom: 3px solid var(--gcl-accent) !important; padding: 8px 8px 6px !important;
  display: flex !important; flex-direction: column; align-items: center; justify-content: center; text-align: center; white-space: normal !important; overflow: hidden; }
.gcl-brand .brand-full { max-height: 52px; max-width: 190px; display: block; }
.gcl-brand .brand-icon { max-height: 44px; }
.gcl-brand .brand-mini { display: none; max-height: 34px; }
.gcl-brand .brand-name { display: block; margin-top: 5px; color: var(--gcl-sidebar) !important; font-weight: 700; font-size: .92rem;
  line-height: 1.15; letter-spacing: .2px; max-width: 220px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gcl-brand:hover .brand-name { color: var(--gcl-accent) !important; }
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .gcl-brand .brand-full,
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .gcl-brand .brand-name { display: none; }
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .gcl-brand .brand-mini { display: block; }
.wrapper .gcl-sidebar .brand-link.gcl-brand { height: 100px !important; }
.layout-fixed .wrapper .gcl-sidebar .sidebar { margin-top: 100px !important; height: calc(100vh - 100px) !important; }
/* Logo only (default): shorter brand area with a larger logo */
.wrapper .gcl-sidebar .brand-link.gcl-brand-logo { height: 80px !important; }
.gcl-brand-logo .brand-full { max-height: 62px; max-width: 210px; }
.layout-fixed .wrapper .gcl-sidebar .gcl-brand-logo ~ .sidebar { margin-top: 80px !important; height: calc(100vh - 80px) !important; }
.dark-mode .gcl-brand { background: #fff !important; }

/* ---------- Content ---------- */
.content-wrapper { background: #f5f6fa; }
.gcl-page-title { font-size: 1.45rem; color: var(--gcl-primary); font-weight: 600; }
.dark-mode .gcl-page-title { color: #fff; }
.card { border-radius: .4rem; }
.card-title { font-weight: 600; }
.table thead th { border-bottom-width: 1px; }
.table-gcl thead th { background: var(--gcl-accent); color: #fff; border-color: var(--gcl-accent); font-weight: 600; white-space: nowrap; }
.table-gcl-soft thead th { background: var(--gcl-accent-light); color: #333; border: 1px solid var(--gcl-accent); }
.small-box .icon > i { font-size: 60px; top: 18px; }
.small-box.bg-gcl-blue { background: var(--gcl-primary); color: #fff; }
.small-box.bg-gcl-orange { background: var(--gcl-accent); color: #fff; }
.small-box.bg-gcl-navy { background: var(--gcl-sidebar); color: #fff; }
.small-box.bg-gcl-green { background: #20a464; color: #fff; }
.small-box > .small-box-footer { background: rgba(0,0,0,.12); }
.info-box-icon.bg-accent { color: #fff; }
.badge { font-weight: 600; }
.dataTables_wrapper .dataTables_filter input { border-radius: .25rem; }
.select2-container--bootstrap4 .select2-selection { min-height: calc(2.25rem + 2px); }
.text-sm .select2-container--bootstrap4 .select2-selection { min-height: calc(1.8rem + 2px); }

/* ---------- Footer band (from the document sample) ---------- */
.gcl-footer { padding: 0 !important; border-top: 0 !important; background: transparent; }
.gcl-footer-band { display: flex; align-items: stretch; min-height: 42px; background: var(--gcl-primary); color: #fff; box-shadow: inset 0 -4px 0 #c3c3c3; }
.gcl-footer-left { flex: 1; padding: 10px 16px; font-size: .9rem; }
.gcl-footer-block { width: 70px; background: var(--gcl-accent); border-left: 3px solid #fff; border-right: 3px solid #fff; }
.gcl-footer-right { width: 140px; padding: 10px 16px; text-align: right; font-size: .85rem; }
.dark-mode .gcl-footer { background: transparent; }

/* ---------- Auth / installer ---------- */
.gcl-auth-page { min-height: 100vh; background: #f5f6fa; display: flex; flex-direction: column; }
.gcl-auth-wrap { flex: 1; display: flex; align-items: center; justify-content: center; padding: 30px 15px; }
.gcl-auth-box { width: 100%; max-width: 410px; }
.gcl-auth-box.wide { max-width: 760px; }
.gcl-auth-card { border-top: 4px solid var(--gcl-accent); border-radius: .5rem; box-shadow: 0 10px 30px rgba(34,60,144,.12); }
.gcl-auth-logo { text-align: center; margin-bottom: 18px; }
.gcl-auth-logo img { max-height: 90px; max-width: 260px; }
.gcl-auth-title { color: var(--gcl-accent); font-weight: 300; font-size: 1.8rem; }
.gcl-auth-band { margin-top: auto; }

/* ---------- BoM editor ---------- */
.bom-section { border-left: 4px solid var(--gcl-accent); }
.bom-section .card-header { background: var(--gcl-accent-light); }
.bom-table th { background: var(--gcl-accent); color: #fff; font-weight: 600; font-size: .85rem; white-space: nowrap; vertical-align: middle !important; }
.bom-table td { vertical-align: top; padding: .3rem; }
.bom-table .form-control { padding: .25rem .4rem; height: auto; font-size: .9rem; }
.bom-table textarea.form-control { min-height: 34px; resize: vertical; overflow: hidden; }
.bom-table tr.row-heading td { background: #f3f4fb; }
.bom-table tr.row-heading textarea { font-weight: 700; text-transform: uppercase; }
.bom-table tr.row-note td { background: #fffaf5; }
.bom-table tr.row-note textarea { font-style: italic; }
.bom-table .amount-cell { text-align: right; font-weight: 600; white-space: nowrap; padding-top: .55rem; }
.bom-table .drag-handle { cursor: grab; color: #aaa; padding-top: .5rem; text-align: center; }
.bom-table .sortable-ghost { opacity: .4; background: var(--gcl-accent-light); }
.bom-totals th, .bom-totals td { padding: .45rem .75rem; }
.bom-totals tr.grand { background: var(--gcl-accent-light); font-weight: 700; font-size: 1.05rem; }
.bom-sticky { position: sticky; top: 70px; }
.row-type-badge { font-size: .65rem; display: block; text-align: center; margin-top: 6px; }

/* ---------- BoM preview (web view of document) ---------- */
.doc-preview { background: #fff; max-width: 1000px; margin: 0 auto; padding: 28px 34px; box-shadow: 0 2px 14px rgba(0,0,0,.08); color: #333; }
.doc-preview .doc-title { color: var(--gcl-accent); font-size: 2rem; font-weight: 300; margin: 0; }
.doc-preview .doc-logo { max-height: 80px; max-width: 220px; }
.doc-preview .doc-info th { background: var(--gcl-accent-light); border: 1px solid var(--gcl-accent) !important; text-align: center; font-size: .85rem; }
.doc-preview .doc-info td { border: 1px solid var(--gcl-accent) !important; text-align: center; font-size: .9rem; }
.doc-preview table.doc-items { font-size: .88rem; }
.doc-preview table.doc-items thead th { background: var(--gcl-accent); color: #fff; border: 1px solid var(--gcl-accent); }
.doc-preview table.doc-items td { border: 1px solid #f3c9ab; }
.doc-preview tr.sec-row td { background: var(--gcl-accent-light); font-weight: 700; }
.doc-preview tr.head-row td { font-weight: 700; text-decoration: underline; }
.doc-preview tr.note-row td { font-style: italic; }
.doc-preview tr.total-row td { background: var(--gcl-accent-light); font-weight: 700; }
.doc-preview .doc-summary td, .doc-preview .doc-summary th { border: 1px solid #f3c9ab; }
.doc-preview .doc-summary tr.alt td { background: var(--gcl-accent-light); }
.doc-preview .doc-summary tr.grand td { background: var(--gcl-accent-light); font-weight: 700; }
.doc-preview .doc-project { text-align: center; font-weight: 700; color: var(--gcl-sidebar); font-size: 1.05rem; margin: 18px 0 10px; text-transform: uppercase; }

@media print {
  .main-sidebar, .main-header, .main-footer, .content-header, .no-print { display: none !important; }
  .content-wrapper { margin: 0 !important; background: #fff; }
  .doc-preview { box-shadow: none; padding: 0; }
}
.bom-totals th { white-space: nowrap; font-size: .88rem; }
.bom-totals td { font-size: .9rem; }