/* L'Atelier Electro — thème client cuivre / graphite */
:root {
  --bg: #e9e4dc;
  --panel: #f8f4ee;
  --panel-strong: #fffaf3;
  --ink: #24231f;
  --muted: #746e67;
  --border: #d4cbc0;
  --border-strong: #b8aa9c;
  --dark: #181915;
  --dark-soft: #21221d;
  --dark-raised: #292a24;
  --yellow: #b88b53;
  --blue: #8f583b;
  --green: #47745b;
  --red: #a84f48;
  --accent: #c8845c;
  --accent-strong: #a76645;
  --accent-soft: #efe0d4;
  --ok: #47745b;
  --ok-soft: #e4eee7;
  --ring: #c8845c;
  --radius: 5px;
  --radius-sm: 3px;
  --shadow: 0 18px 42px rgba(45, 36, 29, .08);
  --font-ui: "Manrope", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-tech: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
}

html, body, .page { background: var(--bg); }
body, button, input, textarea, select { font-family: var(--font-ui); }
body { color: var(--ink); letter-spacing: -.012em; }
::selection { background: #dba47e; color: #181915; }

.client-portal-hero {
  min-height: 138px;
  padding: 26px 42px 28px;
  background: var(--dark);
  border-bottom: 1px solid rgba(224, 164, 125, .38);
  isolation: isolate;
}
.client-portal-hero::before, .client-portal-hero::after { display: none; }
.client-portal-hero-media {
  position: absolute;
  inset: 0 0 0 auto;
  width: min(54%, 900px);
  background: #181915 url('/portal-workshop.webp') center 58% / cover no-repeat;
  opacity: .72;
  z-index: -1;
}
.client-portal-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(24, 25, 21, .28);
}
.client-portal-hero .hero-inner {
  max-width: 1540px;
  min-height: 84px;
  padding-top: 0;
  align-items: center;
}
.client-portal-brand { position: relative; z-index: 1; width: min(690px, 62%); }
.client-portal-kicker,
.eyebrow,
.client-announcement-eyebrow,
.service-badge,
.svc-flag,
.kpi-label {
  font-family: var(--font-tech);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: 10px;
  font-weight: 600;
}
.client-portal-kicker { display: block; margin-bottom: 9px; color: var(--accent); }
.client-portal-hero h1 {
  margin: 0;
  color: #f0ebe4;
  font-size: clamp(30px, 3vw, 48px);
  font-weight: 700;
  letter-spacing: -.055em;
}
.client-portal-hero p { max-width: 560px; margin-top: 7px; color: #bdb6ae; font-size: 14px; }
.client-portal-hero .top-actions { position: relative; z-index: 1; }
.client-portal-hero .btn.ghost {
  min-height: 44px;
  padding-inline: 18px;
  background: rgba(24, 25, 21, .76);
  border-color: rgba(224, 164, 125, .48);
  color: #f0ebe4;
}
.client-portal-hero .btn.ghost:hover { background: var(--accent); border-color: var(--accent); color: #181915; }

.page:has(.client-dashboard-v3) > .client-portal-hero { width: calc(100% - 264px); margin-left: 264px; }
.page:has(.client-dashboard-v3) > .shell { width: auto; max-width: none; margin: 0; padding: 0; }
.dash.client-dashboard-v3 {
  gap: 22px;
  padding: 28px 38px 64px calc(264px + 38px);
  background: var(--bg);
}

.panel,
.client-current-repairs,
.client-service-banner,
.repair,
.doc,
.event,
.stat,
.client-quick-card,
.portal-modal,
.client-legal-card,
.client-follow-panel,
.client-message-panel {
  border-color: var(--border);
  border-radius: var(--radius);
  background: var(--panel);
  box-shadow: var(--shadow);
}
.panel, .client-current-repairs, .client-service-banner { padding: 24px 26px; }
h1, h2, h3, h4 { color: var(--ink); }
h2, h3 { letter-spacing: -.035em; }
.section-head h2 { font-size: clamp(20px, 2vw, 27px); }
.muted { color: var(--muted); }
.eyebrow { color: var(--accent-strong); }

.btn {
  min-height: 42px;
  border-radius: 3px;
  border-color: var(--border-strong);
  background: var(--panel-strong);
  color: var(--ink);
  font-weight: 700;
  box-shadow: none;
}
.btn:hover { border-color: var(--accent); background: #f2e8de; }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #181915; }
.btn.primary:hover { background: #dfa078; border-color: #dfa078; filter: none; }
.btn.green { background: var(--green); border-color: var(--green); color: #fff; }
.btn.ghost { background: transparent; color: var(--ink); border-color: var(--border-strong); }

.field label { color: #5c554e; font-family: var(--font-tech); letter-spacing: .04em; }
.field input, .field textarea, .field select, input, textarea, select {
  border-color: var(--border-strong);
  border-radius: 3px;
  background: var(--panel-strong);
  color: var(--ink);
}
.field input:focus, .field textarea:focus, .field select:focus,
input:focus, textarea:focus, select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(200, 132, 92, .16);
  outline: none;
}

.client-page-tabs.client-menu-v3 {
  width: 264px;
  padding: 18px 14px 28px;
  gap: 3px;
  background: var(--dark);
  border-right: 1px solid rgba(224, 164, 125, .32);
  box-shadow: 10px 0 34px rgba(23, 19, 16, .12);
}
.cmenu-brand {
  min-height: 70px;
  gap: 12px;
  padding: 8px 8px 18px;
  margin-bottom: 10px;
  border-bottom-color: rgba(240, 236, 230, .13);
}
.cmenu-brand-mark {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  flex: 0 0 40px;
  border: 1px solid rgba(224, 164, 125, .58);
  color: var(--accent);
  font-family: var(--font-tech);
  font-size: 12px;
  letter-spacing: -.06em;
}
.cmenu-brand-txt strong { color: #f0ebe4; font-size: 15px; letter-spacing: -.03em; }
.cmenu-brand-txt small {
  color: #9f9790;
  font-family: var(--font-tech);
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.cmenu-brand:hover .cmenu-brand-txt strong { color: var(--accent); }

.client-page-tabs.client-menu-v3 a {
  grid-template-columns: 22px minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  column-gap: 10px;
  min-height: 52px;
  padding: 9px 10px;
  border: 1px solid transparent;
  border-radius: 3px;
  color: #b9b2aa;
  background: transparent;
}
.client-page-tabs.client-menu-v3 a:hover { border-color: rgba(224, 164, 125, .22); background: var(--dark-soft); color: #f0ebe4; }
.client-page-tabs.client-menu-v3 a span { grid-column: 2; grid-row: 1; font-size: 13px; font-weight: 700; }
.client-page-tabs.client-menu-v3 a small { grid-column: 2; grid-row: 2; color: #77736d; font-size: 10px; font-weight: 600; }
.client-page-tabs.client-menu-v3 a b {
  grid-column: 3;
  grid-row: 1 / span 2;
  min-width: 21px;
  height: 21px;
  border-radius: 2px;
  background: var(--accent);
  color: #181915;
}
.cmenu-item-ico {
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: center;
  width: 20px;
  color: #817a73;
  font-size: 14px;
  text-align: center;
}
.client-page-tabs.client-menu-v3 a.active { border-color: rgba(224, 164, 125, .4); background: var(--dark-raised); color: #f4eee7; }
.client-page-tabs.client-menu-v3 a.active::before { display: none; }
.client-page-tabs.client-menu-v3 a.active span,
.client-page-tabs.client-menu-v3 a.active .cmenu-item-ico { color: var(--accent); }
.client-page-tabs.client-menu-v3 a.active small { color: #b7afa7; }
.cmenu-group-h {
  min-height: 36px;
  padding: 10px 9px 7px;
  color: #817b74;
  font-family: var(--font-tech);
  font-size: 9px;
  letter-spacing: .13em;
}
.cmenu-group-h:hover { color: var(--accent); }
.cmenu-group-ico { width: 18px; color: var(--accent); font-size: 12px; text-align: center; }
.cmenu-chev { color: #706a64; }
.client-page-tabs.client-menu-v3 a.hot,
.client-page-tabs.client-menu-v3 a.live,
.client-page-tabs.client-menu-v3 a.warn { background: rgba(200, 132, 92, .06); }

.client-preview-banner {
  min-height: 48px;
  border: 1px solid #c6b7a8;
  border-left: 4px solid var(--accent);
  border-radius: 3px;
  background: #f2e9df;
  color: #433b34;
}
.client-announcement-banner {
  border: 1px solid #c9a17f;
  border-left: 4px solid var(--accent);
  border-radius: 4px;
  background: #f5eadf;
  box-shadow: 0 16px 36px rgba(89, 61, 40, .08);
}
.client-announcement-icon { border-radius: 3px; background: var(--dark); color: var(--accent); }
.client-announcement-content h2 { color: #322a24; }
.client-announcement-content p { color: #54493f; }
.client-announcement-eyebrow { color: var(--accent-strong); }
.client-announcement-ack { border-color: #ceb49f; border-radius: 3px; background: rgba(255, 250, 243, .72); }
.client-announcement-ack input { accent-color: var(--accent-strong); }
.client-announcement-banner.is-acknowledged { border-color: #8aa18f; border-left-color: var(--green); background: #e8eee9; }

.client-current-repairs { border-top: 3px solid var(--accent); background: var(--panel-strong); }
.client-current-repairs .eyebrow { color: var(--accent-strong); }
.client-command-v2, .client-command-v3, .repair, .ticket-card, .doc, .event { border-color: var(--border); background: #f5f0e9; }

/* Réponse contextuelle aux informations envoyées par l'atelier. */
.client-info-reply{display:grid;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid rgba(169,112,72,.24)}
.client-info-reply-toggle{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:10px 13px;border:1px solid rgba(169,112,72,.5);border-radius:9px;background:#fffaf4;color:#70452e;font:inherit;font-weight:800;cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.client-info-reply-toggle:hover{background:#fff3e8;border-color:#a86b46;transform:translateY(-1px)}
.client-info-reply.is-open .client-info-reply-toggle{background:#efe3d6;border-color:#9f6542}
.client-info-reply-composer{display:grid;gap:8px;padding:13px;border:1px solid rgba(169,112,72,.28);border-radius:10px;background:rgba(255,255,255,.78)}
.client-info-reply-composer[hidden]{display:none!important}
.client-info-reply-composer label{font-size:12px;font-weight:900;color:#46372e}
.client-info-reply-composer textarea{width:100%;min-height:88px;resize:vertical;padding:11px 12px;border:1px solid #cdbbad;border-radius:8px;background:#fff;color:#222;font:inherit;line-height:1.5}
.client-info-reply-composer textarea:focus{outline:2px solid rgba(184,112,68,.25);border-color:#a86b46}
.client-info-reply-actions{display:flex;flex-wrap:wrap;gap:8px}
.client-info-reply-status{min-height:18px;color:#6d625b;font-size:12px;font-weight:700}
.client-info-reply-status.success{color:#176b48}
.client-info-reply-status.error{color:#ad3028}
@media(max-width:680px){.client-info-reply-actions{display:grid;grid-template-columns:1fr}.client-info-reply-actions .btn{width:100%}}
.repair:hover, .doc:hover, .client-quick-card:hover, .client-service-offer:hover {
  border-color: #b98562;
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(52, 39, 29, .09);
}
.progress span, .repair-progress span, .client-tracking-progress span { background: var(--accent); }
.pill, .status-pill, .ticket-status, .sub-pill, .service-badge, .svc-owned-badge { border-radius: 2px; }

.tabs, .client-page-tabs:not(.client-menu-v3), .cdash-tabs { border-radius: 4px; background: #ddd4c9; }
.tabs button, .cdash-tab { border-radius: 3px; }
.tabs button.active, .cdash-tab.active { background: var(--panel-strong); color: var(--accent-strong); }
.client-overview-grid { gap: 22px; }
.client-overview-main, .client-overview-side { gap: 20px; }
.client-quick-card { border-left: 3px solid var(--accent) !important; border-radius: 4px; background: var(--panel); }
.client-quick-card strong { color: var(--ink); }
.client-quick-card span { color: var(--muted); }

.client-service-banner, .client-service-offer, .svc-card, .client-cloud-promo,
.client-services-promo, .client-buyback-panel, .client-buyback-panel.accepted {
  border-color: var(--border);
  border-radius: 5px;
  background: var(--panel);
  color: var(--ink);
  box-shadow: var(--shadow);
}
.client-cloud-promo, .client-services-promo { position: relative; border-left: 4px solid var(--accent); }
.client-cloud-promo h2, .client-cloud-promo p,
.client-services-promo h2, .client-services-promo p { color: var(--ink); }
.client-cloud-promo .ccp-badge, .service-price-chip, .service-badge, .svc-flag {
  border-radius: 2px;
  background: var(--accent-soft);
  color: var(--accent-strong);
}
.client-service-offer, .svc-card { background: #f3eee7; }
.client-service-offer ul li, .svc-specs li { color: #4e4842; }
.client-service-offer ul li::before, .svc-specs li::before { color: var(--accent-strong); }
.company { border-top: 1px solid var(--border-strong); background: transparent; box-shadow: none; }
.client-footer {
  padding-top: 18px;
  border-top: 1px solid var(--border-strong);
  color: #777067;
  font-family: var(--font-tech);
  font-size: 10px;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.portal-modal-backdrop { background: rgba(24, 25, 21, .72); }
.portal-modal { border: 1px solid var(--border-strong); background: var(--panel-strong); }
.portal-modal-head { border-bottom-color: var(--border); }
.portal-toast { border-radius: 3px; border-color: rgba(224, 164, 125, .48); background: var(--dark-soft); color: #f0ebe4; }

.page:not(:has(.client-dashboard-v3)) .client-portal-hero { min-height: 250px; padding-bottom: 68px; }
.page:not(:has(.client-dashboard-v3)) .shell { max-width: 1160px; margin-top: -54px; }
.page:not(:has(.client-dashboard-v3)) .auth-grid { gap: 18px; }
.page:not(:has(.client-dashboard-v3)) .intro-panel { border-top: 3px solid var(--accent); background: var(--panel-strong); }
.page:not(:has(.client-dashboard-v3)) .step { border-radius: 3px; border-color: var(--border); background: #f0eae2; }
.page:not(:has(.client-dashboard-v3)) .step span { border-radius: 2px; background: var(--dark); color: var(--accent); }

@keyframes copperPortalIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.client-dashboard-v3 > .client-preview-banner,
.client-dashboard-v3 > .client-announcement-banner,
.client-dashboard-v3 > .client-current-repairs,
.client-dashboard-v3 > .client-service-banner,
.client-dashboard-v3 > .client-overview-grid,
.client-dashboard-v3 > .panel { animation: copperPortalIn .38s ease both; }

@media (max-width: 1180px) {
  .dash.client-dashboard-v3 { padding-right: 24px; padding-left: calc(264px + 24px); }
  .client-portal-hero { padding-inline: 28px; }
}
@media (max-width: 900px) {
  .page:has(.client-dashboard-v3) > .client-portal-hero { width: 100%; margin-left: 0; }
  .client-portal-hero { min-height: 152px; padding: 22px 18px 24px; }
  .client-portal-hero-media { width: 72%; opacity: .5; }
  .client-portal-brand { width: min(530px, 76%); }
  .client-portal-hero h1 { font-size: 32px; }
  .client-portal-hero p { font-size: 13px; }
  .dash.client-dashboard-v3 { padding: 18px 14px 48px !important; }
  .client-burger {
    min-height: 44px;
    margin-bottom: 0;
    border-radius: 3px;
    border-color: rgba(224, 164, 125, .42);
    background: var(--dark);
    color: #f0ebe4;
    box-shadow: none;
  }
  .client-page-tabs.client-menu-v3 { width: 304px !important; background: var(--dark); border-right-color: rgba(224, 164, 125, .36) !important; }
  .dash.client-dashboard-v3.menu-ouvert .client-menu-backdrop { background: rgba(24, 25, 21, .68); }
  .client-overview-grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 640px) {
  .client-portal-hero { min-height: 168px; padding: 18px 14px 20px; }
  .client-portal-hero .hero-inner { align-items: flex-end; }
  .client-portal-brand { width: 74%; }
  .client-portal-kicker { font-size: 8px; letter-spacing: .09em; }
  .client-portal-hero h1 { font-size: 27px; }
  .client-portal-hero p { display: none; }
  .client-portal-hero .top-actions .btn { min-height: 40px; padding-inline: 12px; font-size: 12px; }
  .client-portal-hero-media { width: 100%; opacity: .42; background-position: 64% 54%; }
  .dash.client-dashboard-v3 { gap: 16px; padding: 14px 10px 38px !important; }
  .panel, .client-current-repairs, .client-service-banner { padding: 18px 16px; }
  .section-head h2 { font-size: 21px; }
  .client-announcement-banner { grid-template-columns: 42px minmax(0, 1fr); }
  .client-announcement-ack { grid-column: 1 / -1; }
  .client-footer { gap: 7px; }
}
@media (prefers-reduced-motion: reduce) {
  .client-dashboard-v3 > * { animation: none !important; transition: none !important; }
}

/* ==========================================================================
   Portail client — harmonisation complète et navigation simplifiée
   ========================================================================== */

/* Navigation : cinq usages quotidiens, le reste dans un tiroir volontaire. */
.client-page-tabs.client-menu-v3 {
  width: 252px;
  padding: 20px 13px 24px;
  gap: 8px;
  scrollbar-color: rgba(200, 132, 92, .42) transparent;
}
.page:has(.client-dashboard-v3) > .client-portal-hero {
  width: calc(100% - 252px);
  margin-left: 252px;
}
.dash.client-dashboard-v3 {
  padding-left: calc(252px + 38px);
}
.cmenu-brand {
  min-height: 64px;
  margin: 0 2px 10px;
  padding: 4px 9px 15px 14px;
  border-left: 2px solid var(--accent);
  border-bottom: 0;
}
.cmenu-brand-mark { display: none; }
.cmenu-brand-txt strong { font-size: 16px; }
.cmenu-brand-txt small { margin-top: 5px; display: block; }
.cmenu-section-title,
.cmenu-current > span,
.cmenu-drawer-section > span {
  display: block;
  padding: 0 10px 7px;
  color: #746e67;
  font-family: var(--font-tech);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.cmenu-primary,
.cmenu-current,
.cmenu-drawer-section {
  display: grid;
  gap: 5px;
}
.cmenu-current {
  margin-top: 2px;
  padding-top: 11px;
  border-top: 1px solid rgba(240, 236, 230, .11);
}
.client-page-tabs.client-menu-v3 a {
  min-height: 47px;
  padding: 8px 10px;
  border-radius: 11px;
}
.client-page-tabs.client-menu-v3 a:hover {
  border-color: rgba(224, 164, 125, .28);
  background: #24251f;
}
.client-page-tabs.client-menu-v3 a.active {
  border-color: rgba(224, 164, 125, .44);
  border-radius: 11px;
  background:
    linear-gradient(90deg, rgba(200, 132, 92, .18), rgba(200, 132, 92, .04)),
    #292a24;
  box-shadow: inset 3px 0 0 var(--accent);
}
.client-page-tabs.client-menu-v3 a b {
  border-radius: 999px;
  min-width: 20px;
  height: 20px;
}
.cmenu-more {
  margin-top: 3px;
  border: 1px solid rgba(224, 164, 125, .18);
  border-radius: 12px;
  background: rgba(255, 255, 255, .025);
  overflow: hidden;
}
.cmenu-more-toggle {
  width: 100%;
  min-height: 46px;
  padding: 11px 12px;
  color: #c8c0b8;
  letter-spacing: 0;
  text-transform: none;
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 750;
}
.cmenu-more-toggle:hover { background: var(--dark-soft); color: #f0ebe4; }
.cmenu-more-toggle .cmenu-group-ico { color: var(--accent); }
.cmenu-more.collapsed .cmenu-drawer { display: none; }
.cmenu-more:not(.collapsed) .cmenu-chev { transform: rotate(180deg); }
.cmenu-drawer {
  max-height: min(55vh, 510px);
  padding: 5px 7px 10px;
  overflow-y: auto;
  border-top: 1px solid rgba(240, 236, 230, .09);
}
.cmenu-drawer-section {
  padding-top: 11px;
}
.cmenu-drawer-section > span { padding-left: 7px; }
.client-page-tabs.client-menu-v3 .cmenu-drawer a {
  min-height: 40px;
  padding: 7px 8px;
  border-radius: 9px;
}
.client-page-tabs.client-menu-v3 .cmenu-drawer a small { display: none; }
.client-page-tabs.client-menu-v3 .cmenu-drawer a span { align-self: center; }
.cmenu-account {
  margin-top: 2px;
  border-top: 1px solid rgba(240, 236, 230, .1) !important;
}

/* Une palette unique : ivoire, graphite, cuivre. Les couleurs d'état restent
   réservées aux confirmations, alertes et erreurs. */
.client-announcement-banner,
.client-announcement-banner.is-acknowledged {
  border-color: #cbb8a8;
  border-left-color: var(--accent);
  background: #f3eee7;
  box-shadow: 0 16px 36px rgba(54, 42, 31, .08);
}
.client-announcement-icon,
.client-announcement-banner.is-acknowledged .client-announcement-icon {
  background: var(--dark-soft);
  color: var(--accent);
}
.client-announcement-ack,
.client-announcement-ack.is-acknowledged {
  border-color: #d4c4b5;
  background: #eee8df;
}
.client-announcement-ack input { accent-color: var(--accent-strong); }
.client-announcement-ack.is-acknowledged small { color: #526b59; }

.client-preview-banner,
.client-current-repairs,
.client-command-v2,
.client-command-v3,
.client-follow-panel,
.client-message-panel,
.support-hub,
.client-legal-card,
.client-legal-hero,
.client-legal-hero.rules,
.register-card,
.account-card,
.warranty-card,
.store-client-card,
.client-quick-card,
.payment-due,
.latest-live-card {
  border-color: var(--border) !important;
  background: var(--panel) !important;
  box-shadow: var(--shadow) !important;
}
.command-copy,
.atelier-presence,
.doc-summary-item,
.tracking-metric,
.client-quick-card.legal {
  border-color: var(--border) !important;
  background: #f4efe8 !important;
}
.client-next-action {
  border-color: rgba(224, 164, 125, .28);
  background: var(--dark-soft);
}
.client-next-action > span { color: var(--accent); }
.tracking-metric,
.tracking-metric.hot,
.tracking-metric.warn,
.tracking-metric.live { border-left-color: var(--accent); }
.client-quick-card.store,
.client-quick-card.warranty,
.client-quick-card.legal { border-left-color: var(--accent) !important; }
.doc-summary-item.total,
.doc-summary-item.success { background: #e8eee9 !important; border-color: #b9c7bb !important; }
.doc-summary-item.total dd,
.doc-summary-item.success dd { color: #416149; }
.doc .doc-total { background: var(--accent-soft); border-color: #d9bda9; color: var(--accent-strong); }

/* Pages Services, Web et Cloud : neutralisation définitive des anciens violets. */
#client-services,
#client-web,
#client-cloud {
  background: transparent !important;
}
#client-web .webx-hero,
#client-services .svc-hero,
#client-cloud .cloud-private-banner,
.cloudx-banner,
.emp-hero,
.client-services-promo,
.client-cloud-promo {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(224, 164, 125, .32) !important;
  border-radius: 10px !important;
  background:
    radial-gradient(700px 260px at 92% -10%, rgba(200, 132, 92, .27), transparent 62%),
    linear-gradient(135deg, #181915 0%, #25231e 58%, #6d4935 100%) !important;
  background-size: auto !important;
  color: #f2ece5 !important;
  box-shadow: 0 22px 50px rgba(33, 27, 22, .16) !important;
  animation: none !important;
}
#client-web .webx-hero,
#client-services .svc-hero,
#client-cloud .cloud-private-banner { padding: 34px 36px !important; }
#client-web .webx-hero::before,
#client-web .webx-hero::after,
#client-services .svc-hero::before,
#client-services .svc-hero::after,
#client-cloud .cloud-private-banner::before,
#client-cloud .cloud-private-banner::after { animation: none !important; filter: none !important; }
#client-web .webx-hero h2,
#client-services .svc-hero h2,
.emp-hero h2,
.emp-hero h3,
.client-services-promo h2,
.client-cloud-promo h2 { color: #f2ece5 !important; }
#client-web .webx-hero h2,
#client-services .svc-hero h2 { font-size: clamp(30px, 3.3vw, 44px) !important; }
#client-web .webx-hero p,
#client-services .svc-hero p,
.emp-hero p,
.client-services-promo p,
.client-cloud-promo p { color: #c8beb5 !important; }
#client-web .webx-flag,
#client-services .svc-flag,
.client-cloud-promo .ccp-badge,
.client-services-promo .ccp-badge {
  border: 1px solid rgba(224, 164, 125, .36) !important;
  border-radius: 999px !important;
  background: rgba(200, 132, 92, .12) !important;
  color: #e6b18f !important;
}
#client-web .webx-steps li {
  border-color: rgba(224, 164, 125, .24) !important;
  border-radius: 8px !important;
  background: rgba(255, 250, 243, .055) !important;
}
#client-web .webx-steps li > span {
  background: var(--accent) !important;
  color: #181915 !important;
}
#client-services .svc-card,
#client-web .web-site-card,
#client-web .webx-card,
#client-cloud .cloud-quota-card,
#client-cloud .cloud-transfer-card,
.cloudx .cloudx-card,
.cloudx.cdash {
  border-color: var(--border) !important;
  border-radius: 8px !important;
  background: var(--panel-strong) !important;
  box-shadow: var(--shadow) !important;
}
#client-services .svc-card::before,
#client-web .web-site-card::before,
#client-services .svc-card::after,
#client-web .web-site-card::after {
  height: 3px !important;
  background: var(--accent) !important;
  opacity: 1 !important;
}
#client-web .webx-kpi,
.cloudx .kpi,
.cloudx .cdash-sec-card {
  border-color: var(--border) !important;
  border-radius: 6px !important;
  background: #f1ece5 !important;
}
#client-web .webx-kpi b,
#client-web .webx-kpi strong,
#client-web .webx-kpi > b {
  color: var(--ink) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}
#client-web .webx-gallery,
.webx .web-gallery,
.cloudx .cdash-head,
.cloud-private-banner,
.emp-resale-hi {
  border-color: var(--border) !important;
  background: #f2ede6 !important;
}
.cloudx .gauge > div,
.cloud-usage-bar > div,
.ws-bar span { background: var(--accent) !important; }

/* Boutons et conversation : plus aucun violet décoratif. */
#client-services .svc-card .btn.primary,
#client-cloud .btn.primary,
#client-web .btn.primary,
.btn.primary,
.gx-btn.market {
  border-color: var(--accent) !important;
  background: var(--accent) !important;
  color: #181915 !important;
  box-shadow: 0 10px 24px rgba(123, 76, 48, .16) !important;
}
#client-services .svc-card .btn.primary:hover,
#client-cloud .btn.primary:hover,
#client-web .btn.primary:hover,
.btn.primary:hover {
  background: #dda078 !important;
  box-shadow: 0 13px 28px rgba(123, 76, 48, .22) !important;
}
.lc-fab {
  border: 1px solid rgba(224, 164, 125, .48) !important;
  background: var(--dark-soft) !important;
  color: var(--accent) !important;
  box-shadow: 0 14px 30px rgba(33, 27, 22, .28) !important;
}
.lc-head { background: var(--dark-soft) !important; color: #f2ece5 !important; }
.lc-msg.me .lc-bubble { background: var(--accent) !important; color: #181915 !important; }

/* Les couleurs de documents et statuts deviennent plus sobres sans perdre leur sens. */
.ticket-doc-chip.quote,
.pill.repairing,
.pill.accepted {
  border-color: #d8bca8 !important;
  background: var(--accent-soft) !important;
  color: var(--accent-strong) !important;
}
.ticket-doc-chip.invoice {
  border-color: #c8c2b8 !important;
  background: #eee9e1 !important;
  color: #514b45 !important;
}

#client-subscriptions .svc-card,
#client-empreinte .emp-card,
#client-cessions .cession-card,
#client-account .register-address,
#client-store .store-client-card {
  border-color: var(--border) !important;
  border-radius: 8px !important;
  background: var(--panel-strong) !important;
  box-shadow: var(--shadow) !important;
}
.emp-premium.locked,
.emp-premium.requested {
  border: 1px solid #d0b5a0 !important;
  border-radius: 8px !important;
  background: var(--accent-soft) !important;
  color: var(--ink) !important;
}
.emp-premium.locked p,
.emp-premium.locked strong,
.emp-premium.locked b { color: var(--ink) !important; }
.store-client-image-empty {
  background: #e9e2d9 !important;
  color: var(--accent-strong) !important;
}
.live-chip,
.svc-owned-badge,
.sub-pill {
  border-color: #d2b9a6 !important;
  background: var(--accent-soft) !important;
  color: var(--accent-strong) !important;
}
.btn.blue {
  border-color: var(--dark-soft) !important;
  background: var(--dark-soft) !important;
  color: #f2ece5 !important;
}
#client-games .game-card.gx {
  border-color: rgba(224, 164, 125, .28) !important;
  background: linear-gradient(180deg, #20211d, #171814) !important;
  box-shadow: 0 22px 50px rgba(28, 23, 19, .22) !important;
}
#client-games .game-card.gx::before {
  background: var(--accent) !important;
  opacity: .48 !important;
}
#client-games .game-card.gx .gx-top {
  border-bottom-color: rgba(224, 164, 125, .18) !important;
  background: linear-gradient(180deg, rgba(200, 132, 92, .11), transparent) !important;
}
#client-games .gx-btn.market,
#client-games .game-card.gx .gx-btn.gx-start {
  border-color: var(--accent) !important;
  background: var(--accent) !important;
  color: #181915 !important;
  box-shadow: none !important;
}
#client-games .game-card.gx .gx-tab.active::after {
  background: var(--accent) !important;
  box-shadow: none !important;
}

@media (max-width: 1180px) {
  .dash.client-dashboard-v3 { padding-left: calc(252px + 24px); }
}
@media (max-width: 900px) {
  .page:has(.client-dashboard-v3) > .client-portal-hero { width: 100%; margin-left: 0; }
  .client-page-tabs.client-menu-v3 { width: min(88vw, 326px) !important; padding: 18px 12px 24px !important; }
  .dash.client-dashboard-v3 { padding-left: 14px !important; }
}
@media (max-width: 640px) {
  #client-web .webx-hero,
  #client-services .svc-hero,
  #client-cloud .cloud-private-banner { padding: 24px 20px !important; }
  #client-web .webx-hero h2,
  #client-services .svc-hero h2 { font-size: 30px !important; }
  .client-announcement-banner { border-radius: 9px; }
}

/* Chronologie des communications visible depuis l'accueil client. */
.client-communications{margin:24px 0;border:1px solid rgba(147,92,57,.27)!important;background:linear-gradient(145deg,#fdfbf7,#f6f1e9)!important;box-shadow:0 20px 45px rgba(52,40,29,.08)!important;overflow:hidden}
.client-communications-head{align-items:flex-start;border-bottom:1px solid rgba(147,92,57,.17);padding-bottom:18px}.client-communications-head h2{margin:4px 0 5px}.client-communications-head p{margin:0;color:#756d63;max-width:760px}
.client-communications-privacy{display:inline-flex;align-items:center;padding:7px 10px;border:1px solid rgba(147,92,57,.22);border-radius:999px;color:#7b4d32;background:#fffaf5;font-size:.75rem;font-weight:800;white-space:nowrap}
.client-communication-filters{display:flex;gap:8px;flex-wrap:wrap;padding:14px 0 13px;border-bottom:1px solid rgba(147,92,57,.15)}
.client-communication-filter{border:1px solid rgba(147,92,57,.24);border-radius:999px;padding:8px 12px;background:#fff;color:#4a4038;font:inherit;font-size:.8rem;font-weight:750;cursor:pointer}
.client-communication-filter b{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:5px;border-radius:10px;background:#f1e8de;font-size:.7rem}
.client-communication-filter.active{border-color:#a96843;background:#a96843;color:#fff;box-shadow:0 8px 18px rgba(169,104,67,.2)}.client-communication-filter.active b{background:rgba(255,255,255,.22)}
.client-communication-list{max-height:620px;overflow:auto}
.client-communication-row{display:grid;grid-template-columns:42px minmax(0,1fr);gap:13px;padding:17px 2px;border-bottom:1px solid rgba(147,92,57,.14)}.client-communication-row:last-child{border-bottom:0}.client-communication-row[hidden]{display:none}
.client-communication-icon{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(147,92,57,.25);border-radius:50%;background:#fff9f3;color:#a96843;font-weight:900}
.client-communication-row.incoming .client-communication-icon{background:#edf7ef;color:#37734d;border-color:#bcd9c5}.client-communication-row.outgoing .client-communication-icon{background:#fff4e8;color:#a45b2f}
.client-communication-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:#81776d;font-size:.78rem}.client-communication-meta strong{color:#302922;font-size:.88rem}.client-communication-meta time{font-variant-numeric:tabular-nums}
.client-communication-ticket{padding:3px 7px;border-radius:999px;background:#eee5da;color:#70513d;font-weight:800}.client-communication-copy h3{margin:7px 0 4px;font-size:1rem}.client-communication-copy p{margin:6px 0 0;color:#5e554d;line-height:1.58;overflow-wrap:anywhere}.client-communication-copy small{display:block;margin-top:7px;color:#7c6f64}
@media(max-width:640px){.client-communications{margin:16px 0!important;padding:18px 16px!important}.client-communications-head{display:grid!important}.client-communications-privacy{justify-self:start}.client-communication-filters{overflow-x:auto;flex-wrap:nowrap}.client-communication-list{max-height:none}.client-communication-row{grid-template-columns:36px minmax(0,1fr)}.client-communication-icon{width:34px;height:34px}.client-communication-meta{gap:5px}.client-communication-copy p{font-size:.92rem}}

/* Centre d'aide v3 : widget client compact sur bureau, plein écran sur mobile. */
.lc-widget { right: 18px !important; bottom: 18px !important; gap: 10px !important; font-family: var(--font-body, Arial, sans-serif); }
.lc-fab { display: grid !important; width: 56px !important; height: 56px !important; padding: 0 !important; place-items: center; border-radius: 50% !important; background: #1d211f !important; color: #e2a27c !important; box-shadow: 0 14px 30px rgba(28, 30, 28, .24) !important; font-size: 20px !important; }
.lc-fab:hover { transform: translateY(-2px) !important; background: #292e2b !important; }
.lc-widget.open .lc-fab { opacity: .72; transform: scale(.88) !important; }
.lc-badge { top: -4px !important; right: -4px !important; border-color: #f8f4ee !important; background: #b83243 !important; }
.lc-panel { width: 420px !important; max-width: calc(100vw - 28px) !important; height: min(680px, calc(100dvh - 100px)) !important; max-height: none !important; overflow: hidden !important; border: 1px solid #cfc7bc !important; border-radius: 8px !important; background: #f8f4ee !important; box-shadow: 0 24px 64px rgba(28, 27, 24, .25) !important; }
.lc-panel[hidden], .lc-compose[hidden], .lc-topics[hidden], #lcEndBtn[hidden] { display: none !important; }
.lc-head { min-height: 68px; padding: 11px 12px !important; justify-content: flex-start !important; border-bottom: 1px solid rgba(227, 166, 128, .22); background: #1d211f !important; }
.lc-brand { display: grid; width: 40px; height: 40px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(226, 162, 124, .38); border-radius: 7px; background: #292e2b; color: #e2a27c; font-size: 17px; }
.lc-head-txt { display: grid; min-width: 0; margin-right: auto; }
.lc-head-txt strong { color: #fbf7f1; font-size: 14px !important; letter-spacing: 0; }
.lc-head-txt small { max-width: 238px; overflow: hidden; color: #bbb9b2 !important; font-size: 10.5px !important; text-overflow: ellipsis; white-space: nowrap; }
.lc-head-actions { display: flex; gap: 5px; }
.lc-x { display: grid; width: 34px !important; height: 34px !important; padding: 0; place-items: center; border: 1px solid #444a46 !important; border-radius: 6px !important; background: #292e2b !important; color: #ddd9d2 !important; font-size: 13px !important; }
.lc-x:hover, .lc-x.active { border-color: #bc7954 !important; background: #39332e !important; color: #f0ad84 !important; }
.lc-msgs { gap: 9px !important; padding: 16px !important; background: #eeeae3 !important; scrollbar-color: #c0b8ad transparent; }
.lc-intro { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 11px; padding: 13px !important; border-color: #d6cec3 !important; border-radius: 7px !important; background: #fbf8f3 !important; color: #4e4b45 !important; box-shadow: none !important; }
.lc-intro-icon { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 6px; background: #262b28; color: #dfa078; }
.lc-intro strong { color: #262925; font-size: 13px; }
.lc-intro p { margin: 3px 0 8px; font-size: 11.5px; line-height: 1.48; }
.lc-intro small { display: flex; gap: 5px; align-items: flex-start; color: #777269; font-size: 9px; line-height: 1.4; }
.lc-msg { max-width: 82% !important; }
.lc-who { display: flex; gap: 4px; align-items: center; margin: 0 0 3px 4px !important; color: #6f706a !important; font-size: 9px !important; }
.lc-bubble { padding: 9px 11px !important; border-radius: 8px !important; font-size: 12.5px !important; line-height: 1.48 !important; overflow-wrap: anywhere; }
.lc-msg.me .lc-bubble { border: 1px solid #ad6845; border-bottom-right-radius: 2px !important; background: #bd7853 !important; color: #171916 !important; }
.lc-msg.them .lc-bubble { border-color: #d0c9bf !important; border-bottom-left-radius: 2px !important; background: #fff !important; color: #292c28 !important; }
.lc-time { display: flex; gap: 4px; align-items: center; margin-top: 3px; color: #797970; font-size: 8.5px; }
.lc-msg.me .lc-time { justify-content: flex-end; }
.lc-msg.me .lc-time i { color: #47745b; font-size: 8px; }
.lc-sys { padding: 4px 9px !important; border: 1px solid #d4cec5; border-radius: 5px !important; background: #e6e1da !important; color: #716d65 !important; font-size: 9px !important; }
.lc-day { display: flex; gap: 8px; align-items: center; width: 100%; margin: 3px 0; color: #89837a; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.lc-day::before, .lc-day::after { content: ''; height: 1px; flex: 1; background: #d8d1c7; }
.lc-day span { white-space: nowrap; }
.lc-reopen { display: flex; gap: 9px; align-items: center; align-self: stretch; margin-top: 5px; padding: 10px; border: 1px solid #d2cbc1; border-radius: 6px; background: #f8f5ef; color: #756f67; }
.lc-reopen > i { color: #9e6849; }
.lc-reopen span { display: grid; font-size: 9px; }
.lc-reopen strong { color: #383a35; font-size: 10px; }
.lc-compose { flex: 0 0 auto; border-top: 1px solid #d3cbc0; background: #fbf8f3; }
.lc-topics { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; padding: 10px 11px 4px; }
.lc-topics button { display: flex; gap: 6px; align-items: center; min-width: 0; min-height: 34px; padding: 6px 8px; border: 1px solid #d2c9bd; border-radius: 6px; background: #fff; color: #4c4c46; font: inherit; font-size: 9.5px; font-weight: 750; text-align: left; cursor: pointer; }
.lc-topics button:last-child { grid-column: 1 / -1; }
.lc-topics button i { width: 16px; flex: 0 0 auto; color: #aa6c4b; text-align: center; }
.lc-topics button:hover, .lc-topics button.active { border-color: #b67450; background: #f3e3d8; color: #302d29; }
.lc-input { gap: 7px !important; padding: 7px 11px 4px !important; border: 0 !important; background: transparent !important; }
.lc-input textarea { min-height: 43px; max-height: 120px !important; padding: 10px 11px !important; border: 1px solid #c9c0b5 !important; border-radius: 7px !important; background: #fff !important; color: #292b27; font-size: 12.5px !important; resize: none !important; }
.lc-input textarea:focus { border-color: #aa6847 !important; box-shadow: 0 0 0 3px rgba(170, 104, 71, .1) !important; }
.lc-send { display: grid; width: 43px !important; height: 43px !important; padding: 0; place-items: center; border-radius: 7px !important; background: #1f2521 !important; color: #e5a47e !important; font-size: 14px !important; }
.lc-send:hover { background: #303630 !important; }
.lc-send:disabled { cursor: wait; opacity: .55; }
.lc-send.loading i { animation: lcSendPulse .8s ease-in-out infinite alternate; }
@keyframes lcSendPulse { to { transform: translateX(3px); opacity: .55; } }
.lc-compose-foot { display: flex; min-height: 30px; gap: 8px; align-items: center; justify-content: space-between; padding: 0 12px 8px; color: #8b8379; font-size: 8px; }
.lc-compose-foot > button { display: inline-flex; gap: 5px; align-items: center; padding: 4px 0; border: 0; background: transparent; color: #856149; font: inherit; font-size: 8.5px; font-weight: 750; cursor: pointer; }
.lc-compose-foot > button:hover { color: #9f3d3f; }
.lc-back { display: inline-flex; gap: 6px; align-items: center; align-self: flex-start; padding: 5px 0; border: 0; background: transparent; color: #985e40; font: inherit; font-size: 10px; font-weight: 800; cursor: pointer; }
.lc-view-title { display: grid; gap: 2px; margin: 2px 0 6px; padding-bottom: 10px; border-bottom: 1px solid #d8d1c7; }
.lc-view-title strong { color: #292c27; font-size: 14px; }
.lc-view-title span { color: #77736c; font-size: 9px; }
.lc-history-list { display: grid; gap: 6px; }
.lc-history-row { display: grid; gap: 5px; width: 100%; padding: 10px; border: 1px solid #d4cdc3; border-radius: 7px; background: #f9f6f1; color: #393a35; font: inherit; text-align: left; cursor: pointer; }
.lc-history-row:hover { border-color: #bb805e; background: #fff; }
.lc-history-top, .lc-history-meta { display: flex; gap: 8px; align-items: center; justify-content: space-between; }
.lc-history-top b { min-width: 0; overflow: hidden; font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.lc-history-top em { padding: 2px 5px; border-radius: 4px; background: #eee9e2; color: #706b64; font-size: 7px; font-style: normal; font-weight: 850; text-transform: uppercase; }
.lc-history-top em.open { background: #e2f0e6; color: #34704e; }
.lc-history-preview { overflow: hidden; color: #605e58; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.lc-history-meta { color: #89837b; font-size: 8px; }
.lc-loading, .lc-empty-view { display: grid; gap: 7px; margin: auto; place-items: center; padding: 34px 14px; color: #77736c; text-align: center; }
.lc-empty-view > i { color: #a76b4c; font-size: 24px; }
.lc-empty-view strong { color: #383a35; font-size: 12px; }
.lc-empty-view span { font-size: 9px; }
.lc-close-view { display: grid; gap: 9px; margin: auto; place-items: center; padding: 28px 16px; text-align: center; }
.lc-close-view > i { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 50%; background: #e5efe8; color: #47745b; font-size: 22px; }
.lc-close-view strong { color: #292c27; font-size: 15px; }
.lc-close-view p { max-width: 300px; margin: 0; color: #6f6b64; font-size: 10.5px; line-height: 1.5; }
.lc-close-view > div { display: flex; gap: 7px; margin-top: 5px; }
.lc-close-view button { min-height: 35px; padding: 7px 10px; border: 1px solid #c9c1b6; border-radius: 6px; background: #fff; color: #4e4c47; font: inherit; font-size: 9px; font-weight: 800; cursor: pointer; }
.lc-close-view button.primary { border-color: #47745b; background: #47745b; color: #fff; }

@media (max-width: 620px) {
  body.lc-mobile-open { overflow: hidden !important; }
  .lc-widget { right: max(12px, env(safe-area-inset-right)) !important; bottom: max(82px, calc(72px + env(safe-area-inset-bottom))) !important; }
  .lc-widget.open { inset: 0 !important; display: block !important; }
  .lc-widget.open .lc-fab { display: none !important; }
  .lc-panel { width: 100vw !important; max-width: none !important; height: 100dvh !important; max-height: none !important; border: 0 !important; border-radius: 0 !important; }
  .lc-head { min-height: calc(62px + env(safe-area-inset-top)); padding: max(9px, env(safe-area-inset-top)) 10px 9px !important; }
  .lc-msgs { padding: 13px 11px !important; }
  .lc-msg { max-width: 88% !important; }
  .lc-compose { padding-bottom: env(safe-area-inset-bottom); }
  .lc-input textarea { font-size: 16px !important; }
}