/* =========================================================================
   SDC UI — shared design system for the Driving School Management app.
   Generalised from the Voucher Report redesign. All classes are prefixed
   `sdc-` and components are namespaced; loading this globally has NO effect
   on pages that don't opt in (they never use these class names).
   To adopt on a page: wrap content in <div class="sdc-page"> ... </div>.
   ========================================================================= */

:root{
  --sdc-primary:#2651be;
  --sdc-primary-dark:#1b3a8f;
  --sdc-accent:#6d5efc;
  --sdc-success:#16a34a;
  --sdc-success-2:#22c55e;
  --sdc-warning:#f59e0b;
  --sdc-warning-2:#fbbf24;
  --sdc-danger:#ef4444;
  --sdc-info:#0ea5e9;
  --sdc-info-2:#38bdf8;
  --sdc-violet:#8b5cf6;
  --sdc-ink:#1e293b;
  --sdc-muted:#64748b;
  --sdc-line:#e7ecf3;
  --sdc-bg:#f5f7fb;
  --sdc-card:#ffffff;
  --sdc-radius:16px;
  --sdc-shadow:0 6px 22px rgba(30,41,59,.06);
  --sdc-shadow-lg:0 14px 30px rgba(30,41,59,.12);
}

.sdc-page{
  font-family:Roboto,'Helvetica Neue',Arial,sans-serif;
  color:var(--sdc-ink);
}
.sdc-page *{box-sizing:border-box;}

/* ---- Animations ---- */
@keyframes sdcFadeUp{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:translateY(0);}}
@keyframes sdcFadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes sdcPop{0%{opacity:0;transform:scale(.94);}60%{transform:scale(1.02);}100%{opacity:1;transform:scale(1);}}
@keyframes sdcSpin{to{transform:rotate(360deg);}}
@keyframes sdcShimmer{0%{background-position:-400px 0;}100%{background-position:400px 0;}}
.sdc-animate{opacity:0;animation:sdcFadeUp .55s cubic-bezier(.22,.61,.36,1) forwards;}
.sdc-pop{opacity:0;animation:sdcPop .5s cubic-bezier(.22,.61,.36,1) forwards;}
/* Auto-stagger direct children */
.sdc-stagger>*{opacity:0;animation:sdcFadeUp .55s cubic-bezier(.22,.61,.36,1) forwards;}
.sdc-stagger>*:nth-child(1){animation-delay:.04s}
.sdc-stagger>*:nth-child(2){animation-delay:.10s}
.sdc-stagger>*:nth-child(3){animation-delay:.16s}
.sdc-stagger>*:nth-child(4){animation-delay:.22s}
.sdc-stagger>*:nth-child(5){animation-delay:.28s}
.sdc-stagger>*:nth-child(6){animation-delay:.34s}
.sdc-stagger>*:nth-child(7){animation-delay:.40s}
.sdc-stagger>*:nth-child(8){animation-delay:.46s}
.sdc-stagger>*:nth-child(9){animation-delay:.52s}
.sdc-stagger>*:nth-child(n+10){animation-delay:.58s}
/* Reveal-on-scroll (JS toggles .in) */
.sdc-reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s cubic-bezier(.22,.61,.36,1);}
.sdc-reveal.in{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  .sdc-animate,.sdc-pop,.sdc-stagger>*,.sdc-reveal{animation:none!important;opacity:1!important;transform:none!important;transition:none!important;}
}

/* ---- Cards & layout ---- */
.sdc-card{background:var(--sdc-card);border:1px solid var(--sdc-line);border-radius:var(--sdc-radius);box-shadow:var(--sdc-shadow);padding:22px 24px;margin-bottom:22px;}
.sdc-card--flush{padding:0;overflow:hidden;}
.sdc-card-title{display:flex;align-items:center;gap:10px;font-family:Lato,sans-serif;font-weight:700;font-size:1.05rem;margin:0 0 16px;color:var(--sdc-ink);}
.sdc-card-title i{color:var(--sdc-primary);font-size:1.5rem;line-height:1;}
.sdc-card-title .sdc-card-sub{font-family:Roboto,sans-serif;font-weight:400;font-size:.82rem;color:var(--sdc-muted);margin-left:auto;}
.sdc-grid{display:grid;gap:18px;}
.sdc-grid--auto{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));}
.sdc-grid--2{grid-template-columns:repeat(2,1fr);}
.sdc-grid--3{grid-template-columns:repeat(3,1fr);}
.sdc-grid--4{grid-template-columns:repeat(4,1fr);}
@media(max-width:920px){.sdc-grid--3,.sdc-grid--4{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.sdc-grid--2,.sdc-grid--3,.sdc-grid--4{grid-template-columns:1fr;}}

/* ---- Hero / page header ---- */
.sdc-hero{display:flex;align-items:center;gap:18px;background:linear-gradient(120deg,var(--sdc-primary) 0%,var(--sdc-accent) 100%);border-radius:18px;padding:24px 28px;margin-bottom:22px;color:#fff;box-shadow:0 12px 30px rgba(38,81,190,.28);position:relative;overflow:hidden;}
.sdc-hero::after{content:"";position:absolute;right:-40px;top:-60px;width:220px;height:220px;background:radial-gradient(circle,rgba(255,255,255,.25),transparent 70%);pointer-events:none;}
.sdc-hero--green{background:linear-gradient(120deg,#0f9d58,#22c55e);box-shadow:0 12px 30px rgba(22,163,74,.28);}
.sdc-hero--violet{background:linear-gradient(120deg,#6d28d9,#8b5cf6);box-shadow:0 12px 30px rgba(139,92,246,.28);}
.sdc-hero--dark{background:linear-gradient(120deg,#0f172a,#334155);box-shadow:0 12px 30px rgba(15,23,42,.30);}
.sdc-hero-icon{width:62px;height:62px;border-radius:16px;flex:0 0 62px;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;}
.sdc-hero-icon i{font-size:2.2rem;color:#fff;}
.sdc-hero h1{font-family:Lato,sans-serif;font-weight:700;font-size:1.7rem;margin:0;color:#fff;}
.sdc-hero p{margin:4px 0 0;opacity:.9;font-size:.92rem;color:#fff;}
.sdc-hero-actions{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap;}
@media(max-width:620px){.sdc-hero{flex-wrap:wrap;}.sdc-hero-actions{margin-left:0;width:100%;}}

/* ---- Buttons ---- */
.sdc-btn{border:none;border-radius:10px;padding:11px 22px;font-size:.92rem;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;transition:transform .15s,box-shadow .2s,filter .2s,background .2s,color .2s;line-height:1.2;}
.sdc-btn i{font-size:1.2rem;}
.sdc-btn:hover{transform:translateY(-2px);}
.sdc-btn:active{transform:translateY(0);}
.sdc-btn--sm{padding:7px 14px;font-size:.82rem;border-radius:8px;}
.sdc-btn--primary{background:linear-gradient(120deg,var(--sdc-primary),var(--sdc-primary-dark));color:#fff;box-shadow:0 8px 18px rgba(38,81,190,.30);}
.sdc-btn--primary:hover{box-shadow:0 12px 24px rgba(38,81,190,.40);color:#fff;}
.sdc-btn--success{background:linear-gradient(120deg,#16a34a,#15803d);color:#fff;box-shadow:0 8px 18px rgba(22,163,74,.30);}
.sdc-btn--success:hover{color:#fff;}
.sdc-btn--danger{background:linear-gradient(120deg,#ef4444,#dc2626);color:#fff;box-shadow:0 8px 18px rgba(239,68,68,.28);}
.sdc-btn--danger:hover{color:#fff;}
.sdc-btn--ghost{background:#fff;color:var(--sdc-primary);border:1.5px solid var(--sdc-primary);}
.sdc-btn--ghost:hover{background:var(--sdc-primary);color:#fff;}
.sdc-btn--soft{background:#eef2fb;color:#3b4d80;}
.sdc-btn--soft:hover{background:#e2e9f8;color:#2b3a66;}
.sdc-btn--block{width:100%;}

/* ---- Filter bar / forms ---- */
.sdc-filter{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px;}
.sdc-field{display:flex;flex-direction:column;gap:6px;min-width:170px;}
.sdc-field--auto{min-width:auto;}
.sdc-field--full{flex:1 1 100%;min-width:0;}
.sdc-label{font-size:.78rem;font-weight:600;letter-spacing:.02em;color:var(--sdc-muted);text-transform:uppercase;}
.sdc-input,.sdc-select,.sdc-textarea{border:1.5px solid var(--sdc-line);border-radius:10px;padding:10px 13px;font-size:.95rem;color:var(--sdc-ink);background:#fff;transition:border-color .2s,box-shadow .2s;width:100%;font-family:inherit;}
.sdc-textarea{min-height:96px;resize:vertical;}
.sdc-input:focus,.sdc-select:focus,.sdc-textarea:focus{outline:none;border-color:var(--sdc-primary);box-shadow:0 0 0 4px rgba(38,81,190,.12);}

/* ---- Forms (generic Django form rendering) ---- */
.sdc-form .sdc-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;}
.sdc-form-field label{display:block;font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.02em;color:var(--sdc-muted);margin-bottom:6px;}
/* Required-field marker: a clean inline red asterisk on the label of any field whose control is required */
.sdc-form-field:has(:required)>label::after,.sdc-form-field:has([required])>label::after{content:" *";color:var(--sdc-danger);font-weight:700;}
.sdc-form-field input[type=text],.sdc-form-field input[type=number],.sdc-form-field input[type=email],
.sdc-form-field input[type=password],.sdc-form-field input[type=date],.sdc-form-field input[type=time],
.sdc-form-field input[type=datetime-local],.sdc-form-field input[type=url],.sdc-form-field input[type=tel],
.sdc-form-field input[type=search],.sdc-form-field input[type=file],.sdc-form-field input:not([type]),
.sdc-form-field select,.sdc-form-field textarea{
  width:100%;border:1.5px solid var(--sdc-line);border-radius:10px;padding:10px 13px;font-size:.95rem;
  color:var(--sdc-ink);background:#fff;transition:border-color .2s,box-shadow .2s;font-family:inherit;
}
.sdc-form-field textarea{min-height:90px;resize:vertical;}
.sdc-form-field input:focus,.sdc-form-field select:focus,.sdc-form-field textarea:focus{outline:none;border-color:var(--sdc-primary);box-shadow:0 0 0 4px rgba(38,81,190,.12);}
.sdc-form-field input[type=checkbox],.sdc-form-field input[type=radio]{width:18px;height:18px;vertical-align:middle;accent-color:var(--sdc-primary);}
.sdc-form-field .errorlist{color:var(--sdc-danger);font-size:.8rem;list-style:none;padding:0;margin:5px 0 0;}
.sdc-form-field .helptext{color:var(--sdc-muted);font-size:.78rem;margin-top:4px;display:block;}
.sdc-form .select2-container{width:100%!important;}
.sdc-form .select2-selection__choice{background-color:#2651be!important;color:#fff!important;border:2px solid #2651be!important;}
.sdc-form-actions{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap;}

/* ---- KPI cards ---- */
.sdc-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px;margin-bottom:22px;}
.sdc-kpi{background:var(--sdc-card);border:1px solid var(--sdc-line);border-radius:var(--sdc-radius);padding:20px;display:flex;align-items:center;gap:16px;position:relative;overflow:hidden;box-shadow:var(--sdc-shadow);transition:transform .2s,box-shadow .2s;}
.sdc-kpi:hover{transform:translateY(-4px);box-shadow:var(--sdc-shadow-lg);}
.sdc-kpi-icon{width:54px;height:54px;border-radius:14px;flex:0 0 54px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--sdc-primary),var(--sdc-accent));}
.sdc-kpi-icon i{font-size:1.9rem;color:#fff;}
.sdc-kpi--green .sdc-kpi-icon{background:linear-gradient(135deg,#16a34a,#22c55e);}
.sdc-kpi--blue .sdc-kpi-icon{background:linear-gradient(135deg,#2651be,#6d5efc);}
.sdc-kpi--amber .sdc-kpi-icon{background:linear-gradient(135deg,#f59e0b,#fbbf24);}
.sdc-kpi--cyan .sdc-kpi-icon{background:linear-gradient(135deg,#0ea5e9,#38bdf8);}
.sdc-kpi--violet .sdc-kpi-icon{background:linear-gradient(135deg,#7c3aed,#a78bfa);}
.sdc-kpi--rose .sdc-kpi-icon{background:linear-gradient(135deg,#e11d48,#fb7185);}
.sdc-kpi-label{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em;color:var(--sdc-muted);}
.sdc-kpi-value{font-family:Lato,sans-serif;font-weight:700;font-size:1.55rem;line-height:1.2;color:var(--sdc-ink);}
.sdc-kpi-sub{font-size:.78rem;color:var(--sdc-muted);margin-top:2px;}

/* ---- Charts (donut + bars) ---- */
.sdc-chart-wrap{display:grid;grid-template-columns:240px 1fr;gap:28px;align-items:center;}
@media(max-width:760px){.sdc-chart-wrap{grid-template-columns:1fr;}}
.sdc-donut{position:relative;width:200px;height:200px;margin:0 auto;border-radius:50%;transform:scale(.7);opacity:0;transition:transform .7s cubic-bezier(.22,.61,.36,1),opacity .7s;}
.sdc-donut.in{transform:scale(1);opacity:1;}
.sdc-donut::after{content:"";position:absolute;inset:26px;background:var(--sdc-card);border-radius:50%;box-shadow:inset 0 0 0 1px var(--sdc-line);}
.sdc-donut-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:2;text-align:center;}
.sdc-donut-center small{font-size:.72rem;color:var(--sdc-muted);text-transform:uppercase;letter-spacing:.04em;}
.sdc-donut-center b{font-family:Lato,sans-serif;font-size:1.15rem;color:var(--sdc-ink);}
.sdc-bars{display:flex;flex-direction:column;gap:14px;}
.sdc-bar-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:5px;font-size:.86rem;gap:10px;}
.sdc-bar-name{font-weight:600;color:var(--sdc-ink);display:flex;align-items:center;gap:8px;min-width:0;}
.sdc-bar-name span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sdc-dot{width:11px;height:11px;border-radius:50%;display:inline-block;flex:0 0 11px;}
.sdc-bar-val{color:var(--sdc-muted);font-weight:600;white-space:nowrap;}
.sdc-bar-val b{color:var(--sdc-ink);}
.sdc-bar-track{height:11px;background:#eef2f8;border-radius:9px;overflow:hidden;}
.sdc-bar-fill{height:100%;width:0;border-radius:9px;transition:width 1.1s cubic-bezier(.22,.61,.36,1);background:var(--sdc-primary);}
/* Sparkline / progress mini */
.sdc-progress{height:9px;background:#eef2f8;border-radius:8px;overflow:hidden;}
.sdc-progress>span{display:block;height:100%;width:0;border-radius:8px;background:linear-gradient(90deg,var(--sdc-primary),var(--sdc-accent));transition:width 1s cubic-bezier(.22,.61,.36,1);}

/* ---- Tables ---- */
.sdc-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.9rem;}
.sdc-table thead th{background:#f1f5fc;color:#475569;font-weight:600;text-transform:uppercase;font-size:.74rem;letter-spacing:.03em;padding:12px 14px;text-align:left;border-bottom:1px solid var(--sdc-line);white-space:nowrap;}
.sdc-table thead th.num{text-align:right;}
.sdc-table tbody td{padding:11px 14px;border-bottom:1px solid #f1f4f9;vertical-align:middle;}
.sdc-table tbody tr.sdc-row{transition:background .15s;}
.sdc-table tbody tr.sdc-row:hover{background:#f7faff;}
.sdc-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}
.sdc-table .money{color:var(--sdc-success);font-weight:700;}
.sdc-cat-row td{background:linear-gradient(90deg,rgba(38,81,190,.08),rgba(109,94,252,.04));font-family:Lato,sans-serif;font-weight:700;color:var(--sdc-primary-dark);padding:12px 14px;border-top:1px solid var(--sdc-line);border-bottom:1px solid var(--sdc-line);}
.sdc-cat-flex{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.sdc-total-row td{background:#fafbff;font-weight:700;border-top:1px solid var(--sdc-line);}
.sdc-total-row .label{text-align:right;color:var(--sdc-ink);}
.sdc-grand-row td{background:linear-gradient(90deg,#16a34a,#22c55e);color:#fff;font-family:Lato,sans-serif;font-weight:700;}
.sdc-grand-row .label{text-align:right;}
.sdc-grand-row .num{color:#fff;font-size:1.02rem;}
.sdc-table-scroll{overflow-x:auto;border-radius:12px;border:1px solid var(--sdc-line);}
.sdc-table-scroll .sdc-table thead th:first-child{border-top-left-radius:11px;}
.sdc-table-scroll .sdc-table thead th:last-child{border-top-right-radius:11px;}

/* Mobile: stack rows into cards (opt-in via .sdc-table--stack; give each <td> a data-label).
   Label-above-value block layout so it works for any cell content (badges, multi-line, buttons). */
@media (max-width:640px){
  .sdc-table--stack{width:100%!important;table-layout:auto!important;}
  .sdc-table--stack colgroup{display:none!important;}        /* DataTables 2.x sets fixed col widths here */
  .sdc-table--stack thead{display:none;}
  .sdc-table--stack tbody{display:block;width:100%;}
  .sdc-table--stack tbody tr{display:block;width:100%!important;background:#fff;border:1px solid var(--sdc-line);border-radius:12px;box-shadow:var(--sdc-shadow);margin-bottom:12px;padding:4px 4px;}
  .sdc-table--stack tbody td{width:auto!important;}
  .sdc-table--stack tbody tr:hover{background:#fff;}
  .sdc-table--stack tbody td{display:block;text-align:left;border:none;border-bottom:1px solid #f1f4f9;padding:9px 14px;}
  .sdc-table--stack tbody td:last-child{border-bottom:none;}
  .sdc-table--stack tbody td.num{text-align:left;}
  .sdc-table--stack tbody td::before{content:attr(data-label);display:block;font-weight:600;color:var(--sdc-muted);text-transform:uppercase;font-size:.68rem;letter-spacing:.04em;margin-bottom:4px;}
  .sdc-table--stack tbody td[data-label=""]::before,.sdc-table--stack tbody td:not([data-label])::before{content:none;}
  /* let the stacked cards breathe (drop the scroll frame) */
  .sdc-table-scroll:has(.sdc-table--stack){border:none;overflow:visible;}
}

/* Toolbar above tables (search + actions) */
.sdc-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:16px;}
.sdc-toolbar .sdc-search{flex:1 1 240px;position:relative;}
.sdc-toolbar .sdc-search i{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--sdc-muted);font-size:1.1rem;}
.sdc-toolbar .sdc-search input{padding-left:38px;}
.sdc-toolbar .sdc-toolbar-actions{display:flex;gap:10px;flex-wrap:wrap;margin-left:auto;}

/* ---- DataTables integration (so the 50+ DataTables pages match the system) ---- */
.sdc-page .dataTables_wrapper{padding-top:2px;}
/* DataTables' bootstrap5 control rows use Bootstrap's negative gutter margins
   (margin:0 -12px); inside the bordered scroll frame that overflows by ~12px and
   shows a stray horizontal scrollbar even on wide screens. Neutralise it. */
.sdc-page .dataTables_wrapper>.row{margin-left:0;margin-right:0;}
.sdc-page .dataTables_filter{float:right;margin:0 0 14px;}
.sdc-page .dataTables_filter label,.sdc-page .dataTables_length label{color:var(--sdc-muted);font-size:.85rem;font-weight:600;}
.sdc-page .dataTables_filter input{border:1.5px solid var(--sdc-line);border-radius:10px;padding:8px 12px;margin-left:8px;font-size:.9rem;transition:border-color .2s,box-shadow .2s;}
.sdc-page .dataTables_filter input:focus{outline:none;border-color:var(--sdc-primary);box-shadow:0 0 0 4px rgba(38,81,190,.12);}
.sdc-page .dataTables_length{float:left;margin:0 0 14px;}
.sdc-page .dataTables_length select{border:1.5px solid var(--sdc-line);border-radius:8px;padding:6px 26px 6px 10px;margin:0 6px;background:#fff;}
.sdc-page .dataTables_info{color:var(--sdc-muted);font-size:.85rem;padding-top:14px;}
.sdc-page .dataTables_paginate{padding-top:12px;}
.sdc-page .dataTables_paginate .paginate_button{padding:6px 12px!important;margin:0 2px;border-radius:8px!important;border:1px solid var(--sdc-line)!important;background:#fff!important;color:var(--sdc-ink)!important;cursor:pointer;}
.sdc-page .dataTables_paginate .paginate_button:hover{background:#f1f5fc!important;border-color:var(--sdc-primary)!important;color:var(--sdc-primary-dark)!important;}
.sdc-page .dataTables_paginate .paginate_button.current,.sdc-page .dataTables_paginate .paginate_button.current:hover{background:var(--sdc-primary)!important;color:#fff!important;border-color:var(--sdc-primary)!important;}
.sdc-page .dataTables_paginate .paginate_button.disabled{opacity:.45;cursor:default;}
.sdc-page table.dataTable{border-collapse:separate!important;border-spacing:0;width:100%!important;}
.sdc-page table.dataTable thead th{cursor:pointer;}
/* DataTables 2.x (dt-* classes): export buttons, search, paging, info, length */
.sdc-page .dt-buttons{margin:0 0 12px;display:inline-flex;gap:8px;flex-wrap:wrap;}
.sdc-page .dt-button{background:#eef2fb!important;border:1px solid var(--sdc-line)!important;border-radius:9px!important;color:#3b4d80!important;padding:8px 16px!important;font-weight:600!important;font-size:.85rem!important;transition:background .15s,color .15s;}
.sdc-page .dt-button:hover{background:#e2e9f8!important;color:var(--sdc-primary-dark)!important;}
.sdc-page div.dt-search{margin-bottom:12px;}
.sdc-page div.dt-search input,.sdc-page div.dt-length select{border:1.5px solid var(--sdc-line)!important;border-radius:10px!important;padding:8px 12px!important;margin-left:8px;background:#fff;}
.sdc-page div.dt-search input:focus{outline:none;border-color:var(--sdc-primary)!important;box-shadow:0 0 0 4px rgba(38,81,190,.12);}
.sdc-page div.dt-info{color:var(--sdc-muted);font-size:.85rem;}
.sdc-page div.dt-paging .dt-paging-button{border-radius:8px!important;border:1px solid var(--sdc-line)!important;padding:6px 12px!important;margin:0 2px;color:var(--sdc-ink)!important;}
.sdc-page div.dt-paging .dt-paging-button.current{background:var(--sdc-primary)!important;color:#fff!important;border-color:var(--sdc-primary)!important;}
.sdc-page div.dt-paging .dt-paging-button:hover:not(.current){background:#f1f5fc!important;border-color:var(--sdc-primary)!important;color:var(--sdc-primary-dark)!important;}

/* Bootstrap-style pagination (bootstrap5 DataTables integration + other paginators) */
.sdc-page .pagination{gap:3px;flex-wrap:wrap;}
.sdc-page .pagination .page-link{border-radius:8px!important;border:1px solid var(--sdc-line);color:var(--sdc-ink);transition:background .15s,color .15s;}
.sdc-page .pagination .page-link:hover{background:#f1f5fc;color:var(--sdc-primary-dark);}
.sdc-page .pagination .page-item.active .page-link{background:var(--sdc-primary);border-color:var(--sdc-primary);color:#fff;}
.sdc-page .pagination .page-item.disabled .page-link{opacity:.45;}

/* DataTables controls on small screens: stack, centre, and let pagination wrap
   (a long row of page numbers must not force horizontal page overflow). */
@media (max-width:640px){
  .sdc-page .dataTables_length,.sdc-page .dataTables_filter,
  .sdc-page .dataTables_info,.sdc-page .dataTables_paginate{float:none!important;text-align:center;margin:8px 0;}
  .sdc-page .dataTables_filter input{margin:6px 0 0;width:100%;max-width:280px;}
  .sdc-page .dataTables_paginate{display:flex;justify-content:center;}
  .sdc-page .pagination{justify-content:center;row-gap:6px;}
  .sdc-page .pagination .page-link{padding:7px 12px!important;min-width:40px;text-align:center;}
  /* DataTables 2.x */
  .sdc-page div.dt-layout-row{flex-direction:column;gap:6px;text-align:center;}
  .sdc-page div.dt-search input{width:100%;max-width:280px;}
  .sdc-page div.dt-paging{flex-wrap:wrap;justify-content:center;row-gap:6px;}
  .sdc-page div.dt-paging .dt-paging-button{padding:7px 12px!important;min-width:40px;}
  .sdc-page .dt-buttons{justify-content:center;}
}

/* ---- Pills / badges / chips ---- */
.sdc-chip{display:inline-block;background:#eef2fb;color:#3b4d80;border-radius:20px;padding:3px 12px;font-size:.82rem;font-weight:600;}
.sdc-badge{display:inline-flex;align-items:center;gap:5px;border-radius:20px;padding:3px 11px;font-size:.78rem;font-weight:700;}
.sdc-badge--green{background:#dcfce7;color:#15803d;}
.sdc-badge--amber{background:#fef3c7;color:#b45309;}
.sdc-badge--red{background:#fee2e2;color:#b91c1c;}
.sdc-badge--blue{background:#dbeafe;color:#1d4ed8;}
.sdc-badge--gray{background:#eef2f6;color:#475569;}
.sdc-idtag{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;background:#fff;border:1px solid var(--sdc-primary);color:var(--sdc-primary);border-radius:7px;font-size:.74rem;font-weight:700;margin-right:9px;}
.sdc-pillno{display:inline-block;background:#eef2fb;color:#3b4d80;border-radius:7px;padding:2px 9px;font-weight:600;font-size:.82rem;}
.sdc-link{color:var(--sdc-primary);font-weight:600;text-decoration:none;}
.sdc-link:hover{text-decoration:underline;color:var(--sdc-primary-dark);}
/* Detail line-items (description + amount), e.g. inside a table cell */
.sdc-detail{display:flex;justify-content:space-between;gap:14px;padding:2px 0;border-bottom:1px dashed #eef1f6;}
.sdc-detail:last-child{border-bottom:none;}
.sdc-detail .amt{color:var(--sdc-muted);font-variant-numeric:tabular-nums;white-space:nowrap;}
/* Icon-only action buttons */
.sdc-iconbtn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:9px;border:none;cursor:pointer;text-decoration:none;transition:transform .15s,filter .2s,box-shadow .2s;}
.sdc-iconbtn:hover{transform:translateY(-2px);filter:brightness(1.05);}
.sdc-iconbtn i{font-size:1.15rem;line-height:1;}
.sdc-iconbtn--view{background:#dbeafe;color:#1d4ed8;}
.sdc-iconbtn--approve{background:#dcfce7;color:#15803d;}
.sdc-iconbtn--edit{background:#fef3c7;color:#b45309;}
.sdc-iconbtn--delete{background:#fee2e2;color:#b91c1c;}
.sdc-actions{display:inline-flex;gap:7px;}

/* ---- Empty state ---- */
.sdc-empty{text-align:center;padding:50px 20px;}
.sdc-empty svg{width:140px;height:auto;margin-bottom:18px;}
.sdc-empty h3{font-family:Lato,sans-serif;color:var(--sdc-ink);margin:0 0 6px;}
.sdc-empty p{color:var(--sdc-muted);margin:0;}

/* ---- Loading overlay ---- */
.sdc-overlay{position:fixed;inset:0;background:rgba(245,247,251,.7);backdrop-filter:blur(2px);display:none;align-items:center;justify-content:center;z-index:1200;}
.sdc-overlay.show{display:flex;}
.sdc-spinner{width:48px;height:48px;border:5px solid rgba(38,81,190,.18);border-top-color:var(--sdc-primary);border-radius:50%;animation:sdcSpin .8s linear infinite;}

/* ---- Skeleton shimmer (optional) ---- */
.sdc-skel{background:linear-gradient(90deg,#eef2f8 25%,#f6f8fc 37%,#eef2f8 63%);background-size:800px 100%;animation:sdcShimmer 1.4s infinite;border-radius:8px;}

/* ---- Print: keep it clean ---- */
@media print{
  .sdc-overlay,.sdc-hero-actions,.sdc-btn{display:none!important;}
  .sdc-card,.sdc-kpi{box-shadow:none;border:1px solid #ccc;}
  .sdc-animate,.sdc-reveal,.sdc-stagger>*{opacity:1!important;transform:none!important;animation:none!important;}
}

/* ============================================================
   Sidebar enhancements (menu search + animated nav items)
   Scoped to .app-sidebar so un-upgraded behaviour is untouched.
   ============================================================ */
.sdc-menu-search{position:relative;margin:4px 14px 12px;}
.sdc-menu-search>i{position:absolute;left:13px;top:50%;transform:translateY(-50%);font-size:1.1rem;color:#9aa6c2;pointer-events:none;}
.sdc-menu-search input{width:100%;border:1.5px solid rgba(140,155,190,.28);background:rgba(140,155,190,.10);border-radius:12px;padding:10px 32px 10px 38px;font-size:.86rem;color:inherit;outline:none;transition:border-color .16s,box-shadow .16s,background .16s;}
.sdc-menu-search input::placeholder{color:#9aa6c2;}
.sdc-menu-search input:focus{border-color:var(--sdc-primary);background:rgba(255,255,255,.16);box-shadow:0 0 0 3px rgba(38,81,190,.15);}
.sdc-menu-search input:focus+#sdcMenuClear,.sdc-menu-search input:not(:placeholder-shown)~#sdcMenuClear{display:flex;}
#sdcMenuClear{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:none;border-radius:50%;background:rgba(140,155,190,.25);color:#54618a;cursor:pointer;align-items:center;justify-content:center;font-size:1.05rem;line-height:1;padding:0;transition:background .15s;}
#sdcMenuClear:hover{background:var(--sdc-danger);color:#fff;}
.sdc-menu-empty{display:none;list-style:none;text-align:center;color:#9aa6c2;font-size:.82rem;padding:16px 10px;font-style:italic;}
.vertical-nav-menu.sdc-searching ul{display:block!important;max-height:none!important;overflow:visible!important;}
.vertical-nav-menu.sdc-searching .metismenu-state-icon{opacity:.3;}

/* Animated nav items (gentle — keeps ArchitectUI layout intact) */
.app-sidebar .vertical-nav-menu li>a{border-radius:10px;transition:background .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease;}
.app-sidebar .vertical-nav-menu li>a:hover{transform:translateX(4px);}
.app-sidebar .vertical-nav-menu li>a .metismenu-icon{transition:transform .18s ease,color .16s ease;}
.app-sidebar .vertical-nav-menu li>a:hover .metismenu-icon{color:var(--sdc-primary);transform:scale(1.14);}
.app-sidebar .vertical-nav-menu li>a.mm-active{background:linear-gradient(90deg,rgba(38,81,190,.16),rgba(109,94,252,.04))!important;box-shadow:inset 3px 0 0 var(--sdc-primary);font-weight:600;}
.app-sidebar .vertical-nav-menu li>a.mm-active .metismenu-icon{color:var(--sdc-primary);}
.app-sidebar .vertical-nav-menu li ul li>a:hover{background:rgba(38,81,190,.07);}
.app-sidebar .vertical-nav-menu>li>a{position:relative;animation:sdcNavIn .4s both;}
@keyframes sdcNavIn{from{opacity:0;transform:translateX(-8px);}to{opacity:1;transform:translateX(0);}}