/* Ideal Files — espace membre (site). Couleurs reprises du template quand il en définit. */
.if-space { --if-accent: var(--bs-primary, #1d5fbf); --if-muted: #6b7280; --if-border: rgba(0, 0, 0, .1); }
/* Page du composant : largeur de lecture ; module et élément YOOtheme : largeur de leur emplacement */
.if-page { max-width: 900px; margin: 0 auto; }
.if-muted { color: var(--if-muted); }
.if-small { font-size: .875rem; }

/* Connexion */
.if-login .if-card { max-width: 460px; margin: 2rem auto; padding: 2rem 1.75rem; border: 1px solid var(--if-border); border-radius: 14px; background: #fff; box-shadow: 0 8px 28px rgba(15, 23, 42, .07); text-align: center; color: #1f2937; }
.if-lock, .if-sent-icon { display: inline-grid; place-items: center; width: 62px; height: 62px; margin-bottom: .75rem; border-radius: 50%; color: var(--if-accent); background: color-mix(in srgb, var(--if-accent) 10%, transparent); }
.if-title { margin: 0 0 .5rem; font-size: 1.45rem; }
.if-intro { margin: 0 0 1.25rem; color: #374151; }
.if-form { display: grid; gap: .55rem; text-align: left; }
.if-label { font-weight: 600; font-size: .95rem; }
.if-input { width: 100%; box-sizing: border-box; padding: .7rem .8rem; font-size: 1rem; border: 1px solid #cbd5e1; border-radius: 8px; }
.if-input:focus { outline: 2px solid var(--if-accent); outline-offset: 1px; border-color: transparent; }
.if-captcha { margin-top: .25rem; }
.if-space .if-button { height: auto; line-height: 1.35; }
.if-button { display: block; width: 100%; box-sizing: border-box; margin-top: .5rem; padding: .75rem 1rem; font-size: 1rem; font-weight: 600; border-radius: 8px; text-align: center; text-decoration: none; }
.if-login .if-card > .if-button { margin-top: 0; }
.if-login .if-card > p.if-muted { margin: 1rem 0 0; }
.if-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.if-sent p { margin: 0 0 .75rem; }

/* Liste des documents */
.if-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .75rem 1.5rem; margin-bottom: 1.5rem; }
.if-head .if-muted { margin: .25rem 0 0; }
.if-h1 { margin: 0; }
.if-logout { margin: 0; }
.if-group { margin-bottom: 2rem; }
.if-group-title { margin: 0 0 .25rem; font-size: 1.25rem; }
.if-group > .if-muted { margin: 0 0 .75rem; }
.if-list { list-style: none; margin: .75rem 0 0; padding: 0; border: 1px solid var(--if-border); border-radius: 12px; overflow: hidden; background: #fff; }
.if-item + .if-item { border-top: 1px solid var(--if-border); }
.if-item { display: flex; align-items: center; gap: .9rem; padding: .85rem 1rem; color: #1f2937; }
.if-item-body { display: flex; flex-direction: column; gap: .1rem; min-width: 0; flex: 1; }
.if-item-title { font-weight: 600; color: #1f2937; overflow-wrap: anywhere; }
.if-item-desc { font-size: .92rem; color: #374151; }
.if-item-meta { font-size: .82rem; color: var(--if-muted); }
.if-actions { flex: none; box-sizing: border-box; display: flex; flex-wrap: wrap; gap: .4rem; justify-content: flex-end; }
.if-btn { display: inline-flex; align-items: center; gap: .35rem; padding: .42rem .8rem; border-radius: 999px; font-size: .88rem; font-weight: 600; line-height: 1.2; text-decoration: none; white-space: nowrap; transition: background .15s, color .15s, border-color .15s; }
.if-btn svg { flex: none; }
.if-btn--view { color: var(--if-accent); border: 1px solid color-mix(in srgb, var(--if-accent) 35%, transparent); background: #fff; }
.if-btn--view:hover, .if-btn--view:focus-visible { background: color-mix(in srgb, var(--if-accent) 8%, #fff); color: var(--if-accent); text-decoration: none; }
.if-btn--download { color: #fff; border: 1px solid var(--if-accent); background: var(--if-accent); }
.if-btn--download:hover, .if-btn--download:focus-visible { color: #fff; background: color-mix(in srgb, var(--if-accent) 85%, #000); text-decoration: none; }
.if-empty { padding: 1.5rem; border: 1px dashed var(--if-border); border-radius: 12px; text-align: center; color: var(--if-muted); }

/* Pastille du type de fichier */
.if-kind { flex: none; display: inline-grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 8px; color: #fff; font: 700 .68rem/1 system-ui, sans-serif; letter-spacing: .02em; background: #6b7280; }
.if-kind::before { content: "FILE"; }
.if-kind--pdf { background: #d93025; } .if-kind--pdf::before { content: "PDF"; }
.if-kind--doc { background: #2b5797; } .if-kind--doc::before { content: "DOC"; }
.if-kind--sheet { background: #1e7145; } .if-kind--sheet::before { content: "XLS"; }
.if-kind--slides { background: #c55a11; } .if-kind--slides::before { content: "PPT"; }
.if-kind--image { background: #7c3aed; } .if-kind--image::before { content: "IMG"; }
.if-kind--zip { background: #8a6d3b; } .if-kind--zip::before { content: "ZIP"; }

/* Module, élément YOOtheme en colonne étroite, mobile */
.if-compact .if-login .if-card, .if-compact.if-login .if-card { margin: 0 auto; padding: 1.25rem 1rem; box-shadow: none; }
.if-space { container-type: inline-size; }
@container (max-width: 520px) {
  .if-item { flex-wrap: wrap; }
  .if-item-body { flex-basis: calc(100% - 3.6rem); }
  .if-actions { width: 100%; justify-content: flex-start; padding-left: 3.5rem; }
}
@container (max-width: 340px) {
  .if-item { padding: .75rem .7rem; gap: .6rem; }
  .if-kind { width: 2.1rem; height: 2.1rem; font-size: .58rem; }
  .if-actions { padding-left: 0; }
  .if-btn { flex: 1 1 auto; justify-content: center; padding: .4rem .6rem; }
}
@media (max-width: 560px) {
  .if-login .if-card { padding: 1.5rem 1.1rem; margin: 1rem auto; }
  .if-item { padding: .75rem .8rem; gap: .7rem; }
  .if-kind { width: 2.2rem; height: 2.2rem; font-size: .6rem; }
}

/* Gestion depuis le site (membres gestionnaires) — 0.4.0 */
.if-head-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.if-tabs { display: flex; gap: .25rem; margin: 0 0 1.25rem; border-bottom: 1px solid var(--if-border); }
.if-tab { padding: .6rem 1rem; margin-bottom: -1px; border: 1px solid transparent; border-radius: 8px 8px 0 0; color: var(--if-muted); font-weight: 600; text-decoration: none; }
.if-tab:hover, .if-tab:focus-visible { color: var(--if-accent); text-decoration: none; }
.if-tab.is-active { color: #1f2937; background: #fff; border-color: var(--if-border); border-bottom-color: #fff; }
.if-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 1rem; }
.if-toolbar .if-group-title { margin: 0; }
.if-filters { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0; }
.if-filters .if-input { width: auto; min-width: 10rem; padding: .45rem .65rem; font-size: .95rem; }
.if-select { background-color: #fff; }
.if-link { font-size: .9rem; }
.if-manage button.if-btn { cursor: pointer; font-family: inherit; }
.if-inline { display: inline; margin: 0; }
.if-btn--danger { color: #b42318; border: 1px solid rgba(180, 35, 24, .35); background: #fff; }
.if-btn--danger:hover, .if-btn--danger:focus-visible { color: #fff; background: #b42318; text-decoration: none; }
.if-item--off .if-item-title, .if-item--off .if-item-desc { color: var(--if-muted); }
.if-item--off .if-kind { opacity: .45; }
.if-badge { display: inline-block; margin-left: .35rem; padding: .1rem .5rem; border-radius: 999px; font-size: .72rem; font-weight: 600; vertical-align: middle; color: #6b7280; background: #f1f5f9; }
.if-badge--on { color: #166534; background: #dcfce7; }
.if-badge--manager { color: var(--if-accent); background: color-mix(in srgb, var(--if-accent) 12%, #fff); }
.if-panel { padding: 1.25rem; border: 1px solid var(--if-border); border-radius: 12px; background: #fff; color: #1f2937; }
.if-panel .if-group-title { margin-bottom: .75rem; }
.if-columns { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
.if-panel--wide { padding: 1.25rem 1.25rem .5rem; }
.if-edit { max-width: 640px; }
.if-edit .if-label { margin-top: .5rem; }
.if-edit .if-small { margin: 0; }
.if-check { display: flex; align-items: center; gap: .5rem; margin-top: .75rem; font-weight: 600; cursor: pointer; }
.if-check input[type=checkbox] { width: 1.15rem; height: 1.15rem; }
.if-form-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
textarea.if-input { resize: vertical; font-family: inherit; }