/* Helios Stock V25 · Web UX refinement
   Visual-only layer: dashboard, navigation, topbar and common web surfaces. */

:root{
  --v25-ink:#162033;
  --v25-muted:#6b7890;
  --v25-line:#e7ecf3;
  --v25-soft:#f7f9fc;
  --v25-blue:#2557d6;
  --v25-blue-2:#3267e3;
  --v25-shadow:0 10px 28px rgba(15,23,42,.055);
}

/* ----- Global web polish ----- */
body{background:#f5f7fb;color:var(--v25-ink)}
.content{padding:26px 28px 34px}
.card-panel,.kpi{border-color:var(--v25-line);box-shadow:var(--v25-shadow)}
.card-panel{border-radius:18px}
.btn{font-weight:700}
.btn-primary{box-shadow:0 7px 16px rgba(37,87,214,.18)}
.form-control,.form-select{min-height:41px;background-color:#fff}
.native-table tbody tr{transition:background .14s ease}
.native-table tbody tr:hover{background:#f8fbff}

/* ----- Sidebar / navigation ----- */
.sidebar{width:252px;padding:20px 14px 16px;background:linear-gradient(180deg,#101a2d 0%,#0d1728 100%);box-shadow:10px 0 32px rgba(15,23,42,.09)}
.main{margin-left:252px}
.sidebar .brand{min-height:54px;margin-bottom:3px;padding:0 11px;border-radius:13px}
.sidebar .brand-mark{width:40px;height:40px;border-radius:12px;font-size:20px}
.sidebar .brand>span:last-child{line-height:1.05}
.sidebar .brand small{display:inline-block;margin-top:4px;color:#aebbd0;font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.sidebar nav{gap:2px;padding-right:2px}
.sidebar nav>a,.sidebar .nav-group>summary{min-height:39px;padding:8px 11px;border-radius:10px;font-size:12px}
.sidebar nav>a>i,.sidebar .nav-group>summary>span>i{width:18px;font-size:15px}
.sidebar nav>a{color:#d7e2f1!important}
.sidebar nav>a>i{color:#9db7dc}
.sidebar nav>a:hover,.sidebar nav>a:focus-visible{background:rgba(255,255,255,.065)!important;color:#fff!important;box-shadow:none!important}
.sidebar nav>a.active{background:linear-gradient(90deg,rgba(59,130,246,.25),rgba(59,130,246,.10))!important;color:#fff!important;box-shadow:inset 3px 0 #66a3ff!important}
.sidebar nav>a.active>i{color:#fff}
.sidebar .nav-caption{display:flex;align-items:center;gap:9px;margin:18px 10px 6px!important;color:#7f93ae!important;font-size:8px!important;font-weight:850!important;letter-spacing:.16em!important}
.sidebar .nav-caption::after{height:1px!important;background:rgba(148,163,184,.16)!important}
.sidebar .nav-group{margin:1px 0;border:0!important}
.sidebar .nav-group>summary{color:#d7e2f1!important}
.sidebar .nav-group>summary>span>i{color:#9db7dc!important}
.sidebar .nav-group>summary:hover,.sidebar .nav-group>summary:focus-visible{background:rgba(255,255,255,.065)!important;color:#fff!important;box-shadow:none!important}
.sidebar .nav-group.active>summary,.sidebar .nav-group[open]>summary{background:rgba(59,130,246,.13)!important;color:#fff!important;box-shadow:inset 3px 0 #66a3ff!important}
.sidebar .nav-group.active>summary>span>i,.sidebar .nav-group[open]>summary>span>i{color:#fff!important}
.sidebar .nav-submenu{gap:1px;margin:2px 0 4px 19px;padding:3px 0 3px 10px;border-left-color:rgba(148,163,184,.16)}
.sidebar .nav-submenu a{min-height:32px;padding:6px 9px!important;color:#b8c7dc!important;font-size:11px!important}
.sidebar .nav-submenu a:hover,.sidebar .nav-submenu a:focus-visible{background:rgba(255,255,255,.055)!important;color:#fff!important}
.sidebar .nav-submenu a.active{background:rgba(59,130,246,.16)!important;color:#fff!important}
.sidebar form[action="/logout"]{margin-top:10px!important;padding-top:10px!important;border-top-color:rgba(148,163,184,.14)!important}
.sidebar .logout{min-height:38px;padding:8px 11px;border-radius:10px;font-size:12px}

/* ----- Topbar ----- */
.topbar{height:66px;justify-content:space-between;padding:0 28px;background:rgba(255,255,255,.96);border-bottom-color:#e8edf4}
.topbar-context{display:flex;align-items:center;gap:10px;min-width:0;color:#526078}
.topbar-context>span{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#edf3ff;color:#2557d6;font-size:14px}
.topbar-context>div{display:grid;gap:1px;min-width:0}
.topbar-context small{color:#93a0b3;font-size:8px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
.topbar-context strong{overflow:hidden;color:#26334a;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.topbar-actions{gap:9px}
.language-switch{min-height:34px;padding:7px 10px;border:1px solid #e1e7f0;border-radius:10px;background:#fff;color:#526078;font-size:10px;font-weight:800}
.user-summary{gap:9px;padding-left:12px}
.user-avatar{width:34px;height:34px;border-radius:10px}
.user-summary strong{font-size:11px}
.role{padding:3px 6px;font-size:8px}

/* ----- Dashboard V25 ----- */
.dashboard-v25{display:grid;gap:18px}
.dashboard-v25 .dashboard-hero{margin:0;padding:24px 26px;border-radius:20px;background:linear-gradient(118deg,#14223b 0%,#1c438d 65%,#2e6be3 100%);box-shadow:0 15px 34px rgba(30,64,175,.18)}
.dashboard-v25 .dashboard-hero h1{font-size:25px}
.dashboard-v25 .dashboard-hero p{max-width:760px;font-size:12px}
.dashboard-v25 .hero-date{min-width:195px;padding:13px 17px}
.dashboard-v25 .hero-date strong{font-size:13px}

.v25-quick-shell{padding:16px 18px}
.v25-quick-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:11px}
.v25-quick-header>div{display:flex;align-items:center;gap:9px}
.v25-quick-header i{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#edf3ff;color:#2557d6}
.v25-quick-header h2{margin:0;font-size:13px}
.v25-quick-header small{color:#8a97ab;font-size:9px}
.v25-quick-actions{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.v25-quick-action{display:flex;align-items:center;gap:9px;min-height:54px;padding:10px 11px;border:1px solid #e5ebf3;border-radius:12px;background:#fbfcfe;color:#334155;transition:.15s ease}
.v25-quick-action:hover{border-color:#bfd0f7;background:#f5f8ff;color:#1d4ed8;transform:translateY(-1px)}
.v25-quick-action>i{display:grid;place-items:center;flex:0 0 auto;width:32px;height:32px;border-radius:9px;background:#edf3ff;color:#2557d6;font-size:14px}
.v25-quick-action>span{display:grid;min-width:0;line-height:1.15}
.v25-quick-action strong{overflow:hidden;font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.v25-quick-action small{margin-top:3px;color:#8a97ab;font-size:8px}

.v25-purchase-flow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border:1px solid #e7ecf3;border-radius:15px;background:#fff}
.v25-flow-title{display:flex;align-items:center;gap:9px;min-width:150px}
.v25-flow-title i{color:#2557d6;font-size:17px}
.v25-flow-title span{display:grid}
.v25-flow-title strong{font-size:10px}
.v25-flow-title small{color:#8996aa;font-size:8px}
.v25-flow-steps{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex:1}
.v25-flow-step{display:flex;align-items:center;gap:7px;padding:7px 10px;border-radius:10px;color:#536178;background:#f7f9fc;font-size:9px;font-weight:750;white-space:nowrap}
.v25-flow-step:hover{background:#edf3ff;color:#2557d6}
.v25-flow-step i{font-size:12px}
.v25-flow-arrow{color:#b3bdca;font-size:10px}

.dashboard-v25 .control-filters{display:grid;grid-template-columns:145px 145px minmax(240px,1fr) auto;align-items:end;gap:10px;padding:14px 16px;margin:0;border-radius:15px}
.dashboard-v25 .control-filters label{display:block;margin:0 0 5px;color:#6c7990;font-size:8px;font-weight:850;letter-spacing:.07em;text-transform:uppercase}
.dashboard-v25 .control-filters .form-control,.dashboard-v25 .control-filters .form-select{min-height:38px;padding:8px 10px;font-size:11px}
.dashboard-v25 .control-filters .btn{min-height:38px;padding:8px 14px;font-size:10px}

.dashboard-v25 .control-kpis{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:0}
.dashboard-v25 .control-kpi{min-height:94px;padding:14px;border:1px solid #e6ebf2;border-radius:15px;background:#fff;box-shadow:0 5px 16px rgba(15,23,42,.035)}
.dashboard-v25 .control-kpi:hover{border-color:#cad7ee;box-shadow:0 8px 20px rgba(15,23,42,.055)}
.dashboard-v25 .control-kpi>i{width:36px;height:36px;border-radius:10px;font-size:15px}
.dashboard-v25 .control-kpi small{font-size:8px}
.dashboard-v25 .control-kpi strong{margin-top:2px;font-size:18px}
.dashboard-v25 .control-kpi em{font-size:8px}

.v25-attention-strip{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(290px,.65fr);gap:16px}
.dashboard-v25 .flow-panel,.dashboard-v25 .task-panel{padding:18px}
.dashboard-v25 .section-heading{margin-bottom:13px}
.dashboard-v25 .section-heading i{width:34px;height:34px;border-radius:10px;font-size:14px}
.dashboard-v25 .section-heading h2{font-size:13px}
.dashboard-v25 .section-heading p{font-size:9px}
.dashboard-v25 .task-list{gap:7px}
.dashboard-v25 .task-item{min-height:48px;padding:9px 10px;border-radius:11px}
.dashboard-v25 .task-item>i:first-child{width:31px;height:31px;border-radius:9px;font-size:13px}
.dashboard-v25 .task-item strong{font-size:14px}
.dashboard-v25 .task-item small{font-size:8px}

.dashboard-v25 .dashboard-grid{gap:16px}
.dashboard-v25 .directory-toolbar{padding:15px 17px}
.dashboard-v25 .directory-title i{width:35px;height:35px;border-radius:10px;font-size:14px}
.dashboard-v25 .directory-title h2{font-size:13px}
.dashboard-v25 .directory-title span{font-size:9px}
.dashboard-v25 .directory-table-wrap{padding:0 16px 14px}
.dashboard-v25 .native-table{font-size:10px}
.dashboard-v25 .native-table thead th{font-size:8px}
.dashboard-v25 .native-table>:not(caption)>*>*{padding:9px 8px}
.dashboard-v25 .mover-list>div{padding:8px 0}
.dashboard-v25 .mover-name strong{font-size:10px}
.dashboard-v25 .mover-name small{font-size:8px}
.dashboard-v25 .status{padding:4px 7px;font-size:8px}
.v25-recent{margin:0!important}

/* ----- Common page rhythm ----- */
.page-head{margin-bottom:17px}
.page-head h1{font-size:24px}
.page-subtitle{font-size:12px}
.hero-panel:not(.dashboard-hero){padding:23px 25px;border-radius:20px;margin-bottom:18px}
.directory-toolbar{padding:17px 19px}
.directory-table-wrap{padding:0 18px 17px}

@media(max-width:1350px){
  .v25-quick-actions{grid-template-columns:repeat(3,1fr)}
  .dashboard-v25 .control-kpis{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:1100px){
  .v25-attention-strip{grid-template-columns:1fr}
  .v25-purchase-flow{align-items:flex-start;flex-direction:column}
  .v25-flow-steps{width:100%;justify-content:flex-start;overflow-x:auto;padding-bottom:2px}
  .dashboard-v25 .control-filters{grid-template-columns:1fr 1fr}
  .dashboard-v25 .control-filters .filter-warehouse{grid-column:1/-1}
}
@media(max-width:760px){
  .sidebar{width:252px}
  .main{margin-left:0}
  .content{padding:15px}
  .topbar{height:60px;padding:0 14px}
  .topbar-context{flex:1;margin-left:7px}
  .topbar-context small{display:none}
  .topbar-context strong{max-width:155px}
  .dashboard-v25{gap:13px}
  .dashboard-v25 .dashboard-hero{padding:20px}
  .dashboard-v25 .dashboard-hero h1{font-size:21px}
  .v25-quick-shell{padding:14px}
  .v25-quick-actions{grid-template-columns:1fr 1fr}
  .v25-quick-action{min-height:51px}
  .dashboard-v25 .control-kpis{grid-template-columns:1fr 1fr}
  .dashboard-v25 .control-filters{grid-template-columns:1fr}
  .dashboard-v25 .control-filters .filter-warehouse{grid-column:auto}
  .dashboard-v25 .dashboard-grid{grid-template-columns:1fr}
}
@media(max-width:430px){
  .v25-quick-actions{grid-template-columns:1fr}
  .dashboard-v25 .control-kpis{grid-template-columns:1fr 1fr}
  .dashboard-v25 .control-kpi{min-height:87px;padding:12px}
  .dashboard-v25 .control-kpi>i{width:32px;height:32px}
  .dashboard-v25 .control-kpi strong{font-size:16px}
  .v25-purchase-flow{padding:11px 12px}
  .v25-flow-step{padding:7px 8px}
  .user-summary>div{display:none}
  .language-switch{padding:7px 8px}
}