/* NASORA CRM — VISUAL UNIFICATION 2026-10-03
   UI-only layer. No data, routes, forms, permissions or business logic changed.
*/
:root{
  --nasora-ui-green:#176b46;
  --nasora-ui-green-dark:#105437;
  --nasora-ui-green-soft:#eaf5ef;
  --nasora-ui-bg:#f5f8f6;
  --nasora-ui-card:#fff;
  --nasora-ui-border:#dbe7e0;
  --nasora-ui-text:#18362a;
  --nasora-ui-muted:#687971;
  --nasora-ui-shadow:0 8px 24px rgba(24,54,42,.055);
  --nasora-ui-radius:14px;
}
html{background:var(--nasora-ui-bg)}
body{
  margin:0;
  background:var(--nasora-ui-bg);
  color:var(--nasora-ui-text);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:14px;
}
.site-header{
  background:#fff!important;
  border-bottom:1px solid var(--nasora-ui-border)!important;
  box-shadow:0 2px 10px rgba(20,55,40,.04)!important;
}
.header-inner{
  max-width:1500px!important;
  min-height:66px!important;
  padding:8px 18px!important;
}
.brand-logo{border-radius:8px}
.brand-name{color:var(--nasora-ui-text)!important;font-weight:800!important}
.brand-tagline{color:var(--nasora-ui-muted)!important}
.header-user-role{
  color:var(--nasora-ui-green)!important;
  background:var(--nasora-ui-green-soft)!important;
  border:1px solid #d5e8dc!important;
  border-radius:999px!important;
  padding:5px 9px!important;
}
.header-user-name{color:var(--nasora-ui-text)!important;font-weight:700!important}

/* Navigation: one consistent horizontal system */
.site-nav{
  position:sticky;
  top:0;
  z-index:1000;
  background:var(--nasora-ui-green)!important;
  border:0!important;
  box-shadow:0 4px 14px rgba(16,84,55,.16)!important;
}
.site-nav .nav-inner{
  max-width:1500px!important;
  min-height:46px!important;
  padding:4px 12px!important;
  gap:4px!important;
}
.site-nav a,
.site-nav button{
  min-height:34px!important;
  border-radius:8px!important;
  font-size:.77rem!important;
  line-height:1!important;
  letter-spacing:.005em!important;
  text-shadow:none!important;
}
.site-nav a:hover,
.site-nav button:hover,
.site-nav .nav-dropdown.is-open>.nav-dropdown-trigger,
.site-nav .nav-dropdown-trigger[data-active=true]{
  background:rgba(255,255,255,.13)!important;
}
.site-nav .nav-icon{
  font-size:.9rem!important;
  opacity:.92;
}
.nav-dropdown-menu{
  margin-top:5px!important;
  padding:6px!important;
  min-width:210px!important;
  background:#fff!important;
  border:1px solid var(--nasora-ui-border)!important;
  border-radius:11px!important;
  box-shadow:0 14px 34px rgba(20,55,40,.14)!important;
}
.nav-dropdown-menu a{
  color:var(--nasora-ui-text)!important;
  min-height:34px!important;
  padding:8px 10px!important;
  border-radius:7px!important;
}
.nav-dropdown-menu a:hover{
  color:var(--nasora-ui-green-dark)!important;
  background:var(--nasora-ui-green-soft)!important;
}
.nav-global-search{
  margin-left:auto!important;
  gap:3px!important;
  padding:2px!important;
  border:1px solid rgba(255,255,255,.2)!important;
  background:rgba(255,255,255,.08)!important;
  border-radius:8px!important;
}
.nav-global-search input{
  width:150px!important;
  height:28px!important;
  padding:0 8px!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:#fff!important;
  font-size:.72rem!important;
}
.nav-global-search input::placeholder{color:rgba(255,255,255,.72)!important}
.nav-global-search button{
  min-width:28px!important;
  min-height:28px!important;
  padding:0!important;
  background:transparent!important;
}
.nav-logout-form button{
  min-height:34px!important;
  padding:0 9px!important;
}

/* Global page frame */
.container{
  width:min(1500px,calc(100% - 28px))!important;
  max-width:1500px!important;
  margin:0 auto!important;
  padding:22px 0 42px!important;
}
main.container>*{box-sizing:border-box}
.crm-page-hero,.page-hero{
  border:1px solid var(--nasora-ui-border)!important;
  border-radius:var(--nasora-ui-radius)!important;
  background:linear-gradient(135deg,#edf7f1 0%,#fff 68%)!important;
  box-shadow:var(--nasora-ui-shadow)!important;
}
.crm-page-hero h1,.page-hero h1{
  color:var(--nasora-ui-text)!important;
  font-weight:800!important;
  letter-spacing:-.025em!important;
}
.crm-overline,.hero-eyebrow{
  color:var(--nasora-ui-green)!important;
  font-weight:800!important;
  letter-spacing:.1em!important;
}
.crm-subtitle{color:var(--nasora-ui-muted)!important}

/* Cards, KPIs, summaries and forms */
.summary-card,.kpi-card,.chart-card,.crm-table-card,.direction-division-card,
.objective-item,.filter-form,.empty-state{
  border-color:var(--nasora-ui-border)!important;
  box-shadow:var(--nasora-ui-shadow)!important;
}
.summary-card,.kpi-card,.chart-card,.crm-table-card,.direction-division-card{
  border-radius:var(--nasora-ui-radius)!important;
  background:var(--nasora-ui-card)!important;
}
.kpi-card,.objective-item{transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.kpi-card:hover,.objective-item:hover{
  transform:translateY(-2px);
  border-color:#c8dbd0!important;
  box-shadow:0 12px 28px rgba(24,54,42,.08)!important;
}
.kpi-value,.objective-number{color:var(--nasora-ui-text)!important;font-weight:800!important}
.kpi-label,.kpi-sub,.filter-note,.crm-subtitle{color:var(--nasora-ui-muted)!important}
.form-input,select,textarea,input[type=text],input[type=search],input[type=number],input[type=date],input[type=email],input[type=password]{
  border:1px solid #d3e0d8!important;
  border-radius:8px!important;
  background:#fff!important;
  color:var(--nasora-ui-text)!important;
  min-height:38px;
}
.form-input:focus,select:focus,textarea:focus,input:focus{
  border-color:#6da989!important;
  box-shadow:0 0 0 3px rgba(23,107,70,.1)!important;
  outline:none!important;
}
.btn{
  border-radius:8px!important;
  font-weight:700!important;
  min-height:36px!important;
  box-shadow:0 2px 7px rgba(24,54,42,.05)!important;
}
.btn-primary,.btn-success{
  background:var(--nasora-ui-green)!important;
  border-color:var(--nasora-ui-green)!important;
}
.btn-primary:hover,.btn-success:hover{background:var(--nasora-ui-green-dark)!important}
.btn-secondary,.btn-outline{
  border-color:#cddcd3!important;
  color:var(--nasora-ui-text)!important;
  background:#fff!important;
}

/* Tables: same treatment everywhere */
.crm-table-card,.table-card{overflow:hidden!important}
.responsive-table,.crm-table-card table{
  width:100%;
  border-collapse:separate!important;
  border-spacing:0!important;
}
.responsive-table thead th,.crm-table-card thead th{
  background:#f1f6f3!important;
  color:#40564b!important;
  border-bottom:1px solid var(--nasora-ui-border)!important;
  font-size:.72rem!important;
  font-weight:800!important;
  text-transform:none!important;
}
.responsive-table td,.crm-table-card td{
  border-bottom:1px solid #edf2ef!important;
  color:#294238!important;
  font-size:.8rem!important;
}
.responsive-table tbody tr:hover,.crm-table-card tbody tr:hover{
  background:#f7fbf8!important;
}

/* Section headings and action rows */
.section-heading,.crm-section-title{
  margin-top:20px!important;
  margin-bottom:12px!important;
}
.dashboard-nav-actions,.quick-actions,.export-actions{
  gap:7px!important;
}

/* Footer */
footer{
  background:#fff!important;
  border-top:1px solid var(--nasora-ui-border)!important;
  color:var(--nasora-ui-muted)!important;
}
footer a{color:var(--nasora-ui-green)!important}

/* Mobile keeps the same visual language without changing functionality */
@media(max-width:900px){
  .container{width:min(100% - 20px,1500px)!important;padding-top:16px!important}
  .site-nav{position:relative}
  .site-nav .nav-inner{padding:5px 8px!important}
  .nav-global-search{margin-left:0!important}
  .nav-global-search input{width:110px!important}
}
@media(max-width:640px){
  .header-inner{padding:7px 10px!important}
  .brand-tagline{display:none}
  .container{width:calc(100% - 14px)!important;padding-bottom:28px!important}
  .nav-global-search input{width:92px!important}
  .site-nav a,.site-nav button{font-size:.74rem!important}
}
@media(prefers-reduced-motion:reduce){
  .kpi-card,.objective-item{transition:none}
  .kpi-card:hover,.objective-item:hover{transform:none}
}
