/* LONHOW ERP first-batch visual foundation.
   Scope: tokens, shell, headers, buttons, badges, typography, spacing only. */
:root{
  --lh-brand:#ed0c1d;
  --lh-brand-hover:#d20a18;
  --lh-brand-soft:#fff1f2;
  --lh-bg:#f7f7f5;
  --lh-surface:#ffffff;
  --lh-surface-soft:#f4f5f3;
  --lh-surface-muted:#fafafa;
  --lh-text:#1f2328;
  --lh-text-secondary:#667085;
  --lh-text-muted:#98a2b3;
  --lh-border:#e5e7eb;
  --lh-border-strong:#d0d5dd;
  --lh-success:#16803c;
  --lh-success-soft:#ecfdf3;
  --lh-info:#2563eb;
  --lh-info-soft:#eff6ff;
  --lh-warning:#b54708;
  --lh-warning-soft:#fffaeb;
  --lh-danger:#b42318;
  --lh-danger-soft:#fff1f3;
  --lh-radius-sm:6px;
  --lh-radius-md:8px;
  --lh-radius-lg:12px;
  --lh-radius-xl:14px;
  --lh-shadow-sm:0 1px 2px rgba(16,24,40,.05);
  --lh-shadow-float:0 18px 40px rgba(16,24,40,.14);
}

html{
  scroll-behavior:smooth;
}

body{
  background:var(--lh-bg);
  color:var(--lh-text);
  padding:18px;
  overflow-x:hidden;
}

body::before,
body::after{
  display:none;
  content:none;
}

.container{
  max-width:1600px;
}

.glass,
.hero,
.form-card,
.table-wrapper,
.kpi-card,
.home-panel,
.sales-summary-card,
.modal-panel,
.login-card{
  background:var(--lh-surface);
  border:1px solid var(--lh-border);
  box-shadow:var(--lh-shadow-sm);
  color:var(--lh-text);
}

.hero,
.form-card,
.table-wrapper,
.kpi-card,
.home-panel,
.sales-summary-card{
  overflow:hidden;
}

.hero::before,
.hero::after,
.form-card::before,
.table-wrapper::before,
.kpi-card::before,
.home-panel::before,
.sales-summary-card::before,
.modal-panel::before,
.login-card::before{
  display:none;
  content:none;
}

.hero > *,
.form-card > *,
.table-wrapper > *,
.kpi-card > *,
.home-panel > *,
.sales-summary-card > *,
.modal-panel > *,
.login-card > *{
  position:relative;
  z-index:1;
}

.hero{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  padding:12px 14px;
  margin-bottom:16px;
  border-radius:var(--lh-radius-xl);
}

.hero-top{
  display:flex;
  align-items:center;
  gap:14px;
  flex:0 0 auto;
}

.brand-lockup{
  gap:0;
}

.logo{
  color:var(--lh-brand);
  background:none;
  -webkit-background-clip:initial;
  background-clip:initial;
  font-size:22px;
  font-weight:760;
  letter-spacing:0;
  filter:none;
  text-shadow:none;
}

.logo-sub,
.product-cn,
.product-ru,
.home-section-sub,
.sales-summary-note,
.muted,
.field-hint,
.kpi-sub{
  color:var(--lh-text-secondary);
}

.logo-sub{
  margin-top:2px;
  font-size:12px;
}

.product-badge{
  text-align:left;
  padding-left:12px;
  border-left:1px solid var(--lh-border);
}

.product-cn{
  font-size:13px;
  font-weight:600;
  letter-spacing:0;
}

.product-ru{
  font-size:12px;
  margin-top:2px;
}

.hero > div[style*="position: absolute"]{
  position:static !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin-left:auto !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
}

.nav{
  display:flex;
  align-items:center;
  gap:4px;
  margin-top:0;
  flex:1 1 560px;
  min-width:280px;
}

.nav-item{
  min-height:34px;
  padding:7px 10px;
  border-radius:var(--lh-radius-md);
  border:1px solid transparent;
  background:transparent;
  color:var(--lh-text-secondary);
  box-shadow:none;
  transform:none;
}

.nav-item:hover{
  background:var(--lh-surface-soft);
  border-color:var(--lh-border);
  color:var(--lh-text);
  transform:none;
}

.nav-item.active{
  background:var(--lh-brand-soft);
  border-color:#ffd6dc;
  color:var(--lh-brand);
  box-shadow:none;
}

.nav-cn,
.nav-ru{
  font-size:13px;
  font-weight:650;
  margin:0;
}

.lang-switch{
  display:inline-flex;
  align-items:center;
  gap:2px;
  padding:2px;
  border:1px solid var(--lh-border);
  border-radius:var(--lh-radius-md);
  background:var(--lh-surface-soft);
  backdrop-filter:none;
}

.lang-btn{
  min-height:30px;
  padding:0 9px;
  border-radius:var(--lh-radius-sm);
  color:var(--lh-text-secondary);
  background:transparent;
  font-size:12px;
  font-weight:650;
  letter-spacing:0;
}

.lang-btn.active{
  background:var(--lh-surface);
  color:var(--lh-brand);
  box-shadow:var(--lh-shadow-sm);
}

.logout-btn{
  min-height:34px;
  padding:0 12px;
  border-radius:var(--lh-radius-md);
  border:1px solid var(--lh-border);
  background:var(--lh-surface);
  color:var(--lh-text-secondary);
  font-size:13px;
}

.logout-btn:hover{
  background:var(--lh-danger-soft);
  border-color:#fecdca;
  color:var(--lh-danger);
}

.section-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin:0 0 12px;
}

.section-header h2,
.home-section-title{
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--lh-text);
  background:none;
  -webkit-background-clip:initial;
  background-clip:initial;
  font-size:20px;
  line-height:1.25;
  font-weight:700;
  letter-spacing:0;
}

.section-icon{
  width:28px;
  height:28px;
  min-width:28px;
  border-radius:var(--lh-radius-md);
  border:1px solid #ffd6dc;
  background:var(--lh-brand-soft);
  box-shadow:none;
}

.section-icon svg{
  width:16px;
  height:16px;
  stroke:var(--lh-brand);
}

.home-v29{
  display:grid;
  gap:14px;
}

.home-section-head{
  margin-bottom:12px;
}

.home-panel,
.form-card,
.table-wrapper,
.kpi-card,
.sales-summary-card{
  border-radius:var(--lh-radius-xl);
  padding:16px;
}

.sales-summary-grid,
.kpi-grid{
  gap:12px;
}

.sales-summary-card,
.kpi-card{
  min-height:96px;
}

.sales-summary-label,
.kpi-title,
.form-label,
label{
  color:var(--lh-text-secondary);
  font-size:12px;
  font-weight:650;
  letter-spacing:0;
}

.sales-summary-value,
.kpi-grid .kpi-number,
.kpi-card .kpi-number{
  color:var(--lh-text);
  margin-top:8px;
  font-size:clamp(22px,2.4vw,34px);
  font-weight:650;
  letter-spacing:0;
  line-height:1.1;
  text-shadow:none;
}

.sales-summary-value.gold,
.kpi-number.total-number,
#customerTotalDebt,
#kpiUnpaid{
  color:var(--lh-text);
  text-shadow:none;
}

.btn,
.login-btn,
.primary-button{
  min-height:36px;
  padding:8px 14px;
  border:1px solid transparent;
  border-radius:var(--lh-radius-md);
  background:var(--lh-brand);
  color:#fff;
  box-shadow:none;
  font-size:13px;
  font-weight:650;
  letter-spacing:0;
  transition:background .14s ease,border-color .14s ease,color .14s ease,box-shadow .14s ease;
}

.btn:hover,
.login-btn:hover,
.primary-button:hover{
  background:var(--lh-brand-hover);
  transform:none;
  filter:none;
  box-shadow:none;
}

.btn-outline,
.secondary-button,
.pill-button,
.icon-button{
  border:1px solid var(--lh-border);
  background:var(--lh-surface);
  color:var(--lh-text);
  box-shadow:none;
}

.btn-outline:hover,
.secondary-button:hover,
.pill-button:hover,
.icon-button:hover{
  background:var(--lh-surface-soft);
  border-color:var(--lh-border-strong);
  color:var(--lh-text);
}

.warn-btn{
  border:1px solid var(--lh-border);
  background:var(--lh-surface);
  color:var(--lh-text-secondary);
  box-shadow:none;
}

.danger-btn,
.action-del{
  color:var(--lh-danger);
}

.action{
  color:var(--lh-text-secondary);
  font-size:13px;
  font-weight:500;
  margin:0 6px;
}

.action:hover{
  color:var(--lh-brand);
}

.status-pill,
.sp-status,
[class*="status-paid"],
[class*="status-unpaid"]{
  border-radius:999px;
  font-size:12px;
  font-weight:650;
}

.status-paid,
.sp-active,
.status-pill.v6-active,
.status-pill.v62-active{
  color:var(--lh-success);
  background:var(--lh-success-soft);
  border-color:#abefc6;
}

.status-unpaid,
.sp-inactive,
.status-pill.v6-inactive,
.status-pill.v62-inactive{
  color:var(--lh-warning);
  background:var(--lh-warning-soft);
  border-color:#fedf89;
}

.form-input,
.form-select,
.search-input,
.login-input,
textarea{
  min-height:38px;
  border-radius:var(--lh-radius-md);
  border:1px solid var(--lh-border);
  background:var(--lh-surface);
  color:var(--lh-text);
  box-shadow:none;
  font-size:13px;
}

.form-input::placeholder,
.search-input::placeholder,
.login-input::placeholder,
textarea::placeholder{
  color:var(--lh-text-muted);
  opacity:1;
  font-weight:400;
}

.form-input:focus,
.form-select:focus,
.search-input:focus,
.login-input:focus,
textarea:focus{
  outline:none;
  border-color:var(--lh-brand);
  box-shadow:0 0 0 3px rgba(237,12,29,.09);
}

.form-select option{
  background:#fff;
  color:var(--lh-text);
}

.table-wrapper{
  background:var(--lh-surface);
  border-color:var(--lh-border);
}

th{
  color:var(--lh-text-secondary);
  background:var(--lh-surface-muted);
  border-bottom-color:var(--lh-border);
  font-size:12px;
  font-weight:650;
  letter-spacing:0;
}

td{
  color:var(--lh-text);
  border-bottom-color:var(--lh-border);
  font-size:13px;
  font-weight:400;
}

.home-table{
  border-color:var(--lh-border);
  border-radius:var(--lh-radius-lg);
}

.home-table th{
  color:var(--lh-text-secondary);
  background:var(--lh-surface-muted);
  border-bottom-color:var(--lh-border);
}

.home-table td{
  color:var(--lh-text);
  border-bottom-color:var(--lh-border);
}

.home-table .num,
.home-table .amount{
  color:var(--lh-text);
  font-weight:600;
}

.page:not(#sale):not(#product):not(#stockin):not(#customer):not(#ltrcms) .pagination{
  gap:8px;
  margin-top:14px;
}

.page:not(#sale):not(#product):not(#stockin):not(#customer):not(#ltrcms) .pagination button,
.page-btn{
  min-width:34px;
  min-height:34px;
  border-radius:var(--lh-radius-md);
  border:1px solid var(--lh-border);
  background:var(--lh-surface);
  color:var(--lh-text-secondary);
  box-shadow:none;
}

.page:not(#sale):not(#product):not(#stockin):not(#customer):not(#ltrcms) .pagination button:disabled,
.page-btn:disabled{
  opacity:.45;
}

@media(max-width:980px){
  body{padding:12px;}
  .hero{align-items:flex-start;}
  .nav{flex-basis:100%;}
  .product-badge{display:none;}
}