/* Shared contrast and dialog rules. Loaded last, including after Ateliers. */
.chat-body { max-height: 60vh; max-height: 60dvh; overflow-anchor: none; }
.chat-body > * { flex-shrink: 0; }
.chat-body .bubble { overflow-wrap: anywhere; }
.chat-body .bubble.sent { color: #fff; }
.chat-body .bubble time { color: var(--ui-secondary); opacity: 1; }
.chat-body .bubble.sent time { color: #f0ebff; }
.chat-history-more { align-self: center; min-height: 44px; max-width: 100%; font-size: 14px; line-height: 1.4; }
.chat-history-more:disabled { cursor: wait; }
.chat-body:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: -2px; }
@media (min-width: 721px) { .chat-body { max-height: clamp(240px, calc(100dvh - 470px), 560px); } }
.profile-access { padding: 28px 20px; color: var(--text); }
.profile-access h1 { margin: 0 0 12px; font-size: clamp(1.3rem, 5vw, 1.7rem); line-height: 1.3; }
.profile-access p { color: var(--ui-secondary); line-height: 1.6; }
.profile-access .primary-outline { display: inline-flex; align-items: center; margin-top: 12px; text-decoration: none; }
.feed-load-error { display: flex; align-items: center; gap: 16px; padding: 18px; margin: 0 0 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); color: var(--text); }
.feed-load-error > div { flex: 1; min-width: 0; }
.feed-load-error strong { font-size: 16px; line-height: 1.4; }
.feed-load-error p { margin: 6px 0 0; font-size: 14px; line-height: 1.5; color: var(--ui-secondary); }
.feed-load-error button { flex: 0 0 auto; }
@media (max-width: 480px) { .feed-load-error { align-items: flex-start; flex-direction: column; margin: 0 12px 14px; } }
.brand-navigation { position: relative; display: flex; align-items: center; gap: 8px; min-width: 0; }
.site-menu-toggle { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 8px; border: 0; border-radius: 50%; background: transparent; cursor: pointer; outline: none !important; }
.site-menu-icon { display: block; width: 28px; height: 26px; color: var(--text); fill: none; stroke-width: 1.8; stroke-linecap: round; }
.site-menu-toggle:hover, .site-menu-toggle[aria-expanded="true"], body[data-surface="Ateliers"] .site-menu-toggle { background: var(--panel2); }
:root[data-input-mode="keyboard"] .site-menu-toggle:focus-visible { box-shadow: 0 0 0 3px var(--focus-ring); }
.site-menu { position: absolute; z-index: 20; top: calc(100% + 12px); left: 0; width: min(330px, calc(100vw - 24px)); max-height: min(690px, calc(100dvh - 94px)); overflow-y: auto; overscroll-behavior: contain; padding: 8px; border: 1px solid var(--line); border-radius: 18px; background: var(--panel); box-shadow: 0 16px 42px #0005; animation: site-menu-enter .16s ease-out; }
.site-menu-group { display: grid; gap: 2px; }
.site-menu-entry { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 50px; padding: 9px 10px; border: 0; border-radius: 11px; background: transparent; color: var(--text); text-align: left; text-decoration: none; cursor: pointer; }
.site-menu-entry:hover, .site-menu-entry:focus-visible, .site-menu-entry[aria-current="page"] { background: var(--panel2); }
.site-menu-entry > svg { width: 26px; height: 26px; flex: 0 0 26px; fill: none; stroke: var(--ui-link); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.site-menu-entry > span { min-width: 0; }
.site-menu-entry strong, .site-menu-entry small { display: block; }
.site-menu-entry strong { font-size: 16px; font-weight: 600; line-height: 1.4; }
.site-menu-entry small { margin-top: 3px; color: var(--ui-secondary); font-size: 13px; line-height: 1.45; }
.site-menu-chevron { margin-left: auto; color: var(--ui-secondary); font-size: 24px; }
.site-menu-workshops { margin-top: 5px; background: color-mix(in srgb, var(--panel2) 72%, transparent); }
.site-menu-divider { height: 1px; margin: 8px 10px; background: var(--line); }
.site-menu-personal .site-menu-entry { min-height: 46px; }
.site-menu-personal .site-menu-entry > svg { width: 22px; height: 22px; flex-basis: 22px; stroke: var(--ui-secondary); }
.site-menu-signout { color: var(--ui-secondary); }
.help-contact { display: inline-flex; text-decoration: none; }
@keyframes site-menu-enter { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .site-menu { animation: none; } }
[hidden] { display: none !important; }
:root {
  --ui-secondary: #b9c5d6;
  --ui-link: #bda4ff;
  --ui-success-bg: #102b24;
  --ui-success-text: #b2f0d9;
  --ui-success-border: #397c65;
}
:root[data-theme="light"] {
  --muted: #58667d;
  --ui-secondary: #526079;
  --ui-link: #5831bd;
  --ui-success-bg: #eaf7f0;
  --ui-success-text: #14543d;
  --ui-success-border: #8bbca4;
}

/* No square on touch/autofocus; a circular focus indicator for keyboard users. */
:root dialog button[aria-label^="Fermer"] {
  display: inline-grid;
  place-items: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--text);
  box-shadow: none;
  outline: none !important;
  line-height: 1;
  font-size: 1.65rem;
  cursor: pointer;
}
:root dialog button[aria-label^="Fermer"]:hover { background: var(--panel2); }
:root[data-input-mode="keyboard"] dialog button[aria-label^="Fermer"]:focus-visible {
  box-shadow: 0 0 0 3px var(--focus-ring);
}
/* Image viewers intentionally retain a dark surface, regardless of theme. */
:root #profileMediaDialog button[aria-label^="Fermer"],
:root #profileCoverDialog button[aria-label^="Fermer"] { background: #101926; color: #fff; }
dialog .dialog-title { gap: 12px; align-items: flex-start; }
dialog .dialog-title > div, dialog .dialog-title > h2 { min-width: 0; flex: 1; }
:root dialog .dialog-title h2 { font-size: clamp(1.1rem, 4.5vw, 1.35rem); line-height: 1.3; overflow-wrap: anywhere; }
dialog input, dialog textarea, dialog select { max-width: 100%; }
.admin-request-head > div, .admin-request, .admin-report { min-width: 0; }
.admin-request p, .admin-request-head, .admin-report p { overflow-wrap: anywhere; }
.admin-decisions, .admin-report-decisions { flex-wrap: wrap; }
html:has(dialog[open]) { overflow: hidden; }
/* One scrolling surface, not two nested scrollbars around moderation. */
#adminDialog {
  width: min(780px, calc(100vw - 24px));
  max-width: none;
  max-height: calc(100dvh - 24px);
  overflow: hidden;
  border-radius: 18px;
}
#adminDialog .admin-review { width: 100%; max-height: calc(100dvh - 24px); }

/* Exercise content uses paired foreground/background tokens in both themes. */
.correction { background: var(--ui-success-bg); color: var(--ui-success-text); border-color: var(--ui-success-border); }
.exercise-attempt-status { color: var(--ui-secondary); }
.exercise-attempt-form label span { color: var(--text); }
.correction-toggle { color: var(--ui-link); min-height: 44px; text-align: left; }
.gradient-btn { background: linear-gradient(100deg, #2455df, #7040db, #b51aa5); color: #fff; }
:root .feed-tabs button.active { background: linear-gradient(105deg, #2455df, #7040db, #b51aa5); color: #fff; }
.exercise-attempt-panel textarea, .sample-exercise-form textarea {
  background: var(--panel); color: var(--text); border-color: var(--line);
}
.course-cover strong, .talent-visual strong { color: #fff; }
.talent-visual { background: #08111f; }
:root .content-badge.question-badge { background: #16466f; color: #9ed9ff; }
:root .content-badge.solution-badge,
:root .content-badge.verified-badge { background: #113f35; color: #99f0d4; }
:root .content-badge.exercise-badge { background: #493614; color: #ffe099; }
:root .content-badge.talent-badge { background: #4d244e; color: #ffb4f9; }
:root[data-theme="light"] .content-badge.question-badge { background: #e4f1ff; color: #164f80; }
:root[data-theme="light"] .content-badge.solution-badge,
:root[data-theme="light"] .content-badge.verified-badge { background: #e1f5ec; color: #175a43; }
:root[data-theme="light"] .content-badge.exercise-badge { background: #fff2d3; color: #74500b; }
:root[data-theme="light"] .content-badge.talent-badge { background: #fbe5f7; color: #80256c; }
.saved-library-copy p, .discover-member-main em, .admin-empty { color: var(--ui-secondary); }
.connection-empty strong { color: var(--text); }
.discover-member-foot > span, .discover-member-foot > button:not(.follow-author),
.reputation-explain, .origin-question button, .exercise-actions button:last-child:not(:disabled) { color: var(--ui-link); }

:root[data-theme="light"] input::placeholder,
:root[data-theme="light"] textarea::placeholder { color: #5f6f86; opacity: 1; }
:root[data-theme="light"] .eyebrow,
:root[data-theme="light"] .verification-document-link,
:root[data-theme="light"] .verification-proof i,
:root[data-theme="light"] .admin-request-head b,
:root[data-theme="light"] .admin-report-head b { color: var(--ui-link); }
:root[data-theme="light"] .verification-state span,
:root[data-theme="light"] .admin-request-head span,
:root[data-theme="light"] .admin-request small,
:root[data-theme="light"] .admin-request p,
:root[data-theme="light"] .admin-report-meta,
:root[data-theme="light"] .admin-report-excerpt { color: var(--ui-secondary); }
:root[data-theme="light"] .admin-report-details { background: #f0ebfb; color: #483367; }
:root[data-theme="light"] .admin-decisions button { background: #176348; color: #fff; }
:root[data-theme="light"] .admin-decisions button:last-child { background: #8d2949; color: #fff; }
:root[data-theme="light"] .admin-report-decisions button { background: #edf2fa; border-color: #acbbd1; color: #243c62; }
:root[data-theme="light"] .admin-report-decisions button:first-child { background: #fff0f3; border-color: #cf9eac; color: #912844; }
:root[data-theme="light"] .moderation-overview strong { color: var(--ui-link); }
:root[data-theme="light"] .moderation-overview button.active { background: #eee8fc; color: #382061; }
:root[data-theme="light"] .moderation-overview button.active span { color: #54377c; }
:root[data-theme="light"] .admin-settings-entry { background: #f5f1fc; color: var(--text); border-color: #d5c9eb; }
:root[data-theme="light"] .settings-private-note,
:root[data-theme="light"] .settings-private-note span,
:root[data-theme="light"] .verified-profile-mark { color: #176348; }
:root[data-theme="light"] .profile-stats strong,
:root[data-theme="light"] .comment-box button { color: var(--ui-link); }
:root[data-theme="light"] .theme-choice button > span,
:root[data-theme="light"] .settings-links b,
:root[data-theme="light"] .profile-settings-entry > b { color: var(--ui-link); }
:root[data-theme="light"] .mandatory-notifications > span { background: #d2eedf; color: #14543d; }

:root[data-theme="light"] .opportunity,
:root[data-theme="light"] .opportunity-form,
:root[data-theme="light"] .opportunity-proposal { background: #f7f1fc; color: var(--text); border-color: #d7c4e7; }
:root[data-theme="light"] .opportunity span,
:root[data-theme="light"] .opportunity small,
:root[data-theme="light"] .opportunity-proposal span,
:root[data-theme="light"] .opportunity-proposal p,
:root[data-theme="light"] .opportunity-proposal small { color: #66506f; }
:root[data-theme="light"] .opportunity-proposal.accepted { background: var(--ui-success-bg); border-color: var(--ui-success-border); }
:root[data-theme="light"] .opportunity-proposal > b { color: var(--ui-success-text); }
:root[data-theme="light"] .course-rating strong,
:root[data-theme="light"] .rating-stars button.rated,
:root[data-theme="light"] .rating-stars button:hover,
:root[data-theme="light"] .rating-stars button:focus-visible { color: #805000; }
:root[data-theme="light"] .follow-author { color: var(--ui-link); }
:root[data-theme="light"] .follow-author.following { background: #eee8fc; color: #482698; }
:root[data-theme="light"] .report-card textarea { background: #f9fbff; color: var(--text); border-color: #ccd7e6; }
:root[data-theme="light"] .explore-search { background: var(--panel2); color: var(--text); border-color: var(--line); }
:root[data-theme="light"] .explorer-card > p { color: var(--ui-secondary); }
:root[data-theme="light"] .explorer-card label { color: var(--text); }
:root[data-theme="light"] .explorer-card select { background: var(--panel2); color: var(--text); border-color: var(--line); }

/* Native input text must not zoom iOS into a clipped modal. */
@media (max-width: 650px) {
  dialog input, dialog textarea, dialog select,
  .exercise-attempt-form textarea, .sample-exercise-form textarea { font-size: 16px; }
  .admin-request-list { padding-inline: 0; }
  .admin-request-head { flex-wrap: wrap; }
  .admin-decisions button { flex: 1 1 110px; min-height: 44px; }
}
