/* ── AlgoVista — Mon Profil ── */
#osm-profile-page {
  font-family: 'DM Sans', sans-serif;
  max-width: 860px;
  margin: 0 auto;
  padding: 32px 20px;
}

#osm-profile-page .osm-page-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(24px, 3vw, 36px);
  font-weight: 600;
  color: #ffffff;
  letter-spacing: -0.02em;
  margin-bottom: 28px;
}

/* ── Onglets (buttons Joomla T4) ── */
#osm-profile-page .joomla-tab button,
#osm-profile-page button[role="region"],
#osm-profile-page [role="tablist"] button {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  box-shadow: none !important;
  color: #5e7388 !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  padding: 10px 18px !important;
  border-radius: 0 !important;
}
#osm-profile-page [role="tablist"] button[aria-expanded="true"],
#osm-profile-page [role="tablist"] button.active {
  color: #22a861 !important;
  border-bottom: 2px solid #22a861 !important;
  background: transparent !important;
}

/* ── Labels ── */
#osm-profile-page label,
#osm-profile-page .col-md-3,
#osm-profile-page .control-label {
  color: #5e7388 !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
}

/* ── Valeurs texte (non-input) ── */
#osm-profile-page .col-md-9 > span,
#osm-profile-page .eb-form-control {
  color: #0f1e2e !important;
  font-size: 14px !important;
}

/* ── Champs ── */
#osm-profile-page input[type="text"],
#osm-profile-page input[type="email"],
#osm-profile-page input[type="password"],
#osm-profile-page .form-control,
#osm-profile-page select,
#osm-profile-page textarea {
  background: #f7f8fa !important;
  border: 1px solid rgba(15,30,46,0.15) !important;
  color: #0f1e2e !important;
  border-radius: 0 !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 14px !important;
}

/* ── Checkboxes / Radios labels ── */
#osm-profile-page .osm-checkboxes-contaier label,
#osm-profile-page .osm-renew-option label,
#osm-profile-page ul li label,
#osm-profile-page .osm-renew-options label {
  color: #0f1e2e !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
#osm-profile-page input[type="checkbox"],
#osm-profile-page input[type="radio"] {
  accent-color: #22a861;
}

/* ── Bouton Mettre à jour ── */
#osm-profile-page input[type="submit"],
#osm-profile-page #osm-btn-update-profile {
  background: #22a861 !important;
  border: none !important;
  color: #fff !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  padding: 12px 28px !important;
  border-radius: 0 !important;
  cursor: pointer !important;
}
#osm-profile-page #osm-btn-logout {
  background: transparent !important;
  border: 1px solid rgba(15,30,46,0.2) !important;
  color: #5e7388 !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  padding: 12px 24px !important;
  border-radius: 0 !important;
}

/* ── Bouton Annuler abonnement ── */
#osm-profile-page .osm-btn-cancel-subscription,
#osm-profile-page .btn-danger {
  background: transparent !important;
  border: 1px solid #b91c1c !important;
  color: #b91c1c !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  padding: 8px 16px !important;
  border-radius: 0 !important;
}

/* ── Bouton Renouveler ── */
#osm-profile-page .btn-primary:not(#osm-btn-update-profile):not(#osm-btn-logout) {
  background: #2563b0 !important;
  border: none !important;
  color: #fff !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  padding: 10px 22px !important;
  border-radius: 0 !important;
}

/* ── Table abonnements ── */
#osm-profile-page table {
  width: 100%;
  border-collapse: collapse;
}
#osm-profile-page table th {
  font-family: 'DM Mono', monospace !important;
  font-size: 9px !important;
  letter-spacing: 0.25em !important;
  text-transform: uppercase !important;
  color: #5e7388 !important;
  background: #f7f8fa !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid rgba(15,30,46,0.1) !important;
  font-weight: 400 !important;
}
#osm-profile-page table td {
  padding: 14px 16px !important;
  border-bottom: 1px solid rgba(15,30,46,0.06) !important;
  font-size: 13px !important;
  color: #0f1e2e !important;
  background: #fff !important;
}

/* ── Section Renouveler/Titre ── */
#osm-profile-page .osm-form-heading {
  font-family: 'Playfair Display', serif !important;
  font-size: 20px !important;
  color: #ffffff !important;
  margin: 32px 0 16px !important;
}

/* ── Texte section renouveler ── */
#osm-profile-page .osm-renew-options,
#osm-profile-page .osm-renew-option {
  color: #0f1e2e !important;
  font-size: 13px !important;
}

/* ── Section Renouveler — fond dark, texte clair ── */
#osm-profile-page .osm-renew-option label,
#osm-profile-page .osm-renew-options label,
#osm-profile-page ul.osm-renew-options li label {
  color: #e2e8f0 !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

#osm-profile-page .osm-form-heading {
  color: #ffffff !important;
}

#osm-profile-page form#osm_form_renew p,
#osm-profile-page form#osm_form_renew span,
#osm-profile-page form#osm_form_renew div {
  color: #e2e8f0 !important;
}

/* ── Fix responsive table ── */
#osm-profile-page table {
  display: block !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  width: 100% !important;
}

#osm-profile-page table thead,
#osm-profile-page table tbody,
#osm-profile-page table tr {
  width: 100% !important;
}

#osm-profile-page table th,
#osm-profile-page table td {
  white-space: nowrap !important;
  min-width: 80px !important;
}

/* ── Fix couleur table striped T4 ── */
#osm-profile-page .table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: #f7f8fa !important;
  color: #0f1e2e !important;
}
#osm-profile-page .table-striped > tbody > tr:nth-of-type(even) > * {
  background-color: #ffffff !important;
  color: #0f1e2e !important;
}
#osm-profile-page .table-bordered > :not(caption) > * > * {
  border-color: rgba(15,30,46,0.08) !important;
}

/* ── Fix select dropdown T4 ── */
#osm-profile-page select.form-select,
#osm-profile-page .form-select {
  background-color: #f7f8fa !important;
  border: 1px solid rgba(15,30,46,0.15) !important;
  color: #0f1e2e !important;
  border-radius: 0 !important;
  background-image: none !important;
}

/* ── Fix onglets mobile ── */
@media (max-width: 680px) {
  #osm-profile-page [role="tablist"] {
    flex-direction: column !important;
    gap: 0 !important;
  }
  #osm-profile-page [role="tablist"] button {
    text-align: left !important;
    border-bottom: 1px solid rgba(255,255,255,0.08) !important;
    border-left: 2px solid transparent !important;
  }
  #osm-profile-page [role="tablist"] button[aria-expanded="true"] {
    border-left: 2px solid #22a861 !important;
    border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  }
}
/* ── Fix select T4 variables ── */
#osm-profile-page select,
#osm-profile-page .form-select,
#osm-profile-page select.validate {
  --body-bg-color: #f7f8fa !important;
  --tpl-base-200: #f7f8fa !important;
  --headings-color: #0f1e2e !important;
  background-color: #f7f8fa !important;
  background-image: none !important;
  color: #0f1e2e !important;
  border: 1px solid rgba(15,30,46,0.15) !important;
  border-radius: 0 !important;
  padding: 10px 14px !important;
}

/* ── Fix titre desktop ── */
#osm-profile-page .osm-page-title {
  color: #0f1e2e !important;
}

/* ── Fix conteneur blanc formulaire ── */
#osm-profile-page .joomla-tab,
#osm-profile-page form#osm_form {
  background: #ffffff !important;
  padding: 24px !important;
  border: 1px solid rgba(15,30,46,0.08) !important;
}

/* ── Fix textes desktop dans formulaire blanc ── */
#osm-profile-page .joomla-tab label,
#osm-profile-page .joomla-tab .col-md-3 {
  color: #5e7388 !important;
}
#osm-profile-page .joomla-tab .eb-form-control,
#osm-profile-page .joomla-tab span {
  color: #0f1e2e !important;
}