.yassdicta-header {
  width: 100%;
  min-height: 64px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  padding: 0 24px;
  box-sizing: border-box;

  background: #ffffff;
  border-bottom: 1px solid #e5e7eb;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);

  position: sticky;
  top: 0;
  z-index: 1000;
}

.yassdicta-title {
  font-size: 24px;
  font-weight: 700;
  color: #1f2937;
}

.yassdicta-user {
  display: flex;
  align-items: center;
  gap: 10px;

  font-size: 14px;
  color: #4b5563;
}

.yassdicta-btn {
  border: 1px solid #d1d5db !important;
  background: #ffffff !important;
  color: #374151 !important;

  border-radius: 7px !important;
  padding: 7px 14px !important;

  font-size: 13px !important;
}

.yassdicta-btn:hover {
  background: #f3f4f6 !important;
}

.yassdicta-logout {
  color: #b91c1c !important;
  border-color: #fecaca !important;
}

.yassdicta-logout:hover {
  background: #fef2f2 !important;
}

/* ==========================================================
   DASHBOARD YASSDICTA
   ========================================================== */

.dashboard-container {
  width: 100%;
  max-width: 1250px;

  margin: 0 auto;

  padding: 32px 28px 50px 28px;

  box-sizing: border-box;
}


/* ==========================================================
   BIENVENUE
   ========================================================== */

.dashboard-welcome {
  margin-bottom: 28px;
}

.dashboard-welcome h2 {
  margin: 0 0 8px 0;

  font-size: 28px;
  font-weight: 700;

  color: #123b63;
}

.dashboard-welcome .shiny-text-output {
  font-size: 15px;
  color: #64748b;
}


/* ==========================================================
   CARTES STATISTIQUES
   ========================================================== */

.dashboard-stats {

  display: grid;

  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap: 20px;

  margin-bottom: 42px;
}


.dashboard-stat-card {

  min-height: 125px;

  display: flex;

  align-items: center;

  gap: 18px;

  padding: 22px;

  box-sizing: border-box;

  background: #ffffff;

  border: 1px solid #dbe7f2;

  border-radius: 14px;

  box-shadow:
    0 4px 14px rgba(30, 80, 120, 0.08);

  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease;

}


.dashboard-stat-card:hover {

  transform: translateY(-3px);

  box-shadow:
    0 8px 22px rgba(30, 80, 120, 0.13);

}


/* Icône */

.stat-icon {

  width: 56px;
  height: 56px;

  min-width: 56px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 14px;

  background: #e8f3fb;

  font-size: 27px;

}


/* Contenu */

.stat-content {
  min-width: 0;
}


.stat-label {

  font-size: 14px;

  font-weight: 600;

  color: #64748b;

  margin-bottom: 5px;

}


.stat-number {

  font-size: 30px;

  line-height: 1;

  font-weight: 700;

  color: #1261a0;

}


/* ==========================================================
   SECTION ACCÈS RAPIDE
   ========================================================== */

.dashboard-section {

  margin-bottom: 22px;

}


.dashboard-section h3 {

  margin: 0 0 6px 0;

  font-size: 21px;

  font-weight: 700;

  color: #123b63;

}


.dashboard-description {

  margin: 0;

  color: #64748b;

  font-size: 14px;

}


/* ==========================================================
   CARTES MODULES
   ========================================================== */

.dashboard-modules {

  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 22px;

  margin-bottom: 28px;

}


.dashboard-module-button {

  width: 100%;

  min-height: 175px;

  padding: 25px !important;

  box-sizing: border-box;

  display: flex !important;

  flex-direction: column;

  align-items: flex-start;

  justify-content: center;

  text-align: left;

  background: #ffffff !important;

  color: #123b63 !important;

  border: 1px solid #d7e5f0 !important;

  border-radius: 16px !important;

  box-shadow:
    0 4px 14px rgba(30, 80, 120, 0.07);

  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease;

}


.dashboard-module-button:hover {

  transform: translateY(-4px);

  background: #f8fcff !important;

  border-color: #8bbddd !important;

  box-shadow:
    0 10px 25px rgba(30, 80, 120, 0.13);

}


.dashboard-module-button:active {

  transform: translateY(-1px);

}


/* Icône module */

.module-icon {

  width: 52px;
  height: 52px;

  display: flex;

  align-items: center;
  justify-content: center;

  margin-bottom: 15px;

  border-radius: 13px;

  background: #e8f3fb;

  font-size: 26px;

}


/* Titre */

.module-title {

  font-size: 18px;

  font-weight: 700;

  color: #123b63;

  margin-bottom: 6px;

}


/* Description */

.module-description {

  font-size: 13px;

  line-height: 1.4;

  color: #64748b;

}


/* ==========================================================
   ADMINISTRATION
   ========================================================== */

.dashboard-admin {

  margin-top: 10px;

}


/* ==========================================================
   RESPONSIVE TABLETTE
   ========================================================== */

@media (max-width: 1000px) {

  .dashboard-stats {

    grid-template-columns:
      repeat(2, minmax(0, 1fr));

  }

  .dashboard-modules {

    grid-template-columns:
      repeat(2, minmax(0, 1fr));

  }

}


/* ==========================================================
   RESPONSIVE MOBILE
   ========================================================== */

@media (max-width: 650px) {

  .dashboard-container {

    padding: 22px 15px 35px 15px;

  }

  .dashboard-welcome h2 {

    font-size: 24px;

  }

  .dashboard-stats {

    grid-template-columns: 1fr;

    gap: 14px;

    margin-bottom: 32px;

  }

  .dashboard-stat-card {

    min-height: 100px;

    padding: 18px;

  }

  .dashboard-modules {

    grid-template-columns: 1fr;

    gap: 15px;

  }

  .dashboard-module-button {

    min-height: 145px;

  }

}


/* ==========================================================
   PETITS TELEPHONES
   ========================================================== */

@media (max-width: 400px) {

  .dashboard-container {

    padding-left: 10px;
    padding-right: 10px;

  }

  .dashboard-stat-card {

    padding: 15px;

  }

  .stat-number {

    font-size: 26px;

  }

}

/* ==========================================================
   PATIENTS
   ========================================================== */

.patient-container {

  width: 100%;
  max-width: 1250px;

  margin: 0 auto;

  padding: 30px 28px 50px;

  box-sizing: border-box;

}


/* ==========================================================
   EN-TÊTE
   ========================================================== */

.patient-page-header {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 20px;

  margin-bottom: 28px;

}


.patient-title-area h2 {

  margin: 0;

  font-size: 28px;

  font-weight: 700;

  color: #123b63;

}


.patient-subtitle {

  margin: 6px 0 0;

  font-size: 14px;

  color: #64748b;

}


/* Nouveau patient */

.patient-new-button {

  min-height: 44px;

  padding: 10px 20px !important;

  border: none !important;

  border-radius: 9px !important;

  background: #1261a0 !important;

  color: white !important;

  font-weight: 600 !important;

  box-shadow: 0 4px 10px rgba(18, 97, 160, 0.20);

  transition: all 0.18s ease;

}


.patient-new-button:hover {

  background: #0d4f85 !important;

  transform: translateY(-1px);

  box-shadow: 0 6px 15px rgba(18, 97, 160, 0.25);

}


/* ==========================================================
   RECHERCHE
   ========================================================== */

.patient-search-card {

  background: #ffffff;

  border: 1px solid #dbe7f2;

  border-radius: 14px;

  padding: 18px 20px 8px;

  margin-bottom: 22px;

  box-shadow: 0 3px 12px rgba(30, 80, 120, 0.06);

}


.patient-search-label {

  display: flex;

  align-items: center;

  gap: 8px;

  margin-bottom: 8px;

  font-size: 14px;

  font-weight: 600;

  color: #123b63;

}


.patient-search-icon {

  font-size: 18px;

}


/* Champ recherche */

.patient-search-card .form-group {

  margin-bottom: 8px;

}


.patient-search-card .form-control {

  height: 43px;

  border: 1px solid #cbdbe8;

  border-radius: 8px;

  box-shadow: none;

  font-size: 14px;

}


.patient-search-card .form-control:focus {

  border-color: #4c9dcc;

  box-shadow:
    0 0 0 3px rgba(76, 157, 204, 0.12);

}


/* ==========================================================
   TABLEAU
   ========================================================== */

.patient-table-card {

  background: #ffffff;

  border: 1px solid #dbe7f2;

  border-radius: 14px;

  padding: 0 18px 18px;

  margin-bottom: 22px;

  box-shadow: 0 3px 12px rgba(30, 80, 120, 0.06);

  overflow: hidden;

}


.patient-table-header {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 15px;

  padding: 18px 2px;

  border-bottom: 1px solid #e7eef5;

  margin-bottom: 10px;

}


.patient-table-title {

  font-size: 17px;

  font-weight: 700;

  color: #123b63;

}


.patient-table-hint {

  font-size: 12px;

  color: #94a3b8;

}


/* DataTable */

.patient-table-card .dataTables_wrapper {

  padding-top: 4px;

}


.patient-table-card table.dataTable {

  border-collapse: collapse !important;

}


.patient-table-card table.dataTable thead th {

  background: #f2f7fb;

  color: #36536d;

  font-weight: 600;

  border-bottom: 1px solid #d7e5f0 !important;

}


.patient-table-card table.dataTable tbody td {

  padding: 11px 10px;

  color: #334155;

  border-bottom: 1px solid #edf2f6;

}


.patient-table-card table.dataTable tbody tr:hover {

  background: #f7fbfe !important;

}


/* ==========================================================
   ACTIONS
   ========================================================== */

.patient-actions {

  display: flex;

  flex-wrap: wrap;

  gap: 10px;

  align-items: center;

}


.patient-action-button {

  min-height: 42px;

  padding: 9px 16px !important;

  border-radius: 8px !important;

  font-size: 13px !important;

  font-weight: 600 !important;

  transition: all 0.15s ease;

}


/* Modifier */

.patient-edit {

  background: #fff8e6 !important;

  color: #8a5a00 !important;

  border: 1px solid #f0d58a !important;

}


.patient-edit:hover {

  background: #fff2cc !important;

}


/* Supprimer */

.patient-delete {

  background: #fff5f5 !important;

  color: #b42318 !important;

  border: 1px solid #f1b8b8 !important;

}


.patient-delete:hover {

  background: #ffe7e7 !important;

}


/* Consultations / blocs */

.patient-primary {

  background: #eaf4fb !important;

  color: #1261a0 !important;

  border: 1px solid #b9d7eb !important;

}


.patient-primary:hover {

  background: #dceef9 !important;

}


/* Retour */

.patient-back {

  margin-left: auto;

  background: #f8fafc !important;

  color: #475569 !important;

  border: 1px solid #cbd5e1 !important;

}


.patient-back:hover {

  background: #f1f5f9 !important;

}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 900px) {

  .patient-container {

    padding: 24px 20px 40px;

  }

  .patient-page-header {

    align-items: flex-start;

  }

  .patient-actions {

    gap: 8px;

  }

  .patient-back {

    margin-left: 0;

  }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 650px) {

  .patient-container {

    padding: 20px 12px 35px;

  }

  .patient-page-header {

    flex-direction: column;

    align-items: stretch;

  }

  .patient-title-area h2 {

    font-size: 24px;

  }

  .patient-new-button {

    width: 100%;

  }

  .patient-table-card {

    padding-left: 10px;

    padding-right: 10px;

  }

  .patient-table-header {

    align-items: flex-start;

    flex-direction: column;

  }

  .patient-table-hint {

    display: none;

  }

  .patient-actions {

    display: grid;

    grid-template-columns: 1fr 1fr;

    width: 100%;

  }

  .patient-action-button {

    width: 100%;

  }

  .patient-back {

    grid-column: 1 / -1;

  }

}


/* ==========================================================
   PETIT MOBILE
   ========================================================== */

@media (max-width: 400px) {

  .patient-actions {

    grid-template-columns: 1fr;

  }

  .patient-back {

    grid-column: auto;

  }

}

/* ==========================================================
   CONSULTATIONS
   ========================================================== */

.consultation-container {

  width: 100%;
  max-width: 1250px;

  margin: 0 auto;

  padding: 30px 28px 50px;

  box-sizing: border-box;

}


/* ==========================================================
   EN-TÊTE
   ========================================================== */

.consultation-page-header {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 20px;

  margin-bottom: 28px;

}


.consultation-title-area h2 {

  margin: 0;

  font-size: 28px;

  font-weight: 700;

  color: #123b63;

}


.consultation-subtitle {

  margin: 6px 0 0;

  font-size: 14px;

  color: #64748b;

}


/* Patient */

.consultation-patient-badge {

  display: flex;

  align-items: center;

  gap: 9px;

  padding: 10px 16px;

  background: #eef7fc;

  border: 1px solid #c8e0ef;

  border-radius: 10px;

  color: #1261a0;

  font-size: 14px;

  font-weight: 600;

}


.consultation-patient-icon {

  font-size: 18px;

}


/* ==========================================================
   TABLEAU
   ========================================================== */

.consultation-table-card {

  background: #ffffff;

  border: 1px solid #dbe7f2;

  border-radius: 14px;

  padding: 0 18px 18px;

  margin-bottom: 22px;

  box-shadow: 0 3px 12px rgba(30, 80, 120, 0.06);

  overflow: hidden;

}


.consultation-table-header {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 15px;

  padding: 18px 2px;

  border-bottom: 1px solid #e7eef5;

  margin-bottom: 10px;

}


.consultation-table-title {

  font-size: 17px;

  font-weight: 700;

  color: #123b63;

}


.consultation-table-hint {

  font-size: 12px;

  color: #94a3b8;

}


/* DataTable */

.consultation-table-card table.dataTable {

  border-collapse: collapse !important;

}


.consultation-table-card table.dataTable thead th {

  background: #f2f7fb;

  color: #36536d;

  font-weight: 600;

  border-bottom: 1px solid #d7e5f0 !important;

}


.consultation-table-card table.dataTable tbody td {

  padding: 11px 10px;

  color: #334155;

  border-bottom: 1px solid #edf2f6;

}


.consultation-table-card table.dataTable tbody tr:hover {

  background: #f7fbfe !important;

}


/* ==========================================================
   ACTIONS
   ========================================================== */

.consultation-actions {

  display: flex;

  flex-wrap: wrap;

  gap: 10px;

  align-items: center;

}


.consultation-action-button {

  min-height: 42px;

  padding: 9px 16px !important;

  border-radius: 8px !important;

  font-size: 13px !important;

  font-weight: 600 !important;

  transition: all 0.15s ease;

}


/* Nouvelle */

.consultation-new {

  background: #1261a0 !important;

  color: #ffffff !important;

  border: 1px solid #1261a0 !important;

}


.consultation-new:hover {

  background: #0d4f85 !important;

}


/* Modifier */

.consultation-edit {

  background: #fff8e6 !important;

  color: #8a5a00 !important;

  border: 1px solid #f0d58a !important;

}


/* Supprimer */

.consultation-delete {

  background: #fff5f5 !important;

  color: #b42318 !important;

  border: 1px solid #f1b8b8 !important;

}


/* Dictaphone */

.consultation-dictaphone {

  background: #eaf4fb !important;

  color: #1261a0 !important;

  border: 1px solid #b9d7eb !important;

}


.consultation-dictaphone:hover {

  background: #dceef9 !important;

}


/* Retour */

.consultation-back {

  margin-left: auto;

  background: #f8fafc !important;

  color: #475569 !important;

  border: 1px solid #cbd5e1 !important;

}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 900px) {

  .consultation-container {

    padding: 24px 20px 40px;

  }

  .consultation-page-header {

    align-items: flex-start;

  }

  .consultation-back {

    margin-left: 0;

  }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 650px) {

  .consultation-container {

    padding: 20px 12px 35px;

  }

  .consultation-page-header {

    flex-direction: column;

    align-items: stretch;

  }

  .consultation-title-area h2 {

    font-size: 24px;

  }

  .consultation-patient-badge {

    width: 100%;

    box-sizing: border-box;

  }

  .consultation-table-card {

    padding-left: 10px;

    padding-right: 10px;

  }

  .consultation-table-header {

    flex-direction: column;

    align-items: flex-start;

  }

  .consultation-table-hint {

    display: none;

  }

  .consultation-actions {

    display: grid;

    grid-template-columns: 1fr 1fr;

    width: 100%;

  }

  .consultation-action-button {

    width: 100%;

  }

  .consultation-back {

    grid-column: 1 / -1;

  }

}


/* ==========================================================
   PETIT MOBILE
   ========================================================== */

@media (max-width: 400px) {

  .consultation-actions {

    grid-template-columns: 1fr;

  }

  .consultation-back {

    grid-column: auto;

  }

}

/* ==========================================================
   DICTAPHONE MÉDICAL
   ========================================================== */

.dictaphone-container {

  width: 100%;
  max-width: 1250px;

  margin: 0 auto;

  padding: 30px 28px 50px;

  box-sizing: border-box;

}


/* ==========================================================
   EN-TÊTE
   ========================================================== */

.dictaphone-page-header {

  margin-bottom: 25px;

}


.dictaphone-title {

  margin: 0;

  font-size: 28px;

  font-weight: 700;

  color: #123b63;

}


.dictaphone-subtitle {

  margin: 7px 0 0;

  color: #64748b;

  font-size: 14px;

}


/* ==========================================================
   PATIENT / CONSULTATION
   ========================================================== */

.dictaphone-context-card {

  display: flex;

  align-items: center;

  gap: 28px;

  padding: 18px 22px;

  margin-bottom: 22px;

  background: #ffffff;

  border: 1px solid #dbe7f2;

  border-radius: 14px;

  box-shadow: 0 3px 12px rgba(30, 80, 120, 0.06);

}


.dictaphone-context-item {

  display: flex;

  align-items: center;

  gap: 12px;

  flex: 1;

}


.dictaphone-context-icon {

  width: 42px;

  height: 42px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 10px;

  background: #eaf4fb;

  font-size: 21px;

}


.dictaphone-context-label {

  font-size: 12px;

  color: #64748b;

  margin-bottom: 3px;

}


.dictaphone-context-value {

  color: #123b63;

  font-size: 15px;

  font-weight: 600;

}


.dictaphone-context-separator {

  width: 1px;

  height: 42px;

  background: #e2e8f0;

}


/* ==========================================================
   CARTES
   ========================================================== */

.dictaphone-section-card {

  background: #ffffff;

  border: 1px solid #dbe7f2;

  border-radius: 14px;

  padding: 20px;

  margin-bottom: 20px;

  box-shadow: 0 3px 12px rgba(30, 80, 120, 0.05);

}


.dictaphone-section-header {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 15px;

  margin-bottom: 20px;

}


.dictaphone-section-header-simple {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 15px;

}


.dictaphone-section-title {

  margin: 0;

  color: #123b63;

  font-size: 18px;

  font-weight: 700;

}


.dictaphone-section-description {

  margin: 5px 0 0;

  color: #64748b;

  font-size: 13px;

}


/* ==========================================================
   INDICATEUR
   ========================================================== */

.dictaphone-recording-indicator {

  min-width: 120px;

  text-align: right;

  font-size: 13px;

  font-weight: 600;

}


/* ==========================================================
   BOUTONS
   ========================================================== */

.dictaphone-controls {

  display: flex;

  flex-wrap: wrap;

  gap: 10px;

}


.dictaphone-control {

  min-height: 44px;

  padding: 9px 18px !important;

  border-radius: 8px !important;

  font-size: 13px !important;

  font-weight: 600 !important;

  transition: all 0.15s ease;

}


/* Enregistrer */

.dictaphone-record {

  background: #b42318 !important;

  color: white !important;

  border: 1px solid #b42318 !important;

}


/* Arrêter */

.dictaphone-stop {

  background: #fff8e6 !important;

  color: #8a5a00 !important;

  border: 1px solid #f0d58a !important;

}


/* Lire */

.dictaphone-play {

  background: #eaf4fb !important;

  color: #1261a0 !important;

  border: 1px solid #b9d7eb !important;

}


/* Sauvegarder */

.dictaphone-save {

  background: #1261a0 !important;

  color: white !important;

  border: 1px solid #1261a0 !important;

}


.dictaphone-save:hover {

  background: #0d4f85 !important;

}


/* ==========================================================
   TRAITEMENT
   ========================================================== */

.dictaphone-processing {

  margin-top: 22px;

  padding-top: 18px;

  border-top: 1px solid #e7eef5;

}


.dictaphone-processing-title {

  margin-bottom: 12px;

  color: #475569;

  font-size: 13px;

  font-weight: 600;

}


.dictaphone-processing-controls {

  align-items: center;

}


/* IA */

.dictaphone-ai {

  background: #eef2ff !important;

  color: #4338ca !important;

  border: 1px solid #c7d2fe !important;

}


/* Terminer */

.dictaphone-finish {

  background: #ecfdf5 !important;

  color: #047857 !important;

  border: 1px solid #a7f3d0 !important;

}


/* ==========================================================
   AUDIO
   ========================================================== */

.dictaphone-audio-container {

  padding: 10px 0;

}


.dictaphone-audio-container audio {

  width: 100%;

  max-width: 700px;

}


/* ==========================================================
   TRANSCRIPTION / RAPPORT
   ========================================================== */

.dictaphone-text-container {

  background: #f8fafc;

  border: 1px solid #e2e8f0;

  border-radius: 9px;

  padding: 16px;

  min-height: 80px;

}


.dictaphone-text-container pre {

  margin: 0;

  white-space: pre-wrap;

  word-break: break-word;

  font-family: inherit;

  font-size: 14px;

  line-height: 1.65;

  color: #334155;

  background: transparent;

  border: 0;

}


.dictaphone-report-card {

  border-left: 4px solid #1261a0;

}


.dictaphone-report-container {

  background: #f7fbfe;

}


.dictaphone-ai-badge {

  padding: 4px 9px;

  border-radius: 20px;

  background: #eaf4fb;

  color: #1261a0;

  font-size: 11px;

  font-weight: 700;

}


/* ==========================================================
   FOOTER
   ========================================================== */

.dictaphone-footer {

  display: flex;

  justify-content: flex-start;

  margin-top: 5px;

}


.dictaphone-back {

  min-height: 42px;

  padding: 9px 18px !important;

  border-radius: 8px !important;

  background: #f8fafc !important;

  color: #475569 !important;

  border: 1px solid #cbd5e1 !important;

  font-weight: 600 !important;

}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 850px) {

  .dictaphone-container {

    padding: 24px 20px 40px;

  }

  .dictaphone-context-card {

    gap: 15px;

  }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 650px) {

  .dictaphone-container {

    padding: 20px 12px 35px;

  }

  .dictaphone-title {

    font-size: 24px;

  }

  .dictaphone-context-card {

    flex-direction: column;

    align-items: stretch;

    gap: 14px;

  }

  .dictaphone-context-separator {

    width: 100%;

    height: 1px;

  }

  .dictaphone-section-card {

    padding: 15px;

  }

  .dictaphone-section-header {

    flex-direction: column;

    align-items: flex-start;

  }

  .dictaphone-controls {

    display: grid;

    grid-template-columns: 1fr 1fr;

    width: 100%;

  }

  .dictaphone-control {

    width: 100%;

  }

  .dictaphone-recording-indicator {

    text-align: left;

  }

}


/* ==========================================================
   PETIT MOBILE
   ========================================================== */

@media (max-width: 400px) {

  .dictaphone-controls {

    grid-template-columns: 1fr;

  }

}

/* ==========================================================
   ÉDITEUR MÉDICAL
   ========================================================== */

.editor-container {

  width: 100%;
  max-width: 1250px;

  margin: 0 auto;

  padding: 30px 28px 50px;

  box-sizing: border-box;

}


.editor-page-header {

  margin-bottom: 24px;

}


.editor-title {

  margin: 0;

  color: #123b63;

  font-size: 28px;

  font-weight: 700;

}


.editor-subtitle {

  margin: 7px 0 0;

  color: #64748b;

  font-size: 14px;

}


/* Carte éditeur */

.editor-card {

  background: #ffffff;

  border: 1px solid #dbe7f2;

  border-radius: 14px;

  padding: 20px;

  box-shadow: 0 3px 12px rgba(30, 80, 120, 0.06);

}


.editor-card-header {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 15px;

}


.editor-card-title {

  color: #123b63;

  font-size: 18px;

  font-weight: 700;

}


.editor-card-badge {

  padding: 5px 10px;

  border-radius: 20px;

  background: #eaf4fb;

  color: #1261a0;

  font-size: 11px;

  font-weight: 700;

}


/* Textarea */

.editor-card textarea {

  width: 100% !important;

  box-sizing: border-box;

  border: 1px solid #cbdbe8 !important;

  border-radius: 9px !important;

  padding: 16px !important;

  color: #263b4d;

  background: #fbfdff;

  font-size: 14px;

  line-height: 1.65;

  box-shadow: none !important;

}


.editor-card textarea:focus {

  border-color: #4c94c4 !important;

  box-shadow: 0 0 0 3px rgba(18, 97, 160, 0.10) !important;

}


/* Actions */

.editor-actions {

  display: flex;

  flex-wrap: wrap;

  gap: 10px;

  margin-top: 18px;

}


.editor-action {

  min-height: 44px;

  padding: 9px 20px !important;

  border-radius: 8px !important;

  font-size: 13px !important;

  font-weight: 600 !important;

}


/* Enregistrer */

.editor-save {

  background: #1261a0 !important;

  color: white !important;

  border: 1px solid #1261a0 !important;

}


/* Export */

.editor-export {

  background: #eaf4fb !important;

  color: #1261a0 !important;

  border: 1px solid #b9d7eb !important;

}


/* Retour */

.editor-back {

  margin-left: auto;

  background: #f8fafc !important;

  color: #475569 !important;

  border: 1px solid #cbd5e1 !important;

}


/* ==========================================================
   EXPORT
   ========================================================== */

.export-container {

  width: 100%;

  max-width: 1100px;

  margin: 0 auto;

  padding: 30px 28px 50px;

  box-sizing: border-box;

}


.export-page-header {

  margin-bottom: 24px;

}


.export-title {

  margin: 0;

  color: #123b63;

  font-size: 28px;

  font-weight: 700;

}


.export-subtitle {

  margin: 7px 0 0;

  color: #64748b;

  font-size: 14px;

}


/* Informations */

.export-info-card {

  display: flex;

  align-items: center;

  gap: 25px;

  padding: 18px 22px;

  margin-bottom: 20px;

  background: white;

  border: 1px solid #dbe7f2;

  border-radius: 14px;

  box-shadow: 0 3px 12px rgba(30, 80, 120, 0.05);

}


.export-info-item {

  display: flex;

  align-items: center;

  gap: 12px;

  flex: 1;

}


.export-info-icon {

  width: 42px;

  height: 42px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 10px;

  background: #eaf4fb;

  font-size: 20px;

}


.export-info-label {

  color: #64748b;

  font-size: 12px;

}


.export-info-value {

  margin-top: 3px;

  color: #123b63;

  font-size: 15px;

  font-weight: 600;

}


.export-info-separator {

  width: 1px;

  height: 42px;

  background: #e2e8f0;

}


/* Aperçu */

.export-preview-card {

  background: white;

  border: 1px solid #dbe7f2;

  border-radius: 14px;

  padding: 20px;

  box-shadow: 0 3px 12px rgba(30, 80, 120, 0.05);

}


.export-preview-header {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 15px;

}


.export-preview-title {

  color: #123b63;

  font-size: 18px;

  font-weight: 700;

}


.export-preview-badge {

  padding: 4px 9px;

  border-radius: 20px;

  background: #f1f5f9;

  color: #64748b;

  font-size: 10px;

  font-weight: 700;

}


.export-preview-content {

  background: #f8fafc;

  border: 1px solid #e2e8f0;

  border-radius: 9px;

  padding: 18px;

}


.export-preview-content pre {

  margin: 0;

  background: transparent;

  border: 0;

  white-space: pre-wrap;

  line-height: 1.7;

  font-family: inherit;

  font-size: 14px;

  color: #334155;

}


/* Actions export */

.export-actions {

  display: flex;

  align-items: center;

  gap: 10px;

  margin-top: 18px;

}


.export-action {

  min-height: 44px;

  padding: 9px 20px !important;

  border-radius: 8px !important;

  font-weight: 600 !important;

}


/* Word */

.export-word {

  background: #1261a0 !important;

  color: white !important;

  border: 1px solid #1261a0 !important;

}


/* Retour */

.export-back {

  margin-left: auto;

  background: #f8fafc !important;

  color: #475569 !important;

  border: 1px solid #cbd5e1 !important;

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 650px) {

  .editor-container,
  .export-container {

    padding: 20px 12px 35px;

  }


  .editor-title,
  .export-title {

    font-size: 24px;

  }


  .editor-card {

    padding: 14px;

  }


  .editor-actions,
  .export-actions {

    display: grid;

    grid-template-columns: 1fr;

    width: 100%;

  }


  .editor-action,
  .export-action {

    width: 100%;

  }


  .editor-back,
  .export-back {

    margin-left: 0;

  }


  .export-info-card {

    flex-direction: column;

    align-items: stretch;

    gap: 14px;

  }


  .export-info-separator {

    width: 100%;

    height: 1px;

  }


  .export-preview-card {

    padding: 14px;

  }

}

/* ==========================================================
   EXPORT BLOC OPÉRATOIRE
   ========================================================== */

.export-bloc-container .export-title {
  color: #123b63;
}

.export-bloc-container .export-bloc-preview {
  border-top: 4px solid #1261a0;
}

.export-bloc-badge {
  background: #eaf4fb;
  color: #1261a0;
  border: 1px solid #b9d7eb;
}

/* ==========================================================
   DICTAPHONE BLOC OPERATOIRE
   ========================================================== */

.dictaphone-bloc-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px 20px 40px 20px;
  box-sizing: border-box;
}


/* ==========================================================
   HEADER
   ========================================================== */

.dictaphone-page-header {
  margin-bottom: 24px;
}

.dictaphone-title {
  margin: 0;
  color: #123b63;
  font-size: 28px;
  font-weight: 700;
}

.dictaphone-subtitle {
  margin-top: 6px;
  color: #64748b;
  font-size: 15px;
}


/* ==========================================================
   CONTEXTE BLOC
   ========================================================== */

.dictaphone-context-card {
  background: #ffffff;
  border: 1px solid #dbe7f1;
  border-left: 5px solid #1261a0;
  border-radius: 12px;
  padding: 18px 22px;
  margin-bottom: 22px;

  box-shadow: 0 3px 12px rgba(18, 59, 99, 0.06);
}

.dictaphone-context-item {
  display: flex;
  align-items: center;
  gap: 16px;
}

.dictaphone-context-icon {
  width: 48px;
  height: 48px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 10px;

  background: #eaf4fb;
  color: #1261a0;

  font-size: 24px;
}

.dictaphone-context-label {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: #64748b;
}

.dictaphone-context-value {
  margin-top: 3px;
  font-size: 18px;
  font-weight: 600;
  color: #123b63;
}


/* ==========================================================
   CARTES DE SECTION
   ========================================================== */

.dictaphone-section-card {
  background: #ffffff;

  border: 1px solid #dbe7f1;
  border-radius: 12px;

  padding: 22px;

  margin-bottom: 20px;

  box-shadow: 0 3px 12px rgba(18, 59, 99, 0.05);
}

.dictaphone-section-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;

  gap: 20px;

  margin-bottom: 20px;
}

.dictaphone-section-header-simple {
  display: flex;
  align-items: center;
  justify-content: space-between;

  margin-bottom: 16px;
}

.dictaphone-section-title {
  margin: 0;

  color: #123b63;

  font-size: 19px;
  font-weight: 650;
}

.dictaphone-section-description {
  margin: 5px 0 0 0;

  color: #64748b;

  font-size: 14px;
}


/* ==========================================================
   INDICATEUR ENREGISTREMENT
   ========================================================== */

.dictaphone-recording-indicator {
  min-width: 140px;
  text-align: right;
}


/* ==========================================================
   BOUTONS
   ========================================================== */

.dictaphone-controls {
  display: flex;
  flex-wrap: wrap;

  gap: 12px;

  align-items: center;
}

.dictaphone-control {
  border-radius: 8px !important;

  padding: 10px 18px !important;

  font-size: 14px !important;
  font-weight: 600 !important;

  border: 1px solid transparent !important;

  transition:
    transform .15s ease,
    box-shadow .15s ease,
    background .15s ease;
}

.dictaphone-control:hover {
  transform: translateY(-1px);

  box-shadow: 0 4px 10px rgba(0,0,0,.10);
}


/* Enregistrer */

.dictaphone-record {
  background: #c62828 !important;
  border-color: #b71c1c !important;
  color: #ffffff !important;
}


/* Arrêter */

.dictaphone-stop {
  background: #f59e0b !important;
  border-color: #d97706 !important;
  color: #ffffff !important;
}


/* Sauvegarder */

.dictaphone-save {
  background: #16805c !important;
  border-color: #126b4c !important;
  color: #ffffff !important;
}


/* Transcription */

.dictaphone-play {
  background: #1261a0 !important;
  border-color: #0d4f83 !important;
  color: #ffffff !important;
}


/* IA */

.dictaphone-ai {
  background: #2563a8 !important;
  border-color: #1d4f86 !important;
  color: #ffffff !important;
}


/* ==========================================================
   TRAITEMENT
   ========================================================== */

.dictaphone-processing {
  margin-top: 22px;

  padding-top: 18px;

  border-top: 1px solid #e5edf4;
}

.dictaphone-processing-title {
  margin-bottom: 12px;

  color: #475569;

  font-size: 13px;
  font-weight: 700;

  text-transform: uppercase;
  letter-spacing: .5px;
}


/* ==========================================================
   AUDIO
   ========================================================== */

.dictaphone-audio-container {
  width: 100%;

  padding: 18px;

  background: #f8fbfd;

  border: 1px solid #e1ebf3;

  border-radius: 9px;

  box-sizing: border-box;
}

.dictaphone-audio-container audio {
  width: 100%;
  max-width: 100%;
}


/* ==========================================================
   TRANSCRIPTION / RAPPORT
   ========================================================== */

.dictaphone-text-container {
  min-height: 100px;

  padding: 18px;

  background: #f8fafc;

  border: 1px solid #e2e8f0;

  border-radius: 9px;

  box-sizing: border-box;
}

.dictaphone-text-container pre {
  margin: 0;

  white-space: pre-wrap;
  word-break: break-word;

  font-family: inherit;

  font-size: 14px;
  line-height: 1.65;

  color: #334155;

  background: transparent;
  border: 0;
}


/* ==========================================================
   COMPTE RENDU IA
   ========================================================== */

.dictaphone-report-card {
  border-top: 4px solid #1261a0;
}

.dictaphone-report-container {
  background: #f4f9fd;

  border-color: #cfe1ef;
}

.dictaphone-ai-badge {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  padding: 4px 10px;

  border-radius: 20px;

  background: #eaf4fb;
  color: #1261a0;

  border: 1px solid #c7dfef;

  font-size: 11px;
  font-weight: 700;

  text-transform: uppercase;
}


/* ==========================================================
   HISTORIQUE
   ========================================================== */

.dictaphone-section-card .dataTables_wrapper {
  width: 100%;
}

.dictaphone-section-card table.dataTable {
  border-collapse: collapse !important;
}

.dictaphone-section-card table.dataTable thead th {
  background: #f1f7fb;

  color: #123b63;

  font-weight: 600;

  border-bottom: 1px solid #cddfea;
}


/* ==========================================================
   FOOTER / RETOUR
   ========================================================== */

.dictaphone-footer {
  display: flex;

  justify-content: flex-start;

  margin-top: 8px;
}

.dictaphone-back {
  background: #ffffff !important;

  color: #475569 !important;

  border: 1px solid #cbd5e1 !important;

  border-radius: 8px !important;

  padding: 9px 18px !important;

  font-weight: 600 !important;
}

.dictaphone-back:hover {
  background: #f1f5f9 !important;
}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 900px) {

  .dictaphone-bloc-container {
    padding: 20px 15px 35px 15px;
  }

  .dictaphone-title {
    font-size: 24px;
  }

  .dictaphone-section-card {
    padding: 18px;
  }

  .dictaphone-section-header {
    flex-direction: column;
  }

  .dictaphone-recording-indicator {
    width: 100%;
    text-align: left;
  }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 600px) {

  .dictaphone-bloc-container {
    padding: 15px 10px 30px 10px;
  }

  .dictaphone-title {
    font-size: 21px;
  }

  .dictaphone-subtitle {
    font-size: 13px;
  }

  .dictaphone-section-card {
    padding: 15px;

    border-radius: 10px;
  }

  .dictaphone-context-card {
    padding: 14px;
  }

  .dictaphone-context-value {
    font-size: 16px;
  }

  .dictaphone-controls {
    flex-direction: column;

    width: 100%;
  }

  .dictaphone-control {
    width: 100% !important;
  }

  .dictaphone-processing .dictaphone-control {
    width: 100% !important;
  }

  .dictaphone-section-header-simple {
    align-items: flex-start;
  }

  .dictaphone-section-title {
    font-size: 17px;
  }

}

/* ==========================================================
   BLOCS OPERATOIRES
   ========================================================== */

.bloc-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px 20px 40px 20px;
}


/* ==========================================================
   HEADER
   ========================================================== */

.bloc-page-header {
  margin-bottom: 22px;
}

.bloc-page-title {
  margin: 0;
  color: #123b63;
  font-size: 28px;
  font-weight: 700;
}

.bloc-page-subtitle {
  margin: 6px 0 0 0;
  color: #64748b;
  font-size: 14px;
}


/* ==========================================================
   PATIENT
   ========================================================== */

.bloc-patient-card {
  display: flex;
  align-items: center;
  gap: 16px;

  background: #ffffff;

  border: 1px solid #dbe7f1;
  border-left: 5px solid #1261a0;

  border-radius: 12px;

  padding: 16px 20px;

  margin-bottom: 20px;

  box-shadow: 0 3px 12px rgba(18, 59, 99, 0.06);
}

.bloc-patient-icon {
  width: 48px;
  height: 48px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 10px;

  background: #eaf4fb;

  font-size: 24px;
}

.bloc-patient-label {
  color: #64748b;

  font-size: 12px;
  font-weight: 600;

  text-transform: uppercase;
  letter-spacing: .5px;
}

.bloc-patient-name {
  margin-top: 3px;

  color: #123b63;

  font-size: 19px;
  font-weight: 700;
}


/* ==========================================================
   TABLEAU
   ========================================================== */

.bloc-table-card {
  background: #ffffff;

  border: 1px solid #dbe7f1;

  border-radius: 12px;

  padding: 20px;

  margin-bottom: 20px;

  box-shadow: 0 3px 12px rgba(18, 59, 99, 0.05);
}

.bloc-table-header {
  margin-bottom: 15px;
}

.bloc-table-title {
  margin: 0;

  color: #123b63;

  font-size: 19px;
  font-weight: 650;
}

.bloc-table-description {
  margin: 5px 0 0 0;

  color: #64748b;

  font-size: 13px;
}


/* DataTable */

.bloc-table-card table.dataTable thead th {
  background: #f1f7fb;

  color: #123b63;

  font-weight: 600;

  border-bottom: 1px solid #cddfea;
}

.bloc-table-card table.dataTable tbody tr {
  cursor: pointer;
}

.bloc-table-card table.dataTable tbody tr:hover {
  background: #f4f9fd !important;
}


/* ==========================================================
   ACTIONS
   ========================================================== */

.bloc-actions {
  display: grid;

  grid-template-columns:
    repeat(5, minmax(0, 1fr));

  gap: 12px;

  margin-top: 8px;
}

.bloc-action {
  width: 100%;

  min-height: 48px;

  border-radius: 9px !important;

  font-size: 14px !important;
  font-weight: 600 !important;

  border: 1px solid transparent !important;

  transition:
    transform .15s ease,
    box-shadow .15s ease;
}

.bloc-action:hover {
  transform: translateY(-1px);

  box-shadow: 0 4px 12px rgba(0,0,0,.10);
}


/* Nouveau */

.bloc-action-new {
  background: #16805c !important;
  color: #ffffff !important;

  border-color: #126b4c !important;
}


/* Modifier */

.bloc-action-edit {
  background: #f59e0b !important;
  color: #ffffff !important;

  border-color: #d97706 !important;
}


/* Supprimer */

.bloc-action-delete {
  background: #c62828 !important;
  color: #ffffff !important;

  border-color: #b71c1c !important;
}


/* Dictaphone */

.bloc-action-dictaphone {
  background: #1261a0 !important;
  color: #ffffff !important;

  border-color: #0d4f83 !important;
}


/* Retour */

.bloc-action-back {
  background: #ffffff !important;
  color: #475569 !important;

  border-color: #cbd5e1 !important;
}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 950px) {

  .bloc-actions {
    grid-template-columns:
      repeat(3, minmax(0, 1fr));
  }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 600px) {

  .bloc-container {
    padding: 16px 10px 30px 10px;
  }

  .bloc-page-title {
    font-size: 23px;
  }

  .bloc-page-subtitle {
    font-size: 13px;
  }

  .bloc-patient-card {
    padding: 14px;
  }

  .bloc-patient-name {
    font-size: 16px;
  }

  .bloc-table-card {
    padding: 14px;
  }

  .bloc-actions {
    grid-template-columns: 1fr;
  }

  .bloc-action {
    min-height: 46px;
  }

}

/* ==========================================================
   HISTORIQUE
   ========================================================== */

.history-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px 20px 40px 20px;
}


/* ==========================================================
   HEADER
   ========================================================== */

.history-page-header {
  margin-bottom: 22px;
}

.history-page-title {
  margin: 0;

  color: #123b63;

  font-size: 28px;
  font-weight: 700;
}

.history-page-subtitle {
  margin: 6px 0 0 0;

  color: #64748b;

  font-size: 14px;
}


/* ==========================================================
   CARTE PRINCIPALE
   ========================================================== */

.history-card {
  background: #ffffff;

  border: 1px solid #dbe7f1;

  border-radius: 12px;

  padding: 20px;

  box-shadow: 0 3px 12px rgba(18, 59, 99, 0.05);
}


/* ==========================================================
   ONGLETS
   ========================================================== */

.history-card .nav-tabs {
  border-bottom: 1px solid #dbe7f1;
}

.history-card .nav-tabs > li > a {
  color: #64748b;

  font-weight: 600;

  border: 0;

  padding: 12px 18px;

  transition: all .15s ease;
}

.history-card .nav-tabs > li > a:hover {
  background: #f4f9fd;

  color: #1261a0;
}

.history-card .nav-tabs > li.active > a,
.history-card .nav-tabs > li.active > a:hover {
  color: #1261a0;

  background: #ffffff;

  border: 0;

  border-bottom: 3px solid #1261a0;
}


.history-tab-content {
  padding-top: 18px;
}

.history-tab-description {
  margin-bottom: 15px;

  color: #64748b;

  font-size: 13px;
}


/* ==========================================================
   TABLEAUX
   ========================================================== */

.history-card table.dataTable {
  width: 100% !important;
}

.history-card table.dataTable thead th {
  background: #f1f7fb;

  color: #123b63;

  font-weight: 600;

  border-bottom: 1px solid #cddfea;
}

.history-card table.dataTable tbody tr {
  cursor: pointer;
}

.history-card table.dataTable tbody tr:hover {
  background: #f4f9fd !important;
}


/* ==========================================================
   ACTIONS
   ========================================================== */

.history-actions-card {
  margin-top: 20px;

  background: #ffffff;

  border: 1px solid #dbe7f1;

  border-radius: 12px;

  padding: 20px;

  box-shadow: 0 3px 12px rgba(18, 59, 99, 0.05);
}

.history-actions-title {
  margin: 0 0 15px 0;

  color: #123b63;

  font-size: 18px;
}

.history-actions {
  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 12px;
}

.history-action {
  width: 100%;

  min-height: 48px;

  border-radius: 9px !important;

  font-size: 14px !important;

  font-weight: 600 !important;

  transition:
    transform .15s ease,
    box-shadow .15s ease;
}

.history-action:hover {
  transform: translateY(-1px);

  box-shadow: 0 4px 12px rgba(0,0,0,.10);
}


/* Lecture */

.history-play {
  background: #1261a0 !important;

  border-color: #0d4f83 !important;

  color: #ffffff !important;
}


/* Transcription */

.history-transcription {
  background: #16805c !important;

  border-color: #126b4c !important;

  color: #ffffff !important;
}


/* Compte rendu */

.history-report {
  background: #2563a8 !important;

  border-color: #1d4f86 !important;

  color: #ffffff !important;
}


/* ==========================================================
   LECTEUR AUDIO
   ========================================================== */

.history-player-card {
  margin-top: 20px;

  background: #ffffff;

  border: 1px solid #dbe7f1;

  border-radius: 12px;

  padding: 20px;

  box-shadow: 0 3px 12px rgba(18, 59, 99, 0.05);
}

.history-player-title {
  margin-bottom: 12px;

  color: #123b63;

  font-size: 17px;
  font-weight: 650;
}

.history-player {
  background: #f8fbfd;

  border: 1px solid #e1ebf3;

  border-radius: 9px;

  padding: 15px;
}

.history-player audio {
  width: 100%;
}


/* ==========================================================
   FOOTER
   ========================================================== */

.history-footer {
  margin-top: 20px;
}

.history-back {
  background: #ffffff !important;

  color: #475569 !important;

  border: 1px solid #cbd5e1 !important;

  border-radius: 8px !important;

  padding: 9px 18px !important;

  font-weight: 600 !important;
}

.history-back:hover {
  background: #f1f5f9 !important;
}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 800px) {

  .history-container {
    padding: 20px 15px 35px 15px;
  }

  .history-page-title {
    font-size: 24px;
  }

  .history-actions {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 600px) {

  .history-container {
    padding: 16px 10px 30px 10px;
  }

  .history-page-title {
    font-size: 22px;
  }

  .history-page-subtitle {
    font-size: 13px;
  }

  .history-card,
  .history-actions-card,
  .history-player-card {
    padding: 14px;
  }

  .history-card .nav-tabs > li > a {
    padding: 10px 9px;

    font-size: 13px;
  }

  .history-actions {
    grid-template-columns: 1fr;
  }

  .history-action {
    min-height: 46px;
  }

}

/* ==========================================================
   PARAMÈTRES
   ========================================================== */

.settings-container {
  max-width: 1000px;
  margin: 0 auto;
  padding: 24px 20px 40px 20px;
}


/* ==========================================================
   HEADER
   ========================================================== */

.settings-page-header {
  margin-bottom: 24px;
}

.settings-page-title {
  margin: 0;

  color: #123b63;

  font-size: 28px;
  font-weight: 700;
}

.settings-page-subtitle {
  margin: 6px 0 0 0;

  color: #64748b;

  font-size: 14px;
}


/* ==========================================================
   CARTES
   ========================================================== */

.settings-card {
  background: #ffffff;

  border: 1px solid #dbe7f1;

  border-radius: 12px;

  padding: 22px;

  margin-bottom: 20px;

  box-shadow: 0 3px 12px rgba(18, 59, 99, 0.05);
}


/* ==========================================================
   HEADER DE CARTE
   ========================================================== */

.settings-card-header {
  display: flex;

  align-items: center;

  gap: 15px;

  margin-bottom: 20px;
}

.settings-card-icon {
  width: 48px;
  height: 48px;

  flex-shrink: 0;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 10px;

  background: #eaf4fb;

  font-size: 23px;
}

.settings-ai-icon {
  background: #eef4fb;
}

.settings-mic-icon {
  background: #edf8f4;
}

.settings-card-title {
  margin: 0;

  color: #123b63;

  font-size: 18px;

  font-weight: 650;
}

.settings-card-description {
  margin: 5px 0 0 0;

  color: #64748b;

  font-size: 13px;

  line-height: 1.5;
}


/* ==========================================================
   FORMULAIRES
   ========================================================== */

.settings-form .form-group,
.settings-card > .form-group {
  margin-bottom: 18px;
}

.settings-container .control-label {
  color: #334155;

  font-size: 13px;

  font-weight: 600;
}

.settings-container .form-control {
  min-height: 42px;

  border: 1px solid #cbd5e1;

  border-radius: 7px;

  box-shadow: none;

  transition:
    border-color .15s ease,
    box-shadow .15s ease;
}

.settings-container .form-control:focus {
  border-color: #1261a0;

  box-shadow:
    0 0 0 3px rgba(18, 97, 160, 0.10);
}


/* ==========================================================
   ACTIONS
   ========================================================== */

.settings-actions {
  display: flex;

  gap: 12px;

  margin-top: 8px;
}

.settings-save,
.settings-back {
  min-height: 46px;

  padding: 10px 22px !important;

  border-radius: 8px !important;

  font-size: 14px !important;

  font-weight: 600 !important;
}

.settings-save {
  background: #16805c !important;

  border-color: #126b4c !important;

  color: #ffffff !important;
}

.settings-back {
  background: #ffffff !important;

  border: 1px solid #cbd5e1 !important;

  color: #475569 !important;
}

.settings-save:hover,
.settings-back:hover {
  transform: translateY(-1px);

  box-shadow: 0 4px 10px rgba(0,0,0,.08);
}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 700px) {

  .settings-container {
    padding: 20px 15px 35px 15px;
  }

  .settings-page-title {
    font-size: 24px;
  }

  .settings-card {
    padding: 18px;
  }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 600px) {

  .settings-container {
    padding: 16px 10px 30px 10px;
  }

  .settings-page-title {
    font-size: 22px;
  }

  .settings-card {
    padding: 15px;
  }

  .settings-card-header {
    align-items: flex-start;
  }

  .settings-card-icon {
    width: 42px;
    height: 42px;

    font-size: 20px;
  }

  .settings-card-title {
    font-size: 16px;
  }

  .settings-actions {
    flex-direction: column;
  }

  .settings-save,
  .settings-back {
    width: 100%;
  }

}
/* ==========================================================
   ADMINISTRATION
   ========================================================== */

.admin-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px 20px 40px 20px;
}


/* ==========================================================
   HEADER
   ========================================================== */

.admin-page-header {
  display: flex;

  align-items: flex-start;
  justify-content: space-between;

  gap: 20px;

  margin-bottom: 24px;
}

.admin-page-title {
  margin: 0;

  color: #123b63;

  font-size: 28px;
  font-weight: 700;
}

.admin-page-subtitle {
  margin: 6px 0 0 0;

  color: #64748b;

  font-size: 14px;
}


/* ==========================================================
   RETOUR
   ========================================================== */

.admin-back {
  background: #ffffff !important;

  color: #475569 !important;

  border: 1px solid #cbd5e1 !important;

  border-radius: 8px !important;

  padding: 9px 17px !important;

  font-weight: 600 !important;

  white-space: nowrap;
}

.admin-back:hover {
  background: #f1f5f9 !important;
}


/* ==========================================================
   CARTE ACTIONS
   ========================================================== */

.admin-actions-card,
.admin-table-card {
  background: #ffffff;

  border: 1px solid #dbe7f1;

  border-radius: 12px;

  padding: 22px;

  margin-bottom: 20px;

  box-shadow: 0 3px 12px rgba(18, 59, 99, 0.05);
}


/* ==========================================================
   HEADER CARTE
   ========================================================== */

.admin-card-header {
  display: flex;

  align-items: center;

  gap: 15px;

  margin-bottom: 20px;
}

.admin-card-icon {
  width: 48px;
  height: 48px;

  display: flex;

  align-items: center;
  justify-content: center;

  flex-shrink: 0;

  border-radius: 10px;

  background: #eaf4fb;

  font-size: 23px;
}

.admin-card-title {
  margin: 0;

  color: #123b63;

  font-size: 18px;

  font-weight: 650;
}

.admin-card-description {
  margin: 5px 0 0 0;

  color: #64748b;

  font-size: 13px;
}


/* ==========================================================
   BOUTONS ADMIN
   ========================================================== */

.admin-actions {
  display: grid;

  grid-template-columns:
    repeat(5, minmax(0, 1fr));

  gap: 12px;
}

.admin-action {
  width: 100%;

  min-height: 48px;

  border-radius: 9px !important;

  font-size: 13px !important;

  font-weight: 600 !important;

  border: 1px solid transparent !important;

  transition:
    transform .15s ease,
    box-shadow .15s ease;
}

.admin-action:hover {
  transform: translateY(-1px);

  box-shadow: 0 4px 12px rgba(0,0,0,.10);
}


/* Nouveau médecin */

.admin-new {
  background: #16805c !important;

  border-color: #126b4c !important;

  color: #ffffff !important;
}


/* Modifier */

.admin-edit {
  background: #1261a0 !important;

  border-color: #0d4f83 !important;

  color: #ffffff !important;
}


/* Activer / désactiver */

.admin-toggle {
  background: #f59e0b !important;

  border-color: #d97706 !important;

  color: #ffffff !important;
}


/* Mot de passe */

.admin-password {
  background: #2563a8 !important;

  border-color: #1d4f86 !important;

  color: #ffffff !important;
}


/* Supprimer */

.admin-delete {
  background: #c62828 !important;

  border-color: #b71c1c !important;

  color: #ffffff !important;
}


/* ==========================================================
   TABLEAU
   ========================================================== */

.admin-table-header {
  margin-bottom: 16px;
}

.admin-table-title {
  margin: 0;

  color: #123b63;

  font-size: 19px;

  font-weight: 650;
}

.admin-table-description {
  margin: 5px 0 0 0;

  color: #64748b;

  font-size: 13px;
}

.admin-table-card table.dataTable thead th {
  background: #f1f7fb;

  color: #123b63;

  font-weight: 600;

  border-bottom: 1px solid #cddfea;
}

.admin-table-card table.dataTable tbody tr {
  cursor: pointer;
}

.admin-table-card table.dataTable tbody tr:hover {
  background: #f4f9fd !important;
}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 1000px) {

  .admin-actions {
    grid-template-columns:
      repeat(3, minmax(0, 1fr));
  }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 650px) {

  .admin-container {
    padding: 16px 10px 30px 10px;
  }

  .admin-page-header {
    flex-direction: column;
  }

  .admin-page-title {
    font-size: 23px;
  }

  .admin-page-subtitle {
    font-size: 13px;
  }

  .admin-back {
    width: 100%;
  }

  .admin-actions-card,
  .admin-table-card {
    padding: 15px;
  }

  .admin-actions {
    grid-template-columns: 1fr;
  }

  .admin-action {
    min-height: 46px;
  }

}

/* ==========================================================
   PAGE DE CONNEXION YASSDICTA
   ========================================================== */

.yassdicta-login-page {
  min-height: 100vh;
  background: #f3f8fc;
}


/* Conteneur principal */

.yassdicta-login-wrapper {
  min-height: 100vh;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 30px 20px;
}


/* Carte */

.yassdicta-login-card {
  width: 100%;
  max-width: 450px;

  background: #ffffff;

  border: 1px solid #d9e6f0;
  border-radius: 14px;

  padding: 40px;

  box-shadow: 0 8px 25px rgba(30, 80, 120, 0.10);
}


/* Logo */

.yassdicta-login-logo {
  width: 70px;
  height: 70px;

  margin: 0 auto 15px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: #e7f3fa;

  border-radius: 50%;

  font-size: 32px;
}


/* Nom YassDicta */

.yassdicta-login-title {
  text-align: center;

  margin: 0;

  color: #155a85;

  font-size: 30px;
  font-weight: 700;
}


/* Sous-titre */

.yassdicta-login-subtitle {
  text-align: center;

  margin-top: 6px;

  color: #2879a8;

  font-size: 16px;
  font-weight: 600;
}


/* Description */

.yassdicta-login-description {
  text-align: center;

  margin-top: 8px;

  color: #64748b;

  font-size: 13px;

  line-height: 1.5;
}


/* Titre connexion */

.yassdicta-login-card h2 {
  color: #1e3a5f;

  font-weight: 600;
}


/* Champs */

.yassdicta-login-card .form-control {
  min-height: 44px;

  border: 1px solid #cbd8e3;

  border-radius: 8px;

  box-shadow: none;
}


.yassdicta-login-card .form-control:focus {
  border-color: #2b7db0;

  box-shadow: 0 0 0 3px rgba(43, 125, 176, 0.12);
}


/* Bouton connexion */

.yassdicta-login-button {
  width: 100%;

  min-height: 45px;

  background: #176b9d !important;

  border-color: #176b9d !important;

  border-radius: 8px !important;

  color: #ffffff !important;

  font-weight: 600;
}


.yassdicta-login-button:hover {
  background: #12577f !important;

  border-color: #12577f !important;
}


/* Message */

.yassdicta-login-message {
  color: #b42318;

  text-align: center;

  font-size: 14px;
}


/* Mobile */

@media (max-width: 600px) {

  .yassdicta-login-card {
    padding: 28px 22px;
  }

  .yassdicta-login-title {
    font-size: 26px;
  }

}

/* ==========================================================
   TUTORIEL - LOGIN
   ========================================================== */

.yassdicta-login-tutorial {
  display: flex;
  align-items: center;

  gap: 14px;

  margin-top: 24px;
  padding: 16px;

  background: #f0f7fc;

  border: 1px solid #d7e8f3;

  border-radius: 10px;
}

.yassdicta-tutorial-icon {
  font-size: 26px;
  flex-shrink: 0;
}

.yassdicta-tutorial-content {
  flex: 1;
}

.yassdicta-tutorial-content strong {
  color: #1e4666;
  font-size: 14px;
}

.yassdicta-tutorial-text {
  margin: 4px 0 9px;

  color: #64748b;

  font-size: 13px;
}

.yassdicta-tutorial-button {
  background: #ffffff !important;

  color: #176b9d !important;

  border: 1px solid #2b7db0 !important;

  border-radius: 7px !important;

  padding: 6px 12px !important;

  font-size: 13px !important;
}

.yassdicta-tutorial-button:hover {
  background: #e6f2f9 !important;
}