/* =========================================================
   Judo Certificats — Styles application
   ========================================================= */

:root {
  --judo-navy: #0f2140;
  --judo-navy-2: #16315c;
  --judo-gold: #c9a227;
  --judo-gold-2: #e7c75a;
  --judo-bg: #f4f6fb;
  --judo-ink: #1c2b45;
}

html, body { height: 100%; }

body {
  background: var(--judo-bg);
  color: var(--judo-ink);
  font-family: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ---------- Coque générale ---------- */
.app-shell { min-height: 100vh; display: flex; flex-direction: column; }
@media (min-width: 992px) {
  .app-shell { flex-direction: row; }
}

.app-sidebar {
  width: 240px;
  background: linear-gradient(180deg, var(--judo-navy) 0%, var(--judo-navy-2) 100%);
  color: #dfe8f7;
  position: sticky;
  top: 0;
  height: 100vh;
  flex-shrink: 0;
}

.app-brand {
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.brand-mark {
  width: 40px; height: 40px;
  background: var(--judo-gold);
  color: var(--judo-navy);
  font-weight: 800;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 10px;
  font-size: 1rem;
}
.brand-text { color:#fff; line-height:1.15; }
.brand-text small { display:block; font-size:.68rem; color:#aebdd8; }

.app-nav { display:flex; flex-direction:column; gap:2px; }
.app-nav-item {
  display:flex; align-items:center; gap:.6rem;
  color:#c7d4ea; text-decoration:none;
  padding:.55rem .8rem; border-radius:.5rem;
  font-size:.92rem;
  transition: background .15s, color .15s;
}
.app-nav-item i { font-size:1.05rem; width:1.2rem; text-align:center; }
.app-nav-item:hover { background:rgba(255,255,255,.08); color:#fff; }
.app-nav-item.active { background:var(--judo-gold); color:var(--judo-navy); font-weight:600; }
.app-sidebar-footer { border-top:1px solid rgba(255,255,255,.08); }

/* ---------- Tête mobile ---------- */
.app-mobile-header {
  background: var(--judo-navy);
  color:#fff;
  display:flex; align-items:center; gap:.5rem;
  padding:.5rem .75rem;
}

/* ---------- Contenu ---------- */
.app-main { flex:1; min-width:0; }

.page-title { font-size:1.4rem; font-weight:700; color:var(--judo-navy); }

/* ---------- Cartes ---------- */
.card { border:0; box-shadow:0 1px 3px rgba(16,35,70,.08); border-radius:.8rem; }
.card-header { background:#fff; border-bottom:1px solid #eef1f7; font-weight:600; }

.stat-card .bi {
  font-size:1.7rem;
  background:linear-gradient(135deg, var(--judo-navy), var(--judo-navy-2));
  color:#fff; border-radius:.9rem;
  width:52px; height:52px;
  display:flex; align-items:center; justify-content:center;
}
.stat-card .stat-value { font-size:1.6rem; font-weight:800; color:var(--judo-navy); }
.stat-card .stat-label { color:#66758f; font-size:.85rem; }

/* ---------- Tables ---------- */
.table thead th {
  font-size:.78rem; text-transform:uppercase; letter-spacing:.03em;
  color:#5a6a86; border-top:0;
}
.table tbody td { vertical-align:middle; }

.thumb {
  width:54px; height:54px; object-fit:contain;
  background:#fff; border:1px solid #e3e8f1; border-radius:.5rem; padding:3px;
}

/* ---------- Boutons ---------- */
.btn-judo {
  background:var(--judo-navy); color:#fff; border:0;
}
.btn-judo:hover { background:var(--judo-navy-2); color:#fff; }
.btn-gold { background:var(--judo-gold); color:#fff; border:0; }
.btn-gold:hover { background:var(--judo-gold-2); color:#fff; }

/* ---------- Aperçu certificat (aperçu CSS) ---------- */
.cert-img { max-width: 100%; height: auto; }
@media (min-width: 992px) {
  .cert-img { max-width: 520px; }
}
.cert-frame {
  background:#fff; border:1px solid #dfe5ef; border-radius:.6rem;
  overflow:auto; padding:1rem;
}
.cert-canvas {
  position:relative; margin:0 auto;
  width:100%; max-width: 340px;
  background:var(--bg-url, none) center/100% 100% no-repeat;
  aspect-ratio: 1113 / 1413;
  box-shadow:0 4px 18px rgba(16,35,70,.18);
}
.cert-el {
  position:absolute; white-space:pre-wrap;
}
.cert-el.is-hidden { display:none; }

/* ---------- Pagination ---------- */
.pagination .page-link { color:var(--judo-navy); }
.pagination .page-item.active .page-link { background:var(--judo-navy); border-color:var(--judo-navy); }

/* ---------- Recherche / filtres ---------- */
.filter-bar { background:#fff; border:1px solid #e8edf6; border-radius:.8rem; padding:.8rem 1rem; }

/* ---------- Tableaux empilés (mobile) ---------- */
@media (max-width: 767.98px) {
  .table-stack, .table-stack tbody, .table-stack tr, .table-stack td { display: block; width: 100%; }
  .table-stack thead { display: none; }
  .table-stack tr {
    border: 1px solid #e3e8f1; border-radius: .6rem; margin-bottom: .6rem;
    background: #fff; padding: .4rem .6rem;
  }
  .table-stack td { border: 0; padding: .28rem .4rem; }
  .table-stack td::before {
    content: attr(data-label);
    display: inline-block; font-size: .68rem; font-weight: 600; color: #5a6a86;
    text-transform: uppercase; letter-spacing: .03em; margin-right: .45rem;
  }
  .table-stack td[data-label=""]::before { display: none; }
  .table-stack td.td-actions { display: flex; flex-wrap: wrap; gap: .3rem; padding-top: .5rem; }
}

/* ---------- Page impression ---------- */
@media print {
  .no-print { display:none !important; }
  body { background:#fff; }
}

/* ---------- Aides ---------- */
.text-gold { color:var(--judo-gold); }
.bg-navy { background:var(--judo-navy); }
.install-body { background:linear-gradient(135deg, #10234d, #1d3a70); min-height:100vh; }

/* ---------- Bouton thème ---------- */
.theme-toggle { border:0; background:transparent; cursor:pointer; text-align:left; }

/* =========================================================
   Thème sombre
   ========================================================= */
[data-theme="dark"] {
  --judo-bg: #0b1220;
  --judo-ink: #e6ecf7;
  --bs-body-bg: #0b1220;
  --bs-body-color: #e6ecf7;
  --bs-body-color-rgb: 230, 236, 247;
  --bs-body-bg-rgb: 11, 18, 32;
  --bs-secondary-color: #94a3bd;
  --bs-border-color: #2a3854;
  --bs-emphasis-color: #fff;
  --bs-link-color: #7fb0ff;
  --bs-link-hover-color: #a8c8ff;
}

[data-theme="dark"] body {
  background: var(--judo-bg);
  color: var(--judo-ink);
}

[data-theme="dark"] .page-title { color: #e6ecf7; }

[data-theme="dark"] .card {
  background: #151e33;
  box-shadow: 0 1px 3px rgba(0,0,0,.35);
}
[data-theme="dark"] .card-header {
  background: #18243d;
  border-bottom-color: #263352;
  color: #e6ecf7;
}

[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select {
  background-color: #101a2e;
  border-color: #2a3854;
  color: #e6ecf7;
}
[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus {
  background-color: #101a2e;
  color: #e6ecf7;
  border-color: #c9a227;
  box-shadow: 0 0 0 .25rem rgba(201,162,39,.2);
}
[data-theme="dark"] .form-control:disabled,
[data-theme="dark"] .form-control[readonly] {
  background-color: #18243d;
  color: #8ea0bf;
}
[data-theme="dark"] .form-control::placeholder { color: #64748b; }
[data-theme="dark"] .input-group-text {
  background-color: #18243d;
  border-color: #2a3854;
  color: #e6ecf7;
}
[data-theme="dark"] .form-label { color: #cbd5e6; }

[data-theme="dark"] .table {
  --bs-table-color: #e6ecf7;
  --bs-table-border-color: #263352;
  border-color: #263352;
}
[data-theme="dark"] .table thead th { color: #94a3bd; border-bottom-color: #2a3854; }
[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) {
  --bs-table-striped-bg: rgba(255,255,255,.03);
}
[data-theme="dark"] .table-hover > tbody > tr:hover {
  --bs-table-hover-bg: rgba(255,255,255,.05);
  color: #e6ecf7;
}
[data-theme="dark"] .table-stack tr { background: #151e33; border-color: #2a3854; }
[data-theme="dark"] .table-stack td::before { color: #94a3bd; }

[data-theme="dark"] .dropdown-menu {
  background-color: #151e33;
  border-color: #2a3854;
  color: #e6ecf7;
}
[data-theme="dark"] .dropdown-item { color: #cbd5e6; }
[data-theme="dark"] .dropdown-item:hover { background: #222f4d; color: #fff; }
[data-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

[data-theme="dark"] .modal-content {
  background-color: #151e33;
  border-color: #2a3854;
  color: #e6ecf7;
}
[data-theme="dark"] .modal-header, [data-theme="dark"] .modal-footer { border-color: #2a3854; }
[data-theme="dark"] .offcanvas {
  background-color: #0f172a;
  color: #e6ecf7;
}
[data-theme="dark"] .offcanvas-header { border-bottom-color: #2a3854; }

[data-theme="dark"] .pagination .page-link {
  background-color: #151e33;
  border-color: #2a3854;
  color: #cbd5e6;
}
[data-theme="dark"] .pagination .page-item.active .page-link {
  background: var(--judo-navy);
  border-color: var(--judo-navy);
}
[data-theme="dark"] .pagination .page-item.disabled .page-link { background-color: #101a2e; color: #64748b; }

[data-theme="dark"] .filter-bar {
  background: #151e33;
  border-color: #2a3854;
}

[data-theme="dark"] .thumb {
  background: #101a2e;
  border-color: #2a3854;
}

[data-theme="dark"] .stat-card .stat-value { color: #e6ecf7; }
[data-theme="dark"] .stat-card .stat-label { color: #94a3bd; }

[data-theme="dark"] .text-secondary { color: #94a3bd !important; }
[data-theme="dark"] .text-muted { color: #94a3bd !important; }
[data-theme="dark"] .border { border-color: #2a3854 !important; }

[data-theme="dark"] .alert {
  border-color: #2a3854;
  background-color: #18243d;
  color: #e6ecf7;
}

[data-theme="dark"] .cert-frame {
  background: #151e33;
  border-color: #2a3854;
}

[data-theme="dark"] .app-nav .app-nav-item.active,
[data-theme="dark"] .app-nav-item.active { background: var(--judo-gold); color: var(--judo-navy); }

[data-theme="dark"] .btn-judo { background: var(--judo-navy); }
[data-theme="dark"] .btn-gold { color: var(--judo-navy); }

[data-theme="dark"] .list-group-item {
  background-color: #151e33;
  border-color: #2a3854;
  color: #e6ecf7;
}
[data-theme="dark"] .progress { background-color: #222f4d; }
[data-theme="dark"] .badge { border: 1px solid #2a3854; }/* --- Module club : badges, graphiques, avatars, RTL --- */
.text-judo { color: var(--judo-gold); }
.bg-judo { background-color: var(--judo-gold); }
.text-bg-judo { background-color: var(--judo-gold); color: var(--judo-navy); }
.progress-bar.bg-judo { background-color: var(--judo-gold); }

.avatar-sm {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--judo-gold); color: var(--judo-navy); font-size: 1rem;
}
.chart-bar {
  width: 100%; border-radius: 6px 6px 0 0;
  background: linear-gradient(180deg, var(--judo-gold), var(--judo-navy));
  min-height: 4px;
}

.row-link { cursor: pointer; }
.row-link:hover td { background-color: rgba(180, 146, 82, 0.06); }

.card-header { font-weight: 600; }

.badge-dot { width: .7em; height: .7em; display: inline-block; border-radius: 50%; }

[dir="rtl"] .text-start { text-align: right !important; }
[dir="rtl"] .text-end { text-align: left !important; }
[dir="rtl"] .dropdown-menu { right: 0; left: auto; }
[dir="rtl"] .table-stack td::before { text-align: right; }
[data-theme="dark"] .chart-bar { background: linear-gradient(180deg, var(--judo-gold), #4a4a92); }
[data-theme="dark"] .avatar-sm { color: #0f172a; }
[data-theme="dark"] .row-link:hover td { background-color: rgba(180, 146, 82, 0.12); }
[data-theme="dark"] .list-group-item { background-color: #151e33; }