/* SSTRADERS V51 — unified Studio UI/UX + dark/light + Urdu + public nav states
   Loaded last. This file intentionally normalizes every Admin page while preserving
   specialized POS/invoice layouts. */

:root{
  --v51-blue:#1268f3;
  --v51-blue-2:#0b56d6;
  --v51-green:#138a58;
  --v51-red:#d93445;
  --v51-amber:#b76b00;
  --v51-radius:16px;
  --v51-radius-sm:11px;
}

html[data-theme="light"]{
  --v51-bg:#f4f7fb;
  --v51-surface:#ffffff;
  --v51-surface-2:#f8fafc;
  --v51-surface-3:#eef4fa;
  --v51-line:#dbe4ee;
  --v51-line-strong:#cbd7e4;
  --v51-text:#11253f;
  --v51-text-2:#3e526b;
  --v51-muted:#75869b;
  --v51-shadow:0 10px 30px rgba(20,51,84,.07);
  --v51-shadow-soft:0 4px 16px rgba(20,51,84,.05);
  --v51-input:#fff;
  --v51-hover:#edf5ff;
}
html[data-theme="dark"]{
  --v51-bg:#07111f;
  --v51-surface:#0c1a2b;
  --v51-surface-2:#101f32;
  --v51-surface-3:#14263b;
  --v51-line:#263b53;
  --v51-line-strong:#36516e;
  --v51-text:#edf5ff;
  --v51-text-2:#c4d1df;
  --v51-muted:#92a7bd;
  --v51-shadow:0 12px 34px rgba(0,0,0,.22);
  --v51-shadow-soft:0 5px 18px rgba(0,0,0,.16);
  --v51-input:#0d1c2e;
  --v51-hover:#132a44;
}

/* ---------------------------------------------------------
   ADMIN SHELL / HEADER
   --------------------------------------------------------- */
.admin-body,.admin-main,.admin-content{background:var(--v51-bg)!important;color:var(--v51-text)!important}
.admin-content{padding:26px clamp(16px,2.2vw,32px) 44px!important}
.admin-header{
  background:color-mix(in srgb,var(--v51-surface) 94%,transparent)!important;
  border-bottom:1px solid var(--v51-line)!important;
  color:var(--v51-text)!important;
  backdrop-filter:blur(18px)!important;
}
.v9-admin-title span{color:var(--v51-muted)!important}
.v9-admin-title h1{color:var(--v51-text)!important}
.menu-toggle,.ui-pref-btn,.v9-admin-site-link,.user-chip{
  background:var(--v51-surface)!important;color:var(--v51-text)!important;border-color:var(--v51-line)!important;
}
.menu-toggle:hover,.ui-pref-btn:hover,.v9-admin-site-link:hover{background:var(--v51-hover)!important;color:var(--v51-blue)!important;border-color:color-mix(in srgb,var(--v51-blue) 35%,var(--v51-line))!important}
.v9-user-chip strong{color:var(--v51-text)!important}.v9-user-chip small{color:var(--v51-muted)!important}

/* Sidebar — same visual language in both themes */
.admin-sidebar{background:var(--v51-surface)!important;border-right:1px solid var(--v51-line)!important;color:var(--v51-text)!important}
.v9-sidebar-context{background:var(--v51-surface-2)!important;border-color:var(--v51-line)!important}
.v9-sidebar-context small,.nav-kicker{color:var(--v51-muted)!important}
.v9-sidebar-context strong{color:var(--v51-text)!important}
.sidebar-nav a,.sidebar-bottom a,.sidebar-bottom button{color:var(--v51-text-2)!important;border:1px solid transparent!important}
.sidebar-nav a:hover,.sidebar-bottom a:hover,.sidebar-bottom button:hover{background:var(--v51-hover)!important;color:var(--v51-text)!important;border-color:var(--v51-line)!important}
.sidebar-nav a.active{background:linear-gradient(135deg,rgba(18,104,243,.16),rgba(18,104,243,.06))!important;color:var(--v51-blue)!important;border-color:rgba(18,104,243,.25)!important;box-shadow:none!important}
html[data-theme="dark"] .sidebar-nav a.active{color:#8fbdff!important;background:linear-gradient(135deg,rgba(47,127,255,.22),rgba(47,127,255,.08))!important;border-color:#315a84!important}

/* ---------------------------------------------------------
   UNIVERSAL PAGE HEADING — NO BIG WHITE BOX
   --------------------------------------------------------- */
.admin-content :is(.page-heading,.page-head){
  display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:18px!important;
  width:100%!important;margin:0 0 22px!important;padding:0 0 16px!important;
  background:transparent!important;border:0!important;border-bottom:1px solid var(--v51-line)!important;
  border-radius:0!important;box-shadow:none!important;color:var(--v51-text)!important;
}
.admin-content :is(.page-heading,.page-head)>div:first-child{min-width:0!important;max-width:860px!important}
.admin-content :is(.page-heading,.page-head) :is(.section-kicker,.eyebrow){
  display:inline-flex!important;align-items:center!important;min-height:24px!important;margin:0 0 7px!important;padding:4px 9px!important;
  border:1px solid var(--v51-line)!important;border-radius:999px!important;background:var(--v51-surface-2)!important;color:var(--v51-muted)!important;
  font-size:.62rem!important;line-height:1.1!important;font-weight:850!important;letter-spacing:.13em!important;text-transform:uppercase!important;
}
.admin-content :is(.page-heading,.page-head) :is(h1,h2,h3){margin:0!important;color:var(--v51-text)!important;font-size:clamp(1.55rem,2.3vw,2rem)!important;line-height:1.1!important;letter-spacing:-.035em!important;font-weight:850!important}
.admin-content :is(.page-heading,.page-head) p{max-width:760px!important;margin:6px 0 0!important;color:var(--v51-muted)!important;font-size:.87rem!important;line-height:1.55!important}
.admin-content .products-page-heading,.admin-content .orderbook-heading,.admin-content .return-pos-heading,.admin-content .mobility-heading,.admin-content .mobility-history-heading,.admin-content .rm-heading,.admin-content .return-page-heading{background:transparent!important;box-shadow:none!important;border-radius:0!important}
.admin-content .page-head>strong{align-self:center;color:var(--v51-blue)!important;background:rgba(18,104,243,.08)!important;border:1px solid rgba(18,104,243,.18)!important;border-radius:999px!important;padding:7px 11px!important;font-size:.76rem!important;white-space:nowrap!important}

/* ---------------------------------------------------------
   SURFACES / PANELS / CARDS
   --------------------------------------------------------- */
.admin-content :is(.panel,.admin-card,.form-panel,.ob-create-card,.ob-detail-card,.ob-search-card,.ob-list-card,.mh-search-card,.mh-list-card,.rm-toolbar-card,.rm-panel,.mob-card,.message-detail-card,.account-summary-card,.metric-card,.invoice-edit-summary-card,.return-sale-summary,.protected-edit-bar,.account-integrity-panel){
  background:var(--v51-surface)!important;color:var(--v51-text)!important;border:1px solid var(--v51-line)!important;border-radius:var(--v51-radius)!important;box-shadow:var(--v51-shadow-soft)!important;
}
.admin-content :is(.panel,.admin-card){overflow:hidden}
.admin-content :is(.panel-head,.ob-section-head,.ob-list-head,.mh-list-head,.rm-panel-head,.pos-head,.invoice-edit-lines-head,.invoice-edit-return-history-head){border-color:var(--v51-line)!important;color:var(--v51-text)!important}
.admin-content :is(.panel-head h2,.panel-head h3,.panel-head strong,.ob-section-head h3,.rm-panel-head h3,.mob-title){color:var(--v51-text)!important}
.admin-content :is(.field-help,.message-source-note,.rm-hint,.text-muted,small){color:var(--v51-muted)!important}

/* Dashboard special cards */
.admin-content :is(.v9-studio-hero,.v9-kpi-card,.v9-dashboard-card,.dashboard-card,.dash-card){border-color:var(--v51-line)!important}
html[data-theme="light"] .v9-studio-hero{background:linear-gradient(135deg,#f8fbff,#edf5ff)!important;color:var(--v51-text)!important}
html[data-theme="light"] .v9-studio-hero :is(h1,h2,h3,strong){color:var(--v51-text)!important}
html[data-theme="light"] .v9-studio-hero :is(p,span:not(.ss14-hero-alerts span)){color:var(--v51-text-2)!important}
html[data-theme="dark"] .v9-studio-hero{background:linear-gradient(135deg,#0b1b2d,#0d2744)!important;border-color:#27415e!important}
.v9-studio-shortcuts a{border:1px solid var(--v51-line)!important;background:color-mix(in srgb,var(--v51-surface) 82%,transparent)!important;color:var(--v51-text)!important}
.v9-studio-shortcuts a:hover{background:var(--v51-hover)!important;border-color:color-mix(in srgb,var(--v51-blue) 35%,var(--v51-line))!important;color:var(--v51-blue)!important}

/* ---------------------------------------------------------
   FORMS
   --------------------------------------------------------- */
.admin-content .field label,.admin-content label{color:var(--v51-text-2)!important;font-weight:750}
.admin-content :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea,.form-control,.form-select,.filter-input,.search-control input,.rm-search input,.ob-search input,.mh-search input){
  background:var(--v51-input)!important;color:var(--v51-text)!important;border-color:var(--v51-line)!important;box-shadow:none!important;
}
.admin-content :is(input,select,textarea,.form-control,.form-select):focus{border-color:rgba(18,104,243,.65)!important;box-shadow:0 0 0 3px rgba(18,104,243,.11)!important;outline:0!important}
.admin-content input::placeholder,.admin-content textarea::placeholder{color:color-mix(in srgb,var(--v51-muted) 78%,transparent)!important}
.admin-content :is(input,select,textarea)[readonly],.admin-content .readonly-input{background:var(--v51-surface-2)!important;color:var(--v51-text-2)!important}
.admin-content select option{background:var(--v51-surface)!important;color:var(--v51-text)!important}
.admin-content .switch-row{background:var(--v51-surface-2)!important;border-color:var(--v51-line)!important;color:var(--v51-text)!important}

/* ---------------------------------------------------------
   BUTTONS / ACTIONS
   --------------------------------------------------------- */
.admin-content :is(.btn-primary-admin,.btn.btn-primary,.quick-pos,.btn-return-submit,.mob-save){background:linear-gradient(135deg,var(--v51-blue),var(--v51-blue-2))!important;color:#fff!important;border:1px solid transparent!important;box-shadow:0 7px 18px rgba(18,104,243,.16)!important}
.admin-content :is(.btn-primary-admin,.btn-secondary-admin,.btn,.table-action,.ob-open,.mh-actions a){transition:.18s ease!important}
.admin-content :is(.btn-primary-admin,.btn-secondary-admin,.btn){border-radius:10px!important;font-weight:800!important}
.admin-content :is(.btn-secondary-admin,.btn.btn-light){background:var(--v51-surface)!important;color:var(--v51-text)!important;border:1px solid var(--v51-line)!important}
.admin-content :is(.btn-secondary-admin,.btn.btn-light):hover{background:var(--v51-hover)!important;color:var(--v51-blue)!important;border-color:rgba(18,104,243,.28)!important}
.admin-content .table-action{display:inline-flex!important;align-items:center!important;gap:5px!important;padding:6px 8px!important;border-radius:8px!important;color:var(--v51-blue)!important;text-decoration:none!important;white-space:nowrap!important}
.admin-content .table-action:hover{background:var(--v51-hover)!important}
.admin-content .table-action.text-danger,.admin-content button.text-danger{color:var(--v51-red)!important}

/* ---------------------------------------------------------
   TABLES — readable in light AND dark
   --------------------------------------------------------- */
.admin-content .table-responsive{border-radius:inherit!important;scrollbar-width:thin;scrollbar-color:var(--v51-line-strong) transparent}
.admin-content table.admin-table{width:100%!important;margin:0!important;background:var(--v51-surface)!important;color:var(--v51-text)!important;border-collapse:separate!important;border-spacing:0!important}
.admin-content .admin-table thead th{background:var(--v51-surface-2)!important;color:var(--v51-muted)!important;border-color:var(--v51-line)!important;font-size:.67rem!important;font-weight:850!important;letter-spacing:.08em!important;text-transform:uppercase!important;white-space:nowrap!important}
.admin-content .admin-table tbody td{background:var(--v51-surface)!important;color:var(--v51-text-2)!important;border-color:var(--v51-line)!important;vertical-align:middle!important}
.admin-content .admin-table tbody td :is(strong,b,a:not(.btn):not(.table-action)){color:var(--v51-text)!important}
.admin-content .admin-table tbody tr:hover td{background:var(--v51-hover)!important}
.admin-content .admin-table code{background:var(--v51-surface-2)!important;color:#d84f7c!important;border:1px solid var(--v51-line)!important;border-radius:7px;padding:3px 6px}
html[data-theme="dark"] .admin-content .admin-table code{color:#ff8eb4!important}
.admin-content .empty-row{color:var(--v51-muted)!important;background:var(--v51-surface)!important}

/* Status / badges */
.admin-content :is(.status-pill,.badge-soft,.stock-pill,.ob-status,.return-badge){border:1px solid var(--v51-line)!important;box-shadow:none!important}
.admin-content .status-pill.active{background:rgba(19,138,88,.12)!important;color:#118352!important;border-color:rgba(19,138,88,.20)!important}
html[data-theme="dark"] .admin-content .status-pill.active{color:#71e1ad!important;background:rgba(34,181,116,.13)!important;border-color:rgba(77,220,153,.22)!important}
.admin-content .status-pill.inactive{background:var(--v51-surface-2)!important;color:var(--v51-muted)!important}

/* Metrics */
.admin-content :is(.metric-grid,.mini-metrics,.ob-metrics,.mh-metrics,.rm-summary,.account-summary-grid){gap:12px!important}
.admin-content :is(.metric-card,.account-summary-card){background:var(--v51-surface)!important;color:var(--v51-text)!important;border-color:var(--v51-line)!important}
.admin-content :is(.metric-card,.account-summary-card) :is(strong,h3,h4){color:var(--v51-text)!important}
.admin-content :is(.metric-card,.account-summary-card) :is(span,small,p){color:var(--v51-muted)!important}

/* Alerts */
html[data-theme="dark"] .admin-content .alert-success{background:#0c2b22!important;color:#94ebc7!important;border-color:#1c5c47!important}
html[data-theme="dark"] .admin-content .alert-danger{background:#32151d!important;color:#ffb7c0!important;border-color:#6a2a38!important}
html[data-theme="dark"] .admin-content .alert-warning{background:#322710!important;color:#f5d486!important;border-color:#6d5720!important}

/* Specific pages user called out */
.admin-content :is(.ob-search-card,.mh-search-card,.rm-toolbar-card){padding:14px!important}
.admin-content :is(.ob-list-card,.mh-list-card,.rm-panel){margin-top:14px!important}
.admin-content :is(.order-qty-chips,.category-chips,.rm-tabs){gap:7px!important}
.admin-content .category-chips button,.admin-content .rm-tabs button,.admin-content .rm-tabs a{background:var(--v51-surface)!important;color:var(--v51-text-2)!important;border-color:var(--v51-line)!important}
.admin-content .category-chips .active,.admin-content .rm-tabs .active{background:rgba(18,104,243,.13)!important;color:var(--v51-blue)!important;border-color:rgba(18,104,243,.30)!important}
.admin-content :is(.pos-shell,.return-pos-shell){color:var(--v51-text)!important}
.admin-content :is(.pos-catalog,.return-catalog){background:var(--v51-surface)!important;border-color:var(--v51-line)!important;color:var(--v51-text)!important}
.admin-content :is(.pos-product,.rproduct){background:var(--v51-surface)!important;border-color:var(--v51-line)!important;color:var(--v51-text)!important}
.admin-content :is(.pos-product,.rproduct):hover{background:var(--v51-hover)!important;border-color:rgba(18,104,243,.35)!important}

/* Website Orders was built with Bootstrap cards: normalize it into Studio language */
.admin-content .page-head + .admin-card{padding:16px!important;margin-bottom:16px!important}
.admin-content .page-head + .admin-card .form-grid{gap:12px!important}

/* ---------------------------------------------------------
   URDU — keep layout stable, improve type/readability
   --------------------------------------------------------- */
html[data-language="ur"] .admin-content :is(.page-heading,.page-head) :is(h1,h2,h3,p,.section-kicker,.eyebrow){text-align:right!important;letter-spacing:0!important}
html[data-language="ur"] .admin-content :is(.page-heading,.page-head) :is(h1,h2,h3){font-family:"SSTRADERS Alvi Nastaleeq","Alvi Nastaleeq Regular","Alvi Nastaleeq","Noto Nastaliq Urdu",Manrope,sans-serif!important;line-height:1.55!important;font-weight:700!important}
html[data-language="ur"] .admin-content :is(.page-heading,.page-head) p{line-height:1.9!important}
html[data-language="ur"] .admin-content .admin-table :is(th,td){line-height:1.75!important}
html[data-language="ur"] .admin-content :is(label,.btn,.btn-primary-admin,.btn-secondary-admin,.table-action,.status-pill){line-height:1.65!important}
html[data-language="ur"] .sidebar-nav a span,html[data-language="ur"] .v9-admin-title :is(span,h1){line-height:1.7!important}
html[data-language="ur"] .admin-content :is(input,textarea){text-align:right!important}
html[data-language="ur"] .admin-content :is(input[type="number"],input[type="date"],input[type="datetime-local"]){text-align:left!important;direction:ltr!important}

/* ---------------------------------------------------------
   RESPONSIVE — all admin pages
   --------------------------------------------------------- */
@media(max-width:991.98px){
  .admin-content{padding:18px 14px 36px!important}
  .admin-header{padding-left:12px!important;padding-right:12px!important}
  .v9-admin-actions .user-chip>div{display:none!important}
  .admin-content :is(.form-grid,.editor-grid,.purchase-layout,.dashboard-grid,.account-action-grid){grid-template-columns:1fr!important}
  .admin-content .form-grid .full,.admin-content .form-grid .span-two,.admin-content .form-grid .three,.admin-content .form-grid .four{grid-column:1!important}
  .admin-content .table-responsive{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
  .admin-content .admin-table{min-width:720px!important}
  .admin-content :is(.metric-grid,.mini-metrics,.ob-metrics,.mh-metrics,.rm-summary,.account-summary-grid){grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:767.98px){
  .admin-content :is(.page-heading,.page-head){flex-direction:column!important;align-items:stretch!important;gap:12px!important;padding-bottom:14px!important;margin-bottom:17px!important}
  .admin-content :is(.page-heading,.page-head)>div:first-child{width:100%!important;max-width:none!important}
  .admin-content :is(.page-heading,.page-head) :is(h1,h2,h3){font-size:1.48rem!important}
  .admin-content :is(.page-heading,.page-head)>.btn-primary-admin,
  .admin-content :is(.page-heading,.page-head)>.btn-secondary-admin,
  .admin-content :is(.page-heading,.page-head)>.heading-actions,
  .admin-content :is(.page-heading,.page-head)>strong{align-self:flex-start!important}
  .admin-content .heading-actions{display:flex!important;flex-wrap:wrap!important;gap:7px!important;width:100%!important}
  .admin-content .toolbar,.admin-content .toolbar-wrap{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:9px!important}
  .admin-content .toolbar :is(.search-control,.filter-input,.btn,.btn-secondary-admin){width:100%!important}
  .admin-content :is(.metric-grid,.mini-metrics,.ob-metrics,.mh-metrics,.rm-summary,.account-summary-grid){grid-template-columns:1fr!important}
  .admin-content :is(.panel,.admin-card,.form-panel,.ob-create-card,.ob-detail-card,.ob-search-card,.ob-list-card,.mh-search-card,.mh-list-card,.rm-toolbar-card,.rm-panel,.mob-card){border-radius:13px!important}
  .admin-content .admin-table{min-width:660px!important}
  .admin-content .table-action{padding:6px!important}
  .admin-content .user-crud-actions{display:flex!important;gap:5px!important;flex-wrap:wrap!important}
}
@media(max-width:480px){
  .admin-content{padding-left:10px!important;padding-right:10px!important}
  .admin-content .admin-table{min-width:620px!important}
  .admin-content :is(.btn-primary-admin,.btn-secondary-admin,.btn){min-height:40px!important}
  .v9-admin-title span{display:none!important}
  .v9-admin-title h1{font-size:1rem!important}
}

/* ---------------------------------------------------------
   PUBLIC NAV — FIX DARK HOVER/FOCUS/SELECTED WHITE PILL ISSUE
   --------------------------------------------------------- */
.ss13-nav-links .nav-link{
  transition:background-color .18s ease,color .18s ease,border-color .18s ease!important;
  border:1px solid transparent!important;box-shadow:none!important;outline:none!important;
}
html[data-theme="light"] .ss13-nav-links .nav-link:is(:hover,:focus,:focus-visible,.active,.show){background:#edf5ff!important;color:#0b57ca!important;border-color:#d7e7fb!important;box-shadow:none!important}
html[data-theme="dark"] .ss13-nav-links .nav-link:is(:hover,:focus,:focus-visible,.active,.show){background:#102844!important;color:#9ec7ff!important;border-color:#2a4d72!important;box-shadow:none!important}
.ss13-nav-links .nav-link:is(:focus,:focus-visible){outline:2px solid transparent!important}
.ss13-nav-links .nav-link:after{background:currentColor!important}
html[data-theme="dark"] .ss13-nav-links .nav-link:after{opacity:.75!important}

/* Public nav actions remain readable in dark mode */
html[data-theme="dark"] .ss13-nav-actions .ui-pref-btn,html[data-theme="dark"] .ss13-cart{background:#0e2136!important;color:#eaf2ff!important;border-color:#29445f!important}
html[data-theme="dark"] .ss13-nav-actions .ui-pref-btn:hover,html[data-theme="dark"] .ss13-cart:hover{background:#15304d!important;color:#9ec7ff!important;border-color:#3b6187!important}
.website-orders-filter{padding:16px!important;margin-bottom:16px!important}
.website-orders-table{padding:0!important;overflow:hidden!important}
.website-orders-filter-actions,.website-order-status-actions,.website-orders-pagination{display:flex!important;gap:7px!important;flex-wrap:wrap!important}
.website-orders-filter-actions{align-items:flex-end!important}
.website-orders-pagination{margin-top:15px!important}
@media(max-width:767.98px){.website-orders-filter-actions{align-items:stretch!important}.website-orders-filter-actions>*{flex:1 1 auto!important}}
