/* ============================================
   MonAidant — Styles principaux
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,wght@0,300;0,400;0,600;1,300;1,400&family=DM+Sans:wght@300;400;500&display=swap');

:root {
  --teal: #2a7d6f; --teal-light: #3a9e8e; --teal-pale: #eef7f5; --teal-mid: #c8e8e3;
  --amber: #e8a435; --amber-pale: #fdf5e6;
  --red: #e05c5c; --red-pale: #fdf0f0;
  --blue: #4a7fb5; --blue-pale: #eef3fa;
  --cream: #fafaf7; --dark: #1a2e2b; --muted: #7a9490; --white: #fff; --border: #deecea;
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'DM Sans',sans-serif; background:var(--cream); color:var(--dark); min-height:100vh; }
a { text-decoration:none; color:inherit; }

/* HEADER */
.site-header { background:linear-gradient(135deg,#1a3530,#0f2420); padding:0.9rem 1.5rem; display:flex; align-items:center; justify-content:space-between; }
.logo { font-family:'Fraunces',serif; font-size:1.3rem; font-weight:400; color:white; }
.logo span { color:#a8dbd4; font-style:italic; }
.header-user { font-size:0.8rem; color:rgba(255,255,255,0.6); display:flex; align-items:center; gap:1rem; }
.header-user strong { color:white; }
.btn-logout { background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.2); color:rgba(255,255,255,0.7); padding:0.3rem 0.8rem; border-radius:6px; font-size:0.75rem; cursor:pointer; font-family:'DM Sans',sans-serif; transition:all 0.2s; }
.btn-logout:hover { background:rgba(255,255,255,0.2); }

/* PROCHE BAR */
.proche-bar { background:white; border-bottom:1px solid var(--border); padding:0.6rem 1.5rem; display:flex; align-items:center; gap:0.7rem; overflow-x:auto; scrollbar-width:none; }
.proche-bar::-webkit-scrollbar { display:none; }
.proche-pill { display:inline-flex; align-items:center; gap:0.4rem; padding:0.35rem 0.9rem; border-radius:20px; border:1.5px solid var(--border); font-size:0.78rem; cursor:pointer; white-space:nowrap; text-decoration:none; color:var(--dark); transition:all 0.2s; }
.proche-pill.active, .proche-pill:hover { background:var(--teal); border-color:var(--teal); color:white; }
.proche-pill.add { background:var(--teal-pale); border:1.5px dashed var(--teal-mid); color:var(--teal); }
.proche-pill.add:hover { background:var(--teal-mid); border-style:solid; }

/* NAV */
.site-nav { background:white; border-bottom:1px solid var(--border); display:flex; overflow-x:auto; scrollbar-width:none; }
.site-nav::-webkit-scrollbar { display:none; }
.nav-link { padding:0.8rem 1.2rem; font-size:0.75rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); white-space:nowrap; border-bottom:2px solid transparent; transition:all 0.2s; display:flex; align-items:center; gap:0.4rem; }
.nav-link:hover { color:var(--teal); }
.nav-link.active { color:var(--teal); border-bottom-color:var(--teal); font-weight:500; }
.nav-link.ai { color:var(--amber); }
.nav-link.ai.active { border-bottom-color:var(--amber); }

/* MAIN */
.main-content { padding:1.5rem; max-width:860px; margin:0 auto; }

/* CARDS */
.card { background:white; border:1px solid var(--border); border-radius:10px; overflow:hidden; margin-bottom:1.2rem; }
.card-header { padding:1rem 1.2rem; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.card-title { font-size:0.85rem; font-weight:500; text-transform:uppercase; letter-spacing:0.06em; }
.card-body { padding:1.2rem; }

/* FORMS */
.form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:0.8rem; }
.form-group { display:flex; flex-direction:column; gap:0.3rem; }
.form-group label { font-size:0.7rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--muted); }
.form-group input, .form-group select, .form-group textarea {
  padding:0.55rem 0.8rem; border:1px solid var(--border); border-radius:6px;
  font-family:'DM Sans',sans-serif; font-size:0.85rem; color:var(--dark); background:white;
  outline:none; transition:border-color 0.2s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:var(--teal); }
.form-group textarea { resize:vertical; min-height:70px; }
.form-full { grid-column:1/-1; }
.form-actions { display:flex; gap:0.6rem; margin-top:0.5rem; }

/* BUTTONS */
.btn { padding:0.55rem 1.1rem; border-radius:6px; font-family:'DM Sans',sans-serif; font-size:0.82rem; cursor:pointer; border:none; transition:opacity 0.2s; font-weight:500; display:inline-flex; align-items:center; gap:0.4rem; }
.btn:hover { opacity:0.85; }
.btn-primary { background:var(--teal); color:white; }
.btn-secondary { background:white; border:1px solid var(--border); color:var(--dark); }
.btn-danger { background:var(--red-pale); color:var(--red); border:1px solid #f5c0c0; }
.btn-sm { padding:0.3rem 0.7rem; font-size:0.75rem; }

/* ALERTS */
.alert { padding:0.8rem 1rem; border-radius:8px; font-size:0.85rem; margin-bottom:1rem; }
.alert-success { background:var(--teal-pale); color:var(--teal); border:1px solid var(--teal-mid); }
.alert-error { background:var(--red-pale); color:var(--red); border:1px solid #f5c0c0; }

/* STAT GRID */
.stat-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:1rem; margin-bottom:1.2rem; }
.stat-card { background:white; border:1px solid var(--border); border-radius:10px; padding:1rem; }
.stat-card.urgent { border-left:3px solid var(--red); }
.stat-card.warn { border-left:3px solid var(--amber); }
.stat-card.ok { border-left:3px solid var(--teal); }
.stat-card .icon { font-size:1.3rem; margin-bottom:0.4rem; }
.stat-card .num { font-family:'Fraunces',serif; font-size:1.8rem; line-height:1; }
.stat-card .lbl { font-size:0.7rem; color:var(--muted); margin-top:0.2rem; letter-spacing:0.04em; }

/* ITEMS LIST */
.item-row { display:flex; align-items:center; gap:1rem; padding:0.85rem 1rem; border-bottom:1px solid #f5faf9; transition:background 0.15s; }
.item-row:last-child { border-bottom:none; }
.item-row:hover { background:var(--teal-pale); }
.item-info { flex:1; }
.item-title { font-size:0.88rem; font-weight:500; }
.item-sub { font-size:0.75rem; color:var(--muted); margin-top:0.15rem; }
.item-actions { display:flex; gap:0.4rem; align-items:center; }

/* BADGES */
.badge { font-size:0.65rem; text-transform:uppercase; letter-spacing:0.08em; padding:0.2rem 0.55rem; border-radius:20px; }
.badge-med { background:var(--blue-pale); color:var(--blue); }
.badge-admin { background:var(--amber-pale); color:#b07a20; }
.badge-perso { background:var(--teal-pale); color:var(--teal); }
.badge-urgent { background:var(--red-pale); color:var(--red); }
.badge-ok { background:var(--teal-pale); color:var(--teal); }
.badge-low { background:var(--amber-pale); color:#b07a20; }
.badge-empty { background:var(--red-pale); color:var(--red); }
.badge-paid { background:#f0f0f0; color:var(--muted); }

/* AUTH PAGES */
.auth-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:2rem; background:linear-gradient(160deg,#eef7f5,var(--cream)); }
.auth-box { background:white; border:1px solid var(--border); border-radius:16px; padding:2.5rem; width:100%; max-width:420px; box-shadow:0 8px 32px rgba(26,46,43,0.08); }
.auth-logo { font-family:'Fraunces',serif; font-size:1.8rem; font-weight:300; text-align:center; margin-bottom:0.3rem; }
.auth-logo span { color:var(--teal); font-style:italic; }
.auth-sub { text-align:center; font-size:0.82rem; color:var(--muted); margin-bottom:2rem; }
.auth-link { text-align:center; font-size:0.82rem; color:var(--muted); margin-top:1.2rem; }
.auth-link a { color:var(--teal); font-weight:500; }

/* SECTION TITLE */
.section-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.2rem; flex-wrap:wrap; gap:0.8rem; }
.section-title { font-family:'Fraunces',serif; font-size:1.5rem; font-weight:300; }
.section-title em { color:var(--teal); font-style:italic; }

/* AI CHAT */
.ai-wrap { background:linear-gradient(160deg,#1a3530,#0f2420); border-radius:12px; overflow:hidden; }
.ai-head { padding:1rem 1.4rem; background:rgba(42,125,111,0.2); border-bottom:1px solid rgba(168,219,212,0.15); display:flex; align-items:center; gap:0.9rem; }
.ai-av { width:38px;height:38px; background:linear-gradient(135deg,#3a9e8e,#2a7d6f); border-radius:10px; display:flex;align-items:center;justify-content:center; font-size:1rem; }
.ai-name { font-family:'Fraunces',serif; font-size:1rem; color:white; }
.ai-status { font-size:0.7rem; color:#a8dbd4; display:flex;align-items:center;gap:0.4rem; }
.pulse { width:6px;height:6px;background:#5cb85c;border-radius:50%;animation:pulse 2s infinite; }
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.4}}
.ai-msgs { padding:1.2rem; min-height:260px; max-height:360px; overflow-y:auto; display:flex; flex-direction:column; gap:0.8rem; }
.msg { display:flex; gap:0.6rem; }
.msg.user { flex-direction:row-reverse; }
.msg-av { width:28px;height:28px; border-radius:7px; display:flex;align-items:center;justify-content:center; font-size:0.8rem; flex-shrink:0; }
.msg.ai .msg-av { background:linear-gradient(135deg,#3a9e8e,#2a7d6f); }
.msg.user .msg-av { background:linear-gradient(135deg,#5a9e8e,#3a7e6e); }
.msg-bubble { max-width:78%; padding:0.7rem 0.9rem; font-size:0.85rem; line-height:1.6; border-radius:10px; }
.msg.ai .msg-bubble { background:rgba(255,255,255,0.07); color:#d4f0ec; border-radius:4px 10px 10px 10px; }
.msg.user .msg-bubble { background:var(--teal); color:white; border-radius:10px 4px 10px 10px; }
.typing { display:none; gap:4px; padding:0.7rem 0.9rem; background:rgba(255,255,255,0.07); border-radius:4px 10px 10px 10px; width:fit-content; }
.typing.show { display:flex; }
.tdot { width:5px;height:5px;background:#3a9e8e;border-radius:50%;animation:tb 1.2s infinite; }
.tdot:nth-child(2){animation-delay:.2s}.tdot:nth-child(3){animation-delay:.4s}
@keyframes tb{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}}
.ai-suggestions { padding:0 1.2rem 0.8rem; display:flex; gap:0.4rem; flex-wrap:wrap; }
.sug-btn { background:rgba(42,125,111,0.2); border:1px solid rgba(168,219,212,0.2); color:#a8dbd4; padding:0.3rem 0.75rem; border-radius:20px; font-size:0.72rem; cursor:pointer; font-family:'DM Sans',sans-serif; transition:all 0.2s; white-space:nowrap; }
.sug-btn:hover { background:rgba(42,125,111,0.4); }
.ai-input-row { padding:0.8rem 1.2rem; border-top:1px solid rgba(168,219,212,0.1); display:flex; gap:0.6rem; }
.ai-input { flex:1; background:rgba(255,255,255,0.07); border:1px solid rgba(168,219,212,0.15); border-radius:8px; padding:0.6rem 0.9rem; color:white; font-family:'DM Sans',sans-serif; font-size:0.84rem; outline:none; }
.ai-input::placeholder { color:rgba(255,255,255,0.25); }
.ai-input:focus { border-color:rgba(42,125,111,0.5); }
.ai-send { background:var(--teal); border:none; width:40px;height:40px; border-radius:8px; color:white; cursor:pointer; font-size:1rem; transition:opacity 0.2s; flex-shrink:0; }
.ai-send:hover { opacity:0.85; }
.ai-send:disabled { opacity:0.35; cursor:not-allowed; }
.ai-footer { text-align:center; padding:0.5rem; font-size:0.65rem; color:rgba(255,255,255,0.2); }

/* RESPONSIVE */
@media(max-width:600px) { .main-content { padding:1rem; } .form-grid { grid-template-columns:1fr; } .stat-grid { grid-template-columns:repeat(2,1fr); } }

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

/* Nav landing page mobile */
@media(max-width: 768px) {
  /* Fix logo nav */
  nav.lp { padding:0.7rem 1rem; }
  .nav-logo-lp { font-size:1.1rem; white-space:nowrap; }
  .nav-links a.lnk { display:none; }
  .nav-links { gap:0.5rem; }
  .nav-links .btn { padding:0.4rem 0.7rem; font-size:0.75rem; }

  /* Hero */
  .hero { padding:5rem 1rem 3rem; }
  .hero h1 { font-size:1.8rem; }
  .hero p { font-size:0.9rem; }
  .hero-form { flex-direction:column; }
  .hero-form input, .hero-form button { width:100%; }
  .hero-btns { flex-direction:column; align-items:center; }
  .hero-btns .btn { width:100%; max-width:300px; justify-content:center; }

  /* Stats bar */
  .stat-bar-inner { grid-template-columns:1fr; gap:1rem; text-align:center; }

  /* Features */
  .feats-section { padding:2.5rem 1rem; }
  .feats { grid-template-columns:1fr; }

  /* FAQ */
  .faq-section { padding:2.5rem 1rem; }

  /* Footer */
  .footer-top { grid-template-columns:1fr; gap:1.5rem; }
  .footer-bottom { flex-direction:column; text-align:center; }
  .footer-legal { justify-content:center; }

  /* Auth */
  .auth-box { padding:1.5rem; }

  /* Header app */
  .site-header { padding:0.7rem 1rem; }
  .header-user span { display:none; }

  /* Proche bar */
  .proche-bar { padding:0.5rem 1rem; }

  /* Stat grid app */
  .stat-grid { grid-template-columns:repeat(2,1fr); }

  /* Admin */
  .admin-header { padding:0.7rem 1rem; }
  .admin-wrap { padding:1rem; }

  /* Compte */
  .form-grid { grid-template-columns:1fr; }

  /* Modal */
  .modal-box { margin:0.5rem; padding:1.2rem; }
}

@media(max-width:400px) {
  .nav-logo-lp { font-size:1rem; }
  .hero h1 { font-size:1.5rem; }
  .stat-grid { grid-template-columns:1fr; }
}