/* Styles communs des outils CSE gratuits — thème bleu-noir */
.oc-card {
  background: #1a1a2e;
  border: 1px solid #1a1a2e;
  border-radius: 16px;
  box-shadow: 0 4px 18px rgba(26,26,46,0.18);
  padding: 2em 2.2em;
  max-width: 760px;
  margin: 0 auto;
  color: #fff;
}
.oc-title { font-size: 1.5em; color: #fff !important; margin: 0 0 0.4em; font-weight: 700; }
.oc-lead { color: rgba(255,255,255,0.88); line-height: 1.7; margin: 0 0 1em; }
.oc-note { color: rgba(255,255,255,0.6); font-size: 0.85em; margin: 0 0 1.5em; }
.oc-q { font-size: 1.3em; color: #fff !important; margin: 0 0 0.6em; font-weight: 700; }
.oc-result-h { font-size: 1.1em; color: #fff !important; margin: 0 0 0.6em; }
.oc-help { color: rgba(255,255,255,0.78); line-height: 1.6; margin: 0 0 1em; font-size: 0.95em; }
.oc-warning { background: rgba(255,163,0,0.15); border: 1px solid rgba(255,163,0,0.5); border-radius: 8px; padding: 0.7em 1em; color: #ffd088; font-size: 0.9em; margin: 0 0 1.2em; line-height: 1.5; }

.oc-options { display: flex; flex-direction: column; gap: 0.6em; margin: 0 0 1.2em; }
.oc-option, .oc-num-opt {
  display: block; width: 100%; text-align: left;
  background: #272742; border: 1px solid #3a3a5a; border-radius: 10px;
  padding: 13px 16px; font-size: 1em; color: #fff; cursor: pointer;
  font-family: inherit; transition: background 0.15s, border-color 0.15s;
}
.oc-option:hover, .oc-num-opt:hover { background: #f39200; border-color: #f39200; color: #1a1a2e; }

.oc-input-row { display: flex; gap: 0.6em; align-items: center; margin: 0 0 1em; }
.oc-input {
  flex: 1; background: #fff; color: #1a1a2e; border: 1px solid #3a3a5a; border-radius: 10px;
  padding: 12px 14px; font-size: 1.05em; font-family: inherit; box-sizing: border-box;
}
.oc-btn { border: none; cursor: pointer; white-space: nowrap; }
.oc-back { background: none; border: none; color: #ffb84d; font-weight: 600; cursor: pointer; font-family: inherit; font-size: 0.95em; text-decoration: underline; }

.oc-exit { text-align: center; }
.oc-exit .oc-q { color: #ffc369; }

.oc-checklist { display: flex; flex-direction: column; gap: 1em; margin: 0 0 1.2em; }
.oc-cl-item { border: 1px solid #3a3a5a; border-radius: 12px; padding: 1em 1.2em; background: #272742; }
.oc-cl-title { font-weight: 700; color: #fff; margin: 0 0 0.2em; }
.oc-cl-ref { color: rgba(255,255,255,0.55); font-size: 0.8em; margin: 0 0 0.8em; }
.oc-cl-answers { display: flex; flex-wrap: wrap; gap: 0.5em; }
.oc-cl-opt {
  background: #272742; border: 1px solid #3a3a5a; border-radius: 20px;
  padding: 7px 16px; font-size: 0.9em; color: #fff; cursor: pointer; font-family: inherit;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.oc-cl-opt:hover { border-color: #f39200; }
.oc-cl-opt--on { background: #f39200; border-color: #f39200; color: #1a1a2e; }

.oc-result-section { margin: 0 0 1.2em; padding: 1.1em 1.2em; background: #f39200; border: 1px solid #f39200; border-radius: 12px; }
.oc-result-section:last-child { margin-bottom: 0; }
.oc-result-section .oc-result-h { color: #1a1a2e !important; }
.oc-result-section .oc-table td { color: #1a1a2e !important; border-bottom: 1px solid rgba(26,26,46,0.25); }
.oc-result-section .oc-table td:first-child { color: rgba(26,26,46,0.72); font-weight: 500; }
.oc-result-section .oc-result-p { color: #1a1a2e; }
.oc-table { width: 100%; border-collapse: collapse; margin: 0 0 0.8em; }
.oc-table td { padding: 0.55em 0.6em; border-bottom: 1px solid rgba(255,255,255,0.14); vertical-align: top; }
.oc-table td:first-child { color: rgba(255,255,255,0.72); width: 48%; font-weight: 500; }
.oc-table td:last-child { color: #fff; font-weight: 600; }
.oc-result-p { color: rgba(255,255,255,0.85); line-height: 1.7; }

.oc-alert { background: rgba(255,163,0,0.16); border: 1px solid rgba(255,163,0,0.5); border-radius: 8px; padding: 0.9em 1.1em; color: #ffd088; margin: 1.2em 0; line-height: 1.6; }
.oc-disclaimer { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); border-radius: 8px; padding: 0.9em 1.1em; color: rgba(255,255,255,0.85); margin: 1.2em 0; line-height: 1.6; font-size: 0.95em; }
.oc-refs { color: rgba(255,255,255,0.7); font-size: 0.9em; margin: 0.6em 0; }
.oc-legal-note { color: rgba(255,255,255,0.55); font-size: 0.82em; margin: 0.6em 0 1.2em; }

/* Ligne Écart mise en évidence (adaptée au fond orange des sections) */
.oc-ecart-row { background: rgba(26,26,46,0.16); }
.oc-ecart-row td { border-bottom: 1px solid rgba(26,26,46,0.28); }
.oc-ecart-row .oc-ecart { color: #6b4700 !important; font-weight: 700; }
.oc-ecart-row .oc-ecart-val {
  color: #1a1a2e !important;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.01em;
}

.oc-actions { display: flex; flex-wrap: wrap; gap: 1em; align-items: center; margin-top: 1em; }
.oc-print {
  background: #f39200; color: #1a1a2e; border: none; border-radius: 50px;
  padding: 12px 28px; font-weight: 700; font-size: 0.98em; cursor: pointer; font-family: inherit;
}
.oc-print:hover { background: #ffb84d; }

/* ===== En-tête / pied dédiés à l'impression (masqués à l'écran) ===== */
.oc-print-header, .oc-print-footer { display: none; }

/* ============================= IMPRESSION : PDF sur une page ============================= */
@media print {
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  @page { margin: 10mm; }
  body { font-size: 11px; }

  .oc-card {
    border: none; box-shadow: none; max-width: 100%; padding: 0; margin: 0;
    background: #fff !important; color: #1a1a2e;
  }
  .oc-title, .oc-q, .oc-result-h, .oc-result .oc-title { color: #1a1a2e !important; }
  .oc-lead, .oc-help, .oc-result-p { color: #333; }
  .oc-note, .oc-legal-note { color: #777; }
  .oc-back, .oc-actions, .oc-print { display: none !important; }

  .oc-table { margin: 0 0 0.6em; }
  .oc-table td { color: #1a1a2e !important; border-bottom: 1px solid #ddd; padding: 0.32em 0.5em; }
  .oc-table td:first-child { color: #444 !important; }
  .oc-ecart-row { background: #f3f4f8 !important; }
  .oc-ecart-row .oc-ecart { color: #8a5a00 !important; font-weight: 700; }
  .oc-ecart-row .oc-ecart-val { color: #8a5a00 !important; font-weight: 800; text-transform: none; }

  .oc-alert { color: #8a5a00; border-color: #d9a83a; background: #fdf3e0; padding: 0.5em 0.7em; margin: 0.7em 0; }
  .oc-disclaimer { color: #333; border-color: #ddd; background: #f7f8fa; padding: 0.5em 0.7em; margin: 0.7em 0; }
  .oc-refs { color: #555; margin: 0.3em 0; }
  .oc-result-section { margin: 0 0 0.7em; background: #fff; border: 1px solid #e0e3ec; padding: 0.7em 0.8em; }

  /* Masquer la navigation et le remplissage visuel du site */
  header, nav, .h-hero, .h-faq, .h-author-block, footer, .h-breadcrumb,
  .h-final-cta .h-cta-group { display: none !important; }

  /* En-tête compact */
  .oc-print-header { display: block; margin-bottom: 0.8em; }
  .oc-ph-band {
    display: inline-block; background: #1a1a2e; color: #fff; font-weight: 700;
    font-size: 0.72em; letter-spacing: 0.08em; padding: 0.28em 0.9em; border-radius: 3px; margin-bottom: 0.5em;
  }
  .oc-print-header h1 { font-size: 1.25em; color: #1a1a2e; margin: 0 0 0.28em; line-height: 1.2; }
  .oc-ph-intro { color: #444; line-height: 1.45; margin: 0 0 0.7em; font-size: 0.95em; }

  /* CTA compact */
  .h-final-cta { background: #f7f8fa; border: 1px solid #e3e6ee; border-radius: 8px; padding: 0.8em 1em; margin-top: 0.9em; }
  .h-final-cta h2 { font-size: 1em; color: #1a1a2e; margin: 0 0 0.2em; }
  .h-final-cta p { color: #444; margin: 0; font-size: 0.92em; }

  /* Pied légal compact */
  .oc-print-footer { display: block; border-top: 1px solid #ccc; margin-top: 1em; padding-top: 0.5em; font-size: 0.7em; color: #666; line-height: 1.4; }
  .oc-pf-contact { margin: 0 0 0.2em; }
  .oc-pf-legal { margin: 0; }
}