/* ═══════════════════════════════════════════════════════════════
   ALMIGHWARI ENTERPRISE — نظام الهوية البصرية
   أعمال المغواري التجارية | مواد البناء والكهرباء والنجارة
   عطبرة، ولاية نهر النيل، السودان
   هاتف: 249910210629+

   PALETTE:
   ── Navy Deep  #0F1B2F  | كحلي عميق
   ── Navy       #1A2B4A  | كحلي رئيسي
   ── Navy Light #243660  | كحلي فاتح
   ── Gold       #C8860A  | ذهبي رئيسي
   ── Gold Light #E8A020  | ذهبي فاتح
   ── Amber      #F0A030  | عنبري
   ── Gold Pale  #FFF3D0  | ذهبي شاحب
   ── Steel      #4A5568  | رمادي صلبي
   ── Light      #F4F6FA  | فاتح خلفية
═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;600;700;900&family=Tajawal:wght@300;400;700;800&display=swap');

/* ── Variables ── */
:root {
  --am-navy-deep:  #0F1B2F;
  --am-navy:       #1A2B4A;
  --am-navy-light: #243660;
  --am-gold:       #C8860A;
  --am-gold-light: #E8A020;
  --am-amber:      #F0A030;
  --am-gold-pale:  #FFF3D0;
  --am-gold-glow:  rgba(200,134,10,0.30);
  --am-steel:      #4A5568;
  --am-steel-lt:   #6B7A8D;
  --am-light:      #F4F6FA;
  --am-border:     #E2E6EE;
  --am-white:      #FFFFFF;

  /* Semantic */
  --am-success: #1A8C52;
  --am-danger:  #C0392B;
  --am-warning: #E8A020;
  --am-info:    #2471A3;

  /* Shadows */
  --am-sh-sm:   0 2px 8px rgba(26,43,74,0.09);
  --am-sh-md:   0 6px 24px rgba(26,43,74,0.14);
  --am-sh-lg:   0 16px 48px rgba(26,43,74,0.18);
  --am-sh-gold: 0 6px 22px rgba(200,134,10,0.32);

  /* Misc */
  --am-r-sm: 6px;
  --am-r-md: 12px;
  --am-r-lg: 20px;
  --am-ease: all 0.3s cubic-bezier(0.4,0,0.2,1);
  --am-font: 'Cairo','Tajawal',sans-serif;

  /* Override existing lemon variables */
  --lemon-dark-primary:   #C8860A !important;
  --lemon-dark-secondary: #E8A020 !important;
  --lemon-dark-accent:    #B07808 !important;
  --lemon-dark-darker:    #9A6606 !important;
  --lemon-dark-light:     #F0A030 !important;
  --lemon-dark-text:      #1A2B4A !important;
  --lemon-dark-border:    #C8860A !important;
  --lemon-dark-bg:        #FFF8E8 !important;
  --card-shadow:          0 4px 20px rgba(26,43,74,0.10) !important;
  --card-hover-shadow:    0 10px 32px rgba(26,43,74,0.18) !important;
}

/* ── Global ── */
*,*::before,*::after{box-sizing:border-box;}
body,input,select,textarea,button,
.modal,.table,.card,.form-control,.form-select,
.btn,.alert,.badge,.breadcrumb {
  font-family: var(--am-font) !important;
}
body { background: var(--am-light) !important; }
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:var(--am-light);}
::-webkit-scrollbar-thumb{background:var(--am-gold);border-radius:3px;}
::-webkit-scrollbar-thumb:hover{background:var(--am-gold-light);}

/* ══════════ HEADER ══════════ */
.header {
  background: linear-gradient(135deg,var(--am-navy-deep) 0%,var(--am-navy) 55%,var(--am-navy-light) 100%) !important;
  border-bottom: 3px solid var(--am-gold) !important;
  box-shadow: 0 4px 22px rgba(0,0,0,0.28) !important;
}
.logo img {
  filter: drop-shadow(0 2px 6px rgba(200,134,10,0.40)) !important;
}
/* Header brand text if any */
.header .logo span,
.header .logo-text { color: var(--am-gold-light) !important; }

/* Header icons/buttons */
.header .nav-icon,
.header .header-nav .nav-link {
  color: rgba(255,255,255,0.76) !important;
  transition: var(--am-ease) !important;
}
.header .nav-icon:hover,
.header .header-nav .nav-link:hover {
  color: var(--am-gold-light) !important;
}

/* Search in header */
.header .search-bar input {
  background: rgba(255,255,255,0.10) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  color: white !important; border-radius: 30px !important;
}
.header .search-bar input::placeholder { color: rgba(255,255,255,0.45) !important; }
.header .search-bar input:focus {
  border-color: var(--am-gold) !important;
  box-shadow: 0 0 0 3px rgba(200,134,10,0.18) !important;
}

/* Toggle sidebar button */
.toggle-sidebar-btn {
  color: rgba(255,255,255,0.80) !important;
}
.toggle-sidebar-btn:hover { color: var(--am-gold-light) !important; }

/* ══════════ SIDEBAR ══════════ */
.sidebar {
  background: linear-gradient(180deg,var(--am-navy-deep) 0%,var(--am-navy) 100%) !important;
  border-left: none !important;
  box-shadow: -4px 0 24px rgba(0,0,0,0.22) !important;
}

/* sidebar brand */
.sidebar-header,
.sidebar .nav-logo {
  padding: 18px 16px !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}

/* nav links */
.sidebar-nav .nav-link,
.sidebar .nav-item .nav-link,
.sidebar .nav-link {
  color: rgba(255,255,255,0.70) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: var(--am-r-sm) !important;
  margin: 2px 8px !important;
  transition: var(--am-ease) !important;
  border-right: 3px solid transparent !important;
  font-family: var(--am-font) !important;
}
.sidebar-nav .nav-link:hover,
.sidebar .nav-link:hover {
  background: rgba(200,134,10,0.14) !important;
  color: var(--am-gold-light) !important;
  border-right-color: var(--am-gold) !important;
  transform: translateX(-3px) !important;
}
.sidebar-nav .nav-link.active,
.sidebar .nav-item.active .nav-link,
.sidebar .nav-link.active {
  background: linear-gradient(135deg,var(--am-gold),var(--am-gold-light)) !important;
  color: var(--am-navy-deep) !important;
  font-weight: 800 !important;
  border-right-color: transparent !important;
  box-shadow: 0 4px 14px rgba(200,134,10,0.38) !important;
}
.sidebar .nav-link i,
.sidebar .nav-link .bi { color: inherit !important; }

/* Section headings */
.sidebar .nav-heading,
.sidebar-title,
.sidebar .nav-separator {
  color: rgba(255,255,255,0.28) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  padding: 14px 20px 4px !important;
  font-family: var(--am-font) !important;
}

/* Submenu */
.sidebar .nav-content .nav-link {
  font-size: 13px !important;
  padding-right: 30px !important;
}

/* Sidebar collapse indicator */
.sidebar .bi-chevron-down,
.sidebar .bi-chevron-up { color: rgba(255,255,255,0.35) !important; }

/* Sidebar overlay (mobile) */
.sidebar-overlay { background: rgba(0,0,0,0.55) !important; }

/* ══════════ MAIN AREA ══════════ */
#main { background: var(--am-light) !important; }

/* Breadcrumb / page title */
.pagetitle {
  background: white !important;
  border-radius: var(--am-r-md) !important;
  box-shadow: var(--am-sh-sm) !important;
  border-right: 4px solid var(--am-gold) !important;
  padding: 16px 22px !important;
  margin-bottom: 24px !important;
}
.pagetitle h1 {
  color: var(--am-navy) !important;
  font-weight: 800 !important;
  font-size: 1.4rem !important;
  border-right: none !important;
  text-shadow: none !important;
}
.pagetitle nav ol li a { color: var(--am-gold) !important; }
.pagetitle nav ol li.active { color: var(--am-steel) !important; }

/* ══════════ CARDS ══════════ */
.card {
  border: 1px solid var(--am-border) !important;
  border-radius: var(--am-r-md) !important;
  background: white !important;
  box-shadow: var(--am-sh-sm) !important;
  transition: var(--am-ease) !important;
  overflow: hidden !important;
}
.card::before {
  content: '' !important;
  position: absolute !important;
  top: 0; left: 0; right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg,var(--am-navy),var(--am-gold),var(--am-amber)) !important;
  opacity: 1 !important;
}
.card:hover {
  box-shadow: var(--am-sh-md) !important;
  transform: translateY(-5px) !important;
}
.card-title {
  color: var(--am-navy) !important;
  font-weight: 800 !important;
  font-family: var(--am-font) !important;
}
.card-icon {
  background: linear-gradient(135deg,var(--am-gold),var(--am-gold-light)) !important;
  box-shadow: var(--am-sh-gold) !important;
}
/* Specific KPI card icons */
.sales-card .card-icon    { background: linear-gradient(135deg,#1A8C52,#27AE60) !important; }
.revenue-card .card-icon  { background: linear-gradient(135deg,#2471A3,#2E86C1) !important; }
.customers-card .card-icon{ background: linear-gradient(135deg,var(--am-gold),var(--am-amber)) !important; }

/* stats-overview */
.stats-overview {
  background: linear-gradient(135deg,white,var(--am-gold-pale)) !important;
  border: 1px solid rgba(200,134,10,0.18) !important;
  border-radius: var(--am-r-md) !important;
  box-shadow: var(--am-sh-sm) !important;
}
.stats-overview h3 { color: var(--am-navy) !important; }

/* ══════════ TABLES ══════════ */
.table thead th {
  background: linear-gradient(135deg,var(--am-navy),var(--am-navy-light)) !important;
  color: white !important;
  font-weight: 700 !important;
  border: none !important;
  padding: 13px 14px !important;
  font-family: var(--am-font) !important;
}
.table tbody tr { border-bottom: 1px solid var(--am-border) !important; transition: background 0.15s !important; }
.table tbody tr:hover { background: rgba(200,134,10,0.05) !important; }
.table tbody td { padding: 11px 14px !important; vertical-align: middle !important; color: var(--am-steel) !important; }
.table { border: 1px solid var(--am-border) !important; border-radius: var(--am-r-sm) !important; overflow: hidden !important; }
.table-responsive { border-radius: var(--am-r-sm) !important; border: 1px solid var(--am-border) !important; }

/* ══════════ BUTTONS ══════════ */
.btn-primary,.btn-success {
  background: linear-gradient(135deg,var(--am-gold),var(--am-gold-light)) !important;
  border: none !important;
  color: var(--am-navy-deep) !important;
  font-weight: 700 !important;
  border-radius: var(--am-r-sm) !important;
  transition: var(--am-ease) !important;
}
.btn-primary:hover,.btn-success:hover {
  background: linear-gradient(135deg,var(--am-gold-light),var(--am-amber)) !important;
  transform: translateY(-2px) !important;
  box-shadow: var(--am-sh-gold) !important;
  color: var(--am-navy-deep) !important;
}
.btn-danger   { border-radius: var(--am-r-sm) !important; }
.btn-warning  { border-radius: var(--am-r-sm) !important; }
.btn-info     { border-radius: var(--am-r-sm) !important; }
.btn-secondary{ border-radius: var(--am-r-sm) !important; }
.btn-outline-primary {
  border-color: var(--am-gold) !important;
  color: var(--am-gold) !important;
  border-radius: var(--am-r-sm) !important;
}
.btn-outline-primary:hover {
  background: var(--am-gold) !important;
  color: var(--am-navy-deep) !important;
}

/* ══════════ FORMS ══════════ */
.form-control,.form-select {
  border: 2px solid var(--am-border) !important;
  border-radius: var(--am-r-sm) !important;
  transition: var(--am-ease) !important;
  background: #FAFBFD !important;
}
.form-control:focus,.form-select:focus {
  border-color: var(--am-gold) !important;
  box-shadow: 0 0 0 3px rgba(200,134,10,0.14) !important;
  background: white !important;
}
.form-label { color: var(--am-navy) !important; font-weight: 700 !important; font-size: 13px !important; }
.form-check-input:checked { background-color: var(--am-gold) !important; border-color: var(--am-gold) !important; }

/* Select2 — width fix: prevent container from overflowing its parent */
.select2-container {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
.select2-container--default .select2-selection--single {
  border: 2px solid var(--am-border) !important;
  border-radius: var(--am-r-sm) !important;
  height: 42px !important;
  background: #FAFBFD !important;
}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default .select2-selection--single:focus {
  border-color: var(--am-gold) !important;
  box-shadow: 0 0 0 3px rgba(200,134,10,0.14) !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 40px !important;
  font-family: var(--am-font) !important;
}
.select2-dropdown {
  border: 2px solid var(--am-gold) !important;
  border-radius: var(--am-r-sm) !important;
  box-shadow: var(--am-sh-md) !important;
}
.select2-results__option--highlighted {
  background: var(--am-gold) !important;
  color: var(--am-navy-deep) !important;
}

/* ══════════ MODALS ══════════ */
.modal-header {
  background: linear-gradient(135deg,var(--am-navy),var(--am-navy-light)) !important;
  color: white !important;
  border-bottom: 2px solid var(--am-gold) !important;
  border-radius: var(--am-r-md) var(--am-r-md) 0 0 !important;
}
.modal-title { color: white !important; font-weight: 800 !important; }
.modal-header .btn-close { filter: invert(1) !important; }
.modal-content { border: none !important; border-radius: var(--am-r-md) !important; box-shadow: var(--am-sh-lg) !important; }

/* ══════════ ALERTS & BADGES ══════════ */
.alert { border-radius: var(--am-r-sm) !important; border: none !important; border-right: 4px solid !important; font-family: var(--am-font) !important; }
.alert-success { border-right-color: var(--am-success) !important; background: rgba(26,140,82,0.09) !important; color: var(--am-success) !important; }
.alert-danger  { border-right-color: var(--am-danger)  !important; background: rgba(192,57,43,0.09) !important; color: var(--am-danger)  !important; }
.alert-warning { border-right-color: var(--am-warning) !important; background: rgba(232,160,32,0.09) !important; color: #8B5500 !important; }
.alert-info    { border-right-color: var(--am-info)    !important; background: rgba(36,113,163,0.09) !important; color: var(--am-info)    !important; }
.badge         { border-radius: 20px !important; font-weight: 700 !important; font-family: var(--am-font) !important; }

/* ══════════ SWEETALERT ══════════ */
.swal2-confirm {
  background: linear-gradient(135deg,var(--am-gold),var(--am-gold-light)) !important;
  color: var(--am-navy-deep) !important; border: none !important;
}
.swal2-title,.swal2-html-container { font-family: var(--am-font) !important; color: var(--am-navy) !important; }

/* ══════════ FOOTER ══════════ */
.footer,#footer {
  background: linear-gradient(135deg,var(--am-navy-deep),var(--am-navy)) !important;
  color: rgba(255,255,255,0.55) !important;
  border-top: 3px solid var(--am-gold) !important;
  font-family: var(--am-font) !important;
}
.footer a { color: var(--am-gold-light) !important; text-decoration: none !important; }
.footer a:hover { color: var(--am-amber) !important; }

/* ══════════ TEXT UTILITIES ══════════ */
.text-success { color: var(--am-success) !important; }
.contribution { color: var(--am-navy) !important; }
.section-title { color: var(--am-navy) !important; border-bottom-color: var(--am-gold) !important; }
.section-title::after { background: linear-gradient(90deg,var(--am-gold),var(--am-amber)) !important; }
.section-tag { background: rgba(200,134,10,0.12) !important; color: var(--am-gold) !important; }

/* percentage badges */
.percentage-up { background: rgba(200,134,10,0.14) !important; color: var(--am-gold) !important; border-color: rgba(200,134,10,0.25) !important; }
.percentage-down { background: rgba(192,57,43,0.10) !important; color: var(--am-danger) !important; border-color: rgba(192,57,43,0.20) !important; }

/* ══════════ PRINT ══════════ */
@media print {
  body { background: white !important; }
  .sidebar,.header,.footer,.btn { display: none !important; }
  #main { margin: 0 !important; padding: 0 !important; }
}

/* ══════════ SIDEBAR LAYOUT — تجاوب مع السايدبار ══════════ */
#main {
  transition: margin-right 0.3s cubic-bezier(0.4,0,0.2,1) !important;
  padding: 20px !important;
}
@media (min-width: 992px) {
  body.sidebar-open #main    { margin-right: 300px !important; }
  body.sidebar-open .header  { padding-right: 300px !important; }
  body:not(.sidebar-open) #main   { margin-right: 0 !important; }
  body:not(.sidebar-open) .header { padding-right: 0 !important; }
}
@media (max-width: 991px) {
  body.sidebar-open #main   { margin-right: 0 !important; }
  body.sidebar-open .header { padding-right: 0 !important; }
  #main { padding: 10px 8px !important; }
  .container { max-width: 100% !important; padding-right: 8px !important; padding-left: 8px !important; }
  .table { font-size: 12px !important; }
  .table th, .table td { padding: 8px 6px !important; }
}
@media (max-width: 576px) {
  #main { padding: 8px 6px !important; }
  .breadcrumbs h2 { font-size: 17px !important; }
  .compact-stats { grid-template-columns: 1fr !important; }
  .tab-content-wrapper { padding: 12px !important; }
  .inline-form-card { padding: 12px !important; }
}

/* ══════════ BRAND TABLE HEADER OVERRIDE ══════════ */
/* tables in templates that define their own thead style */
.table thead th,
thead th {
  background: linear-gradient(135deg, var(--am-navy) 0%, var(--am-navy-light) 100%) !important;
  color: #fff !important;
  border: none !important;
}

/* ══════════ SIDEBAR SUBMENU COLORS ══════════ */
.sidebar .nav-content {
  background: rgba(255,255,255,0.04) !important;
  border-right-color: var(--am-gold) !important;
}
.sidebar .nav-content a {
  color: rgba(255,255,255,0.60) !important;
}
.sidebar .nav-content a:hover {
  color: var(--am-gold-light) !important;
  background: rgba(200,134,10,0.10) !important;
}
.sidebar .nav-content a.active {
  color: var(--am-gold-light) !important;
  background: rgba(200,134,10,0.15) !important;
}
.sidebar-header h4 {
  color: var(--am-gold-light) !important;
}
/* ══════════ NAV TABS OVERRIDE ══════════ */
.voucher-tabs, .nav-tabs {
  border-bottom-color: rgba(200,134,10,0.2) !important;
}
.nav-tabs .nav-link.active {
  border-color: rgba(200,134,10,0.3) rgba(200,134,10,0.3) #fff !important;
  color: var(--am-navy) !important;
}
.tab-content-wrapper {
  border-color: rgba(200,134,10,0.15) !important;
}
