/* ═══════════════════════════════════════════════════════════════════
   Copango Admin — back-office standard responsive
   Style volontairement classique : sidebar, topbar, cartes, listes, formulaires.
   ═══════════════════════════════════════════════════════════════════ */

:root {
  --admin-bg: #f5f7fb;
  --admin-sidebar: #111827;
  --admin-sidebar-soft: #1f2937;
  --admin-sidebar-text: #d1d5db;
  --admin-sidebar-muted: #9ca3af;
  --admin-primary: #16a34a;
  --admin-primary-dark: #15803d;
  --admin-blue: #2563eb;
  --admin-danger: #dc2626;
  --admin-warning: #d97706;
  --admin-ink: #111827;
  --admin-muted: #6b7280;
  --admin-border: #e5e7eb;
  --admin-border-strong: #d1d5db;
  --admin-surface: #ffffff;
  --admin-soft: #f9fafb;
  --admin-radius: 12px;
  --admin-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .10);
}

.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.admin-os,
.admin-os * { box-sizing: border-box; }

.admin-page .footer {
  display: none;
}

.admin-page .navbar {
  box-shadow: 0 1px 2px rgba(16, 24, 40, .06);
}

.admin-page .navbar-links,
.admin-page .navbar-burger {
  display: none !important;
}

.admin-page .navbar .container {
  max-width: none;
  width: 100%;
}

.admin-os {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 272px minmax(0, 1fr);
  gap: 0;
  min-height: calc(100vh - 64px);
  color: var(--admin-ink);
  background: linear-gradient(90deg, var(--admin-sidebar) 0, var(--admin-sidebar) 272px, var(--admin-bg) 272px, var(--admin-bg) 100%);
}

.admin-page .admin-os {
  background: linear-gradient(90deg, var(--admin-sidebar) 0, var(--admin-sidebar) 272px, var(--admin-bg) 272px, var(--admin-bg) 100%);
}

.admin-sidebar {
  position: sticky;
  top: 64px;
  align-self: start;
  height: calc(100vh - 64px);
  overflow-y: auto;
  padding: 1rem .875rem;
  color: var(--admin-sidebar-text);
  background: var(--admin-sidebar);
  border-right: 1px solid rgba(255,255,255,.08);
}

.admin-brand {
  display:flex;
  align-items:center;
  gap:.75rem;
  min-height:48px;
  padding:.55rem .6rem .9rem;
  color:#fff;
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.admin-brand-mark {
  width:36px;
  height:36px;
  border-radius:10px;
  display:inline-grid;
  place-items:center;
  background:var(--admin-primary);
  color:#fff;
  font-weight:800;
}
.admin-brand strong { display:block; font-size:1rem; line-height:1.1; }
.admin-brand small,
.admin-operator small { display:block; color:var(--admin-sidebar-muted); font-size:.75rem; margin-top:.12rem; overflow-wrap:anywhere; }

.admin-profile-card,
.admin-god-card {
  margin:1rem 0;
  padding:.75rem;
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--admin-radius);
  background:var(--admin-sidebar-soft);
}
.admin-god-card p { display:none; }
.admin-god-pill {
  display:inline-flex;
  align-items:center;
  margin-top:.7rem;
  padding:.25rem .55rem;
  border-radius:999px;
  background:rgba(22,163,74,.14);
  color:#bbf7d0;
  border:1px solid rgba(22,163,74,.25);
  font-size:.72rem;
  font-weight:700;
}
.admin-operator { display:flex; gap:.65rem; align-items:center; min-width:0; }
.admin-operator-avatar {
  width:36px;
  height:36px;
  border-radius:50%;
  display:inline-grid;
  place-items:center;
  background:#374151;
  color:#fff;
  font-weight:800;
  flex:0 0 auto;
}
.admin-operator strong { display:block; color:#fff; font-size:.9rem; overflow-wrap:anywhere; }

.admin-nav { padding:.25rem 0 1rem; }
.admin-nav-group {
  margin:1rem .65rem .35rem;
  color:var(--admin-sidebar-muted);
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:800;
}
.admin-nav-link {
  display:flex;
  align-items:center;
  gap:.7rem;
  min-height:40px;
  padding:.58rem .65rem;
  border-radius:10px;
  color:var(--admin-sidebar-text);
  text-decoration:none;
  font-weight:600;
  font-size:.92rem;
  transition:background .15s ease, color .15s ease;
}
.admin-nav-link:hover { background:#1f2937; color:#fff; }
.admin-nav-link.is-active {
  background:#ecfdf5;
  color:#065f46;
}
.admin-nav-icon { width:1.35rem; flex:0 0 1.35rem; display:inline-grid; place-items:center; }

.admin-workspace {
  min-width:0;
  padding:1.25rem;
  background:var(--admin-bg);
}
.admin-topbar {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:1rem;
  padding:1rem 1.1rem;
  border:1px solid var(--admin-border);
  border-radius:var(--admin-radius);
  background:var(--admin-surface);
  box-shadow:var(--admin-shadow);
  margin-bottom:1rem;
}
.admin-title-block { min-width:0; }
.admin-eyebrow {
  color:var(--admin-muted);
  font-size:.76rem;
  letter-spacing:.02em;
  font-weight:700;
  margin-bottom:.3rem;
}
.admin-topbar h1 {
  margin:0;
  color:var(--admin-ink);
  font-size:clamp(1.35rem, 2.4vw, 2rem);
  line-height:1.18;
  font-weight:750;
}
.admin-topbar p {
  margin:.35rem 0 0;
  color:var(--admin-muted);
  max-width:780px;
  line-height:1.5;
}
.admin-topbar-actions {
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:.5rem;
  flex-wrap:wrap;
  min-width:0;
}
.admin-search { min-width:0; }
.admin-search input {
  width: min(320px, 32vw);
  min-width: 210px;
  border-radius:10px;
  border:1px solid var(--admin-border-strong);
  padding:.58rem .75rem;
  color:var(--admin-ink);
  background:#fff;
}
.admin-search input:focus,
.admin-data-row input:focus,
.admin-data-row select:focus,
.admin-data-row textarea:focus {
  outline:2px solid rgba(22,163,74,.22);
  border-color:var(--admin-primary);
}

.admin-content { min-width:0; }
.admin-content > .container,
.admin-content > section > .container { max-width:none !important; width:100% !important; padding-left:0 !important; padding-right:0 !important; }
.admin-content section { padding:0; background:transparent; }

.admin-hero,
.admin-card,
.admin-data-row,
.admin-role-card,
.admin-kpi,
.alert {
  border:1px solid var(--admin-border);
  border-radius:var(--admin-radius);
  background:#fff;
  box-shadow:var(--admin-shadow);
}
.admin-hero { padding:1rem; margin-bottom:1rem; }
.admin-hero h2,
.admin-card h3 { margin:.1rem 0 .4rem; color:var(--admin-ink); }
.admin-hero p,
.admin-card p { color:var(--admin-muted); }

.admin-kpi-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin:1rem 0;
}
.admin-kpi { padding:1rem; }
.admin-kpi strong,
.admin-kpi-value { display:block; font-size:1.55rem; color:var(--admin-ink); font-weight:800; }
.admin-kpi span,
.admin-kpi-label { display:block; margin-top:.25rem; color:var(--admin-muted); font-size:.86rem; }

.admin-data-list { display:grid; gap:.85rem; min-width:0; }
.admin-data-row { padding:1rem; min-width:0; overflow:hidden; }
.admin-row-main { display:grid; grid-template-columns:minmax(210px, .95fr) minmax(0, 2.4fr); gap:1rem; align-items:start; }
.admin-row-title { display:flex; gap:.7rem; align-items:flex-start; min-width:0; }
.admin-row-title strong { display:block; color:var(--admin-ink); }
.admin-row-title small { display:block; color:var(--admin-muted); margin-top:.18rem; overflow-wrap:anywhere; word-break:break-word; }
.admin-row-form { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:.55rem; align-items:start; min-width:0; }
.admin-row-actions { display:flex; justify-content:flex-end; gap:.45rem; flex-wrap:wrap; margin-top:.75rem; padding-top:.75rem; border-top:1px solid var(--admin-border); }

.admin-row-form input,
.admin-row-form select,
.admin-row-form textarea,
.admin-data-row input,
.admin-data-row select,
.admin-data-row textarea {
  width:100%;
  min-width:0;
  border:1px solid var(--admin-border-strong);
  border-radius:10px;
  padding:.56rem .68rem;
  background:#fff;
  color:var(--admin-ink);
  font:inherit;
}
.admin-row-form textarea { min-height:42px; resize:vertical; }
.admin-field-wide,
.admin-field-medium,
.admin-field-small { width:100%; }

.admin-thumb { width:64px; height:52px; object-fit:cover; border-radius:10px; border:1px solid var(--admin-border); background:#f1f5f9; flex:0 0 auto; }
.admin-thumb-placeholder { width:64px; height:52px; display:inline-grid; place-items:center; border-radius:10px; border:1px solid var(--admin-border); background:#f3f4f6; color:var(--admin-muted); flex:0 0 auto; }

.admin-role-permission-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:1rem; align-items:start; }
.admin-save-strip {
  position:sticky;
  top:76px;
  z-index:5;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  flex-wrap:wrap;
  margin-bottom:1rem;
  padding:.8rem 1rem;
  border:1px solid rgba(22,163,74,.28);
  border-radius:var(--admin-radius);
  background:#f0fdf4;
  box-shadow:var(--admin-shadow);
  color:#166534;
  font-weight:700;
}
.admin-role-card { padding:1rem; }
.admin-role-card.is-admin { border-color:rgba(22,163,74,.45); background:#f7fef9; }
.admin-role-card-head { display:flex; justify-content:space-between; gap:.75rem; align-items:flex-start; padding-bottom:.7rem; margin-bottom:.7rem; border-bottom:1px solid var(--admin-border); }
.admin-role-card-head strong { font-size:1rem; color:var(--admin-ink); overflow-wrap:anywhere; }
.admin-role-card-head small { display:block; color:var(--admin-muted); margin-top:.14rem; }
.admin-role-permissions { display:grid; gap:.45rem; }
.admin-role-permission { display:flex; align-items:flex-start; gap:.55rem; padding:.58rem; border:1px solid var(--admin-border); border-radius:10px; background:#f9fafb; }
.admin-role-permission input { margin-top:.2rem; width:auto; }
.admin-role-permission strong { display:block; font-size:.82rem; color:#1f2937; }
.admin-role-permission small { display:block; color:var(--admin-muted); font-size:.7rem; margin-top:.08rem; }
.admin-lock { color:#16a34a; font-weight:800; }

.alert { padding:.85rem 1rem; margin:.75rem 0; }
.alert-success { border-color:rgba(22,163,74,.35); background:#f0fdf4; color:#166534; }
.alert-error { border-color:rgba(220,38,38,.35); background:#fef2f2; color:#991b1b; }

/* Dashboard synthétique */
.admin-overview-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; margin-bottom:1rem; }
.admin-overview-strip > div { padding:1rem; border:1px solid var(--admin-border); border-radius:var(--admin-radius); background:#fff; box-shadow:var(--admin-shadow); }
.admin-overview-strip small { display:block; color:var(--admin-muted); font-weight:700; text-transform:uppercase; font-size:.72rem; letter-spacing:.04em; }
.admin-overview-strip strong { display:block; margin:.25rem 0; color:var(--admin-ink); font-size:1.25rem; }
.admin-overview-strip span { color:var(--admin-muted); font-size:.86rem; }
.admin-alert-line { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.85rem 1rem; margin-bottom:1rem; border:1px solid rgba(217,119,6,.25); border-radius:var(--admin-radius); background:#fffbeb; }
.admin-alert-line > div { display:flex; gap:.45rem; flex-wrap:wrap; }
.admin-section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; margin:1.25rem 0 .75rem; }
.admin-section-heading h2 { margin:0; font-size:1.12rem; color:var(--admin-ink); }
.admin-section-heading p { margin:.2rem 0 0; color:var(--admin-muted); }
.admin-kpi-grid-compact { grid-template-columns:repeat(6,minmax(0,1fr)); }
.admin-dashboard-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin-bottom:1rem; }
.admin-dashboard-grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.admin-card { padding:1rem; }
.admin-card h3 { margin:0 0 .85rem; font-size:1rem; color:var(--admin-ink); }
.admin-empty { margin:0; padding:1rem; border-radius:10px; background:#f9fafb; color:var(--admin-muted); text-align:center; }
.admin-fund-list { display:grid; gap:.6rem; }
.admin-fund-list > div { display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:.55rem 0; border-bottom:1px solid var(--admin-border); }
.admin-fund-list span { display:flex; align-items:center; gap:.5rem; color:var(--admin-muted); }
.admin-fund-list i { width:10px; height:10px; border-radius:3px; display:inline-block; }
.admin-mini-chart { display:flex; align-items:flex-end; gap:2px; height:130px; padding:.5rem; border-radius:10px; background:#f9fafb; overflow-x:auto; }
.admin-mini-chart > div { flex:1; min-width:10px; display:flex; align-items:flex-end; height:100%; }
.admin-mini-chart span { display:block; width:100%; min-height:2px; border-radius:3px 3px 0 0; background:var(--admin-primary); }
.admin-activity-row { display:flex; justify-content:space-between; align-items:center; gap:.75rem; padding:.6rem 0; border-bottom:1px solid var(--admin-border); color:inherit; text-decoration:none; }
.admin-activity-row:last-child { border-bottom:0; }
.admin-activity-row strong { display:block; color:var(--admin-ink); font-size:.9rem; }
.admin-activity-row small { display:block; color:var(--admin-muted); margin-top:.12rem; overflow-wrap:anywhere; }
.admin-activity-row b { color:var(--admin-primary-dark); font-size:.84rem; white-space:nowrap; }

/* Permissions modulaires */
.admin-permission-intro { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; }
.admin-permission-summary { display:flex; gap:.5rem; flex-wrap:wrap; }
.admin-permission-summary span { padding:.55rem .7rem; border-radius:10px; background:#f9fafb; color:var(--admin-muted); }
.admin-permission-summary strong { color:var(--admin-ink); }
.admin-custom-permission-form { display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr 1.4fr auto; gap:.6rem; align-items:end; padding:1rem; margin-bottom:1rem; border:1px solid var(--admin-border); border-radius:var(--admin-radius); background:#fff; box-shadow:var(--admin-shadow); }
.admin-custom-permission-form div strong,
.admin-custom-permission-form div small { display:block; }
.admin-custom-permission-form small { color:var(--admin-muted); }
.admin-custom-permission-form input { width:100%; min-width:0; border:1px solid var(--admin-border-strong); border-radius:10px; padding:.58rem .68rem; }
.admin-permission-modules { display:grid; gap:.85rem; }
.admin-permission-module { border:1px solid var(--admin-border); border-radius:var(--admin-radius); background:#fff; box-shadow:var(--admin-shadow); overflow:hidden; }
.admin-permission-module summary { cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.85rem 1rem; font-weight:800; background:#f9fafb; }
.admin-permission-module summary small { color:var(--admin-muted); font-weight:600; }
.admin-permission-table-wrap { overflow-x:auto; }
.admin-permission-table { min-width:920px; }
.admin-permission-table td:first-child { min-width:260px; white-space:normal; }
.admin-permission-table td strong,
.admin-permission-table td small,
.admin-permission-table td em { display:block; }
.admin-permission-table td small { color:var(--admin-muted); font-size:.72rem; margin-top:.1rem; }
.admin-permission-table td em { color:var(--admin-muted); font-size:.75rem; font-style:normal; margin-top:.18rem; }
.admin-permission-table th:not(:first-child),
.admin-permission-table td:not(:first-child) { text-align:center; min-width:88px; }
.admin-permission-check { display:inline-grid; place-items:center; }
.admin-permission-check input { width:18px; height:18px; accent-color:var(--admin-primary); }
.admin-permission-locked { display:inline-grid; place-items:center; width:24px; height:24px; border-radius:999px; background:#ecfdf5; color:#047857; font-weight:900; }

/* Tables et contenus larges dans l'admin */
.admin-content table { width:100%; border-collapse:collapse; }
.admin-content table th,
.admin-content table td { padding:.7rem; border-bottom:1px solid var(--admin-border); text-align:left; vertical-align:top; }
.admin-content table th { color:#374151; font-size:.78rem; text-transform:uppercase; letter-spacing:.03em; background:#f9fafb; }

@media (max-width: 1200px) {
  .admin-os,
  .admin-page .admin-os {
    grid-template-columns: 236px minmax(0, 1fr);
    background: linear-gradient(90deg, var(--admin-sidebar) 0, var(--admin-sidebar) 236px, var(--admin-bg) 236px, var(--admin-bg) 100%);
  }
  .admin-sidebar { padding:.85rem .65rem; }
  .admin-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .admin-kpi-grid-compact { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .admin-overview-strip,
  .admin-dashboard-grid,
  .admin-dashboard-grid-3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .admin-custom-permission-form { grid-template-columns:1fr 1fr; }
  .admin-row-main { grid-template-columns:1fr; }
  .admin-row-actions { justify-content:flex-start; }
}

@media (max-width: 900px) {
  .admin-os,
  .admin-page .admin-os { grid-template-columns:1fr; min-height:auto; background:var(--admin-bg); }
  .admin-sidebar {
    position:relative;
    top:auto;
    height:auto;
    padding:.8rem;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .admin-brand { border-bottom:0; padding:.35rem .4rem .6rem; }
  .admin-profile-card { display:none; }
  .admin-nav {
    display:flex;
    gap:.45rem;
    overflow-x:auto;
    padding:.25rem .1rem .55rem;
    scrollbar-width:thin;
  }
  .admin-nav-group { display:none; }
  .admin-nav-link { flex:0 0 auto; min-height:38px; white-space:nowrap; background:#1f2937; }
  .admin-nav-link.is-active { background:#ecfdf5; color:#065f46; }
  .admin-workspace { padding:1rem; }
  .admin-topbar { flex-direction:column; align-items:stretch; }
  .admin-topbar-actions { justify-content:flex-start; }
  .admin-search input { width:100%; min-width:0; }
}

@media (max-width: 640px) {
  .admin-workspace { padding:.75rem; }
  .admin-topbar,
  .admin-hero,
  .admin-data-row,
  .admin-role-card,
  .admin-kpi { border-radius:10px; }
  .admin-topbar-actions,
  .admin-row-actions { flex-direction:column; align-items:stretch; }
  .admin-topbar-actions > *,
  .admin-row-actions > * { width:100%; justify-content:center; text-align:center; }
  .admin-kpi-grid,
  .admin-kpi-grid-compact,
  .admin-role-permission-grid,
  .admin-overview-strip,
  .admin-dashboard-grid,
  .admin-dashboard-grid-3,
  .admin-custom-permission-form { grid-template-columns:1fr; }
  .admin-row-form { grid-template-columns:1fr; }
  .admin-row-title { flex-direction:column; }
  .admin-thumb,
  .admin-thumb-placeholder { width:100%; height:120px; }
  .admin-save-strip { position:static; }
  .admin-content table { display:block; overflow-x:auto; white-space:nowrap; }
}

@media (max-width: 420px) {
  .admin-brand strong { font-size:.95rem; }
  .admin-topbar h1 { font-size:1.25rem; }
  .admin-nav-link { font-size:.84rem; padding:.5rem .58rem; }
}
