:root {
  --uac-blue: #003087;
  --uac-blue-dark: #002263;
  --uac-blue-soft: #e7ecfa;
  --uac-gold: #d4a017;
  --uac-cyan: #1e8fd4;
  --uac-grad: linear-gradient(135deg, #003087 0%, #1e8fd4 100%);
  --app-bg: #f4f6fb;
  --app-border: #e7ebf2;
  --app-text: #1f2a44;
  --app-muted: #6b7588;
}
* { box-sizing: border-box; }
html { font-size: 14px; }
@media (min-width: 1600px) { html { font-size: 14.5px; } }
body { font-family: 'Inter','Segoe UI',Tahoma,sans-serif; color: var(--app-text); background: var(--app-bg); margin:0; font-size: .875rem; line-height: 1.45; }
.auth-body { background: linear-gradient(135deg,#003087 0%,#0d6efd 100%); min-height:100vh; }
.btn-primary { background-color: var(--uac-blue); border-color: var(--uac-blue); }
.btn-primary:hover { background-color: var(--uac-blue-dark); border-color: var(--uac-blue-dark); }

/* ===== App shell ===== */
.app-shell { display:flex; min-height:100vh; }
.app-sidebar {
  width: 232px; background:#fff; border-right:1px solid var(--app-border);
  display:flex; flex-direction:column; padding:1rem .75rem;
  position:sticky; top:0; height:100vh; flex-shrink:0;
}
.app-brand { display:flex; align-items:center; gap:.6rem; padding:.15rem .25rem 1rem; border-bottom:1px solid var(--app-border); margin-bottom:.85rem; }
.app-brand-badge {
  width:36px;height:36px;border-radius:10px; background:var(--uac-grad); color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:1.05rem;
  box-shadow:0 4px 12px rgba(0,48,135,.22);
}
.app-brand-badge.sm { width:30px;height:30px;font-size:.9rem;border-radius:8px; }
.app-brand-title { font-weight:700; font-size:.92rem; letter-spacing:.02em; }
.app-brand-sub { font-size:.7rem; color:var(--app-muted); }

.app-nav { display:flex; flex-direction:column; gap:.1rem; overflow-y:auto; flex:1; padding-right:.15rem; }
.app-nav-link {
  display:flex; align-items:center; gap:.55rem;
  padding:.5rem .7rem; border-radius:8px;
  color:#4b5670; text-decoration:none; font-weight:500; font-size:.82rem;
  transition: background .15s, color .15s;
  border-left:3px solid transparent;
}
.app-nav-link i { font-size:.95rem; opacity:.85; }
.app-nav-link:hover { background:#f4f6fb; color:var(--uac-blue); }
.app-nav-link.is-active {
  background: var(--uac-blue-soft); color: var(--uac-blue);
  border-left-color: var(--uac-blue); font-weight:600;
}
.app-nav-link.is-active i { opacity:1; color:var(--uac-blue); }
.app-sidebar-foot { padding-top:.6rem; border-top:1px solid var(--app-border); margin-top:.4rem; font-size:.72rem; }

.app-main { flex:1; min-width:0; display:flex; flex-direction:column; }
.app-topbar {
  background:#fff; border-bottom:1px solid var(--app-border);
  display:flex; align-items:center; justify-content:space-between;
  padding:.55rem 1.25rem; position:sticky; top:0; z-index:20;
}
.app-topbar h5 { font-size:1rem !important; }
.topbar-user { display:flex; align-items:center; gap:.55rem; }
.topbar-avatar {
  width:32px;height:32px;border-radius:50%;
  background:var(--uac-grad); color:#fff; font-weight:600; font-size:.82rem;
  display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 3px 8px rgba(0,48,135,.2);
}
.topbar-user-text { line-height:1.1; }
.topbar-user-name { font-weight:600; font-size:.8rem; }
.topbar-user-role { font-size:.66rem; color:var(--app-muted); }
.topbar-logout { border-radius:8px; font-size:.78rem; }

.app-content { padding: 1.25rem 1.5rem; flex:1; }

.app-footer { background:#fff; border-top:1px solid var(--app-border); padding:1.25rem 1.5rem .75rem; font-size:.8rem; }
.app-footer .footer-title { font-weight:600; font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--app-muted); margin-bottom:.5rem; }
.app-footer a { display:block; color:#4b5670; text-decoration:none; font-size:.8rem; margin-bottom:.3rem; }
.app-footer a:hover { color:var(--uac-blue); }
.app-footer a i { width:16px; color:var(--uac-blue); margin-right:.2rem; }

/* ===== Page hero (gradient banner) ===== */
.page-hero {
  background: var(--uac-grad); color:#fff;
  border-radius:14px; padding:1.1rem 1.35rem;
  box-shadow: 0 8px 24px -12px rgba(0,48,135,.45);
  display:flex; align-items:center; gap:.9rem; margin-bottom:1rem;
  position:relative; overflow:hidden;
}
.page-hero::after { content:""; position:absolute; right:-60px; top:-60px; width:200px;height:200px;border-radius:50%; background:rgba(255,255,255,.07); }
.page-hero::before { content:""; position:absolute; right:60px; bottom:-100px; width:160px;height:160px;border-radius:50%; background:rgba(255,255,255,.05); }
.page-hero .hero-icon {
  width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.18);
  display:inline-flex;align-items:center;justify-content:center;font-size:1.25rem;
  backdrop-filter: blur(4px); flex-shrink:0;
}
.page-hero h1 { font-size:1.1rem; font-weight:700; margin:0; }
.page-hero p { margin:.15rem 0 0; opacity:.92; font-size:.82rem; }

/* ===== Modern data card ===== */
.data-card { background:#fff; border-radius:14px; border:1px solid var(--app-border); box-shadow:0 3px 14px -8px rgba(20,40,80,.08); overflow:hidden; }
.data-card .data-toolbar {
  display:flex; flex-wrap:wrap; gap:.6rem; align-items:center;
  padding:.75rem 1rem; border-bottom:1px solid var(--app-border);
  background:#fbfcfe;
}
.data-search { flex:1 1 280px; max-width:460px; }
.data-search .input-group-text { background:#fff; border-right:0; border-radius:8px 0 0 8px; }
.data-search .form-control { border-left:0; border-radius:0 8px 8px 0; box-shadow:none; font-size:.82rem; }
.data-search .form-control:focus { border-color:var(--uac-blue); }

.btn-uac-primary {
  background: var(--uac-grad); border:none; color:#fff; font-weight:500;
  padding:.5rem .95rem; border-radius:9px; font-size:.82rem;
  box-shadow:0 5px 14px rgba(0,48,135,.26);
  transition:transform .15s, box-shadow .15s, filter .15s;
  display:inline-flex; align-items:center; gap:.35rem;
}
.btn-uac-primary:hover { color:#fff; transform:translateY(-1px); box-shadow:0 7px 18px rgba(0,48,135,.34); filter:brightness(1.05); }
.btn-uac-primary:active { transform:translateY(0); }

.data-table { width:100%; margin:0; font-size:.82rem; }
.data-table thead th {
  background:#f6f8fb; color:#5b6478;
  font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; font-weight:600;
  border-bottom:1px solid var(--app-border); padding:.7rem .85rem; white-space:nowrap;
}
.data-table tbody td { padding:.75rem .85rem; border-top:1px solid #f0f2f7; vertical-align:middle; }
.data-table tbody tr { transition: background .12s; }
.data-table tbody tr:hover { background:#f9fbff; }
.data-table .row-title { font-weight:600; color:var(--app-text); font-size:.86rem; }
.data-table .row-sub { font-size:.74rem; color:var(--app-muted); }

.row-avatar {
  width:32px;height:32px;border-radius:50%;
  background:var(--uac-blue-soft); color:var(--uac-blue);
  display:inline-flex;align-items:center;justify-content:center;
  font-weight:600; font-size:.78rem; flex-shrink:0;
}
.row-cell-user { display:flex; align-items:center; gap:.6rem; }

.badge-soft { display:inline-flex;align-items:center;gap:.25rem;font-weight:500;padding:.28rem .55rem;border-radius:999px;font-size:.7rem; border:1px solid transparent; }
.badge-on { background:rgba(25,135,84,.12); color:#157347; }
.badge-off { background:rgba(108,117,125,.15); color:#5c636a; }
.badge-warn { background:rgba(220,113,30,.12); color:#b35413; }
.badge-info { background:rgba(30,143,212,.12); color:#0b6fa7; }
.badge-neutral { background:#eef1f6; color:#475063; }

.icon-btn { width:30px;height:30px;border-radius:7px; display:inline-flex;align-items:center;justify-content:center; border:1px solid var(--app-border); background:#fff; color:var(--uac-blue); font-size:.85rem; }
.icon-btn:hover { background:var(--uac-blue-soft); }
.icon-btn.success { color:#157347; }
.icon-btn.success:hover { background:rgba(25,135,84,.1); }
.icon-btn.danger { color:#b02a37; }
.icon-btn.danger:hover { background:rgba(220,53,69,.1); border-color:rgba(220,53,69,.35); }

/* ===== Pagination (unified, modern) ===== */
.data-pagination {
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:.5rem; padding:.7rem 1rem; background:#fbfcfe; border-top:1px solid var(--app-border);
}
.data-pagination .dp-info { font-size:.76rem; color:var(--app-muted); }
.data-pagination .pagination { margin:0; gap:.2rem; }
.data-pagination .page-item .page-link {
  min-width:32px; height:32px; padding:0 .55rem;
  display:inline-flex; align-items:center; justify-content:center;
  color:#4b5670; background:#fff; border:1px solid var(--app-border);
  border-radius:8px; font-size:.78rem; font-weight:500;
  transition: background .12s, color .12s, border-color .12s;
}
.data-pagination .page-item .page-link:hover { background:var(--uac-blue-soft); color:var(--uac-blue); border-color:var(--uac-blue-soft); }
.data-pagination .page-item.active .page-link {
  background: var(--uac-grad); border-color:transparent; color:#fff;
  box-shadow:0 3px 8px rgba(0,48,135,.25);
}
.data-pagination .page-item.disabled .page-link { color:#c5cad6; background:#f6f8fb; cursor:not-allowed; }

/* Empty state */
.empty-state { text-align:center; padding:2.25rem 1rem; color:var(--app-muted); font-size:.85rem; }
.empty-state i { font-size:2rem; color:#c7cee0; display:block; margin-bottom:.4rem; }

/* Forms compact */
.form-control, .form-select { font-size:.82rem; }
.form-label { font-size:.78rem; font-weight:500; margin-bottom:.3rem; }
.alert { font-size:.82rem; padding:.65rem .9rem; }

/* ===== Wizard (unchanged) ===== */
.wizard-progress { display:flex; justify-content:space-between; position:relative; }
.wizard-progress::before { content:''; position:absolute; top:18px; left:5%; right:5%; height:2px; background:#ddd; z-index:0; }
.wizard-progress .step { z-index:1; text-align:center; flex:1; }
.wizard-progress .step span { display:inline-flex; width:36px;height:36px;border-radius:50%; background:#ddd; color:#555; align-items:center;justify-content:center;font-weight:bold; font-size:.85rem; }
.wizard-progress .step.active span { background:var(--uac-blue); color:#fff; }
.wizard-progress .step div { font-size:.78rem; margin-top:.25rem; color:#555; }

/* Responsive */
@media (max-width: 768px) {
  .app-sidebar { position:fixed; left:-260px; z-index:50; transition:left .25s; height:100vh; box-shadow:0 0 30px rgba(0,0,0,.15);}
  body.sidebar-open .app-sidebar { left:0; }
  .app-content { padding:.9rem; }
}

/* ===== Public site header & footer (inspired by event.sigan-uac.bj) ===== */
.actia-topbar { background: linear-gradient(90deg, var(--uac-blue-dark) 0%, var(--uac-blue) 100%); }
.actia-topbar a:hover { color: var(--uac-gold) !important; }
.actia-navbar { border-bottom: 1px solid var(--app-border); }
.actia-logo-badge {
  width: 44px; height: 44px; border-radius: 12px;
  background: var(--uac-grad); box-shadow: 0 6px 18px rgba(0,48,135,.25);
  font-size: 1.3rem;
}
.actia-brand-sub { font-size:.65rem; letter-spacing:.12em; color: var(--app-muted); }
.actia-brand-title { font-size: 1.1rem; color: var(--uac-blue); letter-spacing:.02em; }
.actia-nav-link { color: var(--app-text) !important; font-weight: 500; padding:.5rem .9rem !important; border-radius: 8px; transition: all .15s; }
.actia-nav-link:hover { background: var(--uac-blue-soft); color: var(--uac-blue) !important; }
.actia-btn-pill { border-radius: 999px; padding:.5rem 1.1rem; font-weight:600; font-size:.85rem; display:inline-flex; align-items:center; gap:.4rem; }
.actia-btn-outline { background:#fff; color: var(--uac-blue); border:1px solid var(--uac-blue-soft); }
.actia-btn-outline:hover { background: var(--uac-blue-soft); color: var(--uac-blue); }
.actia-btn-warning { background: #ffe27a; color: var(--uac-blue-dark); border:1px solid #f5cf4f; }
.actia-btn-warning:hover { background: var(--uac-gold); color:#fff; }

.actia-footer {
  background: linear-gradient(135deg, var(--uac-blue-dark) 0%, var(--uac-blue) 100%);
  position: relative;
}
.actia-footer .actia-logo-badge { background: rgba(255,255,255,.12); box-shadow:none; }
.actia-footer-links li { margin-bottom:.5rem; font-size:.88rem; }
.actia-footer-links a { color: rgba(255,255,255,.78); text-decoration:none; transition: color .15s; }
.actia-footer-links a:hover { color: var(--uac-gold); }

/* ===== Home page feature cards ===== */
.actia-hero { padding: 3rem 0 2rem; }
.actia-hero-badge {
  display:inline-flex; align-items:center; gap:.5rem;
  background: var(--uac-blue-soft); color: var(--uac-blue);
  padding:.4rem 1rem; border-radius: 999px;
  font-weight:600; font-size:.78rem; letter-spacing:.08em; text-transform: uppercase;
  margin-bottom: 1.25rem;
}
.actia-feature-card {
  position: relative; background:#fff; border-radius: 18px;
  padding: 2rem 1.5rem; border:1px solid var(--app-border);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s;
  overflow: hidden; height:100%;
}
.actia-feature-card::before {
  content:""; position:absolute; top:0; left:0; right:0; height:4px;
  background: var(--uac-grad); transform: scaleX(0); transform-origin:left;
  transition: transform .35s ease;
}
.actia-feature-card:hover { transform: translateY(-6px); box-shadow: 0 18px 40px -18px rgba(0,48,135,.35); border-color: transparent; }
.actia-feature-card:hover::before { transform: scaleX(1); }
.actia-feature-icon {
  width:60px; height:60px; border-radius:16px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:1.6rem; margin-bottom:1rem;
}
.actia-feature-icon.is-warning { background: #fff4d6; color: #c79100; }
.actia-feature-icon.is-success { background: #d6f5e3; color: #1a8754; }
.actia-feature-icon.is-info    { background: #d6ecf9; color: #0a6cb3; }
.actia-feature-title { font-weight:700; color: var(--uac-blue); margin-bottom:.5rem; font-size:1.05rem; }
.actia-feature-text { color: var(--app-muted); font-size:.88rem; margin:0; line-height:1.55; }

/* === Suivi de demande === */
.actia-suivi-hero { animation: actiaFadeUp .5s ease both; }
@keyframes actiaFadeUp { from { opacity:0; transform: translateY(12px);} to { opacity:1; transform:none;} }
.actia-suivi-card { border-radius: 22px; }
.actia-suivi-card-header {
  background: linear-gradient(135deg, #003087 0%, #0a4bbf 60%, #1e6fe0 100%);
  position: relative;
}
.actia-suivi-card-header::after {
  content:""; position:absolute; inset:auto -40px -40px auto;
  width:180px; height:180px; border-radius:50%;
  background: radial-gradient(circle, rgba(255,193,7,.25), transparent 70%);
  pointer-events:none;
}
.actia-suivi-badge {
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.25);
  color:#fff; padding:.35rem .8rem; border-radius:999px;
  font-size:.78rem; font-weight:600; letter-spacing:.5px;
  backdrop-filter: blur(6px);
}
.actia-suivi-input .form-control,
.actia-suivi-input .input-group-text,
.actia-suivi-input .btn { border-radius: 14px; }
.actia-suivi-input .form-control { border-radius: 0; box-shadow:none; font-weight:600; letter-spacing:1px; }
.actia-suivi-input .input-group-text { border-top-right-radius:0; border-bottom-right-radius:0; }
.actia-suivi-input { border-radius:14px; box-shadow: 0 4px 14px -6px rgba(0,48,135,.18); }
.actia-suivi-input:focus-within { box-shadow: 0 6px 22px -6px rgba(0,48,135,.35); }
.actia-btn-primary {
  background: var(--uac-grad, linear-gradient(135deg,#003087,#1e6fe0));
  color:#fff; border:none; font-weight:600;
}
.actia-btn-primary:hover { filter: brightness(1.08); color:#fff; }
.actia-suivi-step {
  padding:.75rem .5rem; border-radius:12px; background:#f7f9fc;
  transition: transform .2s ease, background .2s;
}
.actia-suivi-step:hover { transform: translateY(-2px); background:#eef3fb; }

/* ===== Suivi result cards (notfound / show) ===== */
.actia-result-icon {
  width: 80px; height: 80px; border-radius: 24px;
  background: #f0f3fa; color: var(--uac-blue);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 2.2rem; margin: 0 auto;
  box-shadow: inset 0 0 0 2px rgba(0,48,135,.08);
}
.actia-result-icon.is-success { background: #e6f7ed; color: #157347; box-shadow: inset 0 0 0 2px rgba(21,115,71,.1); }
.actia-result-icon.is-error   { background: #fde8ea; color: #dc3545; box-shadow: inset 0 0 0 2px rgba(220,53,69,.1); }
.actia-result-code {
  background: var(--uac-blue-soft); color: var(--uac-blue);
  padding: .35rem .8rem; border-radius: 8px; font-weight: 600; font-size: .9rem; letter-spacing: .5px;
}
.actia-result-tips {
  background: #f8f9fc; border: 1px solid var(--app-border); border-radius: 14px; padding: 1.25rem 1.25rem;
}
.actia-tip-icon {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--uac-blue); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .8rem; flex-shrink: 0;
}

.actia-track-card {
  background: #f8f9fc; border: 1px solid var(--app-border); border-radius: 14px; padding: 1rem 1.25rem;
}

/* Timeline */
.actia-track-timeline { display: flex; flex-direction: column; gap: 0; position: relative; }
.actia-track-timeline::before {
  content: ""; position: absolute; left: 15px; top: 8px; bottom: 8px; width: 2px;
  background: var(--app-border); border-radius: 2px;
}
.actia-track-step {
  display: flex; align-items: flex-start; gap: .85rem;
  padding: .6rem 0; position: relative; z-index: 1;
}
.actia-track-step:last-child { padding-bottom: 0; }
.actia-track-dot {
  width: 32px; height: 32px; border-radius: 50%;
  background: #e7ebf2; color: #8a94a8;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .8rem; flex-shrink: 0; border: 2px solid #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.06);
}
.actia-track-step.is-done .actia-track-dot { background: var(--uac-blue); color: #fff; }
.actia-track-step.is-active .actia-track-dot { background: #fff; color: var(--uac-blue); border-color: var(--uac-blue); box-shadow: 0 0 0 3px rgba(0,48,135,.12); }
.actia-track-step.is-pending .actia-track-dot { background: #e7ebf2; color: #8a94a8; }
.actia-track-label { padding-top: .15rem; }

.badge-soft-success { background: rgba(25,135,84,.12); color: #157347; border-color: rgba(25,135,84,.15); }
.badge-soft-danger  { background: rgba(220,53,69,.12); color: #b02a37; border-color: rgba(220,53,69,.15); }


/* ===== Modern KPI cards & panels (superadmin) ===== */
.actia-kpi-card {
  background:#fff; border:1px solid var(--app-border,#e7ebf2);
  border-radius:16px; padding:1.1rem 1.25rem;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s;
  position:relative; overflow:hidden;
}
.actia-kpi-card::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:4px;
  background:var(--uac-blue,#003087); opacity:0; transition:opacity .2s;
}
.actia-kpi-card:hover{ transform:translateY(-2px); box-shadow:0 10px 24px -14px rgba(15,23,42,.18); border-color:#d6def0; }
.actia-kpi-card:hover::before{ opacity:1; }
.actia-kpi-label{ color:#6b7280; font-size:.78rem; font-weight:600; text-transform:uppercase; letter-spacing:.5px; }
.actia-kpi-value{ font-size:1.85rem; font-weight:800; line-height:1.1; margin-top:.15rem; }
.actia-kpi-icon{
  width:48px; height:48px; border-radius:14px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:1.35rem; flex-shrink:0;
}
.actia-kpi-icon-primary { background:rgba(13,110,253,.10); color:#0d6efd; }
.actia-kpi-icon-info    { background:rgba(13,202,240,.12); color:#0aa2c0; }
.actia-kpi-icon-warning { background:rgba(255,193,7,.14);  color:#b8860b; }
.actia-kpi-icon-success { background:rgba(25,135,84,.12);  color:#157347; }
.actia-kpi-icon-dark    { background:rgba(33,37,41,.08);   color:#212529; }
.actia-kpi-icon-danger  { background:rgba(220,53,69,.12);  color:#dc3545; }

.actia-panel{ border-radius:16px; }
.actia-panel .card-body{ padding:1.25rem 1.35rem; }
.actia-badge-soft{
  background: var(--uac-blue-soft,#e9eef9); color: var(--uac-blue,#003087);
  font-weight:600; border-radius:8px; padding:.35rem .55rem; font-size:.72rem; letter-spacing:.4px;
}
.actia-table thead th{
  background:#f8f9fc; color:#6b7280; font-size:.72rem; text-transform:uppercase; letter-spacing:.5px;
  border-bottom:1px solid var(--app-border,#e7ebf2);
}
.actia-table tbody tr{ border-bottom:1px solid #f1f3f7; }
.actia-table tbody tr:last-child{ border-bottom:none; }
