/* NASORA CRM — Global SaaS Visual System
   Couche UI globale, additive et sans modification de la logique métier.
*/
:root{
  --ns-green:#17643f;
  --ns-green-dark:#0f3f2a;
  --ns-green-soft:#edf6f1;
  --ns-ink:#17231c;
  --ns-muted:#68756d;
  --ns-border:#dfe7e2;
  --ns-bg:#f7f9f8;
  --ns-white:#fff;
  --ns-radius:14px;
  --ns-shadow:0 8px 28px rgba(20,32,25,.07);
}

html{scroll-behavior:smooth;}
body{background:var(--ns-bg)!important;color:var(--ns-ink)!important;overflow-x:hidden;}
*,*::before,*::after{box-sizing:border-box;}
img,svg,canvas{max-width:100%;}

/* Stabilisation globale : aucun mouvement permanent au chargement. */
.container>*{animation:none!important;}
.card,.panel,.dashboard-card,.kpi-card,.chart-card,.summary-card,.crm-surface,.data-card,.filter-form,.responsive-table{transition:box-shadow .16s ease,border-color .16s ease,transform .16s ease!important;}
.card:hover,.panel:hover,.dashboard-card:hover,.kpi-card:hover,.chart-card:hover,.summary-card:hover,.crm-surface:hover,.data-card:hover{transform:translateY(-1px);box-shadow:0 12px 32px rgba(20,32,25,.09)!important;}

/* Titres et surfaces */
h1,h2,h3,h4{color:var(--ns-ink);letter-spacing:-.02em;}
.page-title,.section-title{line-height:1.2;}
.crm-page-hero,.page-hero{border:1px solid var(--ns-border)!important;background:var(--ns-white)!important;border-radius:var(--ns-radius)!important;box-shadow:var(--ns-shadow)!important;}

/* Formulaires cohérents */
input:not([type="hidden"]),select,textarea{border:1px solid #cfdad3!important;border-radius:10px!important;background:#fff!important;color:var(--ns-ink)!important;min-height:40px;}
input:not([type="hidden"]):focus,select:focus,textarea:focus{border-color:#5b9a78!important;box-shadow:0 0 0 3px rgba(23,100,63,.10)!important;outline:none!important;}
label{font-weight:600;color:#344239;}
button,.btn,.btn-submit{border-radius:10px!important;}

/* Tableaux professionnels et lisibles */
table{width:100%;border-collapse:separate;border-spacing:0;}
thead th{background:#f2f6f3;color:#304238;font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;font-weight:700;}
th,td{padding:10px 12px;border-bottom:1px solid #e6ece8;vertical-align:middle;}
tbody tr:last-child td{border-bottom:0;}
tbody tr:hover td{background:#f8fbf9;}
.responsive-table{overflow:auto;max-width:100%;border:1px solid var(--ns-border);border-radius:12px;background:#fff;}
.responsive-table table{min-width:680px;}

/* Graphiques : hauteur maîtrisée pour éviter les sauts de layout. */
.chart-container,.chart-wrapper,.dashboard-chart,.chart-card canvas{min-height:240px;}
.chart-card canvas{display:block;width:100%!important;max-height:380px;}

/* Badges / KPI */
.badge,.status-badge,.kpi-badge{border-radius:999px!important;font-weight:700!important;}
.kpi-card{background:#fff;border:1px solid var(--ns-border)!important;}

/* Navigation : repère visuel clair de la section courante. */
.nav-dropdown-trigger[data-active="true"]{background:var(--ns-green-dark)!important;color:#fff!important;box-shadow:0 5px 14px rgba(15,63,42,.16);}
.nav-dropdown-trigger[data-active="true"] .nav-icon,.nav-dropdown-trigger[data-active="true"] .nav-chevron{color:#fff!important;}
.nav-dropdown-menu a[aria-current="page"]{background:var(--ns-green-soft)!important;color:var(--ns-green-dark)!important;font-weight:700!important;box-shadow:inset 3px 0 0 var(--ns-green);}
.nav-home[aria-current="page"]{background:var(--ns-green-dark)!important;color:#fff!important;}

/* Liens et états */
a{color:var(--ns-green);}
a:hover{color:var(--ns-green-dark);}
:focus-visible{outline:2px solid #69a486!important;outline-offset:2px;}

/* Flash messages */
.flash{border:1px solid transparent;box-shadow:0 5px 16px rgba(20,32,25,.05);}

/* Mobile */
@media(max-width:820px){
  .container{width:100%!important;max-width:100%!important;padding-left:12px!important;padding-right:12px!important;overflow-x:hidden;}
  .crm-page-hero,.page-hero{border-radius:12px!important;}
  .card,.panel,.dashboard-card,.kpi-card,.chart-card,.summary-card,.crm-surface,.data-card{border-radius:12px!important;}
  table{font-size:.82rem;}
  th,td{padding:8px 9px;}
  .chart-container,.chart-wrapper,.dashboard-chart,.chart-card canvas{min-height:200px;}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.card,.panel,.dashboard-card,.kpi-card,.chart-card,.summary-card,.crm-surface,.data-card{transition:none!important}.card:hover,.panel:hover,.dashboard-card:hover,.kpi-card:hover,.chart-card:hover,.summary-card:hover,.crm-surface:hover,.data-card:hover{transform:none!important}}