/* TACHE_35_GRAPHISMES_19102026 + THEMES_COULEUR_21102026 — habillage des espaces membres (voir js/cdx_habillage.js).
   Cette feuille n'est jamais retraitée par le script (attribut data-cdx-hab) : ses couleurs sont donc écrites pour chaque thème. */
:root{--cdx-ok:#81C784;--cdx-att:#FFB74D;--cdx-err:#E57373;--cdx-info:#64B5F6;}

/* 4A — icônes au trait du menu latéral */
html.cdx-hab .sb-icon.cdx-ic{display:inline-flex;align-items:center;justify-content:center;color:var(--cdx-accent,#C9A84C);}
html.cdx-hab .sb-icon.cdx-ic svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}

/* 6 — bouton de thème */
.cdx-hab-theme{background:none;border:0.5px solid var(--cdx-accent-bord,rgba(201,168,76,0.45));color:var(--cdx-accent,#C9A84C);width:32px;height:30px;border-radius:15px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;flex-shrink:0;}
.cdx-hab-theme:hover{border-color:var(--cdx-accent,#C9A84C);}
.cdx-hab-theme svg,.cdx-hab-burger svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
html.cdx-clair{color-scheme:light;}
html.cdx-clair img,html.cdx-clair video{color-scheme:normal;}

/* THEMES_COULEUR_21102026 — sélecteur de thème (fenêtre du bouton palette + bloc de Paramètres) */
.cdx-hab-pop{display:none;position:fixed;z-index:100002;width:300px;max-width:calc(100vw - 16px);background:var(--cdx-pop,#1A1008);color:var(--cdx-pop-txt,#F5E9C8);border:1px solid var(--cdx-accent-bord,rgba(201,168,76,.5));border-radius:8px;padding:12px;box-shadow:0 12px 34px rgba(0,0,0,.45);font-family:'Montserrat',sans-serif;}
html.cdx-pop-ouvert .cdx-hab-pop{display:block;}
.cdx-hab-pop .tt,.cdx-hab-bloc .tt{font-size:13px;font-weight:700;color:var(--cdx-accent,#C9A84C);margin-bottom:8px;}
.cdx-hab-pop .nb,.cdx-hab-bloc .nb{font-size:11.5px;opacity:.8;margin-top:8px;}
.cdx-hab-bloc .nb{margin:0 0 10px;}
.cdx-hab-pop .gr,.cdx-hab-bloc .gr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;}
.cdx-hab-bloc .gr{grid-template-columns:repeat(4,minmax(0,1fr));}
.cdx-hab-past{display:flex;align-items:center;gap:8px;background:none;border:1px solid transparent;border-radius:6px;padding:6px;cursor:pointer;color:inherit;font:inherit;font-size:12px;text-align:left;}
.cdx-hab-past:hover{border-color:var(--cdx-accent-bord,rgba(201,168,76,.5));}
.cdx-hab-past.on{border-color:var(--cdx-accent,#C9A84C);box-shadow:inset 0 0 0 1px var(--cdx-accent,#C9A84C);}
.cdx-hab-past .pt{width:26px;height:26px;border-radius:50%;flex-shrink:0;border:1px solid rgba(128,128,128,.45);}
.cdx-hab-past .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cdx-hab-bloc{background:var(--cdx-pop,#1A1008);color:var(--cdx-pop-txt,#F5E9C8);border:1px solid var(--cdx-accent-bord,rgba(201,168,76,.5));border-radius:6px;padding:14px;margin:0 0 1.2rem;font-family:'Montserrat',sans-serif;}
@media (max-width:820px){.cdx-hab-bloc .gr{grid-template-columns:repeat(2,minmax(0,1fr));}}

/* 5A — enregistrement réussi : le bouton passe au vert 1,5 s (le contenu du bouton n'est pas modifié) */
.cdx-hab-rel{position:relative !important;}
.cdx-hab-ok::after{content:attr(data-cdx-ok);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#2E7D32;color:#fff;font-weight:700;border-radius:inherit;z-index:3;pointer-events:none;animation:cdxHabPop .45s ease;white-space:nowrap;overflow:hidden;}
@keyframes cdxHabPop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.06);opacity:1}100%{transform:scale(1)}}
.cdx-hab-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#2E7D32;color:#fff;font-family:'Montserrat',sans-serif;font-size:14px;font-weight:600;padding:10px 20px;border-radius:22px;box-shadow:0 6px 24px rgba(0,0,0,.35);z-index:100000;animation:cdxHabPop .45s ease;transition:opacity .4s;}
.cdx-hab-toast.fin{opacity:0;}

/* 5B — paillettes dorées (grands moments) */
.cdx-hab-fete{position:fixed;inset:0;pointer-events:none;z-index:100001;overflow:hidden;}
.cdx-hab-fete span{position:absolute;top:-14px;width:7px;height:12px;border-radius:1px;animation:cdxHabChute 1.8s ease-in forwards;}
@keyframes cdxHabChute{0%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translateY(105vh) rotate(540deg);opacity:.2}}
@media (prefers-reduced-motion: reduce){ .cdx-hab-ok::after,.cdx-hab-toast{animation:none;} .cdx-hab-fete{display:none;} }

/* 1A — téléphone : menu latéral repliable, mise en page sur une colonne. L'ordinateur ne change pas. */
.cdx-hab-burger,.cdx-hab-voile,.cdx-hab-menu-tete{display:none;}
@media (max-width: 820px){
  html.cdx-hab .topwrap .side-logo{width:auto;padding:0 10px;border-right:none;}
  html.cdx-hab .topwrap .side-logo .nav-name{display:none;}
  html.cdx-hab .tbar{padding:0 8px 0 4px;gap:6px;min-width:0;}
  html.cdx-hab .tbar>div:not(.nav-right){min-width:0;flex:1;overflow:hidden;}
  html.cdx-hab .tb-title{font-size:14px !important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  html.cdx-hab .tb-sub{display:none;}
  html.cdx-hab .tbar .nav-right{gap:6px;flex-shrink:0;}
  html.cdx-hab .tbar .nav-right .nav-btn,html.cdx-hab .tbar .nav-right .nav-pseudo,html.cdx-hab .tbar .nav-right #nav-vip-badge{display:none !important;}
  .cdx-hab-burger{display:inline-flex;align-items:center;justify-content:center;background:none;border:0.5px solid var(--cdx-accent-bord,rgba(201,168,76,0.45));color:var(--cdx-accent,#C9A84C);width:36px;height:34px;border-radius:4px;cursor:pointer;padding:0;flex-shrink:0;}
  .cdx-hab-burger svg{width:20px;height:20px;}
  html.cdx-hab .sidebar2{position:fixed !important;top:0;left:0;bottom:0;width:272px !important;max-width:86vw;z-index:1000;transform:translateX(-105%);transition:transform .25s ease;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-top:.5rem !important;}
  html.cdx-menu-ouvert .sidebar2{transform:none;box-shadow:6px 0 30px rgba(0,0,0,.5);}
  html.cdx-menu-ouvert .cdx-hab-voile{display:block;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:999;}
  html.cdx-menu-ouvert,html.cdx-menu-ouvert body{overflow:hidden;}
  .cdx-hab-menu-tete{display:flex;flex-wrap:wrap;gap:6px;padding:8px 12px 12px;border-bottom:0.5px solid rgba(201,168,76,0.2);margin-bottom:6px;}
  .cdx-hab-menu-tete .nav-btn{font-size:11px !important;padding:8px 10px !important;}
  html.cdx-hab .sb-item{padding:.75rem 1rem !important;}
  html.cdx-hab .sb-lbl{font-size:14px !important;}
  html.cdx-hab .sb-section{font-size:11px !important;padding-top:.9rem !important;}
  html.cdx-hab .layout2{display:block;}
  html.cdx-hab .sec{padding:1rem .75rem !important;}
  html.cdx-hab .stats-row{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  html.cdx-hab .grid2,html.cdx-hab .grid3{grid-template-columns:minmax(0,1fr) !important;}
  html.cdx-hab .photos-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
  html.cdx-hab .prefs-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  html.cdx-hab .field input,html.cdx-hab .field select,html.cdx-hab .field textarea{font-size:16px !important;} /* 16 px : iPhone ne zoome plus à la saisie */
  html.cdx-hab .modal{width:auto !important;max-width:94vw !important;}
  html.cdx-hab .profil-photo-wrap{flex-wrap:wrap;}
  html.cdx-hab .main{min-width:0;}
  html.cdx-hab .conv-top{flex-wrap:wrap;row-gap:6px;}
  html.cdx-hab .conv-top-actions{flex-wrap:wrap;margin-left:0;width:100%;}
  /* COMPLETUDE_PRO_MOBILE_21102026 : les 9 segments de la jauge pro débordaient (545 px pour 390) -> plusieurs lignes */
  html.cdx-hab #completude-list-pro>div{flex-wrap:wrap;row-gap:10px;}
  html.cdx-hab #completude-list-pro>div>div{flex:1 1 28% !important;min-width:0;}
}
