:root{
 --bg:#f4f7f8;--surface:#fff;--soft:#f7fafb;--navy:#071c29;
 --navy2:#0b2b3b;--text:#10212b;--muted:#71808a;--line:#e3e9ec;
 --primary:#10b9aa;--primary2:#19c9b5;--danger:#d84b4b;
 --radius:18px;--shadow:0 18px 50px rgba(6,28,41,.10)
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--text)}
button,input{font:inherit}button{cursor:pointer}.hidden{display:none!important}
.eyebrow{color:var(--primary);font-size:11px;font-weight:800;letter-spacing:.18em}
.login-view{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;background:#fff}
.login-brand{min-height:100vh;padding:56px 64px;color:#fff;display:flex;flex-direction:column;position:relative;overflow:hidden;background:radial-gradient(circle at 80% 20%,rgba(16,185,170,.28),transparent 25%),linear-gradient(145deg,#061821,#092b38 50%,#0b4a4c)}
.brand-logo,.sidebar-brand{display:flex;align-items:center;gap:14px;letter-spacing:.15em}
.brand-logo strong,.sidebar-brand strong{display:block;font-size:17px}
.brand-logo span,.sidebar-brand span,.mobile-logo span{color:#5de0d3}
.drop{width:48px;height:48px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(145deg,#55e0d1,#079e94);color:#06252d;font-weight:900;box-shadow:0 10px 30px rgba(16,185,170,.3)}
.drop.small{width:38px;height:38px;border-radius:12px}
.login-message{margin:auto 0;max-width:620px}
.login-message h1{margin:18px 0;font-size:clamp(42px,5vw,70px);line-height:1.02;letter-spacing:-.045em}
.login-message p{max-width:530px;color:rgba(255,255,255,.68);font-size:18px;line-height:1.7}
.brand-footer{color:rgba(255,255,255,.45);font-size:13px;letter-spacing:.12em}
.login-panel{display:grid;place-items:center;padding:60px}
.login-card{width:min(440px,100%)}.mobile-logo{display:none}
.login-card h2{margin:10px 0 5px;font-size:40px;letter-spacing:-.035em}
.login-card>p{color:var(--muted);margin:0 0 36px}
label{display:block;margin:17px 0 8px;font-size:13px;font-weight:700}
input{width:100%;border:1px solid var(--line);background:#fff;color:var(--text);border-radius:12px;padding:14px 15px;outline:none;transition:.18s}
input:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(16,185,170,.10)}
.primary-button,.secondary-button,.logout-button,.text-button,.close-button{border:0}
.primary-button{width:100%;margin-top:24px;padding:14px 20px;border-radius:12px;background:linear-gradient(135deg,var(--primary),var(--primary2));color:#042b2c;font-weight:800}
.primary-button.compact{width:auto;margin:0;padding:12px 18px}
.login-card small{display:block;margin-top:18px;text-align:center;color:var(--muted)}
.error-message{min-height:20px;margin-top:12px;color:var(--danger);font-size:13px}
.sidebar{position:fixed;inset:0 auto 0 0;width:255px;background:linear-gradient(180deg,#061a26,#082432);color:#fff;padding:24px 17px;display:flex;flex-direction:column;z-index:20}
.sidebar-brand{padding:4px 10px 27px}
.sidebar nav{display:flex;flex-direction:column;gap:5px}
.nav-item{width:100%;border:0;background:transparent;color:#9fb0b9;padding:11px 13px;border-radius:10px;text-align:left;display:flex;gap:12px;align-items:center}
.nav-item:hover:not(.disabled),.nav-item.active{color:#fff;background:rgba(25,201,181,.12)}
.nav-item.active{box-shadow:inset 3px 0 var(--primary)}
.nav-item.disabled{opacity:.46;cursor:default}
.nav-separator{height:1px;background:rgba(255,255,255,.07);margin:13px 8px}
.sidebar-bottom{margin-top:auto}
.user-card{display:flex;align-items:center;gap:11px;margin-top:13px;padding:13px;border-radius:12px;background:rgba(255,255,255,.05)}
.avatar{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:var(--primary);color:#06252c;font-weight:900}
.user-card strong,.user-card small{display:block}.user-card strong{font-size:12px}
.user-card small{color:#78939e;margin-top:3px;font-size:10px}
.main-content{margin-left:255px;min-height:100vh}
.topbar{height:82px;padding:0 35px;background:rgba(255,255,255,.92);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10}
.topbar h2{margin:0 0 3px;font-size:17px}.topbar #currentDate{color:var(--muted);font-size:12px}
.top-actions{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:12px}
.online-dot{width:8px;height:8px;background:#1bc784;border-radius:50%}
.logout-button{margin-left:15px;padding:9px 12px;border-radius:9px;background:var(--soft);color:var(--muted)}
.page{padding:34px}

/* DASHBOARD */

.welcome,.page-heading{
 display:flex;align-items:center;justify-content:space-between;margin-bottom:28px
}
.welcome h1,.page-heading h1{
 margin:7px 0 4px;font-size:32px;letter-spacing:-.035em
}
.welcome p,.page-heading p{margin:0;color:var(--muted)}

.stats-grid{
 display:grid;grid-template-columns:repeat(4,1fr);gap:17px
}
.stat-card,.panel{
 background:var(--surface);border:1px solid var(--line);
 border-radius:var(--radius);box-shadow:0 8px 30px rgba(6,28,41,.035)
}
.stat-card{padding:22px}
.stat-card span,.stat-card small{display:block;color:var(--muted)}
.stat-card span{font-size:12px;font-weight:700}
.stat-card strong{display:block;margin:10px 0 7px;font-size:28px}
.stat-card small{font-size:11px}

.dashboard-grid{
 display:grid;grid-template-columns:1.25fr .75fr;gap:17px;margin-top:17px
}
.panel{padding:22px}
.panel-header{
 display:flex;align-items:center;justify-content:space-between;margin-bottom:18px
}
.panel-header h3{margin:0;font-size:15px}
.panel-header p{margin:4px 0 0;color:var(--muted);font-size:11px}
.text-button{background:transparent;color:#07988c;font-weight:700}
.live-badge{
 padding:5px 8px;border-radius:8px;color:#0b9b69;
 background:#e9faf3;font-size:9px;font-weight:800
}
.empty-state{
 padding:34px;border:1px dashed #d8e1e5;border-radius:13px;
 text-align:center;color:var(--muted);font-size:13px
}

.activity-feed{display:grid;gap:10px}
.activity-item{
 display:flex;align-items:center;gap:12px;padding:12px;
 border-radius:12px;background:var(--soft)
}
.activity-icon{
 width:32px;height:32px;display:grid;place-items:center;
 border-radius:9px;background:#e4f8f5;color:#07988c;font-weight:900
}
.activity-item strong,.activity-item small{display:block}
.activity-item strong{font-size:12px}
.activity-item small{color:var(--muted);font-size:10px;margin-top:3px}


/* CLIENTS */

.client-toolbar{
 display:flex;align-items:center;justify-content:space-between;
 gap:20px;margin-bottom:18px
}
.client-toolbar input{max-width:380px}
.client-toolbar span{color:var(--muted);font-size:12px}

.table-wrapper{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th{
 color:var(--muted);font-size:10px;text-transform:uppercase;
 letter-spacing:.08em;text-align:left;padding:12px 13px;
 border-bottom:1px solid var(--line)
}
td{
 padding:15px 13px;border-bottom:1px solid #edf1f3;
 font-size:12px
}
tbody tr{transition:.15s}
tbody tr:hover{background:#f8fbfb}


/* MODAL CLIENT */

.modal{
 position:fixed;inset:0;z-index:100;
 display:grid;place-items:center
}
.modal-backdrop{
 position:absolute;inset:0;background:rgba(2,17,24,.62);
 backdrop-filter:blur(5px)
}
.modal-card{
 position:relative;z-index:1;width:min(650px,calc(100% - 35px));
 padding:26px;border-radius:20px;background:#fff;
 box-shadow:var(--shadow)
}
.modal-header{
 display:flex;justify-content:space-between;align-items:flex-start
}
.modal-header h2{margin:6px 0 0}
.close-button{
 background:#f1f5f6;color:var(--muted);width:34px;height:34px;
 border-radius:9px;font-size:20px
}
.form-grid{
 display:grid;grid-template-columns:1fr 1fr;
 gap:0 16px;margin-top:20px
}
.form-grid .full{grid-column:1/-1}
.modal-actions{
 display:flex;justify-content:flex-end;gap:10px;margin-top:25px
}
.secondary-button{
 padding:12px 18px;border-radius:11px;
 background:#eef3f4;color:var(--text);font-weight:700
}


/* NOTIFICATIONS */

.toast-container{
 position:fixed;right:22px;bottom:22px;z-index:200;
 display:grid;gap:9px
}
.toast{
 min-width:280px;padding:14px 16px;border-radius:12px;
 background:var(--navy);color:#fff;box-shadow:var(--shadow);
 font-size:12px;animation:toastIn .2s ease
}
@keyframes toastIn{
 from{transform:translateY(8px);opacity:0}
 to{transform:translateY(0);opacity:1}
}


/* RESPONSIVE */

@media(max-width:1050px){
 .stats-grid{grid-template-columns:repeat(2,1fr)}
 .dashboard-grid{grid-template-columns:1fr}
}

@media(max-width:850px){
 .login-view{grid-template-columns:1fr}
 .login-brand{display:none}
 .mobile-logo{
  display:block;margin-bottom:35px;font-weight:900;
  letter-spacing:.14em
 }
 .sidebar{width:76px;padding-inline:10px}
 .sidebar-brand>div:last-child,
 .nav-item span,
 .user-card>div:last-child{display:none}
 .sidebar-brand{padding-inline:9px}
 .nav-item{justify-content:center;font-size:18px}
 .main-content{margin-left:76px}
}

@media(max-width:620px){
 .login-panel{padding:30px}
 .page{padding:22px 17px}
 .topbar{padding:0 18px}
 .top-actions>span:not(.online-dot){display:none}

 .stats-grid{grid-template-columns:1fr}
 .welcome,.page-heading{
  align-items:flex-start;gap:18px;flex-direction:column
 }
 .form-grid{grid-template-columns:1fr}
 .form-grid .full{grid-column:auto}
 .modal-card{padding:20px}
 .client-toolbar{align-items:stretch;flex-direction:column}
 .client-toolbar input{max-width:none}
}

/* ===== CLIENT PROFILE V0.3 ===== */

.profile-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:24px;
  margin-bottom:28px;
}

/* ESPACES MÉTIER */
.workspace-chooser{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:linear-gradient(135deg,rgba(4,24,34,.96),rgba(8,55,60,.98));color:#fff;padding:32px}
.workspace-chooser-inner{width:min(880px,100%);text-align:center}.workspace-chooser h1{margin:14px 0 9px;font-size:clamp(30px,5vw,48px);letter-spacing:-.045em}.workspace-chooser p{margin:0;color:rgba(255,255,255,.66);font-size:16px}.workspace-cards{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:38px;text-align:left}.workspace-card{border:1px solid rgba(255,255,255,.14);border-radius:22px;padding:26px;display:flex;gap:18px;align-items:flex-start;color:#fff;min-height:210px;cursor:pointer;transition:.2s;box-shadow:0 20px 50px rgba(0,0,0,.16)}.workspace-card:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.42)}.workspace-card-clean{background:linear-gradient(145deg,#0d4c55,#0b2b3b)}.workspace-card-catering{background:linear-gradient(145deg,#5b2e47,#2f1d36)}.workspace-card-icon{width:50px;height:50px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.14);font-size:24px;color:#77eee1}.workspace-card-catering .workspace-card-icon{color:#ffcf9a}.workspace-card-body{display:flex;flex:1;flex-direction:column;gap:10px}.workspace-card-body strong{font-size:22px}.workspace-card-body small{color:rgba(255,255,255,.7);font-size:13px;line-height:1.55}.workspace-card-link{margin-top:auto;color:#8bf0e3;font-size:12px;font-weight:800}.workspace-card-catering .workspace-card-link{color:#ffd4a5}.workspace-switcher{width:100%;display:flex;align-items:center;gap:9px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:#fff;border-radius:12px;padding:10px 11px;margin:0 0 18px;text-align:left}.workspace-switcher:hover{background:rgba(255,255,255,.1)}.workspace-switcher>span:nth-child(2){display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.workspace-switcher small{color:#78939e;font-size:8px;letter-spacing:.12em}.workspace-switcher strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.workspace-switcher-chevron{color:#8ba8b1}.workspace-switcher-dot{width:9px;height:9px;border-radius:50%;background:#17c9b5;flex:none}.workspace-switcher-dot.catering{background:#f0a870}.workspace-change-button{color:#86a5af;font-size:11px}.nav-group-label{margin:7px 10px 3px;color:#5e7c87;font-size:8px;font-weight:800;letter-spacing:.14em}.catering-eyebrow{color:#d28256}.catering-stat{border-top:3px solid #d28256}.catering-badge{color:#a55d35;background:#fff1e4}.traiteur-page .primary-button{background:linear-gradient(135deg,#df9364,#f2b078);color:#3b2115}.traiteur-page .text-button{color:#b9683e}.agenda-list{display:grid;gap:8px}.agenda-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;background:#fff8f2}.agenda-date{min-width:80px;color:#b9683e;font-size:11px;font-weight:800}.agenda-item span:nth-child(2){display:flex;flex:1;flex-direction:column;gap:3px}.agenda-item strong{font-size:12px}.agenda-item small{font-size:10px;color:var(--muted)}.agenda-arrow{color:#c88054;font-size:18px}.check-list{display:grid;gap:13px}.check-list label{margin:0;display:flex;align-items:flex-start;gap:9px;font-size:12px;font-weight:600}.check-list input{width:16px;height:16px;accent-color:#d28256}.status-pill{display:inline-flex;padding:5px 8px;border-radius:999px;background:#eef4f4;color:#4d7071;font-size:10px;font-weight:800;white-space:nowrap}.status-confirme,.status-confirmée{background:#e6f8f0;color:#16815d}.status-a-confirmer,.status-a-preparer{background:#fff2dc;color:#a46b16}.status-devis-envoye{background:#f0ebff;color:#755cb0}.status-acompte-recu{background:#e9f0ff;color:#4e73b4}.table-action{border:0;background:transparent;color:#b9683e;font-size:11px;font-weight:800}.filter-chip{display:inline-flex;margin-right:6px;padding:8px 11px;border-radius:999px;background:#f3f6f7;color:var(--muted);font-size:11px;font-weight:700}.filter-chip.active{background:#fff0e5;color:#b9683e}.menu-catalogue{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.menu-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 8px 30px rgba(6,28,41,.035);display:grid;grid-template-columns:58px 1fr;gap:14px}.menu-card-art{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;font-size:24px;color:#fff;background:linear-gradient(135deg,#b55e46,#efb071)}.menu-card-art.art-2{background:linear-gradient(135deg,#733c57,#d68e74)}.menu-card-art.art-3{background:linear-gradient(135deg,#a8784d,#f2c18b)}.menu-card h3{margin:5px 0 3px;font-size:15px}.menu-card p{margin:0 0 8px;color:var(--muted);font-size:11px;line-height:1.5}.menu-card small{color:#b9683e;font-size:10px;font-weight:800}.menu-card .text-button{grid-column:1/-1;text-align:left;border-top:1px solid var(--line);padding-top:12px}.production-board{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.production-column{background:#f6f8f8;border:1px solid var(--line);border-radius:18px;padding:17px;min-height:230px}.production-column:nth-child(2){background:#fff9f3}.production-column:nth-child(3){background:#f2faf5}.production-column-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.production-column-heading h3{margin:0;font-size:14px}.production-column-heading span{font-size:10px;color:var(--muted)}.production-task{background:#fff;border:1px solid var(--line);border-radius:13px;padding:13px;margin-top:9px}.production-task strong,.production-task small{display:block}.production-task strong{font-size:12px}.production-task small{margin-top:5px;color:var(--muted);font-size:10px}.task-progress{height:5px;background:#e6edee;border-radius:99px;margin-top:13px;overflow:hidden}.task-progress span{display:block;height:100%;background:#d28256;border-radius:99px}.delivery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.delivery-card{display:flex;gap:13px;align-items:flex-start;padding:19px;border:1px solid var(--line);background:#fff;border-radius:18px;box-shadow:0 8px 30px rgba(6,28,41,.035)}.delivery-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:13px;background:#fff0e5;color:#b9683e;font-size:20px}.delivery-card h3{margin:6px 0 4px;font-size:14px}.delivery-card p{margin:0 0 10px;color:var(--muted);font-size:11px}.delivery-card .text-button{margin-left:auto;font-size:10px;white-space:nowrap}.feature-callout{display:flex;flex-direction:column;gap:8px;padding:22px;border-radius:18px;background:linear-gradient(135deg,#fff5ea,#fff);border:1px solid #f0d8c1}.feature-callout strong{font-size:16px}.feature-callout span{color:var(--muted);font-size:12px}.document-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.document-tile{min-height:130px;padding:22px;border:1px solid var(--line);border-radius:18px;background:#fff;display:flex;flex-direction:column;justify-content:flex-end;gap:8px}.document-tile strong{font-size:14px}.document-tile small{color:var(--muted);font-size:11px}
@media(max-width:850px){.workspace-cards,.menu-catalogue,.production-board,.delivery-grid,.document-grid{grid-template-columns:1fr}.workspace-chooser{padding:22px}.workspace-card{min-height:0}.workspace-switcher{padding-inline:7px}}

.profile-header h1{
  margin:8px 0 4px;
  font-size:32px;
}

.profile-back{
  border:0;
  background:transparent;
  padding:0;
  margin-bottom:18px;
  cursor:pointer;
  color:#64748b;
  font-weight:600;
}

.profile-info-grid{
  display:grid;
  grid-template-columns:1fr 1fr 2fr;
  gap:16px;
  margin-bottom:20px;
}

.profile-info,
.profile-card{
  background:#fff;
  border:1px solid #e3eaed;
  border-radius:16px;
}

.profile-info{
  padding:20px;
}

.profile-info small{
  display:block;
  color:#78909c;
  font-size:11px;
  font-weight:700;
  margin-bottom:8px;
}

.profile-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
}

.profile-card{
  padding:22px;
  min-height:220px;
}

.profile-card-title{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  padding-bottom:16px;
  border-bottom:1px solid #edf1f2;
}

.profile-card-title h2{
  margin:0;
  font-size:18px;
}

.profile-card-title p{
  margin:4px 0 0;
  color:#84949d;
  font-size:13px;
}

.profile-row{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:14px 0;
  border-bottom:1px solid #edf1f2;
}

.profile-row:last-child{
  border-bottom:0;
}

.profile-row span,
.profile-row small{
  color:#71818b;
}

.profile-empty{
  padding:32px 0;
  text-align:center;
  color:#8b9aa2;
}

.profile-modules{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:12px;
  margin-top:20px;
}

.profile-modules > div{
  background:#fff;
  border:1px solid #e3eaed;
  border-radius:14px;
  padding:16px;
  font-weight:700;
}

.profile-modules small{
  display:block;
  margin-top:5px;
  color:#94a3ab;
  font-weight:400;
}

.small-button{
  border:0;
  border-radius:10px;
  padding:9px 13px;
  background:#e8faf7;
  color:#078f80;
  font-weight:700;
  cursor:pointer;
}

@media(max-width:900px){
  .profile-info-grid,
  .profile-grid{
    grid-template-columns:1fr;
  }

  .profile-modules{
    grid-template-columns:repeat(2,1fr);
  }
}


/* ==========================================================
   LUMYSIA BUSINESS FINAL
   ========================================================== */

.business-row {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(120px, 1fr))
        auto;
    gap: 18px;
    align-items: center;
    padding: 17px 12px;
    border-bottom: 1px solid var(--line);
}

.business-row:last-child {
    border-bottom: 0;
}

.business-row > div {
    min-width: 0;
}

.business-row small {
    display: block;
    margin-bottom: 5px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.business-row strong {
    display: block;
    overflow: hidden;
    color: var(--ink);
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-row-actions {
    display: flex;
    gap: 7px;
    justify-content: flex-end;
}

.business-row-actions button {
    border: 0;
    border-radius: 9px;
    background: var(--brand-soft);
    color: var(--brand-dark);
    cursor: pointer;
    font-size: 11px;
    font-weight: 800;
    padding: 9px 11px;
}

.business-row-actions .danger-action {
    background: #fff1f2;
    color: #be123c;
}

.empty-state {
    padding: 48px 20px;
    color: var(--muted);
    text-align: center;
}

.stats-grid {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.stats-grid .stat-card {
    min-height: 145px;
}

#businessFields {
    max-height: 58vh;
    overflow-y: auto;
    padding-right: 4px;
}

#businessFields input {
    width: 100%;
}

.nav-item:not(.disabled) {
    cursor: pointer;
}

@media (max-width: 1150px) {

    .business-row {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .business-row-actions {
        justify-content: flex-start;
    }

    .stats-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {

    .business-row {
        grid-template-columns: 1fr;
    }

    .stats-grid {
        grid-template-columns: 1fr;
    }

    .profile-header {
        flex-direction: column;
    }

    .profile-modules {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================
   USER SETTINGS
   ========================================================== */

.settings-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(320px, .85fr);
    gap: 20px;
    align-items: start;
}

.settings-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    box-shadow: 0 14px 35px rgba(16, 46, 55, .06);
    padding: 24px;
}

.settings-card-heading {
    display: flex;
    gap: 14px;
    align-items: center;
    margin-bottom: 24px;
}

.settings-card-heading h2 {
    margin: 0 0 4px;
    color: var(--ink);
    font-size: 19px;
}

.settings-card-heading p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
}

.settings-icon {
    display: grid;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    place-items: center;
    border-radius: 14px;
    background: var(--brand-soft);
    color: var(--brand-dark);
    font-weight: 900;
}

.settings-icon.secondary {
    background: #eef2ff;
    color: #4f46e5;
}

.settings-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.settings-form-grid .form-field,
.settings-password-form .form-field {
    margin: 0;
}

.settings-form-grid input,
.settings-form-grid select,
.settings-password-form input {
    width: 100%;
    box-sizing: border-box;
}

.settings-divider {
    height: 1px;
    margin: 24px 0;
    background: var(--line);
}

.settings-preferences {
    display: grid;
    gap: 10px;
}

.settings-toggle {
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: space-between;
    border: 1px solid var(--line);
    border-radius: 13px;
    padding: 14px 16px;
    cursor: pointer;
}

.settings-toggle strong,
.settings-toggle small {
    display: block;
}

.settings-toggle small {
    margin-top: 4px;
    color: var(--muted);
}

.settings-toggle input {
    width: 19px;
    height: 19px;
    accent-color: var(--brand);
}

.settings-actions {
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    margin-top: 22px;
}

.role-pill {
    border-radius: 999px;
    background: #edfdf9;
    color: var(--brand-dark);
    font-size: 12px;
    font-weight: 800;
    padding: 8px 12px;
}

.settings-password-form {
    display: grid;
    gap: 16px;
}

.settings-password-form .form-field small {
    margin-top: 5px;
    color: var(--muted);
}

.settings-status {
    margin-bottom: 18px;
    border: 1px solid #a7eadb;
    border-radius: 12px;
    background: #edfdf9;
    color: #08786b;
    font-weight: 700;
    padding: 13px 16px;
}

.settings-status.error {
    border-color: #fecdd3;
    background: #fff1f2;
    color: #be123c;
}

#userSettingsPage :disabled {
    cursor: wait;
    opacity: .65;
}

@media (max-width: 980px) {
    .settings-grid,
    .settings-form-grid {
        grid-template-columns: 1fr;
    }
}

/* LUMYSIA UI 2.0 — hiérarchie, profondeur et responsive */
:root {
    --bg: #f2f6f7;
    --surface: #ffffff;
    --soft: #f7fafb;
    --navy: #071a27;
    --navy2: #0e3040;
    --text: #102630;
    --muted: #71838b;
    --line: #dfe8eb;
    --primary: #13b8a7;
    --primary2: #56d8c5;
    --radius: 20px;
    --shadow: 0 20px 55px rgba(8, 35, 48, .09);
}

html { background: var(--bg); }
body {
    background:
        radial-gradient(circle at 88% -8%, rgba(19,184,167,.12), transparent 28rem),
        radial-gradient(circle at 18% 104%, rgba(93,132,201,.08), transparent 30rem),
        var(--bg);
    letter-spacing: -.005em;
}
.sidebar {
    width: 278px;
    padding: 26px 18px 20px;
    background: linear-gradient(180deg, #061923 0%, #082b39 62%, #092633 100%);
    box-shadow: 14px 0 38px rgba(4, 25, 35, .12);
}
.sidebar-brand { padding: 4px 12px 24px; }
.sidebar-brand .drop { box-shadow: 0 12px 28px rgba(19,184,167,.23); }
.workspace-switcher {
    margin-bottom: 22px;
    padding: 13px 12px;
    border-radius: 15px;
    background: linear-gradient(135deg, rgba(255,255,255,.11), rgba(255,255,255,.04));
    border-color: rgba(255,255,255,.14);
}
.workspace-switcher-dot { box-shadow: 0 0 0 4px rgba(19,184,167,.13); }
.workspace-switcher-dot.catering { box-shadow: 0 0 0 4px rgba(240,168,112,.14); }
.nav-group-label { margin: 12px 11px 7px; color: #6c8b96; }
.sidebar nav { gap: 4px; }
.nav-item {
    min-height: 42px;
    padding: 11px 13px;
    border: 1px solid transparent;
    border-radius: 13px;
    transition: background .18s, transform .18s, border-color .18s;
}
.nav-item:hover:not(.disabled) { transform: translateX(2px); background: rgba(255,255,255,.07); }
.nav-item.active {
    background: linear-gradient(90deg, rgba(19,184,167,.25), rgba(19,184,167,.08));
    border-color: rgba(93,224,211,.18);
    box-shadow: inset 3px 0 var(--primary), 0 7px 22px rgba(0,0,0,.08);
}
body[data-workspace="traiteur"] .nav-item.active {
    background: linear-gradient(90deg, rgba(210,130,86,.30), rgba(210,130,86,.08));
    border-color: rgba(255,207,154,.2);
    box-shadow: inset 3px 0 #e7a174, 0 7px 22px rgba(0,0,0,.08);
}
.sidebar-bottom { padding-top: 14px; }
.user-card { border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.07); }
.main-content { margin-left: 278px; }
.topbar {
    height: 88px;
    padding: 0 46px;
    background: rgba(255,255,255,.76);
    border-bottom-color: rgba(223,232,235,.85);
    backdrop-filter: blur(18px);
}
.topbar h2 { font-size: 20px; letter-spacing: -.025em; }
.topbar #currentDate { font-size: 12px; }
.top-actions { gap: 12px; }
.logout-button { border: 1px solid var(--line); background: #fff; transition: .18s; }
.logout-button:hover { border-color: var(--primary); color: var(--text); }
.page { max-width: 1500px; margin: 0 auto; padding: 40px 46px 58px; }
.welcome, .page-heading { margin-bottom: 30px; }
.welcome h1, .page-heading h1 { font-size: clamp(30px, 3vw, 42px); letter-spacing: -.055em; }
.welcome p, .page-heading p { max-width: 620px; line-height: 1.6; }
.stats-grid { gap: 18px; }
.stat-card, .panel, .menu-card, .delivery-card, .document-tile {
    border-color: rgba(223,232,235,.92);
    border-radius: 20px;
    box-shadow: 0 8px 26px rgba(8,35,48,.035);
    transition: transform .2s, box-shadow .2s, border-color .2s;
}
.stat-card:hover, .panel:hover, .menu-card:hover, .delivery-card:hover, .document-tile:hover {
    transform: translateY(-3px);
    border-color: rgba(19,184,167,.28);
    box-shadow: var(--shadow);
}
.stat-card { position: relative; overflow: hidden; padding: 23px 24px; }
.stat-card::after { content: ""; position: absolute; width: 68px; height: 68px; right: -24px; top: -24px; border-radius: 50%; background: rgba(19,184,167,.08); }
.stat-card strong { font-size: 32px; letter-spacing: -.055em; }
.dashboard-grid { gap: 18px; margin-top: 18px; }
.panel { padding: 23px; }
.panel-heading { margin-bottom: 17px; }
.panel-heading h2 { letter-spacing: -.03em; }
table th { color: #80939b; letter-spacing: .1em; font-size: 10px; }
table td { padding: 17px 15px; border-bottom-color: #edf2f3; }
table tbody tr { transition: background .16s; }
table tbody tr:hover { background: #f7fbfb; }
.client-toolbar { padding: 16px; border-bottom: 1px solid var(--line); background: #fbfcfc; }
.primary-button { border: 1px solid rgba(255,255,255,.2); border-radius: 13px; box-shadow: 0 9px 20px rgba(19,184,167,.18); transition: transform .18s, box-shadow .18s; }
.primary-button:hover { transform: translateY(-2px); box-shadow: 0 13px 26px rgba(19,184,167,.25); }
.secondary-button { border: 1px solid var(--line); border-radius: 13px; background: #fff; color: var(--text); padding: 12px 17px; font-weight: 800; }
.secondary-button:hover { border-color: var(--primary); color: var(--primary); }
.workspace-chooser { background: radial-gradient(circle at 18% 15%, rgba(19,184,167,.22), transparent 22rem), radial-gradient(circle at 85% 80%, rgba(220,139,100,.20), transparent 24rem), linear-gradient(135deg, #061923, #0a3442 55%, #172a3d); }
.workspace-chooser-inner { width: min(1020px, 100%); }
.workspace-chooser h1 { font-size: clamp(36px, 6vw, 62px); }
.workspace-cards { gap: 22px; margin-top: 44px; }
.workspace-card { min-height: 244px; padding: 31px; border-radius: 28px; border-color: rgba(255,255,255,.2); }
.workspace-card:hover { box-shadow: 0 28px 70px rgba(0,0,0,.25); }
.workspace-card-body strong { font-size: 25px; letter-spacing: -.035em; }
.workspace-card-icon { width: 58px; height: 58px; border-radius: 18px; }
.traiteur-page .primary-button { box-shadow: 0 9px 20px rgba(210,130,86,.2); }
.traiteur-page .stat-card { border-top: 3px solid #d28256; }
.settings-shell, .settings-card { border-radius: 22px; }
.modal-card { border-radius: 24px; box-shadow: 0 30px 90px rgba(4,24,34,.25); }
.toast { border-radius: 14px; box-shadow: 0 15px 35px rgba(8,35,48,.18); }
.login-brand { padding: 64px 72px; background: radial-gradient(circle at 78% 22%, rgba(19,184,167,.35), transparent 28%), radial-gradient(circle at 24% 85%, rgba(76,130,212,.22), transparent 24%), linear-gradient(145deg,#061821,#082c3b 54%,#0d4a4b); }
.login-message h1 { font-size: clamp(46px, 6vw, 82px); }
.login-panel { padding: 70px; background: rgba(255,255,255,.84); }
.login-card { padding: 10px 0; }
.login-card h2 { font-size: 44px; }
.login-card input { padding: 16px; border-radius: 14px; background: #fbfcfc; }
.login-card .primary-button { padding: 16px; }

@media (max-width: 1050px) {
    .sidebar { width: 242px; }
    .main-content { margin-left: 242px; }
    .topbar { padding-inline: 30px; }
    .page { padding-inline: 30px; }
}
@media (max-width: 850px) {
    .sidebar { width: 76px; padding-inline: 10px; }
    .main-content { margin-left: 76px; }
    .topbar { padding-inline: 22px; }
    .page { padding-inline: 22px; }
    .workspace-switcher { padding-inline: 8px; }
}
@media (max-width: 620px) {
    .topbar { height: 74px; padding-inline: 16px; }
    .page { padding: 26px 16px 42px; }
    .welcome, .page-heading { align-items: flex-start; flex-direction: column; gap: 18px; }
    .welcome h1, .page-heading h1 { font-size: 31px; }
    .page-heading .primary-button, .page-heading .secondary-button { width: 100%; }
    .workspace-cards { grid-template-columns: 1fr; margin-top: 30px; }
    .workspace-card { min-height: 0; }
    .login-brand { min-height: 42vh; padding: 34px 28px; }
    .login-message { margin: auto 0 0; }
    .login-message h1 { font-size: 44px; }
    .login-panel { padding: 38px 24px; }
}

/* ADMINISTRATION */
.nav-admin-only { color: #d8b4fe; }
.admin-security-badge { display: inline-flex; align-items: center; border: 1px solid #d9c4fb; border-radius: 999px; padding: 9px 13px; background: #f8f3ff; color: #7651a9; font-size: 11px; font-weight: 800; }
.admin-grid { display: grid; grid-template-columns: minmax(360px, .8fr) minmax(520px, 1.2fr); gap: 20px; align-items: start; }
.admin-form-card, .admin-users-card { min-width: 0; }
.admin-form-card .settings-card-heading, .admin-users-card .settings-card-heading { margin-bottom: 22px; }
.admin-section-label { margin: 24px 0 11px; color: var(--text); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.admin-check-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.admin-check-grid label, .admin-permissions label { display: flex; align-items: center; gap: 9px; margin: 0; padding: 11px 12px; border: 1px solid var(--line); border-radius: 12px; background: #fbfcfc; color: var(--text); font-size: 12px; font-weight: 700; transition: .18s; }
.admin-check-grid label:has(input:checked), .admin-permissions label:has(input:checked) { border-color: rgba(19,184,167,.42); background: #effcf9; }
.admin-check-grid input, .admin-permissions input { width: 17px; height: 17px; accent-color: var(--primary); }
.admin-permissions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.admin-active-toggle { margin-top: 21px; }
.admin-users-list { display: grid; gap: 10px; }
.admin-user-row { display: grid; grid-template-columns: minmax(180px, 1.25fr) minmax(135px, .9fr) auto; gap: 15px; align-items: center; padding: 15px; border: 1px solid var(--line); border-radius: 15px; background: #fbfcfc; transition: .18s; }
.admin-user-row:hover { border-color: rgba(19,184,167,.35); background: #fff; box-shadow: 0 10px 25px rgba(8,35,48,.06); }
.admin-user-row.is-disabled { opacity: .62; }
.admin-user-identity { display: flex; align-items: center; gap: 10px; min-width: 0; }
.admin-user-identity .avatar { width: 34px; height: 34px; flex: none; }
.admin-user-identity strong, .admin-user-identity small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-user-identity strong { font-size: 13px; }
.admin-user-identity small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.admin-user-meta { display: grid; gap: 6px; }
.admin-user-meta .role-pill { width: max-content; padding: 5px 8px; font-size: 10px; }
.admin-user-meta > small { color: #1a8b6e; font-size: 10px; font-weight: 800; }
.admin-user-row.is-disabled .admin-user-meta > small { color: #a46b16; }
.admin-chip { display: inline-flex; margin-right: 4px; padding: 4px 7px; border-radius: 999px; background: #edf1f3; color: #58717a; font-size: 9px; font-weight: 800; }
.admin-user-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
.admin-user-actions .text-button { padding: 2px 0; font-size: 10px; }
.admin-user-actions .text-button.danger { color: #c45959; }
.admin-empty { padding: 30px; border: 1px dashed var(--line); border-radius: 14px; color: var(--muted); text-align: center; font-size: 13px; }
@media (max-width: 1180px) { .admin-grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .admin-check-grid, .admin-permissions { grid-template-columns: 1fr; } .admin-user-row { grid-template-columns: 1fr; } .admin-user-actions { flex-direction: row; align-items: center; flex-wrap: wrap; } }