/*!
 * Atlas — gestionnaire immobilier. Version 1.85.0.
 * Copyright (c) 2026 Systegon. Tous droits reserves.
 *
 * Ce fichier et son contenu sont protégés par le droit d'auteur
 * (code de la propriété intellectuelle, art. L112-2 et L122-6).
 * Leur reproduction, adaptation ou réutilisation, même partielle,
 * est interdite sans autorisation écrite de Systegon.
 *
 * https://atlas.systegon.com — contact-atlas@systegon.com
 */
/* ══════════════════════════════════════════════════════════════════════════
   LE CALCULATEUR DE RÉVISION
   ══════════════════════════════════════════════════════════════════════════

   Celui qui arrive ici a une question chiffrée et veut sa réponse. La page
   est donc bâtie à l'envers d'un article : l'outil en haut, l'explication
   dessous, et le résultat prend la place d'un titre quand il apparaît. */

.calc-zone{padding:8px 0 56px;}

.calc{
  max-width:840px;margin:0 auto;padding:26px 24px;
  border-radius:var(--r-lg,20px);border:var(--filet,1px) solid var(--trait, rgba(255,255,255,.08));
  background:var(--fond-carte, rgba(255,255,255,.02));
}
.calc-champs{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:18px;
  margin-bottom:22px;
}
.calc label{display:flex;flex-direction:column;gap:7px;}
.calc label > span{font-size:14px;font-weight:550;color:var(--encre);}
.calc label > span i{font-style:normal;font-weight:400;color:var(--encre-tenue);}
.calc input,.calc select{
  min-height:46px;padding:0 14px;border-radius:var(--r-sm,11px);
  border:var(--filet,1px) solid var(--trait-vif, rgba(255,255,255,.14));
  background:rgba(0,0,0,.28);color:var(--encre);
  /* 16 px : sous ce seuil, iOS zoome à la saisie (voir base.css). */
  font-family:inherit;font-size:16px;
  font-variant-numeric:tabular-nums;
}
.calc input:focus,.calc select:focus{
  outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-sourd);
}
.calc small{font-size:12.5px;line-height:1.5;color:var(--encre-tenue);}
.calc .bouton{width:100%;justify-content:center;
  background:linear-gradient(140deg, var(--accent-vif), var(--accent));
  color:#08131f;box-shadow:0 6px 26px -8px var(--accent-ombre);}

/* ── LE RÉSULTAT ─────────────────────────────────────────────────────────
   Il doit se lire d'un regard, à distance : c'est le seul chiffre que la
   personne est venue chercher. */
.calc-sortie{
  display:block;max-width:840px;margin:18px auto 0;padding:26px 24px;
  border-radius:var(--r-lg,20px);border:var(--filet,1px) solid var(--accent-sourd);
  background:
    radial-gradient(120% 160% at 0% 0%, color-mix(in srgb, var(--accent) 11%, transparent), transparent 60%),
    var(--fond-carte, rgba(255,255,255,.02));
}
.calc-sortie[hidden]{display:none;}
.calc-refus{border-color:var(--trait-vif);background:var(--fond-carte, rgba(255,255,255,.02));}
.calc-refus p{margin:0;color:var(--encre-douce);font-size:15px;line-height:1.6;}

.calc-resultat{display:flex;flex-direction:column;gap:5px;}
.calc-etiq{font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--accent);}
.calc-resultat strong{
  font-size:clamp(34px,6vw,46px);font-weight:600;letter-spacing:-.03em;
  color:var(--encre);font-variant-numeric:tabular-nums;line-height:1.05;
}
.calc-ecart{font-size:14.5px;color:var(--encre-douce);font-variant-numeric:tabular-nums;}

/* Le délai. La seule partie de l'écran qui puisse annoncer une mauvaise
   nouvelle — et la plus utile de toutes. */
.calc-alerte,.calc-delai{
  margin:18px 0 0;padding:13px 16px;border-radius:var(--r-sm,12px);
  font-size:14px;line-height:1.6;border-left:2px solid currentColor;
}
.calc-alerte{color:#e0a06a;background:color-mix(in srgb, #e0a06a 9%, transparent);}
.calc-delai{color:var(--encre-douce);background:rgba(255,255,255,.03);}
.calc-alerte b,.calc-delai b{font-weight:650;}

/* La preuve du calcul. Un locataire a le droit de vérifier ; lui donner de
   quoi le faire évite la moitié des litiges. */
.calc-preuve{margin-top:20px;padding-top:18px;border-top:var(--filet,1px) solid var(--trait, rgba(255,255,255,.08));}
.calc-preuve b{display:block;margin-bottom:9px;font-size:13.5px;color:var(--encre);}
.calc-preuve code{
  display:block;padding:12px 14px;border-radius:var(--r-sm,10px);
  background:rgba(0,0,0,.32);border:var(--filet,1px) solid var(--trait, rgba(255,255,255,.08));
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13.5px;
  color:var(--accent-vif);overflow-x:auto;
}
.calc-preuve p{margin:11px 0 0;font-size:13.5px;line-height:1.6;color:var(--encre-tenue);}

/* ── LES EMPÊCHEMENTS ────────────────────────────────────────────────────
   Avant les explications : un chiffre juste dans un cas où la révision est
   interdite est pire qu'une absence de réponse. */
.empechements{padding:0 0 66px;}
.emp-grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(252px,1fr));gap:14px;}
.emp{
  padding:20px;border-radius:var(--r-md,15px);
  border:var(--filet,1px) solid var(--trait, rgba(255,255,255,.08));
  background:var(--fond-carte, rgba(255,255,255,.02));
}
.emp b{display:block;margin-bottom:8px;font-size:15px;color:var(--encre);}
.emp p{margin:0 0 10px;font-size:14px;line-height:1.6;color:var(--encre-douce);}
.emp-art{font-size:12.5px;color:var(--encre-tenue);}

/* La formule, mise en évidence dans le corps du guide. */
.formule{
  padding:16px 18px;border-radius:var(--r-sm,12px);
  border-left:2px solid var(--accent);
  background:color-mix(in srgb, var(--accent) 6%, transparent);
  font-size:15px;line-height:1.6;color:var(--encre);
}

/* La table des indices : elle défile seule plutôt que d'élargir la page. */
.table-defilante{overflow-x:auto;margin:18px 0;}
.table-idx{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;}
.table-idx th,.table-idx td{
  padding:10px 14px;text-align:left;font-size:14.5px;
  border-bottom:var(--filet,1px) solid var(--trait, rgba(255,255,255,.08));
}
.table-idx th{font-size:12.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--encre-tenue);}
.table-idx td:last-child{color:var(--accent);font-weight:550;}
.source{font-size:13.5px;color:var(--encre-tenue);}
.source a{color:var(--accent);}

/* Les questions fréquentes, en <details> natif : pas de script pour ouvrir
   et fermer un paragraphe. */
.qr{
  border-bottom:var(--filet,1px) solid var(--trait, rgba(255,255,255,.08));
}
.qr summary{
  cursor:pointer;list-style:none;
  display:flex;align-items:center;min-height:52px;
  font-size:15.5px;font-weight:550;color:var(--encre);
}
.qr summary::-webkit-details-marker{display:none;}
.qr summary::after{content:'+';margin-left:auto;font-size:19px;color:var(--accent);font-weight:400;}
.qr[open] summary::after{content:'−';}
.qr summary:hover{color:var(--accent);}
.qr p{margin:0 0 16px;font-size:14.5px;line-height:1.7;color:var(--encre-douce);}

.apres-calcul{padding:0 0 86px;}

@media (max-width:640px){
  .calc{padding:20px 17px;}
  .calc-sortie{padding:20px 17px;}
  .empechements{padding-bottom:48px;}
  .apres-calcul{padding-bottom:60px;}
}

/* Le choix de l'indice occupe toute la largeur : il commande tout le reste du
   formulaire, y compris ce que la page a le droit d'affirmer sur les délais. */
.calc-large{grid-column:1 / -1;}
.calc-large small{line-height:1.6;}
.calc-large small b{color:var(--encre);font-weight:600;}
.calc-large small span{display:block;margin-top:2px;opacity:.8;}
.calc-large small em{
  display:block;margin-top:7px;font-style:normal;
  padding:9px 12px;border-radius:var(--r-sm,9px);
  color:#e0a06a;background:color-mix(in srgb, #e0a06a 8%, transparent);
}

/* La saisie manuelle des indices, pour l'ICC et pour dépanner quand une
   publication est plus récente que la table. */
.calc-manuel{
  margin-bottom:20px;padding:16px 18px;border-radius:var(--r-md,14px);
  border:1px dashed var(--trait-vif, rgba(255,255,255,.14));
  background:rgba(0,0,0,.16);
}
.calc-manuel[hidden]{display:none;}
.calc-manuel > p{margin:0 0 13px;font-size:13.5px;color:var(--encre-douce);}
.calc-manuel-ligne{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;}