/* ========================================================================== 
   Aidely V1.19 — SITEWIDE UX
   Couche d'unification visuelle pour toutes les pages hors homepage.
   Le moteur métier/JS n'est pas modifié.
   ========================================================================== */

/* Compatibilité avec l'ancien styles.css : ses variables deviennent des alias
   du Design System V1.17+ au lieu de maintenir deux identités visuelles. */
:root{
  --purple:var(--action);
  --purple-dark:var(--action-hover);
  --purple-soft:var(--bg-action-soft);
  --ink:var(--text);
  --muted:var(--text-muted);
  --line:var(--border);
  --paper:var(--bg-page);
  --soft:var(--bg-quiet);
  --green:var(--ok);
  --green-dark:var(--ok);
  --serif:var(--font-display);
  --sans:var(--font-body);
  --radius:var(--r-lg);
  --container:var(--max);
  --shadow:var(--shadow-card);

  /* anciens tokens UX internes -> Design System */
  --ux-bg:var(--bg-quiet);
  --ux-card:var(--surface);
  --ux-ink:var(--text);
  --ux-muted:var(--text-muted);
  --ux-purple:var(--action);
  --ux-purple-dark:var(--action-hover);
  --ux-purple-soft:var(--bg-action-soft);
  --ux-green:var(--ok);
  --ux-line:var(--border);
  --ux-shadow:var(--shadow-card);
}

html{scroll-behavior:smooth;background:var(--bg-page)}
body.sitewide{
  background:var(--bg-page);
  color:var(--text);
  font-family:var(--font-body);
  font-size:var(--base);
  line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased;
}
body.sitewide h1,body.sitewide h2,body.sitewide h3{
  font-family:var(--font-display);
  color:var(--text);
  letter-spacing:var(--track-title);
}
body.sitewide h1{font-weight:800;line-height:1.02}
body.sitewide p{color:var(--text-muted)}
body.sitewide a{transition:color var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease)}

/* ---- Header public / app : même langage partout ---- */
body.sitewide .site-header,
body.sitewide .app-header{
  position:sticky;top:0;z-index:80;
  background:rgba(255,252,247,.90);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
  box-shadow:none;
}
body.sitewide .header-inner,
body.sitewide .app-header-inner{min-height:var(--head);padding-block:var(--s3);gap:var(--s5)}
body.sitewide .brand-logo,
body.sitewide .brand-logo-small{width:auto;height:34px;max-width:150px;display:block}
body.sitewide .main-nav,
body.sitewide .app-nav{gap:var(--s2)}
body.sitewide .main-nav a,
body.sitewide .app-nav a,
body.sitewide .app-nav button{
  font-size:var(--t-small);font-weight:700;color:var(--text-muted);
  padding:var(--s2) var(--s3);border-radius:var(--r-pill);text-decoration:none;
}
body.sitewide .main-nav a:hover,
body.sitewide .app-nav a:hover,
body.sitewide .app-nav button:hover{background:var(--bg-action-soft);color:var(--action-hover)}
body.sitewide .main-nav a[aria-current="page"]{color:var(--action);background:var(--bg-action-soft)}
body.sitewide .header-phone{
  background:var(--bg-dark);color:var(--text-on-dark);border-radius:var(--r-pill);
  padding:var(--s3) var(--s5);box-shadow:none;
}
body.sitewide .header-phone:hover{background:var(--action-hover);transform:translateY(-1px)}
body.sitewide .role-badge{
  background:var(--bg-action-soft);color:var(--action-hover);border:1px solid var(--action-line);
  border-radius:var(--r-pill);padding:var(--s2) var(--s3);font-size:var(--t-micro)
}

/* ---- Boutons ---- */
body.sitewide .btn,
body.sitewide button.btn{
  border-radius:var(--r-pill);border-width:2px;padding:var(--s4) var(--s6);
  font-family:var(--font-body);font-weight:700;box-shadow:none;
}
body.sitewide .btn:hover{transform:translateY(-1px)}
body.sitewide .btn-purple{background:var(--action);color:#fff}
body.sitewide .btn-purple:hover{background:var(--action-hover)}
body.sitewide .btn-outline{background:transparent;border-color:var(--border);color:var(--text)}
body.sitewide .btn-outline:hover{border-color:var(--text)}
body.sitewide .btn-danger{background:var(--bg-dark);color:#fff}
body.sitewide .btn-danger:hover{background:var(--action-hover)}

/* ========================================================================== 
   PAGES PUBLIQUES SECONDAIRES
   ========================================================================== */
body.public-page .page-hero{
  min-height:min(78dvh,760px);display:flex;align-items:center;
  padding:clamp(54px,8vh,110px) 0;
  background:var(--bg-page)!important;
}
body.public-page .page-hero .container{max-width:var(--max)}
body.public-page .page-hero h1{
  font-size:clamp(2.7rem,min(6vw,8vh),5.3rem);max-width:15ch;margin:var(--s3) 0 var(--s5);
}
body.public-page .page-hero .lead{font-size:var(--t-lead);max-width:52ch;color:var(--text-muted)}
body.public-page .kicker,
body.public-page .modal-kicker{
  font-size:var(--t-micro);text-transform:uppercase;letter-spacing:var(--track-eyebrow);
  color:var(--action)!important;font-weight:700
}
body.public-page .section{padding:clamp(58px,8vh,104px) 0}
body.public-page .section.soft{background:var(--bg-quiet)}
body.public-page .section-title{font-size:var(--t-title);font-weight:700;max-width:20ch;margin-bottom:var(--s4)}
body.public-page .section-lead{font-size:var(--t-lead);max-width:58ch;color:var(--text-muted);margin-bottom:var(--s7)}
body.public-page .card-grid article,
body.public-page .steps li,
body.public-page .fake-msg,
body.public-page .faq details,
body.public-page .callsign,
body.public-page .end-cta{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  box-shadow:var(--shadow-card)
}
body.public-page .card-grid article,
body.public-page .steps li{padding:clamp(24px,3vw,38px)}
body.public-page .steps li::before{background:var(--bg-action-soft);color:var(--action)}
body.public-page .phone-plate{
  background:var(--bg-dark);border-radius:var(--r-lg);box-shadow:var(--shadow-lift);
}
body.public-page .phone-plate .plate-number{font-family:var(--font-display)}
body.public-page .help-list li{padding-block:var(--s2)}
body.public-page .help-list li::before{color:var(--action)}
body.public-page footer{background:var(--bg-quiet);border-top:1px solid var(--border)}
body.public-page .sticky-call{border-radius:var(--r-pill);background:var(--bg-dark);color:#fff}
body.public-page dialog .modal-shell{border-radius:var(--r-lg);border:1px solid var(--border);box-shadow:var(--shadow-lift)}

/* Les vieux rouges/oranges commerciaux sont supprimés : seul Guide garde l'ambre. */
body.public-page .tint-danger{background:var(--bg-page)!important}
body.public-page .danger-box{border-color:var(--border);background:var(--bg-quiet);color:var(--text)}
body.public-page .orange-text,body.public-page .danger{color:var(--action)!important}

/* ========================================================================== 
   AUTHENTIFICATION
   ========================================================================== */
body.auth-page{min-height:100dvh;background:var(--bg-page)}
body.auth-page .auth-shell{
  min-height:calc(100dvh - var(--head));display:grid;place-items:center;
  padding:clamp(38px,7vh,80px) var(--gutter);background:var(--bg-page)
}
body.auth-page .auth-card{
  width:min(660px,100%);padding:clamp(28px,5vw,54px);
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  box-shadow:var(--shadow-card)
}
body.auth-page .auth-card h1{font-size:clamp(2.15rem,5vw,3.7rem);margin-bottom:var(--s4)}
body.auth-page .auth-card>p{margin-bottom:var(--s6);max-width:48ch}
body.auth-page .auth-tabs button{border:1px solid var(--border);border-radius:var(--r-pill);background:var(--bg-page)}
body.auth-page .auth-tabs button.active{background:var(--bg-action-soft);border-color:var(--action-line);color:var(--action-hover)}
body.auth-page label{font-weight:700;font-size:var(--t-small)}
body.auth-page input,body.auth-page textarea,body.auth-page select{
  width:100%;min-height:52px;border:1px solid var(--border);border-radius:var(--r-sm);
  background:#fff;padding:var(--s3) var(--s4);outline:0
}
body.auth-page input:focus,body.auth-page textarea:focus,body.auth-page select:focus{border-color:var(--action);box-shadow:0 0 0 4px rgba(90,50,176,.08)}
body.auth-page .check{
  display:flex;align-items:flex-start;gap:var(--s3);width:100%;margin:var(--s4) 0;
  font-weight:400;font-size:var(--t-small);line-height:1.45;cursor:pointer
}
body.auth-page .check input[type="checkbox"]{
  flex:0 0 26px;width:26px;min-width:26px;height:26px;min-height:26px;
  margin:1px 0 0;padding:0;border-radius:6px;accent-color:var(--action)
}
body.auth-page .check span{display:block;min-width:0;flex:1}

/* ========================================================================== 
   ESPACES CONNECTÉS / DASHBOARDS
   ========================================================================== */
body.app-page .dashboard{
  background:var(--bg-quiet);min-height:calc(100dvh - var(--head));padding:clamp(28px,4vw,52px) 0 90px
}
body.app-page .dashboard>.container{max-width:var(--max)}
body.app-page .dashboard-head{align-items:flex-start;margin-bottom:var(--s6)}
body.app-page .dashboard-head h1{font-size:clamp(2rem,4vw,3.2rem);margin:0 0 var(--s2)}
body.app-page .dashboard-head p{color:var(--text-muted);max-width:66ch;margin:0}
body.app-page .panel,
body.app-page .kpi,
body.app-page .ticket-card,
body.app-page .device-card,
body.app-page .device-selected,
body.app-page .pair-code-card,
body.app-page .assist-trust-box,
body.app-page .assist-live-status{
  border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);box-shadow:none
}
body.app-page .panel{padding:clamp(20px,2.6vw,34px)}
body.app-page .kpi{padding:var(--s5)}
body.app-page .kpi strong{font-family:var(--font-display);color:var(--text);font-size:2rem}
body.app-page .kpi span{color:var(--text-muted);font-size:var(--t-small)}
body.app-page .ticket-card{border-radius:var(--r-md);padding:var(--s5);margin-bottom:var(--s3)}
body.app-page .ticket-card:hover{border-color:var(--action-line);box-shadow:var(--shadow-card)}
body.app-page .notice-bar{
  border:1px solid var(--action-line);background:var(--bg-action-soft);color:var(--text);
  border-radius:var(--r-md);padding:var(--s4) var(--s5)
}
body.app-page .status{font-size:var(--t-micro);font-weight:700}
body.app-page .status.in-progress{background:var(--bg-action-soft);color:var(--action-hover)}
body.app-page .status.resolved{background:#EAF6EE;color:var(--ok)}

/* Espace senior : retire l'esthétique SaaS ancienne au profit du DS. */
body.app-page .senior-help-hero{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  box-shadow:var(--shadow-card);padding:clamp(28px,4vw,48px)
}
body.app-page .senior-eyebrow{background:var(--bg-action-soft);color:var(--action-hover)}
body.app-page .senior-help-hero h1{font-family:var(--font-display);color:var(--text)}
body.app-page .senior-help-hero p{color:var(--text-muted)}
body.app-page .senior-main-cta{border-radius:var(--r-pill);background:var(--action);box-shadow:none}
body.app-page .senior-panel-grid{gap:var(--s4)!important}

/* Appareils / diagnostic */
body.app-page .device-card{padding:var(--s5)}
body.app-page .health-score{background:var(--bg-action-soft);color:var(--action-hover)}
body.app-page .device-metrics span,body.app-page .privacy-grid div{background:var(--bg-quiet);border-radius:var(--r-sm)}
body.app-page .health-gauge{background:var(--bg-action-soft);border-color:var(--action-line);color:var(--action-hover)}

/* ========================================================================== 
   ASSISTANCE : interface fonctionnelle, pas de magnetic scroll
   ========================================================================== */
body.assist-page .assist-container{max-width:1440px}
body.assist-page .assist-live-badge{border-radius:var(--r-pill)}
body.assist-page .assist-screen,
body.assist-page .screen-stage,
body.assist-page .remote-screen,
body.assist-page video{border-radius:var(--r-lg)}
body.assist-page .assist-trust-box{background:var(--bg-action-soft);border-color:var(--action-line)}
body.assist-page .assist-actions .btn,body.assist-page .guide-actions .btn{border-radius:var(--r-pill)}

/* ========================================================================== 
   TICKET : continuité visuelle homepage -> conversion
   ========================================================================== */
body.ticket-page .request-head{position:sticky;top:0;background:rgba(255,252,247,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);z-index:80}
body.ticket-page .ticket-main{background:var(--bg-page)}
body.ticket-page .ticket-card{box-shadow:var(--shadow-card);border-radius:var(--r-lg)}
body.ticket-page .ticket-primary{min-height:60px;font-size:1rem}
body.ticket-page .ticket-contact-card{margin-bottom:var(--s5)}

/* V1.24 — espaces Alpha concentrés sur l’action en cours. */
.alpha-space-shell,.alpha-tech-shell{max-width:1180px}
.alpha-help-hero{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:clamp(26px,5vw,48px);border:1px solid var(--border);border-radius:28px;background:linear-gradient(135deg,#fff 0%,#f7f2ff 100%);box-shadow:var(--shadow-card);margin-bottom:38px}
.alpha-help-hero h1,.alpha-tech-head h1{font-family:var(--font-display);font-size:clamp(2.15rem,5vw,3.8rem);line-height:1;margin:7px 0 12px;color:var(--text)}
.alpha-help-hero p{margin:0;color:var(--text-muted);font-size:1.05rem}
.alpha-help-hero .senior-main-cta{flex:none;min-height:58px;padding-inline:26px}
.alpha-section-title{margin:0 0 14px}.alpha-section-title span{color:var(--action);font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.alpha-section-title h2{font-family:var(--font-display);font-size:1.7rem;margin:3px 0 0}
.alpha-current-section{margin-bottom:36px}.alpha-current-section .ticket{border:2px solid #d9cdf2;box-shadow:0 18px 44px -34px rgba(66,35,127,.5)}
.alpha-history-section{margin-bottom:28px}.alpha-history-section .ticket{opacity:.92}
.alpha-secondary-panel{border:1px solid var(--border);border-radius:17px;background:#fff;margin-top:10px;overflow:hidden}
.alpha-secondary-panel>summary{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:18px 20px;cursor:pointer;list-style:none;font-weight:800}.alpha-secondary-panel>summary::-webkit-details-marker{display:none}.alpha-secondary-panel>summary::after{content:'+';color:var(--action);font-size:1.25rem}.alpha-secondary-panel[open]>summary::after{content:'−'}.alpha-secondary-panel>summary small{margin-left:auto;color:var(--text-muted);font-weight:400}.alpha-secondary-content{padding:0 20px 20px}
.alpha-tech-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:28px}.alpha-tech-alert{display:grid;justify-items:end;gap:7px;text-align:right}.alpha-tech-alert small{max-width:280px;color:var(--text-muted)}
.alpha-tech-workspace{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:18px;align-items:start}.alpha-tech-workspace>.panel{margin:0;min-width:0}.alpha-count{display:inline-grid;place-items:center;min-width:34px;height:28px;padding:0 9px;border-radius:999px;background:var(--bg-action-soft);color:var(--action);font-weight:800}.alpha-tech-workspace .panel-title-row h2{margin-top:7px}.alpha-my-interventions{position:sticky;top:88px}
.alpha-tech-page .available-ticket{padding:18px}.alpha-tech-page .queue-ticket-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
.ticket-feedback{margin-top:16px;padding:17px;border-radius:16px;background:var(--bg-action-soft);border:1px solid #d9cdf2}.ticket-feedback>strong,.ticket-feedback>span{display:block}.ticket-feedback>span{margin-top:4px;color:var(--text-muted)}.ticket-feedback-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 7px}.ticket-feedback-actions button{min-height:44px;padding:9px 15px;border-radius:999px;border:1px solid #cfc1ea;background:#fff;color:var(--action);font:inherit;font-weight:800;cursor:pointer}.ticket-feedback-actions button:hover{background:#f4effd}.ticket-feedback.is-recorded{background:#eef9f3;border-color:#b9ddca}
.alpha-resolve-box{margin-top:16px;padding:18px;border:1px solid #d9cdf2;border-radius:16px;background:#faf8ff}.alpha-resolve-box h3{margin:0 0 14px}.alpha-resolve-box fieldset{border:0;padding:0;margin:0 0 14px}.alpha-resolve-box legend,.alpha-resolve-box>label{display:block;font-weight:800;font-size:.84rem;margin-bottom:8px}.alpha-resolve-box fieldset label{display:inline-flex;align-items:center;gap:5px;margin:7px 13px 0 0}.alpha-resolve-box select,.alpha-resolve-box textarea{display:block;width:100%;margin-top:7px;border:1px solid var(--border);border-radius:11px;padding:10px;background:#fff;font:inherit}.alpha-resolve-box>label+label{margin-top:13px}.alpha-resolve-box .primary{margin-top:10px}
@media(max-width:860px){.alpha-help-hero,.alpha-tech-head{align-items:stretch;flex-direction:column}.alpha-help-hero .senior-main-cta{width:100%}.alpha-tech-alert{justify-items:start;text-align:left}.alpha-tech-workspace{grid-template-columns:1fr}.alpha-my-interventions{position:static}.alpha-secondary-panel>summary small{display:none}}

/* ========================================================================== 
   PAIEMENT / DIAGNOSTIC TECHNIQUE
   ========================================================================== */
body.app-page .payment-state,
body.app-page .diag-wrap{
  width:min(760px,calc(100% - 40px));margin:clamp(60px,12vh,130px) auto;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:clamp(28px,5vw,52px);box-shadow:var(--shadow-card)
}
body.app-page .payment-state h1,body.app-page .diag-wrap h1{font-size:clamp(2rem,5vw,3rem)}

/* ---- Responsive ---- */
@media(max-width:900px){
  body.sitewide .main-nav{display:none}
  body.sitewide .header-phone span small{display:none}
  body.public-page .page-hero{min-height:auto;padding:64px 0}
  body.public-page .card-grid,body.public-page .steps{grid-template-columns:1fr}
}
@media(max-width:720px){
  body.sitewide .header-phone{display:none}
  body.sitewide .app-header-inner{align-items:flex-start;flex-direction:column;padding-block:var(--s3)}
  body.sitewide .app-nav{width:100%;justify-content:flex-start}
  body.auth-page .auth-card{padding:26px 20px;border-radius:var(--r-md);box-shadow:none}
  body.app-page .dashboard{padding-top:24px}
}

/* Accessibilité : aucune animation automatique si réduction de mouvement. */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}

/* V1.20 — lancement Agent WPF */
.assist-download-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.assist-download-actions .primary,.assist-download-actions .btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center}
.assist-fallback-code{margin-top:16px;border-top:1px solid var(--line,#E4DCD1);padding-top:14px}
.assist-fallback-code summary{cursor:pointer;font-weight:700;color:var(--ink-2,#4A4358);font-size:.9rem}
.assist-fallback-code .session-code-box{margin-top:14px}
