/* Yok-Kod — Profil entreprise : éléments injectés dans les outils (yk-profile.js) + page /mon-profil */

/* ── Dans les outils ── */
.ykp-open { margin-left: auto; display: inline-flex; align-items: center; gap: .3rem; padding: .18rem .65rem; border-radius: 999px; border: 1px solid var(--border); background: var(--panel); color: var(--ink-dim); font: inherit; font-size: .8rem; cursor: pointer; line-height: 1.5; }
.ykp-open:hover, .ykp-open:focus-visible { color: var(--ink); border-color: var(--accent); }
.app-topbar .ykp-open + .badge { margin-left: 0 !important; }
.ykp-bar, .ykp-hint { max-width: 1280px; margin: .6rem auto 0; padding: 0 1rem; box-sizing: border-box; }
.ykp-bar { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem .9rem; }
.ykp-bar { background: linear-gradient(90deg, rgba(124,92,255,.14), rgba(124,92,255,.04)); border: 1px solid rgba(124,92,255,.35); border-radius: var(--radius); padding: .55rem .9rem; width: calc(100% - 2rem); }
.ykp-bar .ykp-ico { font-size: 1.15rem; }
.ykp-bar .ykp-txt { font-size: .9rem; color: var(--ink); flex: 1 1 14rem; min-width: 0; }
.ykp-bar .ykp-acts { display: flex; gap: .4rem; flex-wrap: wrap; }
.ykp-btn { display: inline-flex; align-items: center; justify-content: center; gap: .35rem; padding: .42rem .9rem; border-radius: 999px; border: 1px solid var(--border); background: var(--panel-2, #1b1b29); color: var(--ink); font: inherit; font-size: .84rem; font-weight: 600; cursor: pointer; text-decoration: none; white-space: nowrap; }
.ykp-btn:hover { border-color: var(--accent); color: var(--ink); }
.ykp-btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.ykp-btn.primary:hover { filter: brightness(1.1); color: #fff; }
.ykp-btn.ghost { background: transparent; color: var(--ink-dim); }
.ykp-btn:disabled { opacity: .55; cursor: default; }
.ykp-hint { display: flex; align-items: center; justify-content: space-between; gap: .6rem; font-size: .82rem; }
.ykp-hint a { color: var(--ink-dim); text-decoration: underline; text-underline-offset: 2px; }
.ykp-hint a:hover { color: var(--accent); }
.ykp-x { background: none; border: 0; color: var(--ink-faint); cursor: pointer; font-size: .85rem; padding: .2rem .35rem; border-radius: 4px; }
.ykp-x:hover { color: var(--ink); }
.ykp-pop { position: absolute; z-index: 9000; width: min(320px, calc(100vw - 16px)); box-sizing: border-box; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: .9rem; display: flex; flex-direction: column; gap: .5rem; font-size: .86rem; color: var(--ink); }
.ykp-pop p { margin: 0 0 .2rem; color: var(--ink-dim); line-height: 1.45; }
.ykp-pop .ykp-pop-h strong { color: var(--ink); }
.ykp-pop .ykp-pop-h span { font-size: .8rem; }
.ykp-pop .ykp-btn { width: 100%; white-space: normal; text-align: center; }
.ykp-pop .ykp-link { color: var(--ink-dim); font-size: .82rem; text-align: center; margin-top: .2rem; }
.ykp-pop .ykp-link:hover { color: var(--accent); }
.ykp-toast { position: fixed; left: 50%; bottom: 5.5rem; transform: translate(-50%, 250%); z-index: 10050; display: flex; align-items: center; gap: .7rem; max-width: calc(100vw - 2rem); box-sizing: border-box; background: var(--panel); border: 1px solid var(--accent); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: .6rem .7rem .6rem 1rem; font-size: .88rem; color: var(--ink); transition: transform .25s ease; }
.ykp-toast.show { transform: translate(-50%, 0); }
.ykp-toast span { flex: 1 1 auto; }

/* ── Page profil ── */
.ykp-page { max-width: 980px; margin: 0 auto; padding: 2.2rem 1.25rem 4rem; }
.ykp-page h1 { font-size: 2rem; margin-bottom: .4rem; }
.ykp-lead { color: var(--ink-dim); max-width: 46rem; margin: 0 0 1.2rem; }
.ykp-privacy { display: flex; gap: .7rem; align-items: flex-start; background: rgba(74,217,138,.07); border: 1px solid rgba(74,217,138,.3); border-radius: var(--radius); padding: .8rem 1rem; font-size: .88rem; color: var(--ink); margin-bottom: 1.2rem; }
.ykp-privacy p { margin: 0; }
.ykp-sticky { position: sticky; top: 64px; z-index: 20; background: var(--bg); padding: .7rem 0; margin-bottom: .6rem; border-bottom: 1px solid var(--border-soft); display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; }
.ykp-meter { flex: 1 1 220px; min-width: 0; }
.ykp-meter-top { display: flex; justify-content: space-between; font-size: .82rem; color: var(--ink-dim); margin-bottom: .3rem; gap: .5rem; }
.ykp-meter-top strong { color: var(--ink); }
.ykp-meter-bar { height: 8px; background: var(--panel-2, #1b1b29); border-radius: 999px; overflow: hidden; }
.ykp-meter-bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--accent), var(--success)); border-radius: inherit; transition: width .3s ease; }
.ykp-tools { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.ykp-status { font-size: .8rem; color: var(--ink-faint); min-width: 7rem; }
.ykp-status.ok { color: var(--success); }
.ykp-next { font-size: .8rem; color: var(--ink-faint); margin-top: .3rem; }
.ykp-sec { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.3rem 1.3rem .4rem; margin-bottom: 1rem; }
.ykp-sec h2 { font-size: 1.12rem; margin: 0 0 .25rem; display: flex; align-items: center; gap: .5rem; }
.ykp-sec > p { font-size: .84rem; color: var(--ink-dim); margin: 0 0 1rem; }
.ykp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
.ykp-grid .full { grid-column: 1 / -1; }
.ykp-f { margin-bottom: 1rem; min-width: 0; }
.ykp-f label { display: block; font-size: .84rem; font-weight: 600; color: var(--ink-dim); margin-bottom: .35rem; }
.ykp-f label .req { color: var(--accent); }
.ykp-f .hint { display: block; font-size: .75rem; color: var(--ink-faint); margin-top: .3rem; }
.ykp-f .err { display: block; font-size: .78rem; color: var(--error); margin-top: .3rem; }
.ykp-f .err:empty { display: none; }
.ykp-f.bad input, .ykp-f.bad textarea, .ykp-f.bad select { border-color: var(--error); }
.ykp-f input[type=number] { max-width: 100%; }
.ykp-f textarea { min-height: 5.2rem; resize: vertical; }
.ykp-color { display: flex; gap: .5rem; align-items: center; }
.ykp-color input[type=color] { width: 2.8rem; height: 2.6rem; padding: .15rem; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg); cursor: pointer; flex: 0 0 auto; }
.ykp-color input[type=text] { flex: 1 1 auto; min-width: 0; }
.ykp-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.ykp-chips label { display: inline-flex; align-items: center; gap: .35rem; margin: 0; padding: .4rem .8rem; border: 1px solid var(--border); border-radius: 999px; font-weight: 500; font-size: .84rem; color: var(--ink); cursor: pointer; background: var(--bg); }
.ykp-chips input { accent-color: var(--accent); margin: 0; }
.ykp-chips label:has(input:checked) { border-color: var(--accent); background: rgba(124,92,255,.14); }
.ykp-logo { display: flex; gap: .8rem; align-items: center; flex-wrap: wrap; }
.ykp-logo-prev { width: 72px; height: 72px; border-radius: var(--radius-sm); border: 1px dashed var(--border); display: flex; align-items: center; justify-content: center; background: repeating-conic-gradient(#ffffff10 0 25%, transparent 0 50%) 50% / 16px 16px; color: var(--ink-faint); font-size: .7rem; text-align: center; overflow: hidden; flex: 0 0 auto; }
.ykp-logo-prev img { max-width: 100%; max-height: 100%; object-fit: contain; }
.ykp-logo-acts { display: flex; flex-direction: column; gap: .4rem; flex: 1 1 200px; min-width: 0; }
.ykp-logo-acts .row { display: flex; gap: .4rem; flex-wrap: wrap; }
.ykp-uses { font-size: .84rem; color: var(--ink-dim); }
.ykp-uses ul { display: flex; flex-wrap: wrap; gap: .4rem; list-style: none; padding: 0; margin: .5rem 0 0; }
.ykp-uses a { display: inline-flex; gap: .3rem; padding: .3rem .7rem; border: 1px solid var(--border); border-radius: 999px; color: var(--ink); font-size: .82rem; text-decoration: none; }
.ykp-uses a:hover { border-color: var(--accent); }
.ykp-danger { color: var(--error) !important; }
.ykp-dlg { position: fixed; inset: 0; z-index: 9800; background: rgba(5,5,12,.7); display: flex; align-items: center; justify-content: center; padding: 1rem; }
.ykp-dlg[hidden] { display: none; }
.ykp-dlg-box { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: 1.3rem; width: min(420px, 100%); }
.ykp-dlg-box h3 { margin: 0 0 .5rem; font-size: 1.1rem; }
.ykp-dlg-box p { margin: 0 0 1rem; color: var(--ink-dim); font-size: .9rem; }
.ykp-dlg-acts { display: flex; justify-content: flex-end; gap: .5rem; flex-wrap: wrap; }
.ykp-noscript { padding: 1rem; border: 1px solid var(--warn); border-radius: var(--radius); }
@media (max-width: 700px) {
  .ykp-grid { grid-template-columns: 1fr; }
  .ykp-page { padding: 1.4rem 1rem 3rem; }
  .ykp-page h1 { font-size: 1.6rem; }
  .ykp-sec { padding: 1rem 1rem .2rem; }
  .ykp-sticky { top: 56px; }
  .ykp-bar { width: calc(100% - 2rem); margin-left: 1rem; margin-right: 1rem; }
}
@media (max-width: 700px) { .ykp-sticky { position: static; } }