/* GoalFlow — styles des éléments ajoutés (gf-features.js, passkey-fix.js)
   et petites corrections de l'interface d'origine. Couleurs en variables du
   thème : le mode sombre les redéfinit dans gf-dark.css. */

/* ---- Corrections ---------------------------------------------------------- */

.sidebar-profile{cursor:pointer;transition:background .18s}
.sidebar-profile:hover{background:var(--violet-soft)}
.sidebar-profile>svg{transform:rotate(-90deg)}
.topbar-avatar{cursor:pointer}

/* Le raccourci clavier n'a pas de sens sur un écran tactile. */
@media (hover:none),(max-width:700px){.search-box kbd{display:none}}

.gf-nav-avatar{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--muted);color:var(--surface);font-size:7.5px;font-weight:800;line-height:1;letter-spacing:.02em}
.bottom-nav button.active .gf-nav-avatar{background:var(--violet);color:#fff}

/* ---- Formulaires (compte, étapes, PIN oublié) ----------------------------- */

[data-gf-form][hidden],.gf-form-message[hidden],.gf-steps-error[hidden],.gf-spark[hidden],.gf-spark-empty[hidden]{display:none!important}
.gf-small{min-height:36px;padding:0 13px;box-shadow:none;flex:none}
.gf-pin-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:8px;flex:1 1 100%;margin-top:4px}
@media (max-width:560px){.gf-pin-form{grid-template-columns:1fr 1fr}.gf-pin-form .gf-small{grid-column:span 2}}
.gf-form-message{margin:12px 0 0;padding:9px 11px;border-radius:9px;font-size:10px;line-height:1.5;background:var(--surface-soft);color:var(--ink-soft)}
.gf-form-message.is-ok{background:var(--mint-soft);color:var(--mint)}
.gf-form-message.is-danger{background:var(--coral-soft);color:var(--coral)}

/* ---- Apparence -------------------------------------------------------------- */

.setting-row .gf-segmented{display:inline-grid;grid-auto-flow:column;gap:2px;padding:3px;border-radius:10px;background:var(--surface-soft);border:1px solid var(--line);flex:none}
.gf-segmented button{min-height:30px;padding:0 12px;border-radius:7px;background:transparent;color:var(--ink-soft);font-size:10px;font-weight:700;transition:background .15s,color .15s}
.gf-segmented button[aria-pressed="true"]{background:var(--surface);color:var(--violet);box-shadow:0 1px 3px #2c224c24}

/* ---- Carte « Votre activité » ---------------------------------------------- */

.gf-activity{margin-top:17px;box-shadow:var(--shadow);background:var(--surface);border:1px solid var(--line);border-radius:17px;padding:22px 25px 14px;transition:opacity .2s}
.gf-activity.is-loading{opacity:.55}
.gf-activity-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:12px}
.gf-activity-head h3{margin-top:7px;font-size:15px;font-weight:500;letter-spacing:-.02em}
.gf-activity-head p{margin-top:4px;color:var(--muted);font-size:9px}
.gf-activity-summary{display:grid;justify-items:end;text-align:right;flex:none}
.gf-activity-summary strong{font-size:20px;letter-spacing:-.04em;line-height:1;color:var(--ink)}
.gf-activity-summary span{margin-top:5px;color:var(--muted);font-size:9px}
.gf-chart-wrap{position:relative}
.gf-chart{width:100%;height:128px;border-radius:6px;outline:0}
.gf-chart:focus-visible,.gf-spark:focus-visible{box-shadow:0 0 0 3px #7661dc3d}
.gf-chart svg,.gf-spark svg{display:block;overflow:visible}
.gf-grid{stroke:var(--line);stroke-width:1}
.gf-axis{fill:var(--muted);font-size:9px;font-variant-numeric:tabular-nums}
.gf-bar{fill:var(--violet);transition:opacity .12s}
.gf-bar.is-active{opacity:.7}
.gf-tooltip{position:absolute;z-index:5;pointer-events:none;transform:translate(-50%,-100%);display:grid;gap:2px;padding:7px 10px;border-radius:9px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-strong);white-space:nowrap}
.gf-tooltip strong{color:var(--ink);font-size:12px;letter-spacing:-.01em}
.gf-tooltip span{color:var(--muted);font-size:9px}
.gf-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media (max-width:700px){.gf-activity{margin-top:11px;padding:18px 17px 12px}.gf-activity-head h3{font-size:13px}}

/* ---- Fiche : étapes et historique ------------------------------------------ */

.gf-steps{display:grid;gap:10px;margin:0 0 18px;transition:opacity .15s}
.gf-steps.is-busy{opacity:.65}
.gf-steps-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:11px}
.gf-steps-head strong{color:var(--ink)}
.gf-steps-head span{color:var(--muted);font-size:9px;font-variant-numeric:tabular-nums}
.gf-steps-note{margin:-5px 0 0;color:var(--muted);font-size:9px;line-height:1.5}
.gf-steps-list{display:grid;gap:4px;margin:0;padding:0;list-style:none}
.gf-steps-list:empty{display:none}
.gf-step{display:flex;align-items:center;gap:9px;padding:6px 6px 6px 8px;border-radius:9px;background:var(--surface-soft)}
.gf-check{flex:none;display:grid;place-items:center;width:20px;height:20px;padding:0;border:1.5px solid var(--muted);border-radius:6px;background:var(--surface);color:transparent;transition:background .15s,border-color .15s,color .15s}
.gf-check[aria-pressed="true"]{background:var(--violet);border-color:var(--violet);color:#fff}
.gf-step-title{flex:1;min-width:0;color:var(--ink);font-size:11px;line-height:1.4;overflow-wrap:anywhere}
.gf-step.is-done .gf-step-title{color:var(--muted);text-decoration:line-through}
.gf-step-delete{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:7px;background:transparent;color:var(--muted);font-size:17px;line-height:1}
.gf-step-delete:hover{background:var(--coral-soft);color:var(--coral)}
.gf-step-add{display:flex;gap:8px}
.gf-steps-error{margin:0;color:var(--coral);font-size:9px}
.gf-history{position:relative;display:grid;gap:8px;margin-top:10px}
.gf-spark{height:78px;border-radius:6px;outline:0}
.gf-spark-empty{margin:0;color:var(--muted);font-size:9px;line-height:1.5}
.gf-line{fill:none;stroke:var(--violet);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.gf-area{fill:var(--violet);opacity:.1}
.gf-dot{fill:var(--violet);stroke:var(--surface);stroke-width:2}
.gf-crosshair{stroke:var(--muted);stroke-width:1}
.gf-end-label{fill:var(--ink);font-size:10px;font-weight:700;font-variant-numeric:tabular-nums}

/* ---- Actualiser --------------------------------------------------------------- */

.gf-refresh-trigger.is-spinning{color:var(--violet);pointer-events:none}
.gf-refresh-trigger.is-spinning svg{animation:gf-spin .8s linear infinite}
@keyframes gf-spin{to{transform:rotate(360deg)}}
/* Déjà installée : le bouton « Installer l'app » ne sert plus et libère la place du bouton Actualiser. */
@media (display-mode:standalone){.install-button{display:none!important}}

/* ---- Partage ---------------------------------------------------------------- */

.gf-share-trigger{color:var(--violet)}
.gf-share-sheet{width:min(100%,470px)}
.gf-share-sheet .gf-lead{margin:-12px 0 18px;color:var(--muted);font-size:11px;line-height:1.55}
.gf-share-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.gf-share-grid.has-native{grid-template-columns:repeat(5,minmax(0,1fr))}
.gf-share-card .gf-share-grid{margin-top:16px}
.gf-share-option{display:grid;justify-items:center;gap:7px;min-width:0;padding:10px 2px 8px;border-radius:13px;background:transparent;color:var(--ink-soft);transition:background .15s,transform .12s}
.gf-share-option:hover{background:var(--surface-soft)}
.gf-share-option:active{transform:scale(.94)}
.gf-share-icon{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;color:#fff;box-shadow:0 7px 16px #2c224c24}
.gf-share-label{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;font-weight:700}
.gf-share-option[data-network="whatsapp"] .gf-share-icon{background:#25d366}
.gf-share-option[data-network="facebook"] .gf-share-icon{background:#0866ff}
.gf-share-option[data-network="instagram"] .gf-share-icon{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.gf-share-option[data-network="tiktok"] .gf-share-icon{background:#010101}
.gf-share-option[data-network="tiktok"] svg{filter:drop-shadow(1.4px 1.2px 0 #fe2c55) drop-shadow(-1.2px -1px 0 #25f4ee)}
.gf-share-option[data-network="native"] .gf-share-icon{background:var(--violet-soft);color:var(--violet);box-shadow:none}
.gf-share-link{display:flex;gap:8px;margin-top:16px}
.gf-share-link .gf-input{font-size:11px;color:var(--ink-soft)}
html[data-gf-theme="dark"] .gf-share-option[data-network="tiktok"] .gf-share-icon{box-shadow:inset 0 0 0 1px #ffffff2e}
@media (max-width:700px){
  .gf-share-backdrop{place-items:end stretch;padding:0}
  .gf-share-sheet{width:100%;max-height:92vh;border-radius:20px 20px 0 0;padding-bottom:calc(22px + env(safe-area-inset-bottom,0px));animation:gf-sheet-in .28s var(--ease-out)}
  .gf-share-icon{width:46px;height:46px}
  .gf-share-grid.has-native .gf-share-icon{width:42px;height:42px}
}
@keyframes gf-sheet-in{from{transform:translateY(48px);opacity:.5}to{transform:none;opacity:1}}

/* ---- PIN oublié ------------------------------------------------------------ */

.gf-forgot{display:block;margin:12px auto 0;padding:4px 8px;background:transparent;color:var(--violet);font-size:10px;font-weight:700}
.gf-forgot-modal{width:min(100%,430px)}
.gf-forgot-modal .gf-lead{margin:-12px 0 18px;color:var(--muted);font-size:11px;line-height:1.55}
.gf-link-button{margin-right:auto;padding:0;background:transparent;color:var(--violet);font-size:10px;font-weight:700}