/* Édition de compte — cartes de la maquette edit_account.html.

   Ces cartes ne sont pas les .card de Bootstrap : fond d'en-tête distinct,
   rayon plus marqué, ombre très diffuse et aucune bordure. Les valeurs
   ci-dessous sont relevées au pixel sur la maquette, pas approchées.

   .contact-box, réutilisée ici pour chaque contact, est déjà définie dans
   accounts.css avec exactement les mêmes valeurs : on ne la redéclare pas. */

.card-custom {
    border: none;
    border-radius: 12px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.03);
    background: #FFFFFF;
    overflow: hidden;
    margin-bottom: 25px;
}

.card-custom-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 25px;
    border-bottom: 1px solid #E4E6EF;
    background-color: #FAFAFC;
}

.card-custom-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--agence-dark);
}

/* Le corps de carte vient de Bootstrap (.card-body) mais sans .card parente :
   Bootstrap ne pose aucun style sur .card-body hors contexte, hormis le
   padding apporté par les utilitaires p-4 du gabarit. Rien à ajouter. */

/* Notes internes : fond crème et liseré ambre, pour que le bloc se distingue
   des champs ordinaires — c'est le seul champ du formulaire que le client ne
   voit jamais. */
.note-interne-box,
.note-interne-box:focus {
    background-color: #FFFDF5;
    border-color: #F6B93B;
}

/* Bandeau de titre de la page, pleine largeur sous la barre du haut. Il sort
   volontairement de .page-content : la maquette le colle au topbar, sans les
   30px de marge du contenu. */
.page-header-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1.5rem;
    background: #FFFFFF;
    border-bottom: 1px solid #E4E6EF;
}

.page-header-bar h3 {
    margin-bottom: 0.25rem;
    font-weight: 700;
    color: var(--agence-dark);
}

.page-header-bar p {
    margin-bottom: 0;
}

/* Les trois interrupteurs d'un contact, alignés sur une seule ligne dans un
   cadre blanc qui les détache du fond gris du bloc contact. */
.contact-switches {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    padding: 0.5rem;
    background: #FFFFFF;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

/* Bootstrap attend l'interrupteur et son libellé dans un seul .form-check.
   Le thème du projet, lui, emboîte le widget dans son propre .form-check à
   l'intérieur de la ligne : on déplace donc le retrait de 2.5em de la ligne
   vers ce .form-check interne, sans quoi les deux retraits s'additionnent et
   l'interrupteur part vers la droite, détaché de son libellé. */
.contact-switches .form-switch {
    padding-left: 0;
}

.contact-switches .form-switch > .form-check {
    min-height: auto;
    margin-bottom: 0;
    padding-left: 2.5em;
}

/* Les libellés ne sont pas repris ici : le thème de formulaire du projet pose
   déjà « small fw-semibold » sur chaque .form-label, soit exactement les
   0.875rem / 600 de la maquette. */

/* Contrôles compacts là où la maquette utilise -sm : blocs contact, lignes de
   liens et sélecteurs de l'équipe référente. */
.account-edit .contact-box .form-control,
.account-edit .contact-box .form-select,
.account-edit .link-row .form-control,
.account-edit .link-row .form-select,
.account-edit .equipe-referente .form-select {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    border-radius: 0.25rem;
}

/* Liens projets : une ligne compacte par lien, sans le cadre gris des blocs
   contact. Les libellés sont portés par les placeholders, et les largeurs
   reprennent les colonnes 4/3/4 de la maquette.

   Les trois champs sont ciblés par nth-of-type sur div : le bouton de
   suppression est un <button>, il ne décale donc pas la numérotation, et il
   est renvoyé en fin de ligne par `order` bien qu'il soit émis en premier — ce
   qui permet au script d'ajout de produire un ordre DOM unique pour les deux
   collections. */
.link-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.link-row .form-label {
    display: none;
}

.link-row > div {
    margin-bottom: 0;
}

.link-row > div:nth-of-type(1) {
    flex: 0 0 33%;
    min-width: 0;
}

.link-row > div:nth-of-type(2) {
    flex: 0 0 25%;
    min-width: 0;
}

.link-row > div:nth-of-type(3) {
    flex: 1 1 auto;
    min-width: 0;
}

.link-row-remove {
    order: 99;
    flex: 0 0 auto;
    margin-left: auto;
}

/* Prestations sous contrat : une case par ligne, l'icône du catalogue devant
   le libellé. */
.prestation-check {
    margin-bottom: 1rem;
}

.prestation-check:last-child {
    margin-bottom: 0;
}

.prestation-check .form-check-label {
    font-size: 0.875rem;
    font-weight: 600;
}

.prestation-check .form-check-label i {
    margin-right: 0.25rem;
}