/* ===========================
   OXILIA — Module Aide à Domicile
   CSS spécifique au module AD + Freemium
   =========================== */

/* ── Layout pages AD ── */
.ad-layout { display: grid; grid-template-columns: 1fr 380px; gap: var(--space-lg); align-items: start; }
.ad-index-layout { display: grid; grid-template-columns: 1fr 380px; gap: var(--space-lg); align-items: start; }
@media(max-width:900px){ .ad-layout, .ad-index-layout { grid-template-columns: 1fr; } }
.ad-main h2 { font-family: var(--font-display); font-size: 1.4rem; color: var(--c-navy); margin: 1.5rem 0 .75rem; }
.ad-main h2:first-child { margin-top: 0; }
.ad-aside { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 80px; }

/* ── Formulaire famille ── */
.frm-famille { background: var(--c-navy); border-radius: var(--radius-lg); padding: 1.5rem; }
.frm-header { margin-bottom: 1.1rem; }
.frm-badge { display: inline-block; background: var(--c-coral); color: #fff; font-size: .73rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: .25rem .75rem; border-radius: 99px; margin-bottom: .6rem; }
.frm-header h3 { font-family: var(--font-display); font-size: 1.2rem; color: #fff; margin-bottom: .3rem; }
.frm-header p { color: rgba(255,255,255,.72); font-size: .85rem; line-height: 1.5; }
.frm-body .frm-group { margin-bottom: .65rem; }
.frm-body label { display: block; font-size: .75rem; font-weight: 600; color: rgba(255,255,255,.65); margin-bottom: .25rem; letter-spacing: .04em; text-transform: uppercase; }
.frm-body input, .frm-body select, .frm-body textarea {
  width: 100%; padding: .6rem .85rem; border-radius: var(--radius-sm);
  border: 1.5px solid rgba(255,255,255,.18); background: rgba(255,255,255,.07);
  color: #fff; font-size: .9rem; font-family: var(--font-body);
}
.frm-body input::placeholder, .frm-body textarea::placeholder { color: rgba(255,255,255,.38); }
.frm-body select option { color: #000; }
.frm-body input:focus, .frm-body select:focus, .frm-body textarea:focus { outline: none; border-color: var(--c-coral-light); background: rgba(255,255,255,.12); }
.frm-body textarea { height: 70px; resize: vertical; }
.frm-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
@media(max-width:500px){ .frm-row-2 { grid-template-columns: 1fr; } }
.frm-trust { font-size: .72rem; color: rgba(255,255,255,.45); text-align: center; margin-top: .6rem; }

/* ── Formulaire auxiliaire ── */
.frm-auxiliaire { background: var(--c-cream); border: 1.5px solid var(--c-border); border-radius: var(--radius-lg); padding: 1.3rem; }
.frm-aux-header { margin-bottom: 1rem; }
.frm-aux-header h3 { font-size: 1.05rem; color: var(--c-navy); margin-bottom: .3rem; }
.frm-aux-header p { font-size: .85rem; color: var(--c-text-light); line-height: 1.5; }
.frm-aux-body .frm-group { margin-bottom: .6rem; }
.frm-aux-body label { display: block; font-size: .75rem; font-weight: 600; color: var(--c-text-light); margin-bottom: .25rem; letter-spacing: .04em; text-transform: uppercase; }
.frm-aux-body input, .frm-aux-body select {
  width: 100%; padding: .6rem .85rem; border-radius: var(--radius-sm);
  border: 1.5px solid var(--c-border); background: #fff; color: var(--c-text); font-size: .9rem;
}
.frm-aux-body input:focus, .frm-aux-body select:focus { outline: none; border-color: var(--c-coral); }
.btn-green { background: #38a169; color: #fff; padding: .75rem 1.5rem; border-radius: var(--radius-md); font-weight: 700; width: 100%; border: none; cursor: pointer; font-size: .95rem; }
.btn-green:hover { background: #276749; }

/* ── Upsell boxes ── */
.upsell-box { display: flex; gap: 12px; align-items: flex-start; background: var(--c-white); border: 1.5px solid var(--c-border); border-radius: var(--radius-md); padding: 1.1rem; }
.upsell-box--employeur { border-left: 4px solid var(--c-coral); }
.upsell-box--apa { border-left: 4px solid #38a169; }
.upsell-icon { font-size: 1.6rem; flex-shrink: 0; }
.upsell-content h4 { font-size: .95rem; color: var(--c-navy); margin-bottom: .3rem; }
.upsell-content p { font-size: .83rem; color: var(--c-text-light); line-height: 1.5; margin-bottom: .5rem; }
.upsell-price { display: flex; align-items: baseline; gap: .5rem; margin-bottom: .6rem; }
.price-main { font-size: 1.3rem; font-weight: 700; color: var(--c-coral); }
.price-sub { font-size: .73rem; color: var(--c-text-light); }
.btn-outline-coral { border: 1.5px solid var(--c-coral); color: var(--c-coral); padding: .4rem .9rem; border-radius: var(--radius-sm); font-weight: 600; font-size: .83rem; display: inline-block; }
.btn-outline-coral:hover { background: var(--c-coral); color: #fff; text-decoration: none; }

/* ── Simulateur crédit d'impôt ── */
.simulateur-box { background: var(--c-white); border: 1.5px solid var(--c-border); border-radius: var(--radius-md); padding: 1.4rem; margin: 1.5rem 0; }
.simulateur-box h3 { font-family: var(--font-display); font-size: 1.1rem; color: var(--c-navy); margin-bottom: .5rem; }
.simulateur-box p { font-size: .88rem; color: var(--c-text-light); margin-bottom: 1rem; }
.sim-inputs { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 1rem; }
.sim-inputs label { font-size: .85rem; color: var(--c-text); font-weight: 500; }
.sim-inputs input { width: 70px; padding: .4rem .6rem; border: 1.5px solid var(--c-border); border-radius: var(--radius-sm); font-size: .9rem; margin-left: 6px; }
.sim-result { display: flex; flex-direction: column; gap: 6px; }
.sim-line { display: flex; justify-content: space-between; padding: .5rem .75rem; background: var(--c-cream); border-radius: var(--radius-sm); font-size: .88rem; }
.sim-line--green { background: #f0fff4; color: #276749; font-weight: 600; }
.sim-line--bold { background: var(--c-coral-pale); font-weight: 700; color: var(--c-navy); font-size: 1rem; }

/* ── Comparateur CESU vs agence ── */
.comparateur-box { background: var(--c-white); border: 1.5px solid var(--c-border); border-radius: var(--radius-md); padding: 1.4rem; margin: 1.5rem 0; }
.comparateur-box h3 { font-family: var(--font-display); font-size: 1.1rem; color: var(--c-navy); margin-bottom: 1rem; }
.comp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media(max-width:600px){ .comp-grid { grid-template-columns: 1fr; } }
.comp-col { border: 1.5px solid var(--c-border); border-radius: var(--radius-sm); padding: 1rem; }
.comp-col--cesu { border-color: var(--c-coral); background: var(--c-coral-pale); }
.comp-col--agence { background: var(--c-cream); }
.comp-header { font-weight: 700; font-size: .9rem; color: var(--c-navy); margin-bottom: .75rem; display: flex; flex-direction: column; gap: 4px; }
.comp-badge { display: inline-block; font-size: .7rem; font-weight: 700; padding: .15rem .55rem; border-radius: 99px; }
.comp-badge--free { background: var(--c-coral); color: #fff; }
.comp-badge--premium { background: var(--c-navy); color: #fff; }
.comp-list { list-style: none; margin: 0 0 .75rem; }
.comp-list li { font-size: .82rem; color: var(--c-text-light); padding: .25rem 0; }
.comp-list li.pro { color: var(--c-text); }
.btn-sm { padding: .4rem .9rem; font-size: .82rem; }

/* ── Sticky bar override pour AD ── */
.sticky-mobile-bar .sticky-wa-btn { background: var(--c-coral); }
