/* ═══════════════════════════════════════════════════════════════
   Cashbox Control Panel & Public Theme Stylesheet
   Modern Fintech Aesthetic with Electric Cashbox Orange & Deep Ink Slate
   - Brand Primary: #FF6A00 (Electric Orange) / #FF4500 (Vibrant Tangerine)
   - Secondary / Dark Surfaces: #0B0F19 (Deep Obsidian) & #0F172A (Ink Slate)
   - Page Background: #F8FAFC (Ultra-clean Slate)
   - Accent / Hover: #FF6A00 & #FFF7ED
   ═══════════════════════════════════════════════════════════════ */

:root {
  --cb-primary: #FF6A00;
  --cb-primary-hover: #E65100;
  --cb-primary-gradient: linear-gradient(135deg, #FF6A00 0%, #FF4500 100%);
  --cb-primary-glow: 0 4px 18px rgba(255, 106, 0, 0.32);
  --cb-primary-soft: rgba(255, 106, 0, 0.08);
  --cb-primary-border: rgba(255, 106, 0, 0.25);
  --cb-dark-bg: #0B0F19;
  --cb-dark-surface: #0F172A;
  --cb-page-bg: #F8FAFC;
  --cb-text-dark: #0F172A;
  --cb-radius: 10px;
}

/* 1. Global Page Background & Logo Box */
.layout_admin {
  background-color: var(--cb-page-bg) !important;
}

.layout_admin .navbar-brand-box::before {
  background-color: #FF6500 !important;
  background: linear-gradient(180deg, #FF6500 0%, #F55F00 100%) !important;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.15) !important;
}

.layout_admin .navbar-brand-box::after {
  display: none !important;
}

.layout_admin .navbar-brand-box .vertical-menu-btn svg,
.layout_admin .navbar-brand-box .vertical-menu-btn svg path {
  fill: #ffffff !important;
}

/* 2. Top Header - Cashbox Orange #FF6500 Theme */
.layout_admin .app-header,
.layout_admin .app-header.version-2,
.layout_admin .app-header.sticky,
.layout_admin .app-header .navbar-header {
  background-color: #FF6500 !important;
  background: linear-gradient(90deg, #FF6500 0%, #FF5500 100%) !important;
  box-shadow: 0 4px 20px rgba(255, 101, 0, 0.22) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18) !important;
}

.layout_admin .app-header .navbar-brand-box {
  background-color: transparent !important;
}

.layout_admin .app-header .navbar-brand-box::before {
  background-color: transparent !important;
}

.layout_admin .app-header .side_right_header .dropdown_lang .nav-item .nav-link {
  color: #ffffff !important;
}

.layout_admin .app-header .side_right_header .dropdown_lang .nav-item .nav-link span {
  color: #ffffff !important;
  font-weight: 600 !important;
}

.layout_admin .app-header .side_right_header .dropdown_lang .nav-item .nav-link svg,
.layout_admin .app-header .side_right_header .dropdown_lang .nav-item .nav-link svg path {
  fill: #ffffff !important;
}

.layout_admin .app-header.version-2 .dropdown_lang .nav-item .nav-link.dropdown-toggle::after {
  border-top-color: #ffffff !important;
  border-left-color: #ffffff !important;
}

.layout_admin .app-header .side_right_header .dropdown_lang .nav-item .header-profile-user .name {
  color: #ffffff !important;
  font-weight: 700 !important;
}

.layout_admin .app-header .side_right_header .dropdown_lang .nav-item .header-profile-user::before {
  background-color: rgba(255, 255, 255, 0.25) !important;
}

.layout_admin .app-header .side_right_header .dropdown_lang .nav-item:hover .nav-link {
  background-color: rgba(255, 255, 255, 0.15) !important;
  border-radius: 8px !important;
}

.layout_admin .app-header .vertical-menu-btn,
.layout_admin .vertical-menu-btn {
  background: transparent !important;
}

.layout_admin .app-header .vertical-menu-btn svg, 
.layout_admin .app-header .vertical-menu-btn svg path,
.layout_admin .vertical-menu-btn svg, 
.layout_admin .vertical-menu-btn svg path {
  fill: #ffffff !important;
}

/* 3. Sidebar Container & Menu - Cashbox #FF6500 Theme */
.layout_admin .app-sidebar {
  background-color: #FF6500 !important;
  background: linear-gradient(180deg, #FF6500 0%, #E65100 100%) !important;
  box-shadow: 4px 0 25px rgba(255, 101, 0, 0.22) !important;
  border-left: 1px solid rgba(255, 255, 255, 0.12) !important;
}

/* Custom Sleek Scrollbar inside Sidebar Menu */
.layout_admin .app-sidebar .sidebar-menu > ul {
  --scrollbar-thumb: rgba(255, 255, 255, 0.35);
  --scrollbar-track: rgba(0, 0, 0, 0.08);
  scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track) !important;
  scrollbar-width: thin !important;
}

@supports not (scrollbar-color: auto) {
  .layout_admin .app-sidebar .sidebar-menu > ul::-webkit-scrollbar {
    width: 5px !important;
  }
  .layout_admin .app-sidebar .sidebar-menu > ul::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.35) !important;
    border-radius: 4px !important;
  }
  .layout_admin .app-sidebar .sidebar-menu > ul::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.08) !important;
  }
}

/* Menu Links with Crisp White Typography & Icons */
.layout_admin .app-sidebar .sidebar-menu .list_menu li a {
  color: rgba(255, 255, 255, 0.92) !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  margin: 2px 8px !important;
  transition: all 0.2s ease !important;
}

.layout_admin .app-sidebar .sidebar-menu .list_menu li a svg {
  fill: #ffffff !important;
  transition: fill 0.2s ease !important;
}

.layout_admin .app-sidebar .sidebar-menu .list_menu li a svg path {
  fill: #ffffff !important;
}

/* Link Active & Hover States */
.layout_admin .app-sidebar .sidebar-menu .list_menu li a.active,
.layout_admin .app-sidebar .sidebar-menu .list_menu li a:hover,
.layout_admin .app-sidebar .sidebar-menu .list_menu li a.has-arrow:not(.collapsed) {
  background-color: rgba(255, 255, 255, 0.22) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

.layout_admin .app-sidebar .sidebar-menu .list_menu li a.active svg,
.layout_admin .app-sidebar .sidebar-menu .list_menu li a:hover svg,
.layout_admin .app-sidebar .sidebar-menu .list_menu li a.has-arrow:not(.collapsed) svg,
.layout_admin .app-sidebar .sidebar-menu .list_menu li a.active svg path,
.layout_admin .app-sidebar .sidebar-menu .list_menu li a:hover svg path,
.layout_admin .app-sidebar .sidebar-menu .list_menu li a.has-arrow:not(.collapsed) svg path {
  fill: #ffffff !important;
}

/* Collapsible Submenus styling */
.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu {
  background-color: rgba(0, 0, 0, 0.14) !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  margin: 4px 8px !important;
}

.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li a {
  color: rgba(255, 255, 255, 0.88) !important;
}

.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li a svg,
.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li a svg path {
  fill: rgba(255, 255, 255, 0.88) !important;
}

/* Nested Active Links */
.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li.active > a,
.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li:hover > a,
.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li a:hover {
  background-color: rgba(255, 255, 255, 0.25) !important;
  color: #ffffff !important;
}

.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li.active > a svg,
.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li:hover > a svg,
.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li a:hover svg,
.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li.active > a svg path,
.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li:hover > a svg path,
.layout_admin .app-sidebar .sidebar-menu .list_menu li ul.sub-menu li a:hover svg path {
  fill: #ffffff !important;
}

/* Arrow indicators overrides (white arrows) */
.layout_admin .app-sidebar .sidebar-menu .list_menu li a.has-arrow::after {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M11.9995%2016.8006C11.2995%2016.8006%2010.5995%2016.5306%2010.0695%2016.0006L3.54953%209.48062C3.25953%209.19062%203.25953%208.71062%203.54953%208.42063C3.83953%208.13063%204.31953%208.13063%204.60953%208.42063L11.1295%2014.9406C11.6095%2015.4206%2012.3895%2015.4206%2012.8695%2014.9406L19.3895%208.42063C19.6795%208.13063%2020.1595%208.13063%2020.4495%208.42063C20.7395%208.71062%2020.7395%209.19062%2020.4495%209.48062L13.9295%2016.0006C13.3995%2016.5306%2012.6995%2016.8006%2011.9995%2016.8006Z%22%20fill%3D%22%23ffffff%22%2F%3E%3C%2Fsvg%3E") !important;
}

.layout_admin .app-sidebar .sidebar-menu .list_menu li a.has-arrow:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M19.9195%2015.7981C19.7295%2015.7981%2019.5395%2015.7281%2019.3895%2015.5781L12.8695%209.05813C12.3895%208.57813%2011.6095%208.57813%2011.1295%209.05813L4.60953%2015.5781C4.31953%2015.8681%203.83953%2015.8681%203.54953%2015.5781C3.25953%2015.2881%203.25953%2014.8081%203.54953%2014.5181L10.0695%207.99812C11.1295%206.93813%2012.8595%206.93813%2013.9295%207.99812L20.4495%2014.5181C20.7395%2014.8081%2020.7395%2015.2881%2020.4495%2015.5781C20.2995%2015.7181%2020.1095%2015.7981%2019.9195%2015.7981Z%22%20fill%3D%22%23ffffff%22%2F%3E%3C%2Fsvg%3E") !important;
}

/* 4. Dashboard Statistics Cards - Cashbox Orange #FF6500 */
.stats-card {
  background: #FF6500 !important;
  background: linear-gradient(135deg, #FF6500 0%, #FF4500 100%) !important;
  border: none !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 22px rgba(255, 101, 0, 0.28) !important;
  color: #ffffff !important;
  overflow: hidden !important;
  position: relative !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

.stats-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 28px rgba(255, 101, 0, 0.38) !important;
}

.stats-card::before {
  content: "";
  position: absolute;
  top: -40px;
  right: -40px;
  width: 110px;
  height: 110px;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.22) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.stats-card .card-body {
  padding: 1.5rem 1.25rem !important;
  position: relative;
  z-index: 1;
}

.stats-card .card-title {
  color: rgba(255, 255, 255, 0.92) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  margin-bottom: 0.6rem !important;
  letter-spacing: 0.2px;
}

.stats-card .stat-value {
  color: #ffffff !important;
  font-size: 2.2rem !important;
  font-weight: 800 !important;
  margin-bottom: 0 !important;
  letter-spacing: -0.5px;
}

/* 5. Theme Buttons & General Links */
.btn.btn-theme,
.btn.btn-primary {
  background: var(--cb-primary-gradient) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: var(--cb-primary-glow) !important;
  border-radius: var(--cb-radius) !important;
  font-weight: 700 !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.btn.btn-theme:hover,
.btn.btn-primary:hover {
  background: linear-gradient(135deg, #FF7B1A 0%, #E65100 100%) !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 22px rgba(255, 106, 0, 0.45) !important;
}

.btn.btn-outline-theme,
.btn.btn-outline-primary {
  border: 1.5px solid var(--cb-primary) !important;
  color: var(--cb-primary) !important;
  background-color: transparent !important;
  border-radius: var(--cb-radius) !important;
  font-weight: 600 !important;
  transition: all 0.25s ease !important;
}

.btn.btn-outline-theme svg,
.btn.btn-outline-primary svg {
  fill: var(--cb-primary) !important;
}

.btn.btn-outline-theme:hover,
.btn.btn-outline-primary:hover {
  background: var(--cb-primary-gradient) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: var(--cb-primary-glow) !important;
}

.btn.btn-outline-theme:hover svg,
.btn.btn-outline-primary:hover svg {
  fill: #ffffff !important;
}

.text-theme,
.text-primary {
  color: var(--cb-primary) !important;
}

/* 5. Custom Table Pagination Override */
.custom_pagination_table .pagination_nav .pagination .page-item.active .page-link,
.custom_pagination_table .pagination_nav .pagination .page-item:hover .page-link {
  color: #ffffff !important;
  background: var(--cb-primary) !important;
  border-color: var(--cb-primary) !important;
  box-shadow: 0 2px 8px rgba(255, 106, 0, 0.3) !important;
}

/* 6. Internal Data Tables Styling */
.table.table_primary thead tr th,
.custom_data_table table thead tr th {
  background-color: rgba(255, 106, 0, 0.06) !important;
  color: var(--cb-text-dark) !important;
  font-weight: 700 !important;
  border-bottom: 2px solid rgba(255, 106, 0, 0.15) !important;
}

.table.table_primary tbody tr:hover,
.custom_data_table table tbody tr:hover {
  background-color: rgba(255, 106, 0, 0.035) !important;
}

/* Domain and generic table cell links */
.table.table_primary tbody tr td a,
.custom_data_table table tbody tr td a {
  color: var(--cb-primary) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

.table.table_primary tbody tr td a:hover,
.custom_data_table table tbody tr td a:hover {
  color: var(--cb-primary-hover) !important;
  text-decoration: underline !important;
}

/* Table Checkboxes */
.table.table_primary th input[type=checkbox]:checked,
.table.table_primary td input[type=checkbox]:checked,
.custom_data_table table th input[type=checkbox]:checked,
.custom_data_table table td input[type=checkbox]:checked {
  border-color: var(--cb-primary) !important;
  background-color: var(--cb-primary) !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e") !important;
}

/* 7. Breadcrumbs & Dropdowns */
.custom_breadcrumb .breadcrumb-item a {
  color: var(--cb-primary) !important;
}

.custom_breadcrumb .breadcrumb-item a:hover {
  color: var(--cb-primary-hover) !important;
}

.dropdown-menu .dropdown-item:hover {
  color: #ffffff !important;
  background-color: var(--cb-primary) !important;
}

/* 8. Public Auth Page (Login / Register / Recover) */
.auth-page .item_left_page .auth_header .title,
.auth-page .title {
  color: var(--cb-text-dark) !important;
  font-weight: 800 !important;
}

.auth-page .btn-link {
  color: var(--cb-primary) !important;
  font-weight: 600 !important;
}

.auth-page .custom_field .form-control:focus {
  border-color: var(--cb-primary) !important;
  box-shadow: 0 0 0 3px rgba(255, 106, 0, 0.2) !important;
}

/* 9. Global Scrollbars */
::-webkit-scrollbar-track {
  background: var(--cb-page-bg) !important;
}

::-webkit-scrollbar-thumb {
  background: #CBD5E1 !important;
  border-radius: 4px !important;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--cb-primary) !important;
}