
/*
 * Nettizy 8.5.1 — visual cleanup layer
 * ------------------------------------------------------------
 * This file only refines presentation. Existing business behavior
 * and the legacy app.css rules remain available underneath.
 */

:root{
  --bg:#f5f7fa;
  --card:#ffffff;
  --text:#0f172a;
  --muted:#667085;
  --line:#e7ebf0;
  --accent:#0f172a;
  --danger:#b42318;
  --blue:#168cf5;
  --blue-soft:#eef6ff;
  --green:#16803f;
  --green-soft:#ecfdf3;
  --orange:#c2410c;
  --orange-soft:#fff7ed;
  --radius:18px;
  --radius-lg:22px;
  --shadow:0 10px 30px rgba(15,23,42,.05);
  --shadow-lg:0 22px 60px rgba(15,23,42,.08);
}

html{background:var(--bg)}
body{
  background:
    radial-gradient(circle at 95% -5%,rgba(22,140,245,.06),transparent 22rem),
    var(--bg);
  color:var(--text);
  letter-spacing:-.01em;
}

.topbar{
  min-height:70px;
  padding:12px max(18px,calc((100vw - 1120px)/2));
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(231,235,240,.95);
  box-shadow:0 1px 0 rgba(15,23,42,.01);
}

.brand-logo{
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-size:21px;
  font-weight:900;
  letter-spacing:-.7px;
}
.brand-logo img{
  width:36px;
  height:36px;
  object-fit:contain;
  border-radius:10px;
  background:#fff;
}
.brand-blue{color:var(--blue)}

.user-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  max-width:55vw;
  padding:8px 10px;
  border-radius:999px;
  color:#526071;
  background:#f8fafc;
  text-decoration:none!important;
  font-size:11px;
  font-weight:650;
}
.user-chip:hover{background:#f1f5f9;color:#1e293b}
.user-chip-name{font-weight:800;color:#344054}

.container{
  width:100%;
  max-width:1080px;
  padding:24px 20px 104px;
}

.page-head{
  display:flex;
  align-items:center;
  min-height:46px;
}
.page-head h1{
  margin:4px 0 20px;
  font-size:29px;
  line-height:1.05;
  letter-spacing:-1.25px;
  font-weight:900;
}

.card,.mission-card,.agent-hero{
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow);
}
.card{padding:20px;margin-bottom:16px}
.card h2{font-size:17px;letter-spacing:-.4px}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:15px}
.card-head h2{margin:0}
.card-head>a{font-size:10px;font-weight:800;color:#48729e;text-decoration:none}

.stats,.manager-stats{gap:11px}
.stat,.manager-stat{
  background:#fff;
  border:1px solid var(--line);
  border-radius:17px;
  box-shadow:0 6px 20px rgba(15,23,42,.035);
}
.stat{padding:16px}
.stat b{font-size:25px;letter-spacing:-1px}

.btn{
  min-height:43px;
  border-color:#dfe4ea;
  border-radius:11px;
  font-size:12px;
  font-weight:800;
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 5px 15px rgba(15,23,42,.06)}
.btn.primary{
  background:#101828;
  border-color:#101828;
  box-shadow:0 6px 18px rgba(16,24,40,.10);
}
.btn.primary:hover{background:#1d2939}
.btn.danger{background:#b42318;border-color:#b42318}
.btn.giant{border-radius:14px;letter-spacing:.01em}

input,select,textarea{
  min-height:44px;
  border:1px solid #d8dee7;
  border-radius:11px;
  padding:11px 12px;
  outline:none;
  transition:border-color .15s,box-shadow .15s;
}
textarea{min-height:105px}
input:focus,select:focus,textarea:focus{
  border-color:#78b9f3;
  box-shadow:0 0 0 3px rgba(22,140,245,.08);
}
label{color:#344054;font-size:11px;font-weight:800;letter-spacing:0}

.row-link{
  min-height:64px;
  padding:13px 2px;
  border-bottom-color:#eef1f4;
}
.row-link:hover{background:#fbfcfd}
.row-link b{font-size:12px}
.row-link small{font-size:9px;line-height:1.5}

.badge{
  padding:6px 9px;
  font-size:9px;
  font-weight:850;
  letter-spacing:.01em;
}
.badge.done,.badge.paid,.badge.accepted,.badge.resolved{background:var(--green-soft);color:#16803f}
.badge.in_progress{background:#eaf4ff;color:#146eb8}
.badge.late,.badge.open,.badge.refused{background:#fef3f2;color:#b42318}
.badge.planned,.badge.sent{background:#f2f4f7;color:#475467}

.alert{
  border:1px solid transparent;
  font-size:11px;
  line-height:1.5;
}
.alert.success{background:#ecfdf3;border-color:#d1fadf;color:#166534}
.alert.error{background:#fef3f2;border-color:#fee4e2;color:#991b1b}

.bottom-nav{
  width:min(720px,calc(100% - 24px));
  left:50%;
  right:auto;
  bottom:12px;
  transform:translateX(-50%);
  border:1px solid rgba(218,224,232,.95);
  border-radius:18px;
  box-shadow:0 15px 45px rgba(15,23,42,.13);
  overflow:hidden;
  padding:4px;
  background:rgba(255,255,255,.95);
  backdrop-filter:blur(18px);
}
.bottom-nav a{
  position:relative;
  min-height:57px;
  padding:8px 6px 6px;
  border-radius:13px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  font-size:9px;
  color:#667085;
}
.bottom-nav a.active{
  color:#101828;
  background:#f2f4f7;
}
.bottom-nav a.active:after{
  content:"";
  position:absolute;
  bottom:3px;
  width:18px;
  height:2px;
  border-radius:99px;
  background:var(--blue);
}
.nav-icon{
  display:block;
  min-height:15px;
  font-size:14px;
  line-height:1;
  font-weight:900;
}

/* Dashboard */
.dashboard-hero-clean{
  position:relative;
  overflow:hidden;
  border-radius:23px;
  background:linear-gradient(135deg,#101828,#1d2939);
  box-shadow:0 18px 50px rgba(15,23,42,.13);
}
.dashboard-hero-clean:after{
  content:"";
  position:absolute;
  width:240px;height:240px;
  right:-85px;top:-115px;
  border-radius:50%;
  background:rgba(22,140,245,.13);
}
.dashboard-hero-clean>div{position:relative;z-index:1}
.manager-stats{
  grid-template-columns:repeat(4,1fr);
  margin:14px 0;
}
.manager-stat{
  padding:16px;
  text-decoration:none;
  color:inherit;
}
.manager-stat span,.manager-stat small{display:block}
.manager-stat span{font-size:9px;font-weight:850;color:#667085;text-transform:uppercase;letter-spacing:.06em}
.manager-stat b{display:block;font-size:23px;letter-spacing:-1px;margin:6px 0 2px}
.manager-stat small{font-size:8px;color:#98a2b3}
.manager-stat.alert-stat{border-color:#fed7aa;background:#fffaf5}
.manager-stat.alert-stat b{color:#c2410c}

.quick-actions-clean{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:8px;
  margin-bottom:16px;
}
.quick-actions-clean a{
  min-height:48px;
  padding:10px 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  color:#344054;
  text-align:center;
  text-decoration:none;
  font-size:10px;
  font-weight:850;
  box-shadow:0 4px 14px rgba(15,23,42,.025);
}
.quick-actions-clean a:hover{border-color:#cdd5df;background:#fbfcfd}

.planning-today{padding-top:18px}
.planning-row{padding:12px 0}
.planning-row-main{
  min-width:0;
  display:grid;
  grid-template-columns:45px 1fr;
  gap:10px;
  align-items:center;
}
.planning-row-main time{
  font-size:11px;
  font-weight:900;
  color:#344054;
}
.planning-row-main b{display:block;font-size:12px}
.planning-row-main small{display:block;color:#7b8797;font-size:9px;margin-top:3px}
.empty-state-small{
  display:flex;
  gap:11px;
  align-items:center;
  padding:16px;
  border-radius:13px;
  background:#f8fafc;
  color:#667085;
}
.empty-state-small>span{
  width:29px;height:29px;
  display:grid;place-items:center;
  flex:0 0 auto;
  border-radius:50%;
  background:#ecfdf3;
  color:#16803f;
  font-weight:900;
}
.empty-state-small b,.empty-state-small small{display:block}
.empty-state-small b{font-size:11px;color:#344054}
.empty-state-small small{font-size:9px;margin-top:2px}
.dashboard-secondary-actions{margin-top:-2px}

/* Existing agent UI refinements */
.role-agent .container{max-width:720px}
.agent-summary-v2{
  border-radius:23px;
  box-shadow:0 18px 50px rgba(15,23,42,.12);
}
.mission-card-v2{
  border-radius:20px!important;
  border-color:var(--line)!important;
  box-shadow:var(--shadow)!important;
}
.mission-current{
  border-color:#bfdcff!important;
  box-shadow:0 13px 35px rgba(22,140,245,.09)!important;
}
.completed-block{
  border-radius:18px!important;
  border-color:var(--line)!important;
  box-shadow:var(--shadow)!important;
}

/* Documents & tables */
.doc-table th{
  background:#f8fafc;
  color:#475467;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.doc-table td{font-size:11px}
.document-sheet{box-shadow:var(--shadow-lg)}

/* Login */
.auth{
  background:
    radial-gradient(circle at top right,rgba(22,140,245,.10),transparent 25rem),
    #f5f7fa;
}
.auth-card{
  border-color:var(--line);
  box-shadow:var(--shadow-lg);
}
.auth-logo img{max-width:230px}
.login-help{color:#7b8797!important}

/* Wizard */
.wizard-card{box-shadow:var(--shadow)}
.wizard-number{background:#101828}
.wizard-bar i{background:linear-gradient(90deg,#101828,#168cf5)}
.choice-card{transition:border-color .15s,box-shadow .15s,background .15s}
.choice-card:has(input:checked){
  border-color:#8bc6f8;
  background:#f8fbff;
  box-shadow:0 0 0 3px rgba(22,140,245,.06);
}

/* More menu */
.admin-menu-section-head{padding-left:2px}
.admin-menu-section-head h2{font-size:16px!important}
.admin-menu-item{padding-left:3px;padding-right:3px}
.info-dot{transition:.15s}

/* Mobile */
@media(max-width:700px){
  body{padding-bottom:88px}
  .topbar{min-height:64px;padding:10px 14px}
  .brand-logo img{width:32px;height:32px}
  .brand-logo{font-size:19px}
  .user-chip{padding:7px 8px;font-size:9px}
  .user-chip-separator{display:none}
  .user-chip-name{max-width:24vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  .container{padding:17px 13px 96px}
  .page-head{min-height:42px}
  .page-head h1{font-size:24px;letter-spacing:-.9px;margin-bottom:15px}

  .card,.mission-card,.agent-hero{border-radius:17px;padding:15px}
  .manager-stats{grid-template-columns:1fr 1fr}
  .manager-stat{padding:14px}
  .quick-actions-clean{grid-template-columns:1fr 1fr}
  .quick-actions-clean a:last-child{grid-column:1/-1}

  .bottom-nav{
    width:calc(100% - 16px);
    bottom:8px;
    border-radius:16px;
  }
  .bottom-nav a{min-height:55px;padding:7px 2px 5px;font-size:8px}
  .nav-icon{font-size:13px}

  .planning-row-main{grid-template-columns:40px 1fr}
  .planning-row-main time{font-size:10px}
  .planning-row-main b{font-size:11px}

  input,select,textarea{font-size:16px}
  .btn{min-height:46px}
}

@media print{
  body{background:#fff!important}
  .bottom-nav{display:none!important}
}


/* Nettizy V8.6 — assistant + hors connexion */
.topbar-right{display:flex;align-items:center;gap:8px}
.network-status{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 8px;border-radius:999px;
  font-size:9px;font-weight:850;
  background:#ecfdf3;color:#16803f
}
.network-status i{width:6px;height:6px;border-radius:50%;background:currentColor}
.network-status.offline{background:#fff7ed;color:#c2410c}

.setup-return-banner{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  margin-bottom:14px;padding:12px 14px;
  border:1px solid #bfdbfe;border-radius:14px;background:#eff6ff
}
.setup-return-banner b,.setup-return-banner small{display:block}
.setup-return-banner b{font-size:11px;color:#164e86}
.setup-return-banner small{font-size:9px;color:#52769a;margin-top:2px}

.offline-notice{
  margin-bottom:13px;padding:12px 14px;
  border-radius:13px;border:1px solid #fed7aa;background:#fff7ed;color:#9a3412
}
.offline-notice b,.offline-notice span{display:block}
.offline-notice b{font-size:11px}.offline-notice span{font-size:9px;line-height:1.5;margin-top:2px}

.sync-notice{
  position:fixed;z-index:80;left:50%;bottom:90px;transform:translateX(-50%);
  width:min(520px,calc(100% - 28px));
  padding:11px 13px;border-radius:12px;
  background:#101828;color:#fff;
  box-shadow:0 15px 45px rgba(15,23,42,.2);
  text-align:center;font-size:10px;font-weight:750
}
.sync-notice.success{background:#166534}
.sync-notice.error{background:#991b1b}
.sync-notice.offline{background:#9a3412}
.sync-notice.syncing{background:#1d4ed8}

.mission-status-offline{background:#fff7ed!important;color:#c2410c!important}
.offline-completed-card{opacity:.68;border-style:dashed!important}
.offline-completed-card .mission-open{background:#fff!important;color:#475467!important;border-color:#d0d5dd!important}

@media(max-width:700px){
  .topbar-right{gap:4px}
  .network-status{padding:5px 6px}
  .network-status span{display:none}
  .setup-return-banner{align-items:flex-start;flex-direction:column}
  .setup-return-banner .btn{width:100%}
  .sync-notice{bottom:82px}
}

/* Nettizy V8.7 — activation de l'accès agent hors connexion */
.offline-access-card{border-color:#cfe4f8;background:linear-gradient(135deg,#fff,#f8fbff)}
.offline-access-main{display:flex;align-items:center;gap:11px}
.offline-access-icon{display:grid;place-items:center;width:36px;height:36px;flex:0 0 auto;border-radius:11px;background:#eaf4ff;color:#126ebd;font-size:17px;font-weight:900}
.offline-access-main b,.offline-access-main small{display:block}
.offline-access-main b{font-size:12px}
.offline-access-main small{font-size:9px;margin-top:3px;color:#667085}
.offline-access-actions{display:flex;gap:7px;margin-top:12px}
.offline-access-card>p{margin:10px 0 0;font-size:9px;line-height:1.55;color:#667085}

/* Nettizy V8.8 — mode hors connexion automatique */
.offline-access-card{display:none!important}

/* Nettizy V9 Privacy by Design */
.privacy-hero{background:linear-gradient(135deg,#f8fbff,#fff);border-color:#cfe5f8}
.privacy-kicker{font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.12em;color:#1673c5}
.privacy-hero h2{font-size:25px;letter-spacing:-1px;margin:8px 0}.privacy-hero p{font-size:11px;line-height:1.65;color:#667085}
.privacy-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.privacy-grid>div{padding:13px;border:1px solid #e7ebf0;border-radius:12px;background:#fafbfc}.privacy-grid b,.privacy-grid span{display:block}.privacy-grid b{font-size:10px}.privacy-grid span{font-size:8px;line-height:1.5;color:#667085;margin-top:3px}
.privacy-warning{padding:13px;border-radius:12px;background:#fff7ed;border:1px solid #fed7aa}.privacy-warning b{font-size:10px;color:#9a3412}.privacy-warning p{font-size:9px;color:#7c4a23;line-height:1.55;margin:4px 0 0}
@media(max-width:700px){.privacy-grid{grid-template-columns:1fr}}

.demo-hero{background:linear-gradient(135deg,#f4f9ff,#fff);border-color:#cfe5f8}
.demo-hero h2{font-size:25px;letter-spacing:-1px;margin:8px 0}
.demo-hero p{font-size:11px;line-height:1.65;color:#667085}

.public-demo-banner{position:relative;z-index:100;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:8px 12px;background:#0f172a;color:#fff;font-size:9px}.public-demo-banner b{color:#65b8ff;letter-spacing:.08em}.public-demo-banner span{color:#cbd5e1}.public-demo-banner a{color:#fff;font-weight:850}

.public-demo-choice-body{min-height:100vh;background:radial-gradient(circle at 20% 10%,rgba(22,140,245,.12),transparent 35%),#f6f8fb}
.public-demo-choice{width:min(920px,calc(100% - 28px));margin:auto;padding:50px 0;text-align:center}.public-demo-choice-logo img{width:min(210px,60vw)}
.public-demo-choice-kicker{display:inline-block;margin-top:22px;font-size:9px;font-weight:900;letter-spacing:.13em;color:#1673c5}.public-demo-choice h1{max-width:700px;margin:9px auto 12px;font-size:38px;line-height:1.06;letter-spacing:-1.7px}.public-demo-choice-intro{max-width:650px;margin:0 auto 28px;color:#667085;font-size:12px;line-height:1.7}
.public-demo-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;text-align:left}.public-demo-role-card{display:grid;grid-template-columns:48px 1fr;gap:15px;padding:24px;border:1px solid #e1e7ee;border-radius:21px;background:#fff;text-decoration:none;color:#101828;box-shadow:0 15px 45px rgba(15,23,42,.05);transition:.25s}.public-demo-role-card:hover{transform:translateY(-5px);box-shadow:0 23px 60px rgba(15,23,42,.11)}.public-demo-role-card.agent{background:#101828;color:#fff;border-color:#101828}.public-demo-role-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:#eef7ff;color:#1576c9;font-size:17px;font-weight:950}.public-demo-role-card.agent .public-demo-role-icon{background:#1c3049;color:#62baff}.public-demo-role-card span{font-size:8px;letter-spacing:.09em;font-weight:900;color:#1680d9}.public-demo-role-card h2{margin:6px 0 8px;font-size:21px}.public-demo-role-card p{margin:0 0 15px;color:#667085;font-size:10px;line-height:1.6}.public-demo-role-card.agent p{color:#b6c1cf}.public-demo-role-card b{font-size:9px;color:#1673c5}.public-demo-role-card.agent b{color:#67baff}.public-demo-choice-note{margin-top:18px;padding:12px;border:1px solid #e3e8ef;border-radius:13px;background:#fff;color:#718096;font-size:9px}
.public-demo-banner{position:relative;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:7px 13px;background:#0f172a;color:#fff}.public-demo-banner-info{display:flex;align-items:center;gap:8px}.public-demo-banner-info b{color:#65b8ff;font-size:8px}.public-demo-banner-info span{font-size:8px;color:#cbd5e1}.public-demo-switch{display:flex;gap:4px}.public-demo-switch a{padding:5px 8px;border-radius:7px;color:#cbd5e1;text-decoration:none;font-size:8px;font-weight:800;background:#1e293b}.public-demo-switch a.active{background:#168cf5;color:#fff}
@media(max-width:700px){.public-demo-choice h1{font-size:30px}.public-demo-choice-grid{grid-template-columns:1fr}.public-demo-banner{justify-content:center}}
