/* White Lifestyle modern UI compatibility layer for Bootstrap 3/AdminLTE. */
:root {
  --wl-primary: #059669;
  --wl-primary-hover: #047857;
  --wl-primary-soft: #ecfdf5;
  --wl-ink: #0f172a;
  --wl-sidebar: #111827;
  --wl-sidebar-hover: #1f2937;
  --wl-page: #f8fafc;
  --wl-surface: #ffffff;
  --wl-surface-muted: #f1f5f9;
  --wl-border: #e2e8f0;
  --wl-text: #1e293b;
  --wl-muted: #64748b;
  --wl-info: #2563eb;
  --wl-warning: #d97706;
  --wl-danger: #e11d48;
  --wl-radius: 12px;
  --wl-radius-sm: 8px;
  --wl-shadow: 0 1px 2px rgba(15,23,42,.04), 0 8px 24px rgba(15,23,42,.05);
  --wl-focus: 0 0 0 3px rgba(5,150,105,.18);
}

html, body { background: var(--wl-page); }
body {
  color: var(--wl-text);
  font-family: Inter, "Noto Sans Bengali", "Hind Siliguri", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  line-height: 1.5;
}
a { color: var(--wl-primary); }
a:hover, a:focus { color: var(--wl-primary-hover); }
:focus-visible { outline: 2px solid var(--wl-primary); outline-offset: 2px; }

/* Application shell */
.main-header .navbar,
.skin-blue-light .main-header .navbar,
.skin-blue .main-header .navbar {
  background: rgba(255,255,255,.98) !important;
  border-bottom: 1px solid var(--wl-border);
  box-shadow: 0 1px 3px rgba(15,23,42,.04);
}
.main-header .logo,
.skin-blue-light .main-header .logo,
.skin-blue .main-header .logo {
  background: #fff !important;
  color: var(--wl-ink) !important;
  border: 0 !important;
  border-right: 1px solid var(--wl-border) !important;
  border-bottom: 1px solid var(--wl-border) !important;
  font-weight: 700;
  letter-spacing: -.01em;
}
.main-header .navbar > .sidebar-toggle,
.main-header .navbar .nav > li > a,
.main-header .navbar-custom-menu .navbar-nav > li > a { color: var(--wl-text) !important; }
.main-header .navbar > .sidebar-toggle:hover,
.main-header .navbar .nav > li > a:hover { background: var(--wl-surface-muted) !important; color: var(--wl-ink) !important; }
.main-sidebar, .left-side {
  background: #f8fafc !important;
  border-right: 1px solid var(--wl-border);
  box-shadow: 4px 0 18px rgba(15,23,42,.035);
}
.sidebar { padding: 12px 8px 24px; }
.sidebar .logo {
  background: transparent !important;
  color: var(--wl-ink) !important;
  font-weight: 700;
  margin-bottom: 8px;
  text-align: left;
}
.sidebar-menu > li > a {
  align-items: center;
  background: #fff !important;
  border: 1px solid var(--wl-border) !important;
  border-radius: 11px;
  box-shadow: 0 1px 2px rgba(15,23,42,.025);
  color: #334155 !important;
  display: flex;
  margin: 6px 4px;
  min-height: 46px;
  padding: 10px 12px;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease, color .15s ease, transform .15s ease;
}
.sidebar-menu > li > a:hover,
.sidebar-menu > li.active > a,
.sidebar-menu > li.menu-open > a {
  background: var(--wl-primary-soft) !important;
  border-color: #a7f3d0 !important;
  box-shadow: 0 4px 12px rgba(5,150,105,.08) !important;
  color: #065f46 !important;
  transform: translateY(-1px);
}
.sidebar-menu > li.active > a { box-shadow: inset 3px 0 0 var(--wl-primary), 0 4px 12px rgba(5,150,105,.08) !important; }
.sidebar-menu > li > a > i,
.sidebar-menu > li > a > .fa,
.sidebar-menu > li > a > .fas,
.sidebar-menu > li > a > .far,
.sidebar-menu > li > a > .fab {
  align-items: center;
  background: #f0fdf9;
  border: 1px solid #d1fae5;
  border-radius: 8px;
  color: var(--wl-primary) !important;
  display: inline-flex;
  flex: 0 0 30px;
  height: 30px;
  justify-content: center;
  margin-right: 10px;
  text-align: center;
  width: 30px;
}
.sidebar-menu > li > a > span:not(.pull-right-container) { flex: 1 1 auto; }
.sidebar-menu > li > a .pull-right-container,
.sidebar-menu > li > a > .pull-right { color: #94a3b8; margin-left: auto; }
.sidebar-menu .treeview-menu {
  background: transparent !important;
  margin: 2px 4px 8px 16px;
  padding: 3px 0 3px 12px;
  position: relative;
}
.sidebar-menu .treeview-menu::before {
  background: #dbe5e1;
  border-radius: 4px;
  bottom: 8px;
  content: "";
  left: 0;
  position: absolute;
  top: 8px;
  width: 2px;
}
.sidebar-menu .treeview-menu > li > a {
  align-items: center;
  background: transparent !important;
  border: 1px solid transparent;
  border-radius: 9px;
  color: #475569 !important;
  display: flex;
  font-size: 13px !important;
  margin: 3px 0;
  min-height: 38px;
  padding: 8px 10px !important;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.sidebar-menu .treeview-menu > li.active > a,
.sidebar-menu .treeview-menu > li > a:hover {
  background: #fff !important;
  border-color: var(--wl-border);
  color: #065f46 !important;
  box-shadow: 0 2px 8px rgba(15,23,42,.04);
}
.sidebar-menu .treeview-menu > li.active > a {
  background: var(--wl-primary-soft) !important;
  border-color: #d1fae5;
  color: #047857 !important;
  font-weight: 650;
}
.sidebar-menu .treeview-menu > li > a > i,
.sidebar-menu .treeview-menu > li > a > .fa,
.sidebar-menu .treeview-menu > li > a > .fas {
  color: #10b981 !important;
  font-size: 11px;
  margin-right: 8px;
  width: 15px;
}
.sidebar-menu li.header {
  background: transparent !important;
  color: #94a3b8 !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  padding: 18px 12px 6px;
  text-transform: uppercase;
}
.sidebar-menu .treeview-menu .treeview-menu {
  margin-left: 10px;
  padding-left: 10px;
}
.treeview-menu a::before { content: none !important; }
.content-wrapper { background: var(--wl-page) !important; }

/* Page hierarchy */
.content-header { padding: 24px 24px 10px; }
.content-header > h1 { color: var(--wl-ink); font-size: 24px; font-weight: 700; letter-spacing: -.025em; }
.content-header > h1 > small { color: var(--wl-muted); font-size: 14px; margin-left: 6px; }
.content { padding: 14px 24px 28px; }

/* Cards */
.box, .info-box, .nav-tabs-custom, .modal-content, .dropdown-menu {
  background: var(--wl-surface);
  border: 1px solid var(--wl-border) !important;
  border-radius: var(--wl-radius) !important;
  box-shadow: var(--wl-shadow) !important;
}
.box { overflow: visible; }
.box-header { padding: 16px 18px; border-bottom: 1px solid var(--wl-border); }
.box-header .box-title { color: var(--wl-ink); font-size: 16px; font-weight: 700; }
.box-body { padding: 18px; }
.box.box-primary, .box.box-info, .box.box-warning, .box.box-success, .box.box-danger { border-top: 1px solid var(--wl-border) !important; }
.info-box { min-height: 112px; overflow: hidden; }
.info-box-icon { width: 72px; background: var(--wl-primary-soft) !important; color: var(--wl-primary) !important; }
.info-box-content { margin-left: 72px; padding: 18px 14px; }
.info-box-text { color: var(--wl-muted); font-size: 12px; font-weight: 700; letter-spacing: .045em; text-transform: uppercase; }
.info-box-number { color: var(--wl-ink); font-size: 24px; line-height: 1.3; }

/* Buttons */
.btn {
  min-height: 38px;
  border-radius: var(--wl-radius-sm) !important;
  border-width: 1px;
  font-weight: 600;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.btn:focus { box-shadow: var(--wl-focus); }
.btn-primary, .btn-success { background: var(--wl-primary) !important; border-color: var(--wl-primary) !important; color: #fff !important; }
.btn-primary:hover, .btn-success:hover { background: var(--wl-primary-hover) !important; border-color: var(--wl-primary-hover) !important; }
.btn-info { background: var(--wl-info) !important; border-color: var(--wl-info) !important; }
.btn-warning { background: var(--wl-warning) !important; border-color: var(--wl-warning) !important; }
.btn-danger { background: var(--wl-danger) !important; border-color: var(--wl-danger) !important; }
.btn-default { background: #fff; border-color: #cbd5e1; color: var(--wl-text); }
.btn-default:hover { background: var(--wl-surface-muted); border-color: #94a3b8; }
.btn-flat { border-radius: var(--wl-radius-sm) !important; }
.main-header .btn { min-width: 38px; }

/* Forms */
.form-group label { color: #334155; font-size: 13px; font-weight: 600; margin-bottom: 7px; }
.form-control,
.select2-container .select2-selection--single,
.select2-container .select2-selection--multiple {
  min-height: 42px;
  background: #fff;
  border: 1px solid #cbd5e1 !important;
  border-radius: var(--wl-radius-sm) !important;
  box-shadow: none;
  color: var(--wl-text);
}
.form-control { padding: 9px 12px; }
.form-control:focus,
.select2-container--focus .select2-selection { border-color: var(--wl-primary) !important; box-shadow: var(--wl-focus) !important; }
.input-group-addon { background: var(--wl-surface-muted); border-color: #cbd5e1; color: var(--wl-muted); }
.help-block { color: var(--wl-muted); font-size: 12px; }
.has-error .form-control { border-color: var(--wl-danger) !important; }
.has-error .help-block { color: var(--wl-danger); }

/* Tables */
.table-responsive { border: 0; }
.table { color: var(--wl-text); }
.table > thead > tr > th {
  background: #f8fafc;
  border-bottom: 1px solid var(--wl-border) !important;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .025em;
  padding: 12px 10px;
  text-transform: uppercase;
  white-space: nowrap;
}
.table > tbody > tr > td { border-top: 1px solid #edf2f7; padding: 12px 10px; vertical-align: middle; }
.table-striped > tbody > tr:nth-of-type(odd) { background: #fbfdff; }
.table-hover > tbody > tr:hover, .table > tbody > tr:hover { background: var(--wl-primary-soft); }
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select { border: 1px solid #cbd5e1; border-radius: 7px; padding: 6px 9px; }
.pagination > li > a, .pagination > li > span { border-color: var(--wl-border); color: var(--wl-text); }
.pagination > .active > a, .pagination > .active > span { background: var(--wl-primary); border-color: var(--wl-primary); }

/* Status and dialogs */
.label-success, .bg-green { background-color: var(--wl-primary) !important; }
.label-warning, .bg-yellow { background-color: var(--wl-warning) !important; }
.label-danger, .bg-red { background-color: var(--wl-danger) !important; }
.label-info, .bg-aqua, .bg-blue { background-color: var(--wl-info) !important; }
.label { border-radius: 999px; font-weight: 600; padding: 5px 9px; }
.modal-header { border-bottom: 1px solid var(--wl-border); padding: 18px 20px; }
.modal-title { color: var(--wl-ink); font-weight: 700; }
.modal-body { padding: 20px; }
.modal-footer { background: #f8fafc; border-top: 1px solid var(--wl-border); border-radius: 0 0 var(--wl-radius) var(--wl-radius); padding: 14px 20px; }
.alert { border: 1px solid transparent; border-radius: var(--wl-radius-sm); }

/* POS */
body.lockscreen { background: var(--wl-page); }
.pos-form-actions {
  background: rgba(255,255,255,.96) !important;
  backdrop-filter: blur(10px);
  border-top: 1px solid var(--wl-border);
  box-shadow: 0 -8px 24px rgba(15,23,42,.08);
}
.pos-total span.number { color: var(--wl-ink); }
#search_product { font-size: 16px; }
#product_list_body .product_box { border-color: var(--wl-border); border-radius: 10px; transition: transform .15s ease, box-shadow .15s ease; }
#product_list_body .product_box:hover { box-shadow: var(--wl-shadow); transform: translateY(-1px); }

@media (max-width: 991px) {
  .content-header { padding: 18px 16px 8px; }
  .content { padding: 10px 16px 24px; }
  .content-header > h1 { font-size: 21px; }
  .box-body { padding: 14px; }
}
@media (max-width: 767px) {
  .main-header .logo { background: #fff !important; color: var(--wl-ink) !important; }
  .main-header .navbar { background: #fff !important; }
  .btn { min-height: 42px; }
  .form-control, .select2-container .select2-selection--single { min-height: 44px; }
  .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .pos-form-actions { bottom: 0; position: sticky !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Reference-inspired shell: restrained teal, readable navigation hierarchy. */
:root { --wl-sidebar:#164f63; --wl-sidebar-deep:#103f50; --wl-sidebar-line:rgba(211,239,242,.14); --wl-sidebar-text:#d9edf1; --wl-page:#edf6f8; --wl-primary:#22778a; --wl-primary-hover:#175c6d; --wl-primary-soft:#e1f2f1; }
.main-sidebar,.left-side { background:var(--wl-sidebar)!important; border-right:0!important; }
.main-sidebar .sidebar { background:transparent!important; padding-left:10px; padding-right:10px; }
.main-sidebar .sidebar>.logo { color:#fff!important; padding-left:13px; }
.sidebar-menu>li>a { background:transparent!important; border:1px solid transparent!important; border-radius:8px!important; box-shadow:none!important; color:var(--wl-sidebar-text)!important; margin:3px 0!important; min-height:42px; padding:8px 11px!important; transform:none!important; }
.sidebar-menu>li>a>i,.sidebar-menu>li>a>.fa,.sidebar-menu>li>a>.fas,.sidebar-menu>li>a>.far { background:rgba(222,246,245,.1)!important; border:0!important; color:#a9dde0!important; flex:0 0 27px!important; height:27px!important; margin-right:8px!important; width:27px!important; }
.sidebar-menu>li>a:hover,.sidebar-menu>li.menu-open>a { background:rgba(255,255,255,.09)!important; border-color:rgba(255,255,255,.1)!important; color:#fff!important; }
.sidebar-menu>li.active>a { background:#f3fbfb!important; border-color:#f3fbfb!important; box-shadow:0 5px 14px rgba(7,41,51,.17)!important; color:#164f63!important; }
.sidebar-menu>li.active>a>i { background:#dff2ef!important; color:#1e7887!important; }
.sidebar-menu>li>a .pull-right-container { color:#9fc7d0!important; }
.sidebar-menu>li.active>a .pull-right-container { color:#4b7883!important; }
.sidebar-menu .treeview-menu { background:var(--wl-sidebar-deep)!important; border:1px solid var(--wl-sidebar-line)!important; border-radius:8px!important; margin:4px 0 8px!important; padding:6px!important; }
.sidebar-menu .treeview-menu::before { display:none!important; }
.sidebar-menu .treeview-menu>li>a { background:transparent!important; border:0!important; border-radius:6px!important; color:#bcd8de!important; font-size:12px!important; margin:1px 0!important; min-height:34px!important; padding:7px 9px 7px 17px!important; }
.sidebar-menu .treeview-menu>li>a::before { background:#6fa6b2; border-radius:50%; content:""!important; flex:0 0 4px; height:4px; margin-right:10px; width:4px; }
.sidebar-menu .treeview-menu>li>a:hover { background:rgba(255,255,255,.075)!important; color:#fff!important; }
.sidebar-menu .treeview-menu>li.active>a { background:rgba(130,211,210,.14)!important; color:#fff!important; font-weight:600; }
.sidebar-menu .treeview-menu>li.active>a::before { background:#8ee0da; box-shadow:0 0 0 3px rgba(142,224,218,.12); }
.content-wrapper { background:var(--wl-page)!important; }
.content-header-custom { background:transparent!important; color:#173f4a!important; }
.content-header-custom h1 { color:#173f4a!important; }
.content-custom { background:transparent!important; }
.info-box,.box { border-color:#d4e4e7!important; }

/* Win against legacy saved-theme selectors. */
body.skin-blue-light .wrapper .main-sidebar,
body.skin-blue .wrapper .main-sidebar,
body[class*="skin-"] .wrapper .main-sidebar { background:#164f63!important; }
body[class*="skin-"] .main-sidebar .sidebar-menu>li>a { background:transparent!important; border-color:transparent!important; color:#d9edf1!important; }
body[class*="skin-"] .main-sidebar .sidebar-menu>li>a:hover,
body[class*="skin-"] .main-sidebar .sidebar-menu>li.menu-open>a { background:rgba(255,255,255,.09)!important; border-color:rgba(255,255,255,.1)!important; color:#fff!important; }
body[class*="skin-"] .main-sidebar .sidebar-menu>li.active>a { background:#f3fbfb!important; border-color:#f3fbfb!important; color:#164f63!important; }
body[class*="skin-"] .main-sidebar .sidebar-menu .treeview-menu { background:#103f50!important; padding:6px!important; }
body[class*="skin-"] .main-sidebar .sidebar-menu .treeview-menu>li>a { color:#c7e0e5!important; }
body[class*="skin-"] .main-sidebar .sidebar-menu .treeview-menu>li>a:hover,
body[class*="skin-"] .main-sidebar .sidebar-menu .treeview-menu>li.active>a { background:rgba(255,255,255,.09)!important; color:#fff!important; }
body[class*="skin-"] .content-wrapper .content-header.content-header-custom { background:transparent!important; padding:20px 15px 12px!important; }
body[class*="skin-"] .content-wrapper .content-header.content-header-custom h1 { color:#173f4a!important; }
body[class*="skin-"] .content-wrapper .content.content-custom { background:transparent!important; }

/* Sidebar parent menu -> main content card grid. */
.wl-menu-hub { min-height:calc(100vh - 51px); padding:28px 30px 48px; position:relative; z-index:20; }
body.wl-menu-hub-open .content-wrapper > .content-header,
body.wl-menu-hub-open .content-wrapper > .content { display:none!important; }
.wl-menu-hub__head { align-items:flex-start; border-bottom:1px solid #dbe7ea; display:flex; justify-content:space-between; margin-bottom:26px; padding-bottom:18px; }
.wl-menu-hub__head h1 { color:#193c46; font-size:25px; font-weight:700; letter-spacing:-.025em; margin:0 0 5px; }
.wl-menu-hub__head p { color:#789097; font-size:13px; margin:0; }
.wl-menu-hub__meta { align-items:center; color:#70878e; display:flex; font-size:12px; gap:12px; padding-top:3px; }
.wl-menu-hub__close { align-items:center; background:#fff; border:1px solid #d4e3e6; border-radius:8px; color:#698189; display:inline-flex; font-size:21px; height:32px; justify-content:center; line-height:1; padding:0; width:32px; }
.wl-menu-hub__close:hover { background:#f6fafb; color:#234f5a; }
.wl-menu-hub__grid { display:grid; gap:14px; grid-template-columns:repeat(4,minmax(0,1fr)); }
.wl-menu-card { align-items:center; background:#fff; border:1px solid #d7e3e6; border-radius:12px; box-shadow:0 3px 10px rgba(24,73,87,.05); color:#263f47!important; display:flex; min-height:72px; padding:12px 15px; text-decoration:none!important; transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease; }
.wl-menu-card:hover,.wl-menu-card:focus { border-color:#8fc9ca; box-shadow:0 8px 20px rgba(24,73,87,.10); color:#164f63!important; transform:translateY(-2px); }
.wl-menu-card__icon { align-items:center; background:#eff9f7; border:1px solid #ddf0ed; border-radius:9px; color:#218173; display:inline-flex; flex:0 0 40px; font-size:16px; height:40px; justify-content:center; margin-right:13px; }
.wl-menu-card__label { font-size:13px; font-weight:600; line-height:1.3; }
.wl-menu-card__arrow { color:#a3b8bd; font-size:10px; margin-left:auto; opacity:0; transform:translateX(-3px); transition:opacity .16s ease,transform .16s ease; }
.wl-menu-card:hover .wl-menu-card__arrow { opacity:1; transform:translateX(0); }
@media (max-width:1199px) { .wl-menu-hub__grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:991px) { .wl-menu-hub { padding:24px 20px 40px; } .wl-menu-hub__grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:767px) { .wl-menu-hub { min-height:calc(100vh - 50px); padding:20px 15px 32px; } .wl-menu-hub__head h1 { font-size:21px; } .wl-menu-hub__grid { grid-template-columns:1fr; } .wl-menu-card { min-height:66px; } }
body.wl-menu-hub-open .main-sidebar .sidebar-menu>li.active:not(.wl-hub-selected)>a { background:transparent!important; border-color:transparent!important; box-shadow:none!important; color:#d9edf1!important; }
body[class*="skin-"] .main-sidebar .sidebar-menu>li.wl-hub-selected>a { background:#f3fbfb!important; border-color:#f3fbfb!important; box-shadow:0 5px 14px rgba(7,41,51,.17)!important; color:#164f63!important; }
body[class*="skin-"] .main-sidebar .sidebar-menu>li.wl-hub-selected>a>i { background:#dff2ef!important; color:#1e7887!important; }