/* ============================================================
   Print mode (classe JS — masquage UI avant impression)
   ============================================================ */

.print-mode .btn-orange,
.print-mode .sticky,
.print-mode .status-badge-btn,
.print-mode [data-controller="dropdown"],
.print-mode .comment-count, .print-mode [data-action*="toggleComments"],
.print-mode [data-action*="toggleSketch"], .print-mode [data-action*="addSketch"],
.print-mode .btn-production-steps,
.print-mode button[type="submit"],
.print-mode [data-comment-input] {
  display: none !important;
}

.print-mode .input, .print-mode select, .print-mode .ts-control, .print-mode textarea {
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  appearance: none;
}

/* Exception schema-input : garde bordure et fond */
[data-project-form-target="deviceSection"] .schema-input input,
[data-project-form-target="deviceSection"] .schema-input .print-value {
  border: 1px solid var(--color-blue) !important;
  background-color: var(--color-white-neutral) !important;
  border-radius: 50px !important;
  padding: 0.2rem 0.2rem !important;
  width: 48px !important;
  height: 22px !important;
  text-align: center !important;
  font-size: 0.7rem !important;
}

.print-mode .ts-wrapper .ts-dropdown { display: none !important; }


/* ============================================================
   @media print — impression navigateur / export PDF
   ============================================================ */

/* Sections vides cachées */
.print-mode [data-controller="section-toggle"]:has([data-section-toggle-target="content"].hidden) {
  display: none !important;
}

.print-mode .comment-panel[data-empty="true"],
.print-mode .sketch-panel[data-empty="true"] {
  display: none !important;
}

@page {
  size: A4 portrait;
  margin: 8mm;
}

@media print {
  /* UI cachée */
  .no-print,
  [type="submit"],
  [data-project-form-target="adminBtn"],
  [data-project-form-target="deviceBtn"],
  [data-project-form-target="adminSection"],
  .comment-panel textarea,
  .comment-panel button,
  .sketch-panel > button { display: none !important; }

  body:not(.print-extras) .sketch-panel,
  body:not(.print-extras) .comment-panel { display: none !important; }

  .sm\:ml-64 { margin-left: 0 !important; }
  .max-w-4xl { max-width: 100% !important; padding: 0 !important; }

  /* Header */
  [data-project-form-target="header"] > div {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: flex-start !important;
    height: auto !important;
    margin-bottom: 8px !important;
  }
  [data-project-form-target="header"] h1 { font-size: 22px !important; flex: 1 1 auto; }

  /* Sections */
  [data-project-form-target="deviceSection"] > .bg-white-neutral {
    break-inside: avoid;
    page-break-inside: avoid;
    margin-bottom: 6px !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
  }

  /* Typographie */
  [data-project-form-target="deviceSection"] input,
  [data-project-form-target="deviceSection"] select,
  [data-project-form-target="deviceSection"] span,
  [data-project-form-target="deviceSection"] p,
  [data-project-form-target="deviceSection"] label,
  [data-project-form-target="deviceSection"] div {
    font-size: 10px;
    font-family: inherit;
    line-height: 1.4;
    text-align: left;
    color: inherit;
  }

  [data-project-form-target="deviceSection"] h2 { font-size: 20px !important; font-weight: 600 !important; margin-bottom: 6px !important; }
  [data-project-form-target="deviceSection"] h3 { font-size: 14px !important; font-weight: 600 !important; margin-bottom: 4px !important; }

  /* Champs */
  [data-project-form-target="deviceSection"] input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]),
  [data-project-form-target="deviceSection"] select,
  [data-project-form-target="deviceSection"] .ts-wrapper .ts-control,
  [data-project-form-target="deviceSection"] .print-value {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    font-weight: 600 !important;
  }

  /* Toggles : layout */
  [data-project-form-target="deviceSection"] .toggle-switch,
  [data-project-form-target="deviceSection"] .toggle-switch-choice {
    display: flex !important;
    justify-content: flex-start !important;
    height: auto !important;
    cursor: default !important;
  }

  /* Cache track + inputs */
  [data-project-form-target="deviceSection"] .toggle-switch .track,
  [data-project-form-target="deviceSection"] .toggle-switch-choice .track,
  [data-project-form-target="deviceSection"] .toggle-switch input,
  [data-project-form-target="deviceSection"] .toggle-switch-choice input { display: none !important; }

  /* toggleSwitchChoice : cache les deux labels par défaut */
  [data-project-form-target="deviceSection"] .toggle-switch-choice .label-off,
  [data-project-form-target="deviceSection"] .toggle-switch-choice .label-on { display: none !important; }

  /* Affiche uniquement le label actif */
  [data-project-form-target="deviceSection"] .toggle-switch-choice:has(input:not(:checked)) .label-off,
  [data-project-form-target="deviceSection"] .toggle-switch-choice:has(input:checked) .label-on {
    display: inline !important;
    font-weight: 600 !important;
  }

  /* toggleSwitch simple : affiche ✓ ou ✗ devant le label */
  [data-project-form-target="deviceSection"] .toggle-switch span::before { content: "✗ "; font-weight: 600; }
  [data-project-form-target="deviceSection"] .toggle-switch:has(input[type="checkbox"]:checked) span::before { content: "✓ "; }

  /* Grilles */
  [data-project-form-target="deviceSection"] .xl\:grid-cols-2,
  [data-project-form-target="deviceSection"] .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  [data-project-form-target="deviceSection"] .sm\:grid-cols-\[2fr_1fr\],
  [data-project-form-target="deviceSection"] .grid-cols-\[2fr_1fr\],
  [data-project-form-target="deviceSection"] .grid-cols-\[1fr_1fr\] { grid-template-columns: 2fr 1fr !important; }

  /* Espacements */
  [data-project-form-target="deviceSection"] .gap-6    { gap: 6px !important; }
  [data-project-form-target="deviceSection"] .gap-x-12 { column-gap: 16px !important; }
  [data-project-form-target="deviceSection"] .gap-x-2  { column-gap: 4px !important; }
  [data-project-form-target="deviceSection"] .gap-y-3,
  [data-project-form-target="deviceSection"] .sm\:gap-y-4 { row-gap: 3px !important; }
  [data-project-form-target="deviceSection"] .gap-10   { gap: 10px !important; }
  [data-project-form-target="deviceSection"] .mb-6     { margin-bottom: 4px !important; }
  [data-project-form-target="deviceSection"] .mb-8     { margin-bottom: 4px !important; }
  [data-project-form-target="deviceSection"] .mt-6     { margin-top: 6px !important; }
  [data-project-form-target="deviceSection"] .p-8      { padding: 6px !important; }

  /* Divers */
  [data-project-form-target="deviceSection"] .print-hidden { display: none !important; }
  [data-project-form-target="deviceSection"] .relative img { max-width: 100% !important; }

  .main-content {
    margin-left: 0 !important;
  }

  /* Évite les coupures dans les sections */
  [data-project-form-target="deviceSection"] .form-section {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Évite les coupures dans les schémas */
  [data-project-form-target="deviceSection"] .relative:has(img) {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Saut de page avant chaque section */
  [data-project-form-target="deviceSection"] .form-section + .form-section {
    break-before: auto;
  }

  /* Supprime les bordures verticales */
  [data-project-form-target="deviceSection"] .bg-white-neutral {
    border-left: none !important;
    border-right: none !important;
    border-radius: 0 !important;
    border-top: 1px solid var(--color-blue) !important;
    border-bottom: none !important;
  }

  /* Supprime la page vide finale */
  [data-project-form-target="deviceSection"] .form-section:last-child {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .from-white-neutral\/95 { display: none !important; }
  .sticky.bottom-0 { display: none !important; }

  [data-project-form-target="header"] {
    display: flex !important;
    flex-wrap: wrap !important;
  }

  [data-project-form-target="deviceSection"] .xl\:grid-cols-2,
  [data-project-form-target="deviceSection"] .sm\:grid-cols-2 {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
  }

  [data-project-form-target="deviceSection"] {
    overflow: visible !important;
  }

}