/* ============================================================================
   kw-ds-pages.css — lot PAGES (14/10/2026) : pages publiques intérieures au nouveau design
   Transfert de domaine, ouvrir une demande, base de connaissances, annonces,
   téléchargements, conditions générales, page introuvable ; et la facture.
   Jetons du socle (kw-ds.css) ; un seul bouton orange par page ; bleu = choisi ;
   ni ombre, ni dégradé ; vert réservé au statut « payée ».
   ============================================================================ */

/* ── commun : fil d'Ariane, gabarit, polices ─────────────────────────────── */
body.kw-pg #main-body { background: var(--fond); padding: 8px 0 88px !important; font-family: var(--corps); color: var(--texte); }
body.kw-pg #main-body > .container, body.kw-pg #main-body .primary-content > .container { max-width: 1200px; padding-inline: 24px; }
body.kw-pg .master-breadcrumb { background: var(--fond) !important; border: 0 !important; padding: 22px 0 6px !important; margin: 0 !important; }
body.kw-pg .master-breadcrumb .container { max-width: 1200px; padding-inline: 24px; }
body.kw-pg .master-breadcrumb .breadcrumb { background: none !important; padding: 0 !important; margin: 0; font: 500 14px var(--corps); }
body.kw-pg .master-breadcrumb .breadcrumb-item, body.kw-pg .master-breadcrumb .breadcrumb-item.active { color: var(--gris); }
body.kw-pg .master-breadcrumb a { color: var(--gris) !important; text-decoration: none; }
body.kw-pg .master-breadcrumb a:hover { color: var(--bleu) !important; text-decoration: underline; }
body.kw-pg .master-breadcrumb .breadcrumb-item + .breadcrumb-item::before { content: "›"; color: var(--filet-fort); }
body.kw-pg #main-body, body.kw-pg #main-body p, body.kw-pg #main-body li, body.kw-pg #main-body label, body.kw-pg #main-body td,
body.kw-pg #main-body input, body.kw-pg #main-body select, body.kw-pg #main-body textarea, body.kw-pg #main-body button, body.kw-pg #main-body .btn { font-family: var(--corps) !important; }
body.kw-pg #main-body h1, body.kw-pg #main-body h2 { font-family: var(--titre) !important; color: var(--encre) !important; font-stretch: 108%; letter-spacing: -.02em; }
body.kw-pg #main-body h3, body.kw-pg #main-body h4, body.kw-pg #main-body .card-title { font-family: var(--corps) !important; color: var(--encre) !important; letter-spacing: -.01em; }

/* titre de page posé par header.tpl ($kwPg) */
body.kw-pg .kw-pg-tete { margin: 6px 0 28px; }
body.kw-pg .kw-pg-tete h1 { font-size: clamp(30px, 3.4vw, 42px); line-height: 1.08; font-weight: 800; margin: 0 0 8px; }
body.kw-pg .kw-pg-tete p { margin: 0; color: var(--gris) !important; font-size: 17px; max-width: 62ch; }

/* ── cartes, barre latérale, listes ──────────────────────────────────────── */
body.kw-pg #main-body .card { background: var(--surface) !important; border: 1px solid var(--filet) !important; border-radius: var(--r2) !important; box-shadow: none !important; }
body.kw-pg #main-body .card-header { background: none !important; border-bottom: 1px solid var(--filet) !important; padding: 14px 18px !important; }
body.kw-pg #main-body .card-header .card-title, body.kw-pg #main-body .card-header h3 { font-size: 15px !important; font-weight: 700 !important; margin: 0; }
body.kw-pg #main-body .card-header .card-minimise, body.kw-pg #main-body .card-header i.fa-chevron-up { display: none; }
body.kw-pg #main-body .card-header i { color: var(--gris); }
body.kw-pg #main-body .card-body { padding: 24px 26px !important; }
body.kw-pg #main-body .list-group-item { border: 0 !important; border-top: 1px solid var(--filet) !important; background: none !important; color: var(--texte) !important; font-size: 15px; padding: 11px 18px !important; border-radius: 0 !important; }
body.kw-pg #main-body .list-group-item:first-child { border-top: 0 !important; }
body.kw-pg #main-body .list-group-item i { color: var(--gris) !important; width: 18px; }
body.kw-pg #main-body a.list-group-item:hover { color: var(--bleu) !important; background: var(--surface-2) !important; }
body.kw-pg #main-body .list-group-item.active { background: var(--bleu-doux) !important; color: var(--bleu) !important; font-weight: 600; box-shadow: inset 3px 0 0 var(--bleu); }
body.kw-pg #main-body .list-group-item.active i { color: var(--bleu) !important; }
body.kw-pg.kw-rtl #main-body .list-group-item.active { box-shadow: inset -3px 0 0 var(--bleu); }

/* ── formulaires ─────────────────────────────────────────────────────────── */
body.kw-pg #main-body label { font-weight: 600 !important; font-size: 14.5px !important; color: var(--encre) !important; margin-bottom: 6px; }
body.kw-pg #main-body .form-control, body.kw-pg #main-body .custom-select, body.kw-pg #main-body select {
  height: 48px; border: 1px solid var(--filet-fort) !important; border-radius: var(--r1) !important; background-color: var(--surface) !important;
  color: var(--encre) !important; font-size: 16px !important; box-shadow: none !important; padding: 0 14px; }
body.kw-pg #main-body textarea.form-control { height: auto; padding: 12px 14px; }
body.kw-pg #main-body .form-control:focus, body.kw-pg #main-body select:focus { border-color: var(--bleu) !important; box-shadow: 0 0 0 4px var(--bleu-doux) !important; outline: none; }
body.kw-pg #main-body .md-editor { border: 1px solid var(--filet-fort) !important; border-radius: var(--r1) !important; overflow: hidden; box-shadow: none !important; }
body.kw-pg #main-body .md-editor > .md-header { background: var(--surface-2) !important; border-bottom: 1px solid var(--filet) !important; }
body.kw-pg #main-body .md-editor .btn, body.kw-pg #main-body .md-editor .btn-primary { background: var(--surface) !important; color: var(--encre) !important; border: 1px solid var(--filet-fort) !important; box-shadow: none !important; }
body.kw-pg #main-body .md-editor textarea { border: 0 !important; }
body.kw-pg #main-body .input-group-text, body.kw-pg #main-body .custom-file-label { border-color: var(--filet-fort) !important; background: var(--surface-2) !important; border-radius: var(--r1); }

/* ── boutons : un seul plein (orange), les autres au trait ───────────────── */
body.kw-pg #main-body .btn { min-height: 44px; border-radius: var(--r1) !important; font: 600 15px var(--corps) !important; box-shadow: none !important; transform: none !important; background-image: none !important; }
body.kw-pg #main-body .btn-primary { background: var(--orange) !important; border-color: var(--orange) !important; color: var(--sur-orange) !important; }
body.kw-pg #main-body .btn-primary:hover { background: var(--orange-fonce) !important; border-color: var(--orange-fonce) !important; }
body.kw-pg #main-body .btn-default, body.kw-pg #main-body .btn-secondary, body.kw-pg #main-body .btn-info, body.kw-pg #main-body .btn-light {
  background: var(--surface) !important; border: 1px solid var(--filet-fort) !important; color: var(--encre) !important; }
body.kw-pg #main-body .btn-default:hover, body.kw-pg #main-body .btn-info:hover { border-color: var(--encre) !important; }

/* recherche (base de connaissances, téléchargements) : le composant .recherche de l'accueil */
body.kw-pg #main-body .kb-search { background: var(--surface); border: 1px solid var(--filet-fort); border-radius: var(--r2); padding: 6px; }
body.kw-pg #main-body .kb-search:focus-within { border-color: var(--bleu); box-shadow: 0 0 0 4px var(--bleu-doux); }
body.kw-pg #main-body .kb-search .form-control { border: 0 !important; height: 48px; font-size: 17px !important; box-shadow: none !important; }
body.kw-pg #main-body .kb-search .btn { border-radius: var(--r1) !important; min-height: 48px; padding: 0 22px; }

/* état vide : plus de bandeau bleu-vert, un encart sobre avec une issue */
body.kw-pg #main-body .alert-info { background: var(--surface) !important; border: 1px dashed var(--filet-fort) !important; border-left-width: 1px !important; border-radius: var(--r2) !important;
  color: var(--gris) !important; padding: 28px 24px !important; font-size: 16px; }
body.kw-pg .kw-pg-vide strong { display: block; color: var(--encre); font: 700 18px var(--corps); margin-bottom: 4px; }
body.kw-pg .kw-pg-vide .kw-pg-issues { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 16px; }
body.kw-pg .kw-pg-vide .kw-pg-issues a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: var(--r1); border: 1px solid var(--filet-fort);
  background: var(--surface); color: var(--encre) !important; font-weight: 600; text-decoration: none; }
body.kw-pg .kw-pg-vide .kw-pg-issues a:hover { border-color: var(--encre); }

/* ── conditions générales : un document à lire, pas une affiche ──────────── */
body.kw-pg .terms-of-service > div:first-child { background: none !important; color: var(--texte) !important; padding: 6px 0 22px !important; text-align: left !important; border-radius: 0 !important; margin: 0 !important; box-shadow: none !important; }
body.kw-pg .terms-of-service > div:first-child h1 { font-size: clamp(30px, 3.4vw, 42px) !important; line-height: 1.1; margin: 0 0 8px; }
body.kw-pg .terms-of-service > div:first-child p { color: var(--gris) !important; font-size: 15px; margin: 0; opacity: 1 !important; }
body.kw-pg .terms-of-service .card { max-width: 860px; }
body.kw-pg .terms-of-service .card-body { padding: 36px 44px !important; }
body.kw-pg .terms-of-service h2 { font-size: 22px !important; font-weight: 800; color: var(--encre) !important; border: 0 !important; padding: 0 !important; margin: 0 0 12px !important; scroll-margin-top: 90px; }
body.kw-pg .terms-of-service p, body.kw-pg .terms-of-service li { font-size: 16.5px; line-height: 1.7; color: var(--texte); max-width: 72ch; }
body.kw-pg .terms-of-service hr { border: 0; border-top: 1px solid var(--filet); margin: 30px 0; }
body.kw-pg .terms-of-service strong { color: var(--encre); }

/* ── page introuvable ────────────────────────────────────────────────────── */
body.kw-pg #main-body .text-center.p-5 { max-width: 640px; margin: 24px auto; padding: 56px 32px !important; background: var(--surface); border: 1px solid var(--filet); border-radius: var(--r3); }
body.kw-pg #main-body .text-center.p-5 > i.fa-exclamation-circle { display: none; }
body.kw-pg #main-body .text-center.p-5 h1.display-1 { font-size: 0 !important; margin: 0 0 14px; color: var(--encre) !important; }
body.kw-pg #main-body .text-center.p-5 h1.display-1::before { content: "404"; display: block; font: 800 88px/1 var(--titre); font-stretch: 108%; letter-spacing: -.04em; color: var(--encre); }
body.kw-pg #main-body .text-center.p-5 h3 { font-size: 22px !important; font-weight: 700; margin-bottom: 6px; }
body.kw-pg #main-body .text-center.p-5 p { color: var(--gris); }
body.kw-pg #main-body .text-center.p-5 .buttons { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 22px; }

/* ── transfert de domaine ────────────────────────────────────────────────── */
body.kw-pg .kw-transfer-page { max-width: 880px; margin: 8px auto 0; }
body.kw-pg .kw-transfer-card { background: var(--surface) !important; border: 1px solid var(--filet) !important; border-radius: var(--r3) !important; box-shadow: none !important; }
body.kw-pg .kw-transfer-hero { text-align: left !important; padding: 40px 44px !important; }
body.kw-pg .kw-transfer-icon { display: none !important; }
body.kw-pg .kw-transfer-hero h1 { font-size: clamp(30px, 3.6vw, 44px) !important; font-weight: 800; line-height: 1.06; margin: 0 0 10px !important; }
body.kw-pg .kw-transfer-subtitle { color: var(--gris) !important; font-size: 18px !important; margin: 0 0 24px !important; }
body.kw-pg .kw-transfer-input-row { display: flex; gap: 8px; background: var(--surface); border: 1px solid var(--filet-fort); border-radius: var(--r2); padding: 8px; }
body.kw-pg .kw-transfer-input-row:focus-within { border-color: var(--bleu); box-shadow: 0 0 0 4px var(--bleu-doux); }
body.kw-pg .kw-transfer-input-row input { flex: 1; min-width: 0; border: 0 !important; box-shadow: none !important; outline: none !important; height: 52px; padding: 0 12px !important; font: 500 19px var(--corps) !important; color: var(--encre); background: transparent !important; }
body.kw-pg .kw-transfer-btn { min-height: 52px; padding: 0 24px !important; background: var(--orange) !important; border: 0 !important; color: var(--sur-orange) !important; border-radius: var(--r1) !important; box-shadow: none !important; font: 600 16px var(--corps) !important; transform: none !important; }
body.kw-pg .kw-transfer-btn:hover { background: var(--orange-fonce) !important; }
body.kw-pg .kw-transfer-hint { display: inline-flex; gap: 8px; align-items: center; background: none !important; padding: 0 !important; color: var(--gris) !important; font-size: 14.5px !important; }
body.kw-pg .kw-transfer-hint i { color: var(--gris) !important; }
body.kw-pg .kw-transfer-hint strong { color: var(--encre); }
body.kw-pg .kw-transfer-checklist { padding: 32px 44px !important; }
body.kw-pg .kw-transfer-checklist h2 { font-size: 24px !important; margin-bottom: 18px !important; }
body.kw-pg .kw-transfer-steps [class*="icon"] { background: var(--bleu-doux) !important; color: var(--bleu) !important; border-radius: var(--r1) !important; }
body.kw-pg .kw-transfer-steps [class*="icon"] i { color: var(--bleu) !important; }
body.kw-pg .kw-transfer-steps a { color: var(--bleu) !important; }
body.kw-pg .kw-transfer-exclusions { color: var(--gris) !important; font-size: 13.5px; }

@media (max-width: 640px) {
  body.kw-pg .kw-transfer-hero, body.kw-pg .kw-transfer-checklist { padding: 26px 20px !important; }
  body.kw-pg .terms-of-service .card-body { padding: 24px 20px !important; }
  body.kw-pg #main-body .card-body { padding: 20px 18px !important; }
  body.kw-pg #main-body .text-center.p-5 { padding: 40px 20px !important; }
}

/* ── facture (page autonome, imprimable) ─────────────────────────────────── */
body.kw-pg-facture { background: var(--fond) !important; font-family: var(--corps) !important; color: var(--texte); }
body.kw-pg-facture .kw-invoice-glass-card { box-shadow: none !important; border: 1px solid var(--filet) !important; border-radius: var(--r3) !important; background: var(--surface) !important; }
/* vert réservé au statut « payée » : montants et crédit à l'encre ; un solde dû reste rouge (viewinvoice.tpl) */
body.kw-pg-facture .kw-invoice-glass-card td.text-success, body.kw-pg-facture .kw-invoice-glass-card td .text-success, body.kw-pg-facture .kw-trans-table td.text-success { color: var(--encre) !important; }
body.kw-pg-facture, body.kw-pg-facture p, body.kw-pg-facture td, body.kw-pg-facture th, body.kw-pg-facture span, body.kw-pg-facture div, body.kw-pg-facture a, body.kw-pg-facture button { font-family: var(--corps) !important; }
body.kw-pg-facture .kw-invoice-title { font-family: var(--titre) !important; font-stretch: 108%; letter-spacing: -.02em; color: var(--encre) !important; }
body.kw-pg-facture .kw-section-heading, body.kw-pg-facture h5, body.kw-pg-facture .kw-address-title { font-family: var(--corps) !important; color: var(--encre) !important; font-weight: 700 !important; }
body.kw-pg-facture .kw-address-title i { color: var(--gris) !important; }
body.kw-pg-facture .kw-addresses-row [class*="col-"] > div { background: var(--surface-2) !important; border: 0 !important; border-radius: var(--r2) !important; }
body.kw-pg-facture .kw-separator { border-top: 1px solid var(--filet) !important; border-style: solid !important; }
body.kw-pg-facture .kw-table thead th { color: var(--gris) !important; font-size: 12.5px !important; letter-spacing: .04em; border-bottom: 1px solid var(--filet-fort) !important; }
body.kw-pg-facture .kw-table td { border-color: var(--filet) !important; color: var(--texte); }
body.kw-pg-facture .kw-grand-total, body.kw-pg-facture .kw-totals-table tr:last-child td { color: var(--encre) !important; font-family: var(--titre) !important; }
body.kw-pg-facture .kw-invoice-status-badge { box-shadow: none !important; }
body.kw-pg-facture .btn { border-radius: var(--r1) !important; box-shadow: none !important; background-image: none !important; font-family: var(--corps) !important; }
body.kw-pg-facture .btn-default, body.kw-pg-facture .btn-secondary, body.kw-pg-facture .btn-light { background: var(--surface) !important; border: 1px solid var(--filet-fort) !important; color: var(--encre) !important; }
@media print { body.kw-pg-facture { background: #fff !important; } body.kw-pg-facture .kw-invoice-glass-card { border: 0 !important; } }
/* titres en double : le gabarit d'origine porte son propre petit titre sous le titre de page */
body.kw-pg-announcements .primary-content > .card .card-title, body.kw-pg-supportticketsubmit-steptwo .primary-content .card-title { display: none; }
body.kw-pg .kw-pg-tete p { white-space: normal; }
body.kw-pg-facture .kw-totals-table td.text-success, body.kw-pg-facture .kw-trans-table td.text-success, body.kw-pg-facture .kw-trans-table td .text-success { color: var(--encre) !important; }

/* ── transfert, deuxième étape : domaine choisi et code d'autorisation (lot PAGES2, 14/10/2026) ──
   La première version n'habillait que la saisie du domaine ; l'étape du code EPP gardait bordures orange,
   badge orange et bouton à l'ancienne. */
body.kw-pg .kw-transfer-domain-badge { background: var(--surface-2) !important; border: 1px solid var(--filet) !important; border-radius: var(--r1) !important;
  color: var(--texte) !important; font: 500 15px var(--corps) !important; padding: 12px 16px !important; }
body.kw-pg .kw-transfer-domain-badge i { color: var(--gris) !important; }
body.kw-pg .kw-transfer-domain-badge span, body.kw-pg .kw-transfer-domain-badge strong, body.kw-pg .kw-transfer-domain-badge b { color: var(--encre) !important; }
body.kw-pg .kw-transfer-epp-label { font: 600 14.5px var(--corps) !important; color: var(--encre) !important; }
body.kw-pg .kw-transfer-epp-label a, body.kw-pg .kw-transfer-epp-label a i { color: var(--bleu) !important; font-size: 14px !important; }
body.kw-pg .kw-transfer-epp-input { height: 52px !important; border: 1px solid var(--filet-fort) !important; border-radius: var(--r1) !important; box-shadow: none !important;
  background: var(--surface) !important; color: var(--encre) !important; font: 500 17px var(--corps) !important; padding: 0 16px !important; }
body.kw-pg .kw-transfer-epp-input:focus { border-color: var(--bleu) !important; box-shadow: 0 0 0 4px var(--bleu-doux) !important; outline: none !important; }
body.kw-pg .kw-transfer-epp-input::placeholder { color: var(--gris); }
body.kw-pg .kw-transfer-btn-submit { height: 52px !important; background: var(--orange) !important; color: var(--sur-orange) !important; border: 0 !important;
  border-radius: var(--r1) !important; box-shadow: none !important; transform: none !important; font: 600 16px var(--corps) !important; background-image: none !important; }
body.kw-pg .kw-transfer-btn-submit:hover { background: var(--orange-fonce) !important; }
body.kw-pg .kw-transfer-back-link { color: var(--bleu) !important; font: 600 15px var(--corps) !important; text-decoration: none; }
body.kw-pg .kw-transfer-back-link:hover { text-decoration: underline; }
body.kw-pg #transferUnavailable { background: var(--orange-doux) !important; border: 1px solid var(--filet) !important; border-radius: var(--r1) !important; color: var(--encre) !important; }
body.kw-pg .kw-captcha-wrap { margin-top: 12px; }

/* ── transfert, client connecté : la même page, dans le cadre de l'espace client ── */
body.kw-client.kw-pg .kw-transfer-page { margin-top: 24px; }
body.kw-client.kw-pg .kw-transfer-hero h1, body.kw-client.kw-pg .kw-transfer-checklist h2 { font-family: var(--titre) !important; color: var(--encre) !important; font-stretch: 108%; letter-spacing: -.02em; }
body.kw-client.kw-pg .kw-transfer-page, body.kw-client.kw-pg .kw-transfer-page p, body.kw-client.kw-pg .kw-transfer-page label,
body.kw-client.kw-pg .kw-transfer-page input, body.kw-client.kw-pg .kw-transfer-page button, body.kw-client.kw-pg .kw-transfer-page strong { font-family: var(--corps); }
