/* =================================================================
   CRM Ner Yaale — Thème "Metrica-like" (Bootstrap 5 custom)
   ================================================================= */
:root {
    --ny-sidebar-bg:   #0b1727;
    --ny-sidebar-2:    #15233a;
    --ny-accent:       #4e73df;
    --ny-accent-2:     #2f55d4;
    --ny-body-bg:      #f3f4f7;
    --ny-card-radius:  .55rem;
    --ny-text-muted:   #8a98ac;
    --ny-sidebar-w:    250px;
}

* { box-sizing: border-box; }
body {
    margin: 0;
    background: var(--ny-body-bg);
    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
    font-size: .9rem;
    color: #313b4c;
}

/* ---------- Layout ---------- */
.ny-wrapper { display: flex; min-height: 100vh; }

.ny-sidebar {
    width: var(--ny-sidebar-w);
    background: var(--ny-sidebar-bg);
    color: #c5cddb;
    flex-shrink: 0;
    position: fixed; top: 0; bottom: 0; left: 0;
    overflow-y: auto;
    transition: transform .25s ease;
    z-index: 1040;
}
.ny-main {
    margin-left: var(--ny-sidebar-w);
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    transition: margin .25s ease;
}
body.ny-collapsed .ny-sidebar { transform: translateX(-100%); }
body.ny-collapsed .ny-main    { margin-left: 0; }

/* ---------- Sidebar ---------- */
.ny-brand {
    display: flex; align-items: center; gap: .6rem;
    padding: 1.05rem 1.25rem;
    font-weight: 700; font-size: 1.1rem; color: #fff;
    border-bottom: 1px solid rgba(255,255,255,.06);
}
.ny-brand i { color: var(--ny-accent); }
.ny-menu { list-style: none; padding: .75rem 0; margin: 0; }
.ny-menu .ny-cat {
    padding: .9rem 1.25rem .35rem;
    font-size: .68rem; text-transform: uppercase;
    letter-spacing: .08em; color: var(--ny-text-muted);
}
.ny-menu a {
    display: flex; align-items: center; gap: .8rem;
    padding: .62rem 1.25rem;
    color: #c5cddb; text-decoration: none;
    font-size: .875rem; border-left: 3px solid transparent;
    transition: all .15s;
}
.ny-menu a i { width: 18px; text-align: center; font-size: .95rem; }
.ny-menu a:hover { background: var(--ny-sidebar-2); color: #fff; }
.ny-menu a.active {
    background: var(--ny-sidebar-2); color: #fff;
    border-left-color: var(--ny-accent);
}

/* ---------- Topbar ---------- */
.ny-topbar {
    height: 60px; background: #fff;
    display: flex; align-items: center; gap: 1rem;
    padding: 0 1.25rem;
    border-bottom: 1px solid #e6e9ef;
    position: sticky; top: 0; z-index: 1030;
}
.ny-topbar .ny-burger {
    border: none; background: transparent; font-size: 1.2rem;
    color: #5a677d; cursor: pointer; line-height: 1;
}
.ny-topbar .ny-user {
    margin-left: auto; display: flex; align-items: center; gap: .5rem;
    font-weight: 600; color: #313b4c;
}
.ny-topbar .ny-user .avatar {
    width: 34px; height: 34px; border-radius: 50%;
    background: var(--ny-accent); color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: .8rem; font-weight: 700;
}

/* ---------- Onglets ---------- */
.ny-tabbar {
    background: #fff; border-bottom: 1px solid #e6e9ef;
    padding: .35rem .75rem 0;
    display: flex; gap: .25rem; overflow-x: auto;
}
.ny-tab {
    display: inline-flex; align-items: center; gap: .5rem;
    padding: .5rem .9rem; cursor: pointer;
    border: 1px solid transparent; border-bottom: none;
    border-radius: .4rem .4rem 0 0;
    font-size: .82rem; color: #5a677d; white-space: nowrap;
    background: #f3f4f7;
}
.ny-tab.active { background: #fff; color: var(--ny-accent-2); font-weight: 600;
    border-color: #e6e9ef; }
.ny-tab .ny-close { font-size: 1.05rem; line-height: 1; opacity: .55; cursor: pointer; }
.ny-tab .ny-close:hover { opacity: 1; color: #e3342f; }

.ny-content { padding: 1.25rem; flex: 1; }
.ny-pane { display: none; }
.ny-pane.active { display: block; animation: nyfade .2s ease; }
@keyframes nyfade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; } }

/* ---------- Cards / KPI ---------- */
.card { border: none; border-radius: var(--ny-card-radius);
    box-shadow: 0 1px 3px rgba(20,30,60,.06); }
.card-header { background: #fff; border-bottom: 1px solid #eef0f4;
    font-weight: 600; }
.ny-kpi { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.25rem; }
.ny-kpi .ny-kpi-ico {
    width: 48px; height: 48px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.25rem; color: #fff;
}
.ny-kpi .ny-kpi-val { font-size: 1.5rem; font-weight: 700; line-height: 1; }
.ny-kpi .ny-kpi-lbl { font-size: .78rem; color: var(--ny-text-muted); }
.bg-grad-blue   { background: linear-gradient(135deg,#4e73df,#224abe); }
.bg-grad-green  { background: linear-gradient(135deg,#1cc88a,#13855c); }
.bg-grad-amber  { background: linear-gradient(135deg,#f6c23e,#dda20a); }
.bg-grad-cyan   { background: linear-gradient(135deg,#36b9cc,#258391); }
.bg-grad-pink   { background: linear-gradient(135deg,#e83e8c,#b3186a); }
.bg-grad-grey   { background: linear-gradient(135deg,#858796,#5a5c69); }

/* ---------- Fiche : onglets en haut ---------- */
.ny-ftabs { border-bottom: 2px solid #e6e9ef; margin-bottom: 1rem; flex-wrap: wrap; }
.ny-ftabs .nav-link {
    background: none; border: none; border-bottom: 2px solid transparent;
    margin-bottom: -2px; cursor: pointer;
    color: #5a677d; font-weight: 600; font-size: .85rem; padding: .55rem .9rem;
}
.ny-ftabs .nav-link:hover { color: var(--ny-accent-2); background: #f3f6fd; border-radius: .3rem .3rem 0 0; }
.ny-ftabs .nav-link.active {
    color: var(--ny-accent-2); background: transparent;
    border-bottom-color: var(--ny-accent);
}
.ny-ftab.d-none { display: none !important; }

/* ---------- Fiche : édition inline (compacte) ---------- */
.ny-field { display: flex; flex-direction: column; margin-bottom: .5rem; }
.ny-field label { font-size: .68rem; text-transform: uppercase;
    letter-spacing: .03em; color: var(--ny-text-muted); margin-bottom: .1rem; }

/* Champ RENSEIGNÉ : encadré plein, bien lisible (point 3) */
.ny-editable {
    min-height: 1.65rem; padding: .22rem .45rem; border-radius: .3rem;
    border: 1px solid #e6e9ef; background: #fbfcfe; color: #2b3445;
    cursor: text; transition: background .12s; font-weight: 500;
}
/* Survol : léger fond, AUCUN liséré/bordure colorée */
.ny-editable:hover { background: #eef4ff; }

/* Champ VIDE : discret, pointillés estompés → contraste avec les champs remplis */
.ny-editable.empty {
    color: #b6bdc9; font-style: italic; font-weight: 400;
    background: transparent; border-style: dashed; border-color: #e2e6ee;
}

/* Champ de type liste déroulante : chevron CSS pur (sans FontAwesome) — point 4 */
.ny-editable-select { position: relative; padding-right: 1.5rem; cursor: pointer; }
.ny-editable-select::after {
    content: ""; position: absolute; right: .6rem; top: 50%;
    width: .5rem; height: .5rem; margin-top: -.35rem;
    border-right: 2px solid #97a3b6; border-bottom: 2px solid #97a3b6;
    transform: rotate(45deg); pointer-events: none;
}

.ny-editable.saving { opacity: .5; }
.ny-saved-flash { animation: nyflash 1s ease; }
@keyframes nyflash { 0% { background: #d4edda; } 100% { background: #fbfcfe; } }

/* Cartes d'info plus compactes dans l'onglet Coordonnées */
.ny-view .card-body { padding: .85rem 1rem; }
.ny-view .card-header { padding: .55rem 1rem; font-size: .85rem; }

/* ---------- Timeline notes ---------- */
.ny-timeline { position: relative; padding-left: 1.5rem; }
.ny-timeline:before { content:''; position:absolute; left:.4rem; top:0; bottom:0;
    width:2px; background:#e6e9ef; }
.ny-note { position: relative; margin-bottom: 1rem; }
.ny-note:before { content:''; position:absolute; left:-1.27rem; top:.35rem;
    width:11px; height:11px; border-radius:50%; background:var(--ny-accent);
    border:2px solid #fff; }
.ny-note .ny-note-meta { font-size:.72rem; color:var(--ny-text-muted); }
.ny-note .ny-note-body { background:#fff; border:1px solid #eef0f4;
    border-radius:.4rem; padding:.55rem .75rem; margin-top:.2rem;
    white-space: pre-wrap; }

/* ---------- divers ---------- */
.badge-statut { font-weight:600; }
.table-sm td, .table-sm th { padding: .45rem .6rem; }
@media (max-width: 768px) {
    .ny-main { margin-left: 0; }
    .ny-sidebar { transform: translateX(-100%); }
    body.ny-show-sidebar .ny-sidebar { transform: translateX(0); }
}
