/*
 * EARONTECH — REPÈRES DE MAINTENANCE
 * Écrans : Thème commun, boutons, couleurs, typographie et aperçu des paramètres Apparence.
 * Chargement : private/view.php, private/client-relations.php, private/explorer.php, private/salon-mode.php.
 * Interactions : public/application-appearance.js.
 * Les couleurs et tailles paramétrables utilisent les variables --app-* / --product-*.
 * Les blocs @media adaptent la même interface à la largeur de l’écran.
 * Conserver l’ordre des règles : les ajustements spécialisés suivent le socle commun.
 */

/* APPARENCE COMMUNE — valeurs personnalisées fournies par appearance_css.
   Les composants métier gardent leurs couleurs propres et leur fond lisible. */
body.platform-appearance:not(.product-editor-embedded)  {
  background-color: var(--app-background-color, #f3f5f9);
  background-image: var(--app-background-image, none);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

body.platform-appearance.product-editor-embedded  {
  background: #fff;
}

/* Connexion et double authentification : le formulaire reste sur fond blanc,
   tandis que le bandeau du logo reprend le fond du menu configuré. */
body.platform-appearance.auth-page  {
  min-height: 100vh;
  display: flow-root;
}

body.platform-appearance.auth-page .login-panel  {
  background: #fff;
}

body.platform-appearance.auth-page .auth-logo  {
  background: var(--app-menu-background, #142035);
}

/* Aide et navigation des formulaires de récupération d'accès. */
.auth-page .auth-recovery-link  {
  margin: 12px 0;
  font-size: calc(13px * var(--app-text-scale, 1));
}

.auth-page .auth-recovery-intro  {
  margin: 14px 0;
  font-size: calc(14px * var(--app-text-scale, 1));
  line-height: 1.5;
}

.auth-page .auth-recovery-help  {
  margin-top: 14px;
  font-size: calc(12px * var(--app-text-scale, 1));
  line-height: 1.5;
}

/* Le nom --green est historique : il représente l’accent principal du site.
   Le réappliquer dans l’aperçu permet de tester un thème sans le publier. */
body.platform-appearance, .appearance-preview  {
  --app-primary-color: var(--app-link-color, #1c75bc);
  --app-primary-soft: color-mix(in srgb, var(--app-primary-color) 9%, white);
  --app-primary-border: color-mix(in srgb, var(--app-primary-color) 30%, white);
  --app-control-height: calc(26px * var(--app-buttons-scale, 1));
  --green: var(--app-primary-color);
  --app-font-scale: var(--app-text-scale, 1);
}

body.platform-appearance  {
  font-size: calc(16px * var(--app-text-scale, 1));
}

/* Les tailles de chaque module sont multipliées par ce coefficient local.
   Les titres et commandes ont leur propre coefficient ; les tailles relatives
   héritées ne sont pas multipliées une seconde fois. */
:where(body.platform-appearance) :is(h1,h2,h3,h4,h5,h6,legend,[role=heading])  {
  --app-font-scale: var(--app-titles-scale, 1);
}

:where(body.platform-appearance) :is(button,a.button,input[type=submit],input[type=button],[role=button])  {
  --app-font-scale: var(--app-buttons-scale, 1);
}

/* Une commande sans taille spécifique conserve celle de son contexte. */
:where(body.platform-appearance) :is(button,a:where(.button),input:where([type=submit],[type=button]),[role=button])  {
  font-size: calc(1em / var(--app-text-scale, 1) * var(--app-buttons-scale, 1));
}

/* Un titre d'accordéon suit les titres ; le résumé d'un champ multichoix
   reste à la taille du texte saisi. Les menus d'actions suivent les boutons. */
:where(body.platform-appearance) :is(summary,.family-card)  {
  --app-font-scale: var(--app-titles-scale, 1);
}

:where(body.platform-appearance) :is(.choice-dropdown,.news-choices) > summary  {
  --app-font-scale: var(--app-text-scale, 1);
}

body.salon-mode.platform-appearance  {
  font-size: calc(15px * var(--app-text-scale, 1));
}

/* Les aperçus de documents suivent leurs réglages d’édition, pas ceux de l’écran. */
body.platform-appearance :is(.synthesis-sheet,.selection-document,.pdf-sheet,.share-sheet)  {
  --app-font-scale: 1;
}

body.platform-appearance :is(.synthesis-sheet,.selection-document,.pdf-sheet,.share-sheet) :is(h1,h2,h3,h4,h5,h6,legend)  {
  --app-font-scale: 1;
}

:where(body.platform-appearance) a  {
  color: var(--app-link-color, #1c75bc);
}

/* TITRES ET LIBELLÉS — une même couleur dans les pages, cartes et modales.
   Les règles propres aux statuts, indices et en-têtes contrastés restent
   prioritaires. Le contenu des documents conserve sa mise en page d’édition. */
.platform-appearance :where(h1,h2,h3,h4,h5,h6,[role=heading]):not(:where(  .detail-head *, .pdf-content-preview header *, .selection-comparison-dialog > header *,  .synthesis-sheet *, .selection-document-body *, .preview-body *,  .rg-card *, .event-calendar-tile *, [contenteditable] * ))  {
  color: var(--app-primary-color, #1c75bc);
}

.platform-appearance :where(label,legend,.field,dt):not(:where(  .synthesis-sheet *, .selection-document-body *, .preview-body *, [contenteditable] * ))  {
  color: var(--app-primary-color, #1c75bc);
}

/* Les en-têtes pleins utilisent le thème en fond et gardent leur titre
   contrasté, comme les boutons principaux. */
body.platform-appearance :is(#news-dialog,#news-edit-dialog,.selection-comparison-dialog) > header  {
  background: var(--app-primary-color, #1c75bc);
  color: var(--app-button-text, #fff);
}

body.platform-appearance :is(#news-dialog,#news-edit-dialog,.selection-comparison-dialog) > header :is(h1,h2,h3)  {
  color: inherit;
}

/* Un libellé peut englober son contrôle : sa couleur ne doit pas teinter
   la saisie, les valeurs d’une liste ou le résumé d’un choix multiple. */
body.platform-appearance .field :is(input,textarea,select,option), body.platform-appearance label :is(input,textarea,select,option), body.platform-appearance .choice-dropdown > summary  {
  color: #111;
}

/* Pictogrammes des familles et technologies : les SVG héritent du thème
   grâce à currentColor. Le fond reste clair pour conserver leur lisibilité.
   Ces classes sont communes aux cartes, listes, critères et modales. */
body.platform-appearance :is(.category-icon,.family-symbol)  {
  color: var(--app-primary-color, #1c75bc);
  background-color: #f5f7fa;
  background-color: color-mix(in srgb, var(--app-primary-color, #1c75bc) 10%, white);
}

/* Onglets sobres : les onglets actifs à fond plein ont leur contraste
   défini dans la règle des actions ci-dessous. */
body.platform-appearance :is(  .tabs > a, .tabs > button, [role=tab],  .events-tabs > a, .exhibitor-edit-tabs > button,  .share-tabs > button, .selection-detail-tabs > button ):not(:where(:disabled,[aria-disabled=true]))  {
  color: var(--app-primary-color, #1c75bc);
}

/* Actions principales, y compris les boutons historiques des différents modules.
   Les couleurs de décision, d’état, de secteur et d’indice restent indépendantes. */
body.platform-appearance :is(  button.primary, a.primary, input.primary[type=submit],  button[data-synthesis-view],  .application-update-entry [data-update-email],  .filter-drawer-toggle,  .fc-synthesis-actions .button, .fc-synthesis-actions button,  .study-accordion-footer .study-pdf-button,  .framing-tab-help .framing-add-question, .framing-tab-help .framing-ai-button,  .selection-comparison-dialog .comparison-column-options button,  .selection-summary-dialog > header button, .relations-dialog > header button,  .earon-dashboard-layout .earon-tile-footer .button )  {
  background: var(--app-primary-color, #1c75bc);
  border-color: var(--app-primary-color, #1c75bc);
  color: var(--app-button-text, #fff);
}

body.platform-appearance :is(  button.primary, a.primary, input.primary[type=submit],  button[data-synthesis-view],  .application-update-entry [data-update-email],  .filter-drawer-toggle,  .fc-synthesis-actions .button, .fc-synthesis-actions button,  .study-accordion-footer .study-pdf-button,  .framing-tab-help .framing-add-question, .framing-tab-help .framing-ai-button,  .selection-comparison-dialog .comparison-column-options button,  .selection-summary-dialog > header button, .relations-dialog > header button,  .earon-dashboard-layout .earon-tile-footer .button ):not(:disabled):not([aria-disabled=true]):is(:hover, :focus-visible, .appearance-preview-hover)  {
  background: var(--app-button-hover, #175f99);
  border-color: var(--app-button-hover, #175f99);
  color: var(--app-button-text, #fff);
}

/* Choix de vue, pagination et onglets pleins : même accent que les boutons. */
body.platform-appearance :is(  .application-settings-tabs .active,  .security-view-switch [aria-current=page], .security-browser-pagination [aria-current=page],  .supplier-view-switch [aria-current=page], .supplier-pagination [aria-current=page], .supplier-alphabet [aria-current=page],  .events-view-switch [aria-current=page], .events-tabs [aria-current=page], .events-alphabet [aria-current=page],  .event-calendar-years [aria-current=page], .event-exhibitor-alphabet [aria-pressed=true],  .client-salon-alpha [aria-pressed=true], .contact-alphabet .active,  .exhibitor-edit-tabs [aria-selected=true], .share-tabs [aria-selected=true],  .selection-detail-tabs [aria-pressed=true], .batch-view-options [aria-pressed=true],  .suggestion-pages [aria-current=page] )  {
  background: var(--app-primary-color, #1c75bc);
  border-color: var(--app-primary-color, #1c75bc);
  color: var(--app-button-text, #fff);
}

body.platform-appearance :is(.account-dropdown summary, .quick-access-content a, .address-link, .supplier-enrichment-button, .criteria-detail-icon)  {
  color: var(--app-primary-color, #1c75bc);
}

body.platform-appearance :is(.account-dropdown summary, .criteria-detail-icon):focus-visible  {
  outline-color: var(--app-primary-color, #1c75bc);
}

body.platform-appearance > aside  {
  background: var(--app-menu-background, #142035);
  color: var(--app-menu-text, #eef3fc);
}

body.platform-appearance > aside :is(.brand-caption small,.brand-caption strong,.aside-foot,.aside-foot strong,.nav-label)  {
  color: var(--app-menu-text, #eef3fc);
}

body.platform-appearance > aside a  {
  color: var(--app-menu-link, #b9c7db);
}

body.platform-appearance > aside :is(a.nav.active,a.nav:hover,a.nav:focus-visible)  {
  background: var(--app-menu-active-background, #26364e);
  color: var(--app-menu-active-text, #fff);
}

body.platform-appearance > aside a.nav.active  {
  box-shadow: inset 3px 0 0 var(--app-menu-active-text, #67b5ef);
}

body.platform-appearance > aside .aside-foot a:is(:hover,:focus-visible)  {
  background: var(--app-menu-active-background, #26364e);
  color: var(--app-menu-active-text, #fff);
}

body.platform-appearance > main > header.top  {
  background: var(--app-header-background, #fff);
  color: var(--app-header-text, #18243a);
}

body.platform-appearance > main > header.top > span, body.platform-appearance .top .dashboard-header-welcome > :is(strong,time)  {
  color: var(--app-header-text, #18243a);
}

/* Le mode Salon reprend le fond et les couleurs de navigation. */
body.salon-mode.platform-appearance > .salon-top  {
  background: var(--app-menu-background, #142035);
  color: var(--app-menu-text, #eef3fc);
}

body.salon-mode.platform-appearance > .salon-top a  {
  color: var(--app-menu-link, #b9c7db);
}

body.salon-mode.platform-appearance > .salon-top a:is(:hover,:focus-visible)  {
  background: var(--app-menu-active-background, #26364e);
  color: var(--app-menu-active-text, #fff);
}

/* PARAMÈTRES — commandes compactes à gauche, aperçu à droite. */
.appearance-settings  {
  margin: 18px 0 24px;
  padding: 18px;
  overflow:visible;
}

.appearance-settings > h2  {
  font-size: calc(19px * var(--app-font-scale, 1));
  margin-bottom: 6px;
}

.appearance-settings > p  {
  font-size: calc(13px * var(--app-font-scale, 1));
  margin-bottom: 14px;
}

.appearance-settings-layout  {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: start;
}

.appearance-controls  {
  min-width: 0;
}

.appearance-settings fieldset  {
  margin: 0 0 12px;
  padding: 12px;
}

.appearance-settings legend  {
  font-size: calc(13px * var(--app-font-scale, 1));
  color: var(--app-primary-color, #1c75bc);
}

.appearance-settings .field  {
  font-size: calc(12px * var(--app-font-scale, 1));
  margin-bottom: 8px;
}

.appearance-settings :is(select,input[type=file])  {
  font-size: calc(12px * var(--app-font-scale, 1));
  padding: 6px;
}

.appearance-settings small  {
  display: block;
  font-size: calc(11px * var(--app-font-scale, 1));
  line-height: 1.4;
}

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

.appearance-color > span  {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
}

.appearance-color input[type=color]  {
  width: 46px;
  height: 30px;
  min-height: 0;
  padding: 2px;
  cursor: pointer;
}

.appearance-color output  {
  font-size: calc(11px * var(--app-font-scale, 1));
  color: #435164;
}

.appearance-size-hint  {
  font-size: calc(12px * var(--app-font-scale, 1));
  margin-bottom: 12px;
}

.appearance-text-size > span  {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 5px;
}

.appearance-text-size input  {
  flex: 1;
  min-width: 0;
  accent-color: var(--app-primary-color, #1c75bc);
}

.appearance-text-size output  {
  min-width: 48px;
  font-size: calc(12px * var(--app-font-scale, 1));
  text-align: right;
}

.appearance-image-name  {
  font-size: calc(11px * var(--app-font-scale, 1));
  margin: 8px 0;
  overflow-wrap: anywhere;
}

.appearance-settings .appearance-check  {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: calc(12px * var(--app-font-scale, 1));
}

.appearance-settings .appearance-check input  {
  width: auto;
}

.appearance-preview-column  {
  min-width: 0;
  position: sticky;
  top: 20px;
  max-height:calc(100vh - 40px);
  overflow-y:auto;
}

.appearance-preview-column > h3  {
  font-size: calc(14px * var(--app-font-scale, 1));
  margin-bottom: 10px;
}

.appearance-actions  {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 12px 0 8px;
}

.appearance-actions button  {
  font-size: calc(12px * var(--app-font-scale, 1));
  padding: 7px 10px;
}

[data-appearance-status]  {
  font-size: calc(12px * var(--app-font-scale, 1));
  margin-top: 10px;
  color: #435164;
}

[data-appearance-status].appearance-error  {
  color: #b42318;
}

/* APERÇU — reprend les mêmes variables que la plateforme, sans les publier. */
.appearance-preview  {
  display: grid;
  grid-template-columns: 36% 64%;
  min-height: 350px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  overflow: hidden;
  font-size: calc(11px * var(--app-font-scale, 1));
}

.appearance-preview-menu  {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 15px 8px;
  background: var(--app-menu-background,#142035);
  color: var(--app-menu-text,#eef3fc);
}

.appearance-preview-menu > strong  {
  font-size: calc(12px * var(--app-font-scale, 1));
  margin-bottom: 8px;
}

.appearance-preview-menu > small:last-child  {
  margin-top: auto;
}

.appearance-preview-menu a  {
  display:flex;
  align-items:center;
  box-sizing:border-box;
  min-height:var(--app-menu-row-height,29px);
  padding:2px 9px;
  line-height:1.35;
  font-size:var(--app-menu-font-size,11px);
  border-radius:5px;
  color:var(--app-menu-link,#b9c7db);
  text-decoration:none;
  overflow-wrap:anywhere;
}

.appearance-preview-separator  {
  width:calc(100% - 14px);
  flex:none;
  border:0;
  border-top:1px solid var(--app-menu-separator,#354258);
  opacity:1;
  margin:9px 7px;
}

.appearance-preview-menu :is(a.appearance-preview-active,a:hover,a:focus-visible)  {
  background: var(--app-menu-active-background,#26364e);
  color: var(--app-menu-active-text,#fff);
}

.appearance-preview-main  {
  background-color: var(--app-background-color,#f3f5f9);
  background-image: var(--app-background-image,none);
  background-position: center;
  background-size: cover;
}

.appearance-preview-header  {
  padding: 12px;
  background: var(--app-header-background,#fff);
  color: var(--app-header-text,#18243a);
}

.appearance-preview-content  {
  padding: 15px;
  display: grid;
  gap: 14px;
}

.appearance-preview-content article  {
  background: white;
  color: #18243a;
  border: 1px solid #dfe5ed;
  border-radius: 8px;
  padding: 12px;
}

.appearance-preview-content h4  {
  margin: 0 0 8px;
  font-size: calc(13px * var(--app-font-scale, 1));
}

.appearance-preview-content p  {
  margin: 0 0 8px;
  font-size: calc(11px * var(--app-font-scale, 1));
}

.appearance-preview-content a  {
  color: var(--app-link-color,#1c75bc);
}

.appearance-preview-buttons  {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.appearance-preview-buttons button  {
  font-size: calc(11px * var(--app-font-scale, 1));
  padding: 6px 8px;
}

.appearance-preview-secondary  {
  margin-top: 8px;
}

.appearance-preview .security-view-switch  {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 0;
}

.appearance-color input:disabled  {
  cursor: not-allowed;
}

@media(max-width:1000px)  {
  .appearance-settings-layout  {
    grid-template-columns: 1fr;
  }

  .appearance-preview-column  {
    position: static;
    max-height:none;
    overflow:visible;
  }

}

@media(max-width:500px)  {
  .appearance-color-grid  {
    grid-template-columns: 1fr;
  }

}

/* COMMANDES COMMUNES — même gabarit compact que « Tout voir ».
   Les dimensions sont prioritaires sur les anciens styles de chaque module.
   Les cartes cliquables, miniatures PDF, jours de calendrier et graduations
   des curseurs restent des surfaces de contenu, avec leurs dimensions propres. */
body.platform-appearance :is(  button, a.button, a[class*="-button"], a.attachment-download,  input[type=submit], input[type=button],  .tab, [role=tab], .account-dropdown > summary,  .product-modal-options > summary, .taxonomy-options > summary,  .comparison-column-picker > summary ):not(:where(  [hidden], .family-card, .gallery-open, .pdf-thumbnail, .event-calendar-tile,  .criteria-detail-icon, .salon-calendar-grid *, .study-status-steps *,  .criterion-importance-steps *, .appearance-preview-menu *, .application-sidebar * ))  {
  box-sizing: border-box !important;
  min-height: var(--app-control-height) !important;
  height: var(--app-control-height) !important;
  max-height: var(--app-control-height) !important;
  padding-block: 0 !important;
  padding-inline: 8px !important;
  font-family: inherit !important;
  font-size: calc(11px * var(--app-buttons-scale, 1)) !important;
  line-height: 1.2 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  vertical-align: middle;
  white-space: nowrap;
}

/* Texte et icônes suivent la commande. Les actions destructives conservent
   leur signal rouge ; les boutons à fond plein gardent leur texte contrasté. */
body.platform-appearance :where(button,a.button,input[type=submit],input[type=button]):not(:where(  .danger, .primary, .event-calendar-tile *, .study-status-steps *,  .criterion-importance-steps *, .application-sidebar *, .salon-top * ))  {
  color: var(--app-primary-color, #1c75bc);
}

body.platform-appearance :is(button,.button,.relations-button,.attachment-download) > svg  {
  flex-shrink: 0;
  max-height: calc(16px * var(--app-buttons-scale, 1));
}

/* Les commandes carrées et l'aide ont la même hauteur que les boutons texte. */
body.platform-appearance :is(a.relations-button,.list-help-icon,.salon-segment-help,  .comparison-hide-column,.comparison-web-link,.study-meta-button,.project-info-edit,  .filter-chip-remove)  {
  width: var(--app-control-height) !important;
  min-width: var(--app-control-height) !important;
  padding-inline: 0 !important;
  flex-basis: var(--app-control-height);
}

body.platform-appearance :is(.list-help-icon,.salon-segment-help)  {
  color: var(--app-primary-color, #1c75bc) !important;
  border-color: var(--app-primary-color, #1c75bc) !important;
}

/* Les cases natives et les interrupteurs partagent l'accent du thème.
   Les curseurs des domaines et des états conservent leur palette dédiée. */
body.platform-appearance input:is([type=checkbox],[type=radio])  {
  accent-color: var(--app-primary-color, #1c75bc) !important;
}

body.platform-appearance :is(button,.button,a.relations-button,input,select,textarea,summary):focus-visible  {
  outline-color: var(--app-primary-color, #1c75bc);
}

body.platform-appearance .rg-card.rg-selected  {
  outline-color: var(--app-primary-color, #1c75bc);
}

body.platform-appearance.relations-embedded  {
  background: #fff;
}

/* Hauteur tactile du mode Salon sur téléphone/tablette, uniforme elle aussi. */
@media (pointer: coarse)  {
  body.salon-mode.platform-appearance  {
    --app-control-height: calc(44px * var(--app-buttons-scale, 1));
  }

}

/* BOUTONS SECONDAIRES — palette commune EARON et clients, réglable dans Apparence.
   Les fonds sont opaques, y compris sur une image de page. Ces propriétés
   remplacent les anciens fonds blancs/transparents des modules sans modifier
   leurs dimensions. Les actions principales, états et surfaces de contenu
   gardent leurs palettes et contrastes spécifiques. */
body.platform-appearance :is(  button, a.button, a[class*="-button"], a.attachment-download, a.list-help-icon,  input[type=submit], input[type=button], .account-dropdown > summary,  .product-modal-options > summary, .taxonomy-options > summary,  .comparison-column-picker > summary ):not(:where(  .primary, .danger, .button-danger, .danger-button,  .active, .selected, [aria-current=page], [aria-pressed=true], [aria-selected=true],  button[data-synthesis-view], .application-update-entry [data-update-email],  .filter-drawer-toggle, .fc-synthesis-actions .button, .fc-synthesis-actions button,  .study-accordion-footer .study-pdf-button,  .framing-tab-help .framing-add-question, .framing-tab-help .framing-ai-button,  .selection-comparison-dialog .comparison-column-options button,  .selection-summary-dialog > header button, .relations-dialog > header button,  .earon-dashboard-layout .earon-tile-footer .button, .supplier-discovery-inbox,  .family-card, .gallery-open, .pdf-thumbnail, .event-calendar-tile, .event-calendar-tile *,  .salon-calendar-grid *, .study-status-steps *, .criterion-importance-steps *,  .appearance-preview-menu *, .application-sidebar *, .salon-top *, .app-flash *,  .sector-choice-option, .tab, [role=tab], .tabs *, .events-tabs *,  .selection-detail-tabs *, .share-tabs *, .exhibitor-edit-tabs *,  .synthesis-sheet *, .selection-document *, .pdf-sheet *, .share-sheet * ))  {
  background: var(--_secondary-button-background, var(--app-secondary-button-background, var(--app-primary-soft, #edf5fb))) !important;
  border-color: var(--_secondary-button-border, var(--app-secondary-button-border, var(--app-primary-border, #bdd6e9))) !important;
  color: var(--_secondary-button-text, var(--app-secondary-button-text, var(--app-primary-color, #1c75bc))) !important;
}

/* Les variables locales de survol n’agissent que sur les commandes ci-dessus. */
body.platform-appearance :is(  button, a.button, a[class*="-button"], a.attachment-download, a.list-help-icon,  input[type=submit], input[type=button], .account-dropdown > summary,  .product-modal-options > summary, .taxonomy-options > summary,  .comparison-column-picker > summary ):is(:hover, :focus-visible, .appearance-secondary-hover):not(:disabled):not([aria-disabled=true])  {
  --_secondary-button-background: var(--app-secondary-button-hover-background, color-mix(in srgb, var(--app-primary-color, #1c75bc) 16%, white));
  --_secondary-button-border: var(--app-secondary-button-hover-border, var(--app-primary-color, #1c75bc));
  --_secondary-button-text: var(--app-secondary-button-hover-text, var(--app-primary-color, #1c75bc));
}

/* Aperçu local des textes de consultation : aucune modification des styles globaux. */
.appearance-consultation-preview  {
  background:#fff;
  border:1px solid #dfe5ed;
  border-radius:8px;
  padding:14px;
  margin:8px 0;
  display:grid;
  gap:14px;
  overflow-wrap:anywhere;
}

body.platform-appearance .appearance-consultation-preview [data-consultation-preview-label]  {
  color:var(--app-consultation-label-color,#6b7280)!important;
  font-size:var(--app-consultation-label-size,12px)!important;
  font-weight:var(--app-consultation-label-weight,600)!important;
  line-height:1.3;
  margin:0 0 3px;
}

body.platform-appearance .appearance-consultation-preview [data-consultation-preview-content]  {
  color:var(--app-consultation-content-color,#000)!important;
  font-size:var(--app-consultation-content-size,12px)!important;
  font-weight:var(--app-consultation-content-weight,400)!important;
  line-height:1.5;
  margin:0;
}