/* TELEGRAM-MS 0.3.2 — Admin visual system adapted from the user-supplied
 * MINASOFT Premium Admin V1 reference.  Design/presentation only.
 * IMPORTANT: TELEGRAM-MS trademark, original logo and brand colors stay intact:
 *     orange #F19228  |  ink #111827  |  white #FFFFFF.
 * No MINASOFT images, API handlers, tokens, settings or database code imported.
 * The independent .side-nav / .main scroll regions from v0.3.1 are retained.
 */
:root {
  --ms-admin-page:#f5f7f9;
  --ms-admin-panel:#ffffff;
  --ms-admin-ink:#202d3c;
  --ms-admin-subtle:#718093;
  --ms-admin-stroke:#e6ebf0;
  --ms-admin-warm:#fff3e4;
  --ms-admin-focus:rgba(241,146,40,.16);
  --ms-admin-shadow:0 2px 12px rgba(26,43,62,.035);
}
/* Override the former dark navigation with the reference's light, airy
   dashboard style while keeping original MINA hues for all active elements. */
.shell:not(.shell-auth) { background:var(--ms-admin-page); }
.shell:not(.shell-auth) .sidebar {
  width:268px;flex-basis:268px;
  background:#fff; color:var(--ms-admin-ink);
  border-left:1px solid var(--ms-admin-stroke);
  box-shadow:-1px 0 12px rgba(22,42,60,.018);
  padding:22px 15px 15px;
}
.shell:not(.shell-auth) .sidebar:before {display:none}
.shell:not(.shell-auth) .brand {
  padding:0 7px 17px; margin-bottom:2px;
  border-bottom:1px solid #edf0f3;
  color:#203044; display:flex;gap:12px;
}
.shell:not(.shell-auth) .brand:hover {color:#203044}
.shell:not(.shell-auth) .brand-logo {
  background:#fff7ed; box-shadow:none; border:1px solid #f4dfc5;
  border-radius:13px; width:46px; height:46px; padding:4px;
}
.shell:not(.shell-auth) .brand-copy b {color:#1e2a39;font-size:16px;letter-spacing:.035em}
.shell:not(.shell-auth) .brand-copy small {color:#8491a1;font-size:10px}
.shell:not(.shell-auth) .workspace-switcher {
  background:#f8fafb;border:1px solid #e8ecf1;border-radius:13px;
  padding:11px;box-shadow:none;margin:13px 0 12px;color:#35465a;
}
.shell:not(.shell-auth) .workspace-avatar {
  background:#fff0dc;color:#b36812;border:1px solid #f6deb9;
  border-radius:10px;box-shadow:none;width:35px;height:35px;
}
.shell:not(.shell-auth) .workspace-info small{color:#8490a1;font-size:10px}
.shell:not(.shell-auth) .workspace-info strong{color:#29394b;font-size:12px}
.shell:not(.shell-auth) .workspace-indicator{
  background:#f19228;box-shadow:0 0 0 4px rgba(241,146,40,.11)
}
.shell:not(.shell-auth) .side-nav {gap:2px;padding:0 4px 12px 0}
.shell:not(.shell-auth) .nav-group-title {
  border-top:1px solid #edf0f3;color:#9099a6;
  font-size:10px;font-weight:850;letter-spacing:.01em;
  margin:13px 6px 5px;padding:12px 7px 3px;
}
.shell:not(.shell-auth) .nav-group-title:first-child {border-top:0;margin-top:0;padding-top:8px}
.shell:not(.shell-auth) .nav-link {
  background:transparent; border:1px solid transparent;color:#5c6b7e;
  padding:10px 11px;min-height:41px;margin:1px 0;border-radius:10px;
  font-size:12.5px;font-weight:650;gap:11px;
  transition:background-color .16s,border-color .16s,color .16s;
}
.shell:not(.shell-auth) .nav-link .ui-icon{color:#8a97a7;width:18px;height:18px}
.shell:not(.shell-auth) .nav-link:hover {
  color:#2d3949;background:#f6f8fa;border-color:transparent;transform:none;
}
.shell:not(.shell-auth) .nav-link:hover .ui-icon{color:#c17b25}
.shell:not(.shell-auth) .nav-link.active {
  background:#fff1df;border-color:#f5ddbe;color:#955211;
  box-shadow:none;font-weight:850;
}
.shell:not(.shell-auth) .nav-link.active .ui-icon {color:#d57d19}
.shell:not(.shell-auth) .nav-link.active:before {
  right:0;top:10px;bottom:10px;width:3px;background:#f19228;
}
.shell:not(.shell-auth) .side-nav {
  scrollbar-color:#d2d9e2 transparent;
  overscroll-behavior-y:contain;
}
.shell:not(.shell-auth) .side-nav::-webkit-scrollbar-thumb{
  background:#d2d9e2;border:1px solid #fff;
}
.shell:not(.shell-auth) .sidebar-bottom{padding-top:12px}
.shell:not(.shell-auth) .sidebar-help{
  color:#758295;background:#f9fafb;border:1px solid #eceff2;
  border-radius:12px; padding:12px;font-size:11px;
}
.shell:not(.shell-auth) .sidebar-help .ui-icon{color:#d28125}
.shell:not(.shell-auth) .sidebar-logout {
  color:#5b6b7e;font-weight:650;font-size:12px;padding:11px 12px;
}
.shell:not(.shell-auth) .sidebar-logout:hover{background:#fff1df;color:#974f0a}
/* Workspace header matches the reference's compact utility bar. */
.shell:not(.shell-auth) .main{background:var(--ms-admin-page)}
.shell:not(.shell-auth) .topbar{
  height:72px;background:#fff;border-bottom:1px solid var(--ms-admin-stroke);
  box-shadow:0 2px 12px rgba(34,53,68,.025);
  padding:0 clamp(18px,2.7vw,37px);backdrop-filter:none;
}
.shell:not(.shell-auth) .topbar-context>span {color:#8b98a9;font-size:10px}
.shell:not(.shell-auth) .topbar-context>strong {color:#253449;font-size:14px;font-weight:800}
.shell:not(.shell-auth) .breadcrumb-slash{color:#cf8a35}
.shell:not(.shell-auth) .topbar-end{gap:10px}
.shell:not(.shell-auth) .topbar-quick {
  border:1px solid #f1d9b8;background:#fff8f0;color:#9e621c;
  padding:8px 11px;min-height:36px;border-radius:9px;font-size:11px;
}
.shell:not(.shell-auth) .topbar-quick:hover {background:#ffecd4;color:#874b0e}
.shell:not(.shell-auth) .user-avatar{background:#f4f6f9;border:1px solid #e7ebef;border-radius:10px}
.shell:not(.shell-auth) .user-info b{color:#3b4b5d;font-size:11px}
.shell:not(.shell-auth) .user-info small{font-size:10px}
.shell:not(.shell-auth) .page-content{
  max-width:1580px;padding:28px clamp(18px,2.9vw,40px) 62px;
}
.shell:not(.shell-auth) .main-footer{border-color:#e6ebf0;background:transparent}
/* Reference-inspired content panels and typography.  Orange remains primary. */
.shell:not(.shell-auth) .heading{margin-bottom:20px}
.shell:not(.shell-auth) h1 {font-size:clamp(23px,2.4vw,32px);letter-spacing:-.035em;color:#1e2c3d}
.shell:not(.shell-auth) h2 {color:#29384b}
.shell:not(.shell-auth) .eyebrow,.shell:not(.shell-auth) .section-kicker{color:#b86e19}
.shell:not(.shell-auth) .muted{color:#758398}
.shell:not(.shell-auth) .card,
.shell:not(.shell-auth) .settings-panel,
.shell:not(.shell-auth) .catalog-tile {
  background:#fff;border:1px solid var(--ms-admin-stroke);
  box-shadow:var(--ms-admin-shadow);border-radius:15px;
}
.shell:not(.shell-auth) .card {padding:22px}
.shell:not(.shell-auth) .card-head {padding-bottom:10px;border-bottom:1px solid #f0f2f5}
.shell:not(.shell-auth) .primary,
.shell:not(.shell-auth) .button {
  background:#f19228;border:1px solid #dc821c;color:#1e201e;
  border-radius:9px;box-shadow:none;min-height:42px;
  font-weight:800;transition:background .15s,box-shadow .15s;
}
.shell:not(.shell-auth) .primary:hover,
.shell:not(.shell-auth) .button:hover{transform:none;background:#e9881c;box-shadow:0 5px 14px rgba(241,146,40,.16);color:#171d26}
.shell:not(.shell-auth) .subtle-button {
  background:#fff;border:1px solid #dfe6ed;border-radius:9px;
  color:#40536a;box-shadow:none;
}
.shell:not(.shell-auth) .subtle-button:hover {background:#f7f9fb;border-color:#c9d2db}
.shell:not(.shell-auth) input:not([type=checkbox]):not([type=radio]),
.shell:not(.shell-auth) select,
.shell:not(.shell-auth) textarea{
  border:1px solid #dce4ed;border-radius:9px;background:#fff;
  box-shadow:none;min-height:42px;
}
.shell:not(.shell-auth) input:focus,
.shell:not(.shell-auth) select:focus,
.shell:not(.shell-auth) textarea:focus{
  outline:0;border-color:#e9a24f;box-shadow:0 0 0 3px var(--ms-admin-focus);
}
.shell:not(.shell-auth) .stat{min-height:116px;border-radius:14px;padding:18px}
.shell:not(.shell-auth) .stat:after{display:none}
.shell:not(.shell-auth) .stat span {color:#77869a;font-size:12px}
.shell:not(.shell-auth) .stat strong {color:#26384c;font-size:clamp(22px,2.4vw,30px)}
.shell:not(.shell-auth) .table-wrap {border:1px solid #e9eef2;border-radius:11px}
.shell:not(.shell-auth) table th {background:#f8fafb;color:#657589;border-bottom:1px solid #e8edf1}
.shell:not(.shell-auth) table td {border-color:#eef1f4}
.shell:not(.shell-auth) table tbody tr:hover{background:#fcfcfd}
.shell:not(.shell-auth) .quick-action{background:#f9fafb;border-color:#e9edf1;border-radius:12px}
.shell:not(.shell-auth) .quick-action:hover {background:#fff9f0;border-color:#f3dfc3}
.shell:not(.shell-auth) .quick-action>.ui-icon {background:#fff0dd;color:#bf751d}
/* Content hero panels follow the reference's lighter business-dashboard tone.
   No dynamic numbers/copy are replaced; existing server data stays authoritative. */
.shell:not(.shell-auth) .dashboard-hero,
.shell:not(.shell-auth) .product-list-hero,
.shell:not(.shell-auth) .product-edit-hero {
  background:#fff;border:1px solid var(--ms-admin-stroke);
  color:#27394e;box-shadow:var(--ms-admin-shadow);
  border-radius:16px;
}
.shell:not(.shell-auth) .dashboard-hero{padding:29px 33px;min-height:194px}
.shell:not(.shell-auth) .dashboard-hero:before {display:none}
.shell:not(.shell-auth) .dashboard-hero h1{color:#213143}
.shell:not(.shell-auth) .dashboard-hero h1 em{color:#c7771f}
.shell:not(.shell-auth) .dashboard-hero p:not(.dashboard-hero-eyebrow) {color:#78869a}
.shell:not(.shell-auth) .dashboard-hero-eyebrow{color:#b97226}
.shell:not(.shell-auth) .dashboard-hero-outline {border:1px solid #e2e8ee;color:#41556a;background:#fff}
.shell:not(.shell-auth) .dashboard-hero-outline:hover{color:#af691a;background:#fff5e8}
.shell:not(.shell-auth) .dashboard-hero-mark {
  transform:none;background:#fff7ed;border:1px solid #f4dfc5;
  width:117px;height:117px;border-radius:22px;box-shadow:none;
}
.shell:not(.shell-auth) .dashboard-hero-mark img{width:80px;height:80px;transform:none}
.shell:not(.shell-auth) .catalog-hero {
  background:#fff;border:1px solid var(--ms-admin-stroke);border-radius:16px;
  color:#26384b;box-shadow:var(--ms-admin-shadow);padding:29px 32px;
}
.shell:not(.shell-auth) .catalog-hero h1 {color:#213143}
.shell:not(.shell-auth) .catalog-hero h1 em {color:#b86d19}
.shell:not(.shell-auth) .catalog-hero-kicker {color:#b87324}
.shell:not(.shell-auth) .catalog-hero-copy>p:not(.catalog-hero-kicker) {color:#718299}
.shell:not(.shell-auth) .hero-metric {
  background:#f9fafb;border:1px solid #e6ebef;border-radius:13px;
  backdrop-filter:none;min-height:117px;
}
.shell:not(.shell-auth) .hero-metric>span,
.shell:not(.shell-auth) .hero-metric small {color:#7b8a9c}
.shell:not(.shell-auth) .hero-metric strong {color:#273a4f}
.shell:not(.shell-auth) .hero-metric-primary {background:#fff5e8;border-color:#f4dcc1}
.shell:not(.shell-auth) .hero-metric-primary strong {color:#bc721e}
.shell:not(.shell-auth) .hero-decoration {display:none}
.shell:not(.shell-auth) .hero-muted-link {color:#53667e}
.shell:not(.shell-auth) .hero-muted-link:hover {color:#bd731e}
.shell:not(.shell-auth) .hero-link {background:#f19228;border-color:#e79a44;color:#221d16;box-shadow:none}
.shell:not(.shell-auth) .hero-link:hover{background:#e88a1c;color:#221d16}
.shell:not(.shell-auth) .catalog-tile:hover {
  border-color:#f1cc9f;box-shadow:0 9px 26px rgba(36,51,72,.075);transform:translateY(-2px)
}
.shell:not(.shell-auth) .catalog-tile.is-selected {border-color:#ed9a3e;box-shadow:0 0 0 2px rgba(241,146,40,.13)}
.shell:not(.shell-auth) .catalog-tile .tile-picture {background:#f5f6f7}
.shell:not(.shell-auth) .status {border-radius:999px}
.shell:not(.shell-auth) .settings-toggle {background:#f9fafb}
.shell:not(.shell-auth) .settings-block {border-top-color:#edf1f4}
/* Command/search palette: same productivity pattern as reference; names/links
   come only from TELEGRAM-MS's currently-rendered navigation. */
.admin-command-trigger{
  display:flex;align-items:center;gap:10px;min-width:205px;max-width:235px;
  background:#f9fafb;border:1px solid #e6eaef;border-radius:9px;
  padding:7px 11px;min-height:37px;color:#66768a;
  font-size:11px;font-weight:650;cursor:pointer;
}
.admin-command-trigger .ui-icon{color:#a5b0bd;width:17px;height:17px}
.admin-command-trigger span {white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-command-trigger kbd,.admin-command-close kbd{
  direction:ltr;display:inline-block;margin-inline-start:auto;
  border:1px solid #e2e7ed;background:#fff;color:#7c8999;
  padding:2px 5px;border-radius:5px;font:11px Arial,sans-serif;
}
.admin-command-trigger:hover {background:#fff5e9;border-color:#f4ddbe;color:#a8671d}
.admin-command-overlay[hidden]{display:none!important}
.admin-command-overlay{
  position:fixed;inset:0;z-index:10000;display:flex;
  align-items:flex-start;justify-content:center;padding:12vh 15px 20px;
  background:rgba(16,28,41,.43);backdrop-filter:blur(3px);
}
.admin-command-dialog{
  width:min(565px,100%);max-height:min(72dvh,580px);
  background:#fff;border:1px solid #dce4ec;border-radius:16px;
  box-shadow:0 28px 70px rgba(16,29,48,.25);
  display:flex;flex-direction:column;overflow:hidden;
}
.admin-command-header{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:15px 18px 11px}
.admin-command-title{font-size:13px;font-weight:850;color:#293b50}
.admin-command-close{border:0;background:#f4f6f8;color:#6f7f91;border-radius:8px;padding:7px 11px;cursor:pointer;font-size:11px}
.admin-command-close kbd{background:transparent;border:0}
.admin-command-input-wrap {border-block:1px solid #e9edf2;display:flex;align-items:center;gap:11px;padding:10px 17px;font-weight:400;color:#95a1ae}
.admin-command-input-wrap .ui-icon{width:20px;height:20px}
.admin-command-input-wrap input{border:0!important;outline:0!important;box-shadow:none!important;padding:8px 0!important;min-height:38px!important;flex:1;font-size:14px}
.admin-command-results{padding:8px;overflow-y:auto;min-height:70px;overscroll-behavior:contain}
.admin-command-result{
  display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;
  text-align:right;background:transparent;border:1px solid transparent;
  color:#2f4156;border-radius:9px;padding:12px;cursor:pointer;
}
.admin-command-result:hover,.admin-command-result.is-highlighted,.admin-command-result:focus-visible {
  background:#fff3e4;border-color:#f4dfc2;outline:0;
}
.admin-command-result small{color:#98a3ae;font-size:11px}
.admin-command-empty {color:#8794a2;text-align:center;padding:25px 10px}
.admin-command-footer{border-top:1px solid #e9edf2;font-size:11px;color:#8997a6;margin:0;padding:12px 17px}
body.admin-command-open{overflow:hidden}
/* Keep the main + navigation scroll regions independent on desktop. */
@media(min-width:781px){
  .shell:not(.shell-auth) .main {overflow-y:auto;overscroll-behavior-y:contain}
  .shell:not(.shell-auth) .side-nav {overflow-y:auto;overscroll-behavior-y:contain}
}
@media(max-width:1100px){
  .shell:not(.shell-auth) .sidebar{width:236px;flex-basis:236px}
  .admin-command-trigger{min-width:175px}
  .shell:not(.shell-auth) .page-content {padding-inline:24px}
}
@media(max-width:900px){
  .admin-command-trigger{min-width:40px;max-width:42px;padding:9px;justify-content:center}
  .admin-command-trigger span,.admin-command-trigger kbd{display:none}
  .shell:not(.shell-auth) .topbar-end{gap:7px}
}
@media(max-width:780px){
  /* The app already uses its own accessible mobile popup menu. */
  .shell:not(.shell-auth) .sidebar{display:none}
  .shell:not(.shell-auth) .topbar{padding-inline:14px;height:66px}
  .shell:not(.shell-auth) .page-content{padding:18px 13px 46px}
  .shell:not(.shell-auth) .card{padding:18px}
  .shell:not(.shell-auth) .dashboard-hero {padding:24px 21px}
  .shell:not(.shell-auth) .catalog-hero {padding:24px 19px}
  .shell:not(.shell-auth) .mobile-menu-content{background:#fff;border:1px solid #e5eaf0;box-shadow:0 12px 24px rgba(22,40,62,.1)}
  .shell:not(.shell-auth) .mobile-menu-content .nav-link {color:#556779}
  .shell:not(.shell-auth) .mobile-menu-content .nav-link.active {background:#fff2e2;color:#9b5a14}
}
@media(max-width:550px){
  .shell:not(.shell-auth) .dashboard-hero-mark{display:none}
  .shell:not(.shell-auth) .topbar-end .user-info{display:none}
  .admin-command-overlay{padding:8vh 10px 10px}
  .admin-command-dialog{max-height:83dvh}
  .shell:not(.shell-auth) .stat{min-height:104px}
}
@media(prefers-reduced-motion:reduce){
  .admin-command-trigger,.admin-command-result{transition:none}
}
