/* ==========================================================================
   Nayi Raah — admin / member / staff panel design system
   Written from scratch. Shares nothing with the previous template.
   Provides the grid, utilities and components the existing pages use, so
   every screen is restyled without rewriting a hundred blade files.
   ========================================================================== */

/* ---------- tokens ---------- */
:root {
  --ink:        #111B3A;
  --ink-2:      #37415F;
  --ink-3:      #6B7694;
  --ink-4:      #9AA3BB;
  --line:       #E6EAF2;
  --line-2:     #D3DAE8;
  --paper:      #FFFFFF;
  --canvas:     #F4F6FB;
  --sidebar:    #101A36;
  --sidebar-2:  #17213F;

  --primary:      #2F62E0;
  --primary-600:  #1F4CC4;
  --primary-050:  #EEF3FE;
  --success:      #16A34A;
  --success-050:  #E9F8EF;
  --danger:       #DC2626;
  --danger-050:   #FDECEC;
  --warning:      #D97706;
  --warning-050:  #FEF4E6;
  --info:         #0891B2;
  --info-050:     #E6F6FA;
  --secondary:    #64748B;
  --secondary-050:#F1F3F7;

  --r-sm: 8px;
  --r:    12px;
  --r-lg: 16px;
  --r-xl: 22px;

  --sh-1: 0 1px 2px rgba(17,27,58,.05), 0 1px 3px rgba(17,27,58,.04);
  --sh-2: 0 2px 6px rgba(17,27,58,.06), 0 8px 24px rgba(17,27,58,.07);
  --sh-3: 0 10px 30px rgba(17,27,58,.10), 0 30px 70px rgba(17,27,58,.12);

  --sidebar-w: 268px;
  --header-h: 68px;
  --font: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --ease: cubic-bezier(.22,.61,.36,1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-2);
  background: var(--canvas);
  -webkit-font-smoothing: antialiased;
}
img, svg, video { max-width: 100%; height: auto; }
a { color: var(--primary); text-decoration: none; }
a:hover { color: var(--primary-600); }
h1,h2,h3,h4,h5,h6 { margin: 0 0 .5rem; color: var(--ink); font-weight: 700; line-height: 1.25; letter-spacing: -.015em; }
h1,.h1{font-size:1.75rem} h2,.h2{font-size:1.45rem} h3,.h3{font-size:1.2rem}
h4,.h4{font-size:1.05rem} h5,.h5{font-size:.95rem} h6,.h6{font-size:.85rem}
p { margin: 0 0 1rem; }
hr { border: 0; border-top: 1px solid var(--line); margin: 1rem 0; opacity: 1; }
small, .small { font-size: .8125rem; }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--ink-4); }
::-webkit-scrollbar-track { background: transparent; }

/* ---------- grid ---------- */
.container, .container-fluid { width: 100%; margin-inline: auto; padding-inline: 12px; }
.container { max-width: 1320px; }
.row { display: flex; flex-wrap: wrap; margin-inline: -12px; }
.row > * { padding-inline: 12px; width: 100%; }
.col { flex: 1 0 0%; width: auto; }
.col-auto { flex: 0 0 auto; width: auto; }
.col-1{flex:0 0 auto;width:8.333333%}
.col-2{flex:0 0 auto;width:16.666667%}
.col-3{flex:0 0 auto;width:25.000000%}
.col-4{flex:0 0 auto;width:33.333333%}
.col-5{flex:0 0 auto;width:41.666667%}
.col-6{flex:0 0 auto;width:50.000000%}
.col-7{flex:0 0 auto;width:58.333333%}
.col-8{flex:0 0 auto;width:66.666667%}
.col-9{flex:0 0 auto;width:75.000000%}
.col-10{flex:0 0 auto;width:83.333333%}
.col-11{flex:0 0 auto;width:91.666667%}
.col-12{flex:0 0 auto;width:100.000000%}
@media (min-width:576px){.col-sm-auto{flex:0 0 auto;width:auto}.col-sm{flex:1 0 0%;width:auto}.col-sm-1{flex:0 0 auto;width:8.333333%}.col-sm-2{flex:0 0 auto;width:16.666667%}.col-sm-3{flex:0 0 auto;width:25.000000%}.col-sm-4{flex:0 0 auto;width:33.333333%}.col-sm-5{flex:0 0 auto;width:41.666667%}.col-sm-6{flex:0 0 auto;width:50.000000%}.col-sm-7{flex:0 0 auto;width:58.333333%}.col-sm-8{flex:0 0 auto;width:66.666667%}.col-sm-9{flex:0 0 auto;width:75.000000%}.col-sm-10{flex:0 0 auto;width:83.333333%}.col-sm-11{flex:0 0 auto;width:91.666667%}.col-sm-12{flex:0 0 auto;width:100.000000%}}
@media (min-width:768px){.col-md-auto{flex:0 0 auto;width:auto}.col-md{flex:1 0 0%;width:auto}.col-md-1{flex:0 0 auto;width:8.333333%}.col-md-2{flex:0 0 auto;width:16.666667%}.col-md-3{flex:0 0 auto;width:25.000000%}.col-md-4{flex:0 0 auto;width:33.333333%}.col-md-5{flex:0 0 auto;width:41.666667%}.col-md-6{flex:0 0 auto;width:50.000000%}.col-md-7{flex:0 0 auto;width:58.333333%}.col-md-8{flex:0 0 auto;width:66.666667%}.col-md-9{flex:0 0 auto;width:75.000000%}.col-md-10{flex:0 0 auto;width:83.333333%}.col-md-11{flex:0 0 auto;width:91.666667%}.col-md-12{flex:0 0 auto;width:100.000000%}}
@media (min-width:992px){.col-lg-auto{flex:0 0 auto;width:auto}.col-lg{flex:1 0 0%;width:auto}.col-lg-1{flex:0 0 auto;width:8.333333%}.col-lg-2{flex:0 0 auto;width:16.666667%}.col-lg-3{flex:0 0 auto;width:25.000000%}.col-lg-4{flex:0 0 auto;width:33.333333%}.col-lg-5{flex:0 0 auto;width:41.666667%}.col-lg-6{flex:0 0 auto;width:50.000000%}.col-lg-7{flex:0 0 auto;width:58.333333%}.col-lg-8{flex:0 0 auto;width:66.666667%}.col-lg-9{flex:0 0 auto;width:75.000000%}.col-lg-10{flex:0 0 auto;width:83.333333%}.col-lg-11{flex:0 0 auto;width:91.666667%}.col-lg-12{flex:0 0 auto;width:100.000000%}}
@media (min-width:1200px){.col-xl-auto{flex:0 0 auto;width:auto}.col-xl{flex:1 0 0%;width:auto}.col-xl-1{flex:0 0 auto;width:8.333333%}.col-xl-2{flex:0 0 auto;width:16.666667%}.col-xl-3{flex:0 0 auto;width:25.000000%}.col-xl-4{flex:0 0 auto;width:33.333333%}.col-xl-5{flex:0 0 auto;width:41.666667%}.col-xl-6{flex:0 0 auto;width:50.000000%}.col-xl-7{flex:0 0 auto;width:58.333333%}.col-xl-8{flex:0 0 auto;width:66.666667%}.col-xl-9{flex:0 0 auto;width:75.000000%}.col-xl-10{flex:0 0 auto;width:83.333333%}.col-xl-11{flex:0 0 auto;width:91.666667%}.col-xl-12{flex:0 0 auto;width:100.000000%}}
@media (min-width:1400px){.col-xxl-auto{flex:0 0 auto;width:auto}.col-xxl{flex:1 0 0%;width:auto}.col-xxl-1{flex:0 0 auto;width:8.333333%}.col-xxl-2{flex:0 0 auto;width:16.666667%}.col-xxl-3{flex:0 0 auto;width:25.000000%}.col-xxl-4{flex:0 0 auto;width:33.333333%}.col-xxl-5{flex:0 0 auto;width:41.666667%}.col-xxl-6{flex:0 0 auto;width:50.000000%}.col-xxl-7{flex:0 0 auto;width:58.333333%}.col-xxl-8{flex:0 0 auto;width:66.666667%}.col-xxl-9{flex:0 0 auto;width:75.000000%}.col-xxl-10{flex:0 0 auto;width:83.333333%}.col-xxl-11{flex:0 0 auto;width:91.666667%}.col-xxl-12{flex:0 0 auto;width:100.000000%}}
.g-0,.gx-0{--gap:0rem}
.g-1,.gx-1{--gap:0rem}
.g-2,.gx-2{--gap:0rem}
.g-3,.gx-3{--gap:1rem}
.g-4,.gx-4{--gap:1rem}
.g-5,.gx-5{--gap:3rem}
.g-0{margin-inline:0} .g-0>*{padding-inline:0}
.g-1>*{padding:.25rem} .g-2>*{padding:.5rem} .g-3>*{padding:.75rem} .g-4>*{padding:1rem} .g-5>*{padding:1.5rem}
.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:1rem}.gap-4{gap:1.5rem}.gap-5{gap:3rem}

/* ---------- spacing utilities ---------- */
.m-0{margin:0;}
.m-1{margin:.25rem;}
.m-2{margin:.5rem;}
.m-3{margin:1rem;}
.m-4{margin:1.5rem;}
.m-5{margin:3rem;}
.m-auto{margin:auto;}
.mt-0{margin-top:0;}
.mt-1{margin-top:.25rem;}
.mt-2{margin-top:.5rem;}
.mt-3{margin-top:1rem;}
.mt-4{margin-top:1.5rem;}
.mt-5{margin-top:3rem;}
.mt-auto{margin-top:auto;}
.mb-0{margin-bottom:0;}
.mb-1{margin-bottom:.25rem;}
.mb-2{margin-bottom:.5rem;}
.mb-3{margin-bottom:1rem;}
.mb-4{margin-bottom:1.5rem;}
.mb-5{margin-bottom:3rem;}
.mb-auto{margin-bottom:auto;}
.ms-0{margin-left:0;}
.ms-1{margin-left:.25rem;}
.ms-2{margin-left:.5rem;}
.ms-3{margin-left:1rem;}
.ms-4{margin-left:1.5rem;}
.ms-5{margin-left:3rem;}
.ms-auto{margin-left:auto;}
.me-0{margin-right:0;}
.me-1{margin-right:.25rem;}
.me-2{margin-right:.5rem;}
.me-3{margin-right:1rem;}
.me-4{margin-right:1.5rem;}
.me-5{margin-right:3rem;}
.me-auto{margin-right:auto;}
.mx-0{margin-left:0;margin-right:0;}
.mx-1{margin-left:.25rem;margin-right:.25rem;}
.mx-2{margin-left:.5rem;margin-right:.5rem;}
.mx-3{margin-left:1rem;margin-right:1rem;}
.mx-4{margin-left:1.5rem;margin-right:1.5rem;}
.mx-5{margin-left:3rem;margin-right:3rem;}
.mx-auto{margin-left:auto;margin-right:auto;}
.my-0{margin-top:0;margin-bottom:0;}
.my-1{margin-top:.25rem;margin-bottom:.25rem;}
.my-2{margin-top:.5rem;margin-bottom:.5rem;}
.my-3{margin-top:1rem;margin-bottom:1rem;}
.my-4{margin-top:1.5rem;margin-bottom:1.5rem;}
.my-5{margin-top:3rem;margin-bottom:3rem;}
.my-auto{margin-top:auto;margin-bottom:auto;}
.ml-0{margin-left:0;}
.ml-1{margin-left:.25rem;}
.ml-2{margin-left:.5rem;}
.ml-3{margin-left:1rem;}
.ml-4{margin-left:1.5rem;}
.ml-5{margin-left:3rem;}
.ml-auto{margin-left:auto;}
.mr-0{margin-right:0;}
.mr-1{margin-right:.25rem;}
.mr-2{margin-right:.5rem;}
.mr-3{margin-right:1rem;}
.mr-4{margin-right:1.5rem;}
.mr-5{margin-right:3rem;}
.mr-auto{margin-right:auto;}
.p-0{padding:0;}
.p-1{padding:.25rem;}
.p-2{padding:.5rem;}
.p-3{padding:1rem;}
.p-4{padding:1.5rem;}
.p-5{padding:3rem;}
.pt-0{padding-top:0;}
.pt-1{padding-top:.25rem;}
.pt-2{padding-top:.5rem;}
.pt-3{padding-top:1rem;}
.pt-4{padding-top:1.5rem;}
.pt-5{padding-top:3rem;}
.pb-0{padding-bottom:0;}
.pb-1{padding-bottom:.25rem;}
.pb-2{padding-bottom:.5rem;}
.pb-3{padding-bottom:1rem;}
.pb-4{padding-bottom:1.5rem;}
.pb-5{padding-bottom:3rem;}
.ps-0{padding-left:0;}
.ps-1{padding-left:.25rem;}
.ps-2{padding-left:.5rem;}
.ps-3{padding-left:1rem;}
.ps-4{padding-left:1.5rem;}
.ps-5{padding-left:3rem;}
.pe-0{padding-right:0;}
.pe-1{padding-right:.25rem;}
.pe-2{padding-right:.5rem;}
.pe-3{padding-right:1rem;}
.pe-4{padding-right:1.5rem;}
.pe-5{padding-right:3rem;}
.px-0{padding-left:0;padding-right:0;}
.px-1{padding-left:.25rem;padding-right:.25rem;}
.px-2{padding-left:.5rem;padding-right:.5rem;}
.px-3{padding-left:1rem;padding-right:1rem;}
.px-4{padding-left:1.5rem;padding-right:1.5rem;}
.px-5{padding-left:3rem;padding-right:3rem;}
.py-0{padding-top:0;padding-bottom:0;}
.py-1{padding-top:.25rem;padding-bottom:.25rem;}
.py-2{padding-top:.5rem;padding-bottom:.5rem;}
.py-3{padding-top:1rem;padding-bottom:1rem;}
.py-4{padding-top:1.5rem;padding-bottom:1.5rem;}
.py-5{padding-top:3rem;padding-bottom:3rem;}
.pl-0{padding-left:0;}
.pl-1{padding-left:.25rem;}
.pl-2{padding-left:.5rem;}
.pl-3{padding-left:1rem;}
.pl-4{padding-left:1.5rem;}
.pl-5{padding-left:3rem;}
.pr-0{padding-right:0;}
.pr-1{padding-right:.25rem;}
.pr-2{padding-right:.5rem;}
.pr-3{padding-right:1rem;}
.pr-4{padding-right:1.5rem;}
.pr-5{padding-right:3rem;}
@media (min-width:576px){.m-sm-0{margin:0;}.m-sm-1{margin:.25rem;}.m-sm-2{margin:.5rem;}.m-sm-3{margin:1rem;}.m-sm-4{margin:1.5rem;}.m-sm-5{margin:3rem;}.mt-sm-0{margin-top:0;}.mt-sm-1{margin-top:.25rem;}.mt-sm-2{margin-top:.5rem;}.mt-sm-3{margin-top:1rem;}.mt-sm-4{margin-top:1.5rem;}.mt-sm-5{margin-top:3rem;}.mb-sm-0{margin-bottom:0;}.mb-sm-1{margin-bottom:.25rem;}.mb-sm-2{margin-bottom:.5rem;}.mb-sm-3{margin-bottom:1rem;}.mb-sm-4{margin-bottom:1.5rem;}.mb-sm-5{margin-bottom:3rem;}.ms-sm-0{margin-left:0;}.ms-sm-1{margin-left:.25rem;}.ms-sm-2{margin-left:.5rem;}.ms-sm-3{margin-left:1rem;}.ms-sm-4{margin-left:1.5rem;}.ms-sm-5{margin-left:3rem;}.me-sm-0{margin-right:0;}.me-sm-1{margin-right:.25rem;}.me-sm-2{margin-right:.5rem;}.me-sm-3{margin-right:1rem;}.me-sm-4{margin-right:1.5rem;}.me-sm-5{margin-right:3rem;}.mx-sm-0{margin-left:0;margin-right:0;}.mx-sm-1{margin-left:.25rem;margin-right:.25rem;}.mx-sm-2{margin-left:.5rem;margin-right:.5rem;}.mx-sm-3{margin-left:1rem;margin-right:1rem;}.mx-sm-4{margin-left:1.5rem;margin-right:1.5rem;}.mx-sm-5{margin-left:3rem;margin-right:3rem;}.my-sm-0{margin-top:0;margin-bottom:0;}.my-sm-1{margin-top:.25rem;margin-bottom:.25rem;}.my-sm-2{margin-top:.5rem;margin-bottom:.5rem;}.my-sm-3{margin-top:1rem;margin-bottom:1rem;}.my-sm-4{margin-top:1.5rem;margin-bottom:1.5rem;}.my-sm-5{margin-top:3rem;margin-bottom:3rem;}.ml-sm-0{margin-left:0;}.ml-sm-1{margin-left:.25rem;}.ml-sm-2{margin-left:.5rem;}.ml-sm-3{margin-left:1rem;}.ml-sm-4{margin-left:1.5rem;}.ml-sm-5{margin-left:3rem;}.mr-sm-0{margin-right:0;}.mr-sm-1{margin-right:.25rem;}.mr-sm-2{margin-right:.5rem;}.mr-sm-3{margin-right:1rem;}.mr-sm-4{margin-right:1.5rem;}.mr-sm-5{margin-right:3rem;}.p-sm-0{padding:0;}.p-sm-1{padding:.25rem;}.p-sm-2{padding:.5rem;}.p-sm-3{padding:1rem;}.p-sm-4{padding:1.5rem;}.p-sm-5{padding:3rem;}.pt-sm-0{padding-top:0;}.pt-sm-1{padding-top:.25rem;}.pt-sm-2{padding-top:.5rem;}.pt-sm-3{padding-top:1rem;}.pt-sm-4{padding-top:1.5rem;}.pt-sm-5{padding-top:3rem;}.pb-sm-0{padding-bottom:0;}.pb-sm-1{padding-bottom:.25rem;}.pb-sm-2{padding-bottom:.5rem;}.pb-sm-3{padding-bottom:1rem;}.pb-sm-4{padding-bottom:1.5rem;}.pb-sm-5{padding-bottom:3rem;}.ps-sm-0{padding-left:0;}.ps-sm-1{padding-left:.25rem;}.ps-sm-2{padding-left:.5rem;}.ps-sm-3{padding-left:1rem;}.ps-sm-4{padding-left:1.5rem;}.ps-sm-5{padding-left:3rem;}.pe-sm-0{padding-right:0;}.pe-sm-1{padding-right:.25rem;}.pe-sm-2{padding-right:.5rem;}.pe-sm-3{padding-right:1rem;}.pe-sm-4{padding-right:1.5rem;}.pe-sm-5{padding-right:3rem;}.px-sm-0{padding-left:0;padding-right:0;}.px-sm-1{padding-left:.25rem;padding-right:.25rem;}.px-sm-2{padding-left:.5rem;padding-right:.5rem;}.px-sm-3{padding-left:1rem;padding-right:1rem;}.px-sm-4{padding-left:1.5rem;padding-right:1.5rem;}.px-sm-5{padding-left:3rem;padding-right:3rem;}.py-sm-0{padding-top:0;padding-bottom:0;}.py-sm-1{padding-top:.25rem;padding-bottom:.25rem;}.py-sm-2{padding-top:.5rem;padding-bottom:.5rem;}.py-sm-3{padding-top:1rem;padding-bottom:1rem;}.py-sm-4{padding-top:1.5rem;padding-bottom:1.5rem;}.py-sm-5{padding-top:3rem;padding-bottom:3rem;}.pl-sm-0{padding-left:0;}.pl-sm-1{padding-left:.25rem;}.pl-sm-2{padding-left:.5rem;}.pl-sm-3{padding-left:1rem;}.pl-sm-4{padding-left:1.5rem;}.pl-sm-5{padding-left:3rem;}.pr-sm-0{padding-right:0;}.pr-sm-1{padding-right:.25rem;}.pr-sm-2{padding-right:.5rem;}.pr-sm-3{padding-right:1rem;}.pr-sm-4{padding-right:1.5rem;}.pr-sm-5{padding-right:3rem;}}
@media (min-width:768px){.m-md-0{margin:0;}.m-md-1{margin:.25rem;}.m-md-2{margin:.5rem;}.m-md-3{margin:1rem;}.m-md-4{margin:1.5rem;}.m-md-5{margin:3rem;}.mt-md-0{margin-top:0;}.mt-md-1{margin-top:.25rem;}.mt-md-2{margin-top:.5rem;}.mt-md-3{margin-top:1rem;}.mt-md-4{margin-top:1.5rem;}.mt-md-5{margin-top:3rem;}.mb-md-0{margin-bottom:0;}.mb-md-1{margin-bottom:.25rem;}.mb-md-2{margin-bottom:.5rem;}.mb-md-3{margin-bottom:1rem;}.mb-md-4{margin-bottom:1.5rem;}.mb-md-5{margin-bottom:3rem;}.ms-md-0{margin-left:0;}.ms-md-1{margin-left:.25rem;}.ms-md-2{margin-left:.5rem;}.ms-md-3{margin-left:1rem;}.ms-md-4{margin-left:1.5rem;}.ms-md-5{margin-left:3rem;}.me-md-0{margin-right:0;}.me-md-1{margin-right:.25rem;}.me-md-2{margin-right:.5rem;}.me-md-3{margin-right:1rem;}.me-md-4{margin-right:1.5rem;}.me-md-5{margin-right:3rem;}.mx-md-0{margin-left:0;margin-right:0;}.mx-md-1{margin-left:.25rem;margin-right:.25rem;}.mx-md-2{margin-left:.5rem;margin-right:.5rem;}.mx-md-3{margin-left:1rem;margin-right:1rem;}.mx-md-4{margin-left:1.5rem;margin-right:1.5rem;}.mx-md-5{margin-left:3rem;margin-right:3rem;}.my-md-0{margin-top:0;margin-bottom:0;}.my-md-1{margin-top:.25rem;margin-bottom:.25rem;}.my-md-2{margin-top:.5rem;margin-bottom:.5rem;}.my-md-3{margin-top:1rem;margin-bottom:1rem;}.my-md-4{margin-top:1.5rem;margin-bottom:1.5rem;}.my-md-5{margin-top:3rem;margin-bottom:3rem;}.ml-md-0{margin-left:0;}.ml-md-1{margin-left:.25rem;}.ml-md-2{margin-left:.5rem;}.ml-md-3{margin-left:1rem;}.ml-md-4{margin-left:1.5rem;}.ml-md-5{margin-left:3rem;}.mr-md-0{margin-right:0;}.mr-md-1{margin-right:.25rem;}.mr-md-2{margin-right:.5rem;}.mr-md-3{margin-right:1rem;}.mr-md-4{margin-right:1.5rem;}.mr-md-5{margin-right:3rem;}.p-md-0{padding:0;}.p-md-1{padding:.25rem;}.p-md-2{padding:.5rem;}.p-md-3{padding:1rem;}.p-md-4{padding:1.5rem;}.p-md-5{padding:3rem;}.pt-md-0{padding-top:0;}.pt-md-1{padding-top:.25rem;}.pt-md-2{padding-top:.5rem;}.pt-md-3{padding-top:1rem;}.pt-md-4{padding-top:1.5rem;}.pt-md-5{padding-top:3rem;}.pb-md-0{padding-bottom:0;}.pb-md-1{padding-bottom:.25rem;}.pb-md-2{padding-bottom:.5rem;}.pb-md-3{padding-bottom:1rem;}.pb-md-4{padding-bottom:1.5rem;}.pb-md-5{padding-bottom:3rem;}.ps-md-0{padding-left:0;}.ps-md-1{padding-left:.25rem;}.ps-md-2{padding-left:.5rem;}.ps-md-3{padding-left:1rem;}.ps-md-4{padding-left:1.5rem;}.ps-md-5{padding-left:3rem;}.pe-md-0{padding-right:0;}.pe-md-1{padding-right:.25rem;}.pe-md-2{padding-right:.5rem;}.pe-md-3{padding-right:1rem;}.pe-md-4{padding-right:1.5rem;}.pe-md-5{padding-right:3rem;}.px-md-0{padding-left:0;padding-right:0;}.px-md-1{padding-left:.25rem;padding-right:.25rem;}.px-md-2{padding-left:.5rem;padding-right:.5rem;}.px-md-3{padding-left:1rem;padding-right:1rem;}.px-md-4{padding-left:1.5rem;padding-right:1.5rem;}.px-md-5{padding-left:3rem;padding-right:3rem;}.py-md-0{padding-top:0;padding-bottom:0;}.py-md-1{padding-top:.25rem;padding-bottom:.25rem;}.py-md-2{padding-top:.5rem;padding-bottom:.5rem;}.py-md-3{padding-top:1rem;padding-bottom:1rem;}.py-md-4{padding-top:1.5rem;padding-bottom:1.5rem;}.py-md-5{padding-top:3rem;padding-bottom:3rem;}.pl-md-0{padding-left:0;}.pl-md-1{padding-left:.25rem;}.pl-md-2{padding-left:.5rem;}.pl-md-3{padding-left:1rem;}.pl-md-4{padding-left:1.5rem;}.pl-md-5{padding-left:3rem;}.pr-md-0{padding-right:0;}.pr-md-1{padding-right:.25rem;}.pr-md-2{padding-right:.5rem;}.pr-md-3{padding-right:1rem;}.pr-md-4{padding-right:1.5rem;}.pr-md-5{padding-right:3rem;}}
@media (min-width:992px){.m-lg-0{margin:0;}.m-lg-1{margin:.25rem;}.m-lg-2{margin:.5rem;}.m-lg-3{margin:1rem;}.m-lg-4{margin:1.5rem;}.m-lg-5{margin:3rem;}.mt-lg-0{margin-top:0;}.mt-lg-1{margin-top:.25rem;}.mt-lg-2{margin-top:.5rem;}.mt-lg-3{margin-top:1rem;}.mt-lg-4{margin-top:1.5rem;}.mt-lg-5{margin-top:3rem;}.mb-lg-0{margin-bottom:0;}.mb-lg-1{margin-bottom:.25rem;}.mb-lg-2{margin-bottom:.5rem;}.mb-lg-3{margin-bottom:1rem;}.mb-lg-4{margin-bottom:1.5rem;}.mb-lg-5{margin-bottom:3rem;}.ms-lg-0{margin-left:0;}.ms-lg-1{margin-left:.25rem;}.ms-lg-2{margin-left:.5rem;}.ms-lg-3{margin-left:1rem;}.ms-lg-4{margin-left:1.5rem;}.ms-lg-5{margin-left:3rem;}.me-lg-0{margin-right:0;}.me-lg-1{margin-right:.25rem;}.me-lg-2{margin-right:.5rem;}.me-lg-3{margin-right:1rem;}.me-lg-4{margin-right:1.5rem;}.me-lg-5{margin-right:3rem;}.mx-lg-0{margin-left:0;margin-right:0;}.mx-lg-1{margin-left:.25rem;margin-right:.25rem;}.mx-lg-2{margin-left:.5rem;margin-right:.5rem;}.mx-lg-3{margin-left:1rem;margin-right:1rem;}.mx-lg-4{margin-left:1.5rem;margin-right:1.5rem;}.mx-lg-5{margin-left:3rem;margin-right:3rem;}.my-lg-0{margin-top:0;margin-bottom:0;}.my-lg-1{margin-top:.25rem;margin-bottom:.25rem;}.my-lg-2{margin-top:.5rem;margin-bottom:.5rem;}.my-lg-3{margin-top:1rem;margin-bottom:1rem;}.my-lg-4{margin-top:1.5rem;margin-bottom:1.5rem;}.my-lg-5{margin-top:3rem;margin-bottom:3rem;}.ml-lg-0{margin-left:0;}.ml-lg-1{margin-left:.25rem;}.ml-lg-2{margin-left:.5rem;}.ml-lg-3{margin-left:1rem;}.ml-lg-4{margin-left:1.5rem;}.ml-lg-5{margin-left:3rem;}.mr-lg-0{margin-right:0;}.mr-lg-1{margin-right:.25rem;}.mr-lg-2{margin-right:.5rem;}.mr-lg-3{margin-right:1rem;}.mr-lg-4{margin-right:1.5rem;}.mr-lg-5{margin-right:3rem;}.p-lg-0{padding:0;}.p-lg-1{padding:.25rem;}.p-lg-2{padding:.5rem;}.p-lg-3{padding:1rem;}.p-lg-4{padding:1.5rem;}.p-lg-5{padding:3rem;}.pt-lg-0{padding-top:0;}.pt-lg-1{padding-top:.25rem;}.pt-lg-2{padding-top:.5rem;}.pt-lg-3{padding-top:1rem;}.pt-lg-4{padding-top:1.5rem;}.pt-lg-5{padding-top:3rem;}.pb-lg-0{padding-bottom:0;}.pb-lg-1{padding-bottom:.25rem;}.pb-lg-2{padding-bottom:.5rem;}.pb-lg-3{padding-bottom:1rem;}.pb-lg-4{padding-bottom:1.5rem;}.pb-lg-5{padding-bottom:3rem;}.ps-lg-0{padding-left:0;}.ps-lg-1{padding-left:.25rem;}.ps-lg-2{padding-left:.5rem;}.ps-lg-3{padding-left:1rem;}.ps-lg-4{padding-left:1.5rem;}.ps-lg-5{padding-left:3rem;}.pe-lg-0{padding-right:0;}.pe-lg-1{padding-right:.25rem;}.pe-lg-2{padding-right:.5rem;}.pe-lg-3{padding-right:1rem;}.pe-lg-4{padding-right:1.5rem;}.pe-lg-5{padding-right:3rem;}.px-lg-0{padding-left:0;padding-right:0;}.px-lg-1{padding-left:.25rem;padding-right:.25rem;}.px-lg-2{padding-left:.5rem;padding-right:.5rem;}.px-lg-3{padding-left:1rem;padding-right:1rem;}.px-lg-4{padding-left:1.5rem;padding-right:1.5rem;}.px-lg-5{padding-left:3rem;padding-right:3rem;}.py-lg-0{padding-top:0;padding-bottom:0;}.py-lg-1{padding-top:.25rem;padding-bottom:.25rem;}.py-lg-2{padding-top:.5rem;padding-bottom:.5rem;}.py-lg-3{padding-top:1rem;padding-bottom:1rem;}.py-lg-4{padding-top:1.5rem;padding-bottom:1.5rem;}.py-lg-5{padding-top:3rem;padding-bottom:3rem;}.pl-lg-0{padding-left:0;}.pl-lg-1{padding-left:.25rem;}.pl-lg-2{padding-left:.5rem;}.pl-lg-3{padding-left:1rem;}.pl-lg-4{padding-left:1.5rem;}.pl-lg-5{padding-left:3rem;}.pr-lg-0{padding-right:0;}.pr-lg-1{padding-right:.25rem;}.pr-lg-2{padding-right:.5rem;}.pr-lg-3{padding-right:1rem;}.pr-lg-4{padding-right:1.5rem;}.pr-lg-5{padding-right:3rem;}}

/* legacy spacing names still present in the views */
.m-b-0{margin-bottom:0}.m-t-0{margin-top:0}.p-b-0{padding-bottom:0}.p-t-0{padding-top:0}
.m-b-1{margin-bottom:.25rem}.m-t-1{margin-top:.25rem}.p-b-1{padding-bottom:.25rem}.p-t-1{padding-top:.25rem}
.m-b-2{margin-bottom:.5rem}.m-t-2{margin-top:.5rem}.p-b-2{padding-bottom:.5rem}.p-t-2{padding-top:.5rem}
.m-b-3{margin-bottom:1rem}.m-t-3{margin-top:1rem}.p-b-3{padding-bottom:1rem}.p-t-3{padding-top:1rem}
.m-b-4{margin-bottom:1.5rem}.m-t-4{margin-top:1.5rem}.p-b-4{padding-bottom:1.5rem}.p-t-4{padding-top:1.5rem}
.m-b-5{margin-bottom:3rem}.m-t-5{margin-top:3rem}.p-b-5{padding-bottom:3rem}.p-t-5{padding-top:3rem}
.m-b-5{margin-bottom:5px}.m-b-0{margin-bottom:0}.m-b-10{margin-bottom:10px}.m-b-15{margin-bottom:15px}.m-b-20{margin-bottom:20px}
.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mr-3{margin-right:1rem}.ml-1{margin-left:.25rem}.ml-2{margin-left:.5rem}.ml-3{margin-left:1rem}

/* ---------- display / flex ---------- */
.d-none{display:none!important}.d-block{display:block}.d-inline{display:inline}
.d-inline-block{display:inline-block}.d-flex{display:flex}.d-inline-flex{display:inline-flex}
.d-grid{display:grid}.d-table{display:table}
@media (min-width:576px){.d-sm-none{display:none!important}.d-sm-block{display:block}.d-sm-flex{display:flex}.d-sm-inline-block{display:inline-block}}
@media (min-width:768px){.d-md-none{display:none!important}.d-md-block{display:block}.d-md-flex{display:flex}.d-md-inline-block{display:inline-block}}
@media (min-width:992px){.d-lg-none{display:none!important}.d-lg-block{display:block}.d-lg-flex{display:flex}.d-lg-inline-block{display:inline-block}}
@media (max-width:991.98px){.d-lg-none-down{display:none}}
.flex-row{flex-direction:row}.flex-column{flex-direction:column}.flex-wrap{flex-wrap:wrap}
.flex-nowrap{flex-wrap:nowrap}.flex-fill{flex:1 1 auto}.flex-grow-1{flex-grow:1}.flex-shrink-0{flex-shrink:0}
.align-items-start{align-items:flex-start}.align-items-center{align-items:center}
.align-items-end{align-items:flex-end}.align-items-baseline{align-items:baseline}.align-items-stretch{align-items:stretch}
.align-self-center{align-self:center}.align-self-start{align-self:flex-start}.align-self-end{align-self:flex-end}
.align-middle{vertical-align:middle}.align-top{vertical-align:top}
.justify-content-start{justify-content:flex-start}.justify-content-center{justify-content:center}
.justify-content-end{justify-content:flex-end}.justify-content-between{justify-content:space-between}
.justify-content-around{justify-content:space-around}.justify-content-evenly{justify-content:space-evenly}

/* ---------- sizing / position ---------- */
.w-25{width:25%}.w-50{width:50%}.w-75{width:75%}.w-100{width:100%}.w-auto{width:auto}
.h-25{height:25%}.h-50{height:50%}.h-75{height:75%}.h-100{height:100%}.h-auto{height:auto}
.mw-100{max-width:100%}.mh-100{max-height:100%}.min-vh-100{min-height:100vh}.vh-100{height:100vh}
.position-relative{position:relative}.position-absolute{position:absolute}.position-fixed{position:fixed}
.position-static{position:static}.sticky-top{position:sticky;top:0;z-index:20}
.top-0{top:0}.bottom-0{bottom:0}.start-0{left:0}.end-0{right:0}
.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}
.float-end{float:right}.float-start{float:left}
.absolute-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.hpx-120{height:120px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

/* ---------- text ---------- */
.text-start,.text-left{text-align:left}.text-center{text-align:center}.text-end,.text-right{text-align:right}
.text-uppercase{text-transform:uppercase}.text-lowercase{text-transform:lowercase}.text-capitalize{text-transform:capitalize}
.text-nowrap{white-space:nowrap}
.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.text-decoration-underline{text-decoration:underline}.text-decoration-none{text-decoration:none}
.text-break{word-break:break-word}
.fw-light{font-weight:300}.fw-normal{font-weight:400}.fw-medium{font-weight:500}
.fw-semibold{font-weight:600}.fw-bold,.font-weight-bold{font-weight:700}.fw-bolder{font-weight:800}
.font-weight-medium{font-weight:500}
.fst-italic{font-style:italic}
.lh-1{line-height:1}.lh-sm{line-height:1.3}.lh-base{line-height:1.6}
.text-muted{color:var(--ink-3)}
.text-primary{color:var(--primary)}.text-secondary{color:var(--secondary)}
.text-success{color:var(--success)}.text-danger{color:var(--danger)}
.text-warning{color:var(--warning)}.text-info{color:var(--info)}
.text-dark{color:var(--ink)}.text-body{color:var(--ink-2)}
.text-white{color:#fff}.text-light{color:#fff}.text-black{color:#000}
.font-10{font-size:10px}.font-12{font-size:12px}.font-13{font-size:13px}.font-14{font-size:14px}
.font-16{font-size:16px}.font-18{font-size:18px}.font-20{font-size:20px}.font-22{font-size:22px}
.font-24{font-size:24px}.font-50{font-size:50px}
.fs-1{font-size:2rem}.fs-2{font-size:1.6rem}.fs-3{font-size:1.35rem}.fs-4{font-size:1.15rem}.fs-5{font-size:1rem}.fs-6{font-size:.875rem}
.display-1{font-size:3.5rem;font-weight:800}.display-4{font-size:2.2rem;font-weight:800}

/* ---------- backgrounds / borders ---------- */
.bg-primary{background:var(--primary);color:#fff}.bg-secondary{background:var(--secondary);color:#fff}
.bg-success{background:var(--success);color:#fff}.bg-danger{background:var(--danger);color:#fff}
.bg-warning{background:var(--warning);color:#fff}.bg-info{background:var(--info);color:#fff}
.bg-dark{background:var(--ink);color:#fff}.bg-light{background:var(--canvas)}
.bg-white{background:#fff}.bg-transparent{background:transparent}
.bg-light-blue{background:var(--primary-050)}
.bg-soft-primary{background:var(--primary-050);color:var(--primary-600)}
.bg-soft-secondary{background:var(--secondary-050);color:var(--ink-2)}
.bg-soft-success{background:var(--success-050);color:var(--success)}
.bg-soft-danger{background:var(--danger-050);color:var(--danger)}
.bg-soft-warning{background:var(--warning-050);color:var(--warning)}
.bg-soft-info{background:var(--info-050);color:var(--info)}
.border{border:1px solid var(--line)}.border-0{border:0}
.border-top{border-top:1px solid var(--line)}.border-bottom{border-bottom:1px solid var(--line)}
.border-start{border-left:1px solid var(--line)}.border-end{border-right:1px solid var(--line)}
.border-primary{border-color:var(--primary)}.border-danger{border-color:var(--danger)}
.border-dashed{border:1px dashed var(--line-2)}
.rounded{border-radius:var(--r)}.rounded-0{border-radius:0}.rounded-1{border-radius:var(--r-sm)}
.rounded-2{border-radius:var(--r)}.rounded-3{border-radius:var(--r-lg)}
.rounded-circle{border-radius:50%}.rounded-pill{border-radius:999px}
.shadow-none{box-shadow:none}.shadow-sm{box-shadow:var(--sh-1)}.shadow{box-shadow:var(--sh-2)}.shadow-lg{box-shadow:var(--sh-3)}
.opacity-50{opacity:.5}.opacity-75{opacity:.75}

/* ==========================================================================
   Components
   ========================================================================== */

/* ---------- card ---------- */
.card {
  position: relative;
  display: flex; flex-direction: column;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-1);
  margin-bottom: 1.5rem;
}
.card.border-dashed { border-style: dashed; border-color: var(--line-2); }
.card-header {
  padding: 1.05rem 1.35rem;
  border-bottom: 1px solid var(--line);
  background: transparent;
  border-radius: var(--r-lg) var(--r-lg) 0 0;
}
.card-header h1,.card-header h2,.card-header h3,.card-header h4,.card-header h5 { margin-bottom: 0; }
.card-body { padding: 1.35rem; flex: 1 1 auto; }
.card-footer {
  padding: 1.05rem 1.35rem;
  border-top: 1px solid var(--line);
  background: transparent;
  border-radius: 0 0 var(--r-lg) var(--r-lg);
}
.card-title { font-size: 1rem; font-weight: 700; color: var(--ink); margin-bottom: .4rem; }
.card-text { color: var(--ink-3); margin-bottom: 0; }
.card-img-top { width: 100%; border-radius: var(--r-lg) var(--r-lg) 0 0; }
.card.h-100 { margin-bottom: 0; }

/* ---------- buttons ---------- */
.btn {
  --btn-bg: var(--secondary-050); --btn-fg: var(--ink); --btn-bd: transparent; --btn-bg-h: var(--line);
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  padding: .58rem 1.15rem;
  font-family: inherit; font-size: .875rem; font-weight: 600; line-height: 1.3;
  color: var(--btn-fg); background: var(--btn-bg);
  border: 1px solid var(--btn-bd); border-radius: 10px;
  cursor: pointer; text-align: center; white-space: nowrap;
  transition: background .18s, color .18s, border-color .18s, box-shadow .18s, transform .18s;
}
.btn:hover { background: var(--btn-bg-h); color: var(--btn-fg); }
.btn:active { transform: translateY(1px); }
.btn:disabled, .btn.disabled { opacity: .55; pointer-events: none; }
.btn i, .btn .material-icons-two-tone, .btn .material-symbols-outlined { font-size: 1.05em; line-height: 1; }

.btn-primary{--btn-bg:var(--primary);--btn-fg:#fff;--btn-bg-h:var(--primary-600);box-shadow:0 2px 8px rgba(47,98,224,.25)}
.btn-secondary{--btn-bg:var(--secondary);--btn-fg:#fff;--btn-bg-h:#4E5A6E}
.btn-success{--btn-bg:var(--success);--btn-fg:#fff;--btn-bg-h:#128840}
.btn-danger{--btn-bg:var(--danger);--btn-fg:#fff;--btn-bg-h:#B91C1C}
.btn-warning{--btn-bg:var(--warning);--btn-fg:#fff;--btn-bg-h:#B45309}
.btn-info{--btn-bg:var(--info);--btn-fg:#fff;--btn-bg-h:#0E7490}
.btn-dark{--btn-bg:var(--ink);--btn-fg:#fff;--btn-bg-h:#0A1230}
.btn-light{--btn-bg:#fff;--btn-fg:var(--ink);--btn-bd:var(--line);--btn-bg-h:var(--canvas)}
.btn-link{--btn-bg:transparent;--btn-fg:var(--primary);--btn-bg-h:transparent;padding-inline:.25rem}
.btn-link:hover{text-decoration:underline}

.btn-outline-primary{--btn-bg:transparent;--btn-fg:var(--primary);--btn-bd:var(--primary);--btn-bg-h:var(--primary)}
.btn-outline-secondary{--btn-bg:transparent;--btn-fg:var(--secondary);--btn-bd:var(--line-2);--btn-bg-h:var(--secondary)}
.btn-outline-success{--btn-bg:transparent;--btn-fg:var(--success);--btn-bd:var(--success);--btn-bg-h:var(--success)}
.btn-outline-danger{--btn-bg:transparent;--btn-fg:var(--danger);--btn-bd:var(--danger);--btn-bg-h:var(--danger)}
.btn-outline-warning{--btn-bg:transparent;--btn-fg:var(--warning);--btn-bd:var(--warning);--btn-bg-h:var(--warning)}
.btn-outline-info{--btn-bg:transparent;--btn-fg:var(--info);--btn-bd:var(--info);--btn-bg-h:var(--info)}
.btn-outline-dark{--btn-bg:transparent;--btn-fg:var(--ink);--btn-bd:var(--line-2);--btn-bg-h:var(--ink)}
[class*="btn-outline-"]:hover { color: #fff; border-color: transparent; }

.btn-sm{padding:.38rem .75rem;font-size:.8rem;border-radius:8px}
.btn-lg{padding:.8rem 1.6rem;font-size:1rem;border-radius:12px}
.btn-group{display:inline-flex;gap:.35rem}
.btn-group>.btn{border-radius:10px}
.d-grid>.btn{width:100%}
.btn-close{
  width:32px;height:32px;padding:0;border:0;border-radius:9px;background:var(--secondary-050);
  cursor:pointer;position:relative;flex:0 0 auto;
}
.btn-close::before,.btn-close::after{
  content:'';position:absolute;inset:50% 9px auto 9px;height:1.6px;background:var(--ink-2);border-radius:2px;
}
.btn-close::before{transform:rotate(45deg)}.btn-close::after{transform:rotate(-45deg)}
.btn-close:hover{background:var(--danger-050)}
.btn-close:hover::before,.btn-close:hover::after{background:var(--danger)}

/* ---------- forms ---------- */
label, .form-label { display: inline-block; margin-bottom: .35rem; font-size: .8125rem; font-weight: 600; color: var(--ink); }
.form-control, .form-select, input[type=text], input[type=email], input[type=password],
input[type=number], input[type=tel], input[type=url], input[type=search],
input[type=date], input[type=datetime-local], input[type=time], textarea, select {
  display: block; width: 100%;
  padding: .62rem .85rem;
  font-family: inherit; font-size: .875rem; line-height: 1.5;
  color: var(--ink); background: #fff;
  border: 1px solid var(--line-2); border-radius: 10px;
  transition: border-color .18s, box-shadow .18s;
  appearance: none;
}
.form-select, select {
  padding-right: 2.2rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%236B7694' stroke-width='1.8'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .75rem center; background-size: 15px;
}
.form-control:focus, .form-select:focus, textarea:focus, select:focus, input:focus {
  outline: 0; border-color: var(--primary); box-shadow: 0 0 0 3.5px rgba(47,98,224,.13);
}
.form-control::placeholder, textarea::placeholder { color: var(--ink-4); }
.form-control:disabled, .form-control[readonly], select:disabled { background: var(--canvas); color: var(--ink-3); }
textarea.form-control, textarea { min-height: 96px; resize: vertical; }
.form-control-sm { padding: .38rem .65rem; font-size: .8rem; border-radius: 8px; }
.form-control.p-1 { padding: .25rem; }
.form-text { font-size: .78rem; color: var(--ink-3); }
.form-group { margin-bottom: 1rem; }
.invalid-feedback, .text-danger.small { color: var(--danger); font-size: .78rem; }
.is-invalid, .form-control.is-invalid { border-color: var(--danger); }
.form-check { display: flex; align-items: center; gap: .5rem; margin-bottom: .35rem; }
.form-check-input { width: 17px; height: 17px; margin: 0; accent-color: var(--primary); }
.form-check-label { margin: 0; font-weight: 500; }
input[type=color] { padding: 3px; height: 42px; }
input[type=file] { padding: .45rem .6rem; }

.input-group { display: flex; width: 100%; }
.input-group > * { border-radius: 0; }
.input-group > :first-child { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
.input-group > :last-child { border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
.input-group > .form-control { flex: 1 1 auto; width: 1%; min-width: 0; }
.input-group-text, .input-group-prepend > .input-group-text, .input-group-append > .input-group-text {
  display: flex; align-items: center;
  padding: .62rem .9rem;
  font-size: .8125rem; font-weight: 600; color: var(--ink-2);
  background: var(--secondary-050); border: 1px solid var(--line-2); white-space: nowrap;
}
.input-group > * + * { margin-left: -1px; }
.input-group .form-control:focus { position: relative; z-index: 2; }

/* clean-switch replacement */
.cl-switch { display: inline-flex; align-items: center; gap: .55rem; cursor: pointer; margin: 0; }
.cl-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.cl-switch .switcher {
  position: relative; display: block; width: 42px; height: 23px; flex: 0 0 auto;
  background: var(--line-2); border-radius: 99px; transition: background .22s var(--ease);
}
.cl-switch .switcher::after {
  content: ''; position: absolute; top: 3px; left: 3px; width: 17px; height: 17px;
  background: #fff; border-radius: 50%; box-shadow: var(--sh-1);
  transition: transform .22s var(--ease);
}
.cl-switch input:checked + .switcher { background: var(--success); }
.cl-switch input:checked + .switcher::after { transform: translateX(19px); }
.cl-switch .label { font-size: .8125rem; font-weight: 600; color: var(--ink-2); }

/* icheck-material replacement */
[class*="icheck-material-"] { position: relative; display: inline-flex; align-items: center; }
[class*="icheck-material-"] input { position: absolute; opacity: 0; width: 0; height: 0; }
[class*="icheck-material-"] label { position: relative; padding-left: 26px; margin: 0; cursor: pointer; font-weight: 500; }
[class*="icheck-material-"] label::before {
  content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 17px; height: 17px; border: 1.8px solid var(--line-2); border-radius: 50%; background: #fff;
  transition: border-color .18s;
}
[class*="icheck-material-"] label::after {
  content: ''; position: absolute; left: 4.5px; top: 50%; transform: translateY(-50%) scale(0);
  width: 8px; height: 8px; border-radius: 50%; transition: transform .18s var(--ease);
}
[class*="icheck-material-"] input[type=checkbox] + label::before { border-radius: 5px; }
[class*="icheck-material-"] input:checked + label::after { transform: translateY(-50%) scale(1); }
.icheck-material-green input:checked + label::before{border-color:var(--success)}
.icheck-material-green input:checked + label::after{background:var(--success)}
.icheck-material-red input:checked + label::before{border-color:var(--danger)}
.icheck-material-red input:checked + label::after{background:var(--danger)}
.icheck-material-blue input:checked + label::before,.icheck-material-indigo input:checked + label::before{border-color:var(--primary)}
.icheck-material-blue input:checked + label::after,.icheck-material-indigo input:checked + label::after{background:var(--primary)}
.icheck-material-orange input:checked + label::before{border-color:var(--warning)}
.icheck-material-orange input:checked + label::after{background:var(--warning)}
.icheck-material-teal input:checked + label::before{border-color:var(--info)}
.icheck-material-teal input:checked + label::after{background:var(--info)}

/* ---------- tables ---------- */
.table-responsive { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table {
  width: 100%; margin-bottom: 0; border-collapse: separate; border-spacing: 0;
  font-size: .8125rem; color: var(--ink-2);
}
.table > thead th, .table th {
  padding: .8rem .9rem; text-align: left; vertical-align: middle;
  font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  color: var(--ink-3); background: var(--canvas);
  border-bottom: 1px solid var(--line); white-space: nowrap;
}
.table > thead th:first-child { border-top-left-radius: 10px; }
.table > thead th:last-child { border-top-right-radius: 10px; }
.table td { padding: .8rem .9rem; vertical-align: middle; border-bottom: 1px solid var(--line); }
.table tbody tr:last-child td { border-bottom: 0; }
.table-hover tbody tr { transition: background .15s; }
.table-hover tbody tr:hover { background: var(--primary-050); }
.table-striped tbody tr:nth-child(odd) { background: rgba(244,246,251,.6); }
.table-bordered th, .table-bordered td { border: 1px solid var(--line); }
.table-sm th, .table-sm td { padding: .5rem .65rem; }
.table-borderless th, .table-borderless td { border: 0; }
.table .btn-sm { padding: .3rem .6rem; }
.table-dark th { background: var(--ink); color: #fff; }
.card > .table-responsive:last-child { border-radius: 0 0 var(--r-lg) var(--r-lg); }

/* ---------- badges ---------- */
.badge {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .3rem .65rem;
  font-size: .72rem; font-weight: 700; letter-spacing: .02em; line-height: 1.35;
  border-radius: 999px; color: #fff; background: var(--secondary);
  text-transform: capitalize; white-space: nowrap;
}
.badge.bg-primary{background:var(--primary-050);color:var(--primary-600)}
.badge.bg-secondary{background:var(--secondary-050);color:var(--ink-2)}
.badge.bg-success{background:var(--success-050);color:var(--success)}
.badge.bg-danger{background:var(--danger-050);color:var(--danger)}
.badge.bg-warning{background:var(--warning-050);color:var(--warning)}
.badge.bg-info{background:var(--info-050);color:var(--info)}
.badge.bg-dark{background:var(--ink);color:#fff}
.badge.bg-light{background:var(--canvas);color:var(--ink-2)}

/* ---------- alerts ---------- */
.alert {
  position: relative; padding: .85rem 1.1rem; margin-bottom: 1rem;
  border: 1px solid transparent; border-left-width: 3px; border-radius: var(--r);
  font-size: .875rem;
}
.alert-success{background:var(--success-050);border-color:var(--success);color:#0F6B33}
.alert-danger{background:var(--danger-050);border-color:var(--danger);color:#9F1D1D}
.alert-warning{background:var(--warning-050);border-color:var(--warning);color:#8A4B04}
.alert-info{background:var(--info-050);border-color:var(--info);color:#0B6C84}
.alert-primary{background:var(--primary-050);border-color:var(--primary);color:var(--primary-600)}
.alert-secondary{background:var(--secondary-050);border-color:var(--secondary);color:var(--ink-2)}
.alert .btn-close { position: absolute; top: .55rem; right: .55rem; }

/* ---------- nav / tabs / pills ---------- */
.nav { display: flex; flex-wrap: wrap; list-style: none; padding: 0; margin: 0; gap: .3rem; }
.nav-link {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .55rem 1rem; border-radius: 10px;
  font-size: .875rem; font-weight: 600; color: var(--ink-3);
  border: 0; background: transparent; cursor: pointer; transition: background .18s, color .18s;
}
.nav-link:hover { color: var(--ink); background: var(--secondary-050); }
.nav-link.active { color: var(--primary-600); background: var(--primary-050); }
.nav-tabs { border-bottom: 1px solid var(--line); gap: .15rem; margin-bottom: 1.25rem; }
.nav-tabs .nav-link { border-radius: 10px 10px 0 0; margin-bottom: -1px; border-bottom: 2px solid transparent; }
.nav-tabs .nav-link.active { background: transparent; border-bottom-color: var(--primary); color: var(--primary-600); }
.nav-pills .nav-link.active { background: var(--primary); color: #fff; }
.tab-content > .tab-pane { display: none; }
.tab-content > .tab-pane.active, .tab-content > .active { display: block; }
.arrow-none::after { display: none !important; }

/* ---------- dropdown ---------- */
.dropdown, .dropup { position: relative; }
.dropdown-menu {
  position: absolute; z-index: 60; top: 100%; right: 0; left: auto;
  display: none; min-width: 190px; margin-top: .4rem; padding: .4rem;
  background: #fff; border: 1px solid var(--line); border-radius: var(--r);
  box-shadow: var(--sh-2); list-style: none;
}
.dropdown-menu.show, .dropdown-menu[data-open="true"] { display: block; animation: nrPop .16s var(--ease); }
@keyframes nrPop { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.dropdown-menu-end { right: 0; left: auto; }
.dropdown-item {
  display: flex; align-items: center; gap: .55rem; width: 100%;
  padding: .5rem .7rem; border-radius: 8px;
  font-size: .8125rem; font-weight: 500; color: var(--ink-2);
  background: transparent; border: 0; text-align: left; cursor: pointer;
}
.dropdown-item:hover { background: var(--secondary-050); color: var(--ink); }
.dropdown-divider { height: 1px; margin: .35rem 0; background: var(--line); border: 0; }
.dropdown-header { padding: .5rem .7rem; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-4); font-weight: 700; }

/* ---------- modal ---------- */
.modal {
  position: fixed; inset: 0; z-index: 1055; display: none;
  overflow-x: hidden; overflow-y: auto; outline: 0;
}
.modal.show { display: block; }
.modal-backdrop { position: fixed; inset: 0; z-index: 1050; background: rgba(17,27,58,.55); backdrop-filter: blur(2px); }
.modal-backdrop.show { opacity: 1; }
.modal-dialog {
  position: relative; width: auto; max-width: 560px;
  margin: 1.75rem auto; pointer-events: none;
  transition: transform .22s var(--ease);
}
.modal.fade .modal-dialog { transform: translateY(-14px); }
.modal.show .modal-dialog { transform: none; }
.modal-dialog-centered { display: flex; align-items: center; min-height: calc(100% - 3.5rem); }
.modal-dialog-scrollable { height: calc(100% - 3.5rem); }
.modal-dialog-scrollable .modal-content { max-height: 100%; overflow: hidden; }
.modal-dialog-scrollable .modal-body { overflow-y: auto; }
.modal-sm { max-width: 380px; } .modal-lg { max-width: 800px; } .modal-xl { max-width: 1140px; }
.modal-fullscreen { max-width: none; width: 100%; height: 100%; margin: 0; }
.modal-fullscreen .modal-content { height: 100%; border-radius: 0; }
.modal-content {
  position: relative; display: flex; flex-direction: column; width: 100%;
  background: #fff; border: 0; border-radius: var(--r-lg);
  box-shadow: var(--sh-3); pointer-events: auto;
}
.modal-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.35rem; border-bottom: 1px solid var(--line); }
.modal-title { margin: 0; font-size: 1rem; font-weight: 700; }
.modal-body { position: relative; flex: 1 1 auto; padding: 1.35rem; }
.modal-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .5rem; padding: 1rem 1.35rem; border-top: 1px solid var(--line); }
body.modal-open { overflow: hidden; }

/* ---------- pagination ---------- */
.pagination { display: flex; flex-wrap: wrap; gap: .3rem; list-style: none; padding: 0; margin: 0; }
.page-link, .pagination a, .pagination span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; height: 36px; padding: 0 .6rem;
  font-size: .8125rem; font-weight: 600; color: var(--ink-2);
  background: #fff; border: 1px solid var(--line); border-radius: 9px;
  transition: background .18s, color .18s, border-color .18s;
}
.pagination a:hover { border-color: var(--primary); color: var(--primary); }
.page-item.active .page-link, .pagination .active span { background: var(--primary); border-color: var(--primary); color: #fff; }
.page-item.disabled .page-link, .pagination .disabled span { opacity: .45; }
.pagination svg { width: 15px; height: 15px; }
.custom_pagination { display: flex; justify-content: flex-end; }
.custom_pagination nav > div:first-child { display: none; }

/* ---------- progress / misc ---------- */
.progress { height: 8px; background: var(--secondary-050); border-radius: 99px; overflow: hidden; }
.progress-bar { height: 100%; background: var(--primary); }
.avatar { width: 38px; height: 38px; border-radius: 50%; object-fit: cover; background: var(--secondary-050); }
.breadcrumb { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; margin: 0 0 1.25rem; font-size: .8125rem; }
.breadcrumb-item { color: var(--ink-3); }
.breadcrumb-item + .breadcrumb-item::before { content: '/'; margin-right: .5rem; color: var(--ink-4); }
.breadcrumb-item.active { color: var(--ink); font-weight: 600; }
.spinner-border, .spinner-border-sm {
  display: inline-block; width: 1rem; height: 1rem; vertical-align: -.125em;
  border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%;
  animation: nrSpin .7s linear infinite;
}
@keyframes nrSpin { to { transform: rotate(360deg); } }
.list-group { display: flex; flex-direction: column; border-radius: var(--r); overflow: hidden; border: 1px solid var(--line); }
.list-group-item { padding: .8rem 1rem; background: #fff; border-bottom: 1px solid var(--line); }
.list-group-item:last-child { border-bottom: 0; }
.list-unstyled { list-style: none; padding: 0; margin: 0; }

/* ==========================================================================
   Panel shell — sidebar, header, content
   ========================================================================== */
.nr-shell { min-height: 100vh; }

/* ---------- sidebar ---------- */
.nr-sidebar {
  position: fixed; inset: 0 auto 0 0; z-index: 70;
  width: var(--sidebar-w);
  display: flex; flex-direction: column;
  background: var(--sidebar);
  border-right: 1px solid rgba(255,255,255,.06);
  transform: translateX(-100%);
  transition: transform .28s var(--ease);
}
.nr-sidebar.is-open { transform: none; }
@media (min-width: 992px) { .nr-sidebar { transform: none; } }

.nr-sidebar__brand {
  display: flex; align-items: center; gap: .7rem;
  height: var(--header-h); padding-inline: 1.25rem; flex: 0 0 auto;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.nr-sidebar__brand img { max-height: 38px; width: auto; }
.nr-sidebar__nav { flex: 1 1 auto; overflow-y: auto; padding: 1rem .75rem 2rem; }
.nr-sidebar__nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.14); }

.nr-cap {
  padding: 1.25rem .75rem .4rem;
  font-size: .66rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,.34);
}
.nr-nav { list-style: none; padding: 0; margin: 0; }
.nr-nav a, .nr-nav .nr-toggle {
  display: flex; align-items: center; gap: .8rem; width: 100%;
  padding: .62rem .75rem; margin-bottom: 2px;
  border: 0; background: transparent; border-radius: 10px;
  font-family: inherit; font-size: .85rem; font-weight: 500; text-align: left;
  color: rgba(255,255,255,.68); cursor: pointer;
  transition: background .18s, color .18s;
}
.nr-nav a:hover, .nr-nav .nr-toggle:hover { background: rgba(255,255,255,.07); color: #fff; }
.nr-nav a.is-active { background: var(--primary); color: #fff; box-shadow: 0 4px 14px rgba(47,98,224,.35); }
.nr-nav .nr-ico {
  display: grid; place-items: center; width: 20px; flex: 0 0 auto;
  font-size: 19px; line-height: 1; opacity: .9;
}
.nr-nav a.is-active .nr-ico { opacity: 1; }
.nr-nav .nr-txt { flex: 1 1 auto; }
.nr-nav .nr-arrow { font-size: 16px; transition: transform .22s var(--ease); opacity: .6; }
.nr-nav .nr-toggle[aria-expanded="true"] .nr-arrow { transform: rotate(90deg); }
.nr-sub { list-style: none; margin: 2px 0 6px; padding: 0 0 0 2.55rem; display: none; }
.nr-sub.is-open { display: block; }
.nr-sub a { padding: .45rem .7rem; font-size: .8125rem; color: rgba(255,255,255,.55); }
.nr-sub a.is-active { background: rgba(255,255,255,.10); color: #fff; box-shadow: none; }

.nr-scrim {
  position: fixed; inset: 0; z-index: 65; background: rgba(17,27,58,.5);
  opacity: 0; pointer-events: none; transition: opacity .25s;
}
.nr-scrim.is-open { opacity: 1; pointer-events: auto; }
@media (min-width: 992px) { .nr-scrim { display: none; } }

/* ---------- header ---------- */
.nr-main { min-height: 100vh; display: flex; flex-direction: column; }
@media (min-width: 992px) { .nr-main { margin-left: var(--sidebar-w); } }

.nr-header {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; gap: 1rem;
  height: var(--header-h); padding-inline: clamp(1rem, 3vw, 1.75rem);
  background: rgba(255,255,255,.86);
  backdrop-filter: saturate(180%) blur(12px);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--line);
}
.nr-burger {
  display: inline-flex; flex-direction: column; justify-content: center; gap: 4px;
  width: 40px; height: 40px; padding: 0 10px;
  background: #fff; border: 1px solid var(--line); border-radius: 10px; cursor: pointer;
}
@media (min-width: 992px) { .nr-burger { display: none; } }
.nr-burger span { display: block; height: 2px; background: var(--ink); border-radius: 2px; }
.nr-header__title { font-size: 1rem; font-weight: 700; color: var(--ink); margin: 0; }
.nr-header__spacer { margin-left: auto; }
.nr-header__actions { display: flex; align-items: center; gap: .5rem; }
.nr-iconbtn {
  display: grid; place-items: center; width: 40px; height: 40px;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  color: var(--ink-2); cursor: pointer; transition: background .18s, color .18s, border-color .18s;
}
.nr-iconbtn:hover { background: var(--primary-050); color: var(--primary); border-color: transparent; }
.nr-user {
  display: flex; align-items: center; gap: .6rem;
  padding: .3rem .7rem .3rem .3rem;
  background: #fff; border: 1px solid var(--line); border-radius: 999px; cursor: pointer;
}
.nr-user:hover { border-color: var(--line-2); }
.nr-user__av {
  display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 auto;
  border-radius: 50%; background: var(--primary); color: #fff;
  font-size: .8rem; font-weight: 700; text-transform: uppercase;
}
.nr-user__name { font-size: .8125rem; font-weight: 600; color: var(--ink); line-height: 1.2; }
.nr-user__role { font-size: .7rem; color: var(--ink-3); }
@media (max-width: 575.98px) { .nr-user__meta { display: none; } }

/* ---------- content ---------- */
.nr-content { flex: 1 1 auto; padding: clamp(1rem, 3vw, 1.85rem); }
.nr-content > .row:last-child > [class*="col"] > .card:last-child { margin-bottom: 0; }
.nr-page-head { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-bottom: 1.4rem; }
.nr-page-head h1 { font-size: 1.35rem; margin: 0; }
.nr-foot { padding: 1rem clamp(1rem,3vw,1.85rem) 1.5rem; font-size: .78rem; color: var(--ink-4); }

/* stat tiles used on dashboards */
.nr-stat { display: flex; align-items: center; gap: 1rem; }
.nr-stat__ico { display: grid; place-items: center; width: 46px; height: 46px; flex: 0 0 auto; border-radius: 13px; background: var(--primary-050); color: var(--primary); font-size: 22px; }
.nr-stat__val { font-size: 1.5rem; font-weight: 800; color: var(--ink); letter-spacing: -.02em; line-height: 1.1; }
.nr-stat__lbl { font-size: .78rem; color: var(--ink-3); }

/* ---------- auth screens ---------- */
.auth-wrapper {
  display: flex; align-items: center; justify-content: center;
  min-height: 100vh; padding: 2rem 1rem;
  background:
    radial-gradient(58% 46% at 82% 6%, rgba(47,98,224,.16), transparent 70%),
    radial-gradient(46% 40% at 4% 92%, rgba(242,177,56,.12), transparent 70%),
    var(--canvas);
}
.auth-content { width: 100%; max-width: 430px; }
.auth-wrapper .card { border: 0; border-radius: var(--r-xl); box-shadow: var(--sh-3); margin: 0; }
.auth-wrapper .card-body { padding: 2.1rem; }
.auth-wrapper .logo, .auth-wrapper img[class*="logo"] { max-height: 54px; width: auto; margin-inline: auto; }
.auth-wrapper h4, .auth-wrapper h3 { text-align: center; font-size: 1.2rem; margin-bottom: 1.5rem; }
.auth-wrapper .btn-primary { width: 100%; padding-block: .75rem; }
.auth-wrapper.maintance { text-align: center; }
.auth-wrapper.maintance .auth-content { max-width: 560px; }

/* ---------- icon fonts sizing ---------- */
.material-icons-two-tone, .material-symbols-outlined { font-size: 20px; line-height: 1; vertical-align: middle; }
.pc-micon .material-icons-two-tone, .nr-ico .material-icons-two-tone { font-size: 19px; }

/* ---------- file uploader ---------- */
.file-item { margin-bottom: .75rem; }
.card-file-thumb { border: 1px solid var(--line); background: var(--canvas); overflow: hidden; }
.card-file-thumb img { max-height: 100%; object-fit: contain; }
.file-amount { cursor: pointer; }
.file-select-tab .btn { border-radius: 999px; }
.FileUploadSelectedInfo { border-top: 1px solid var(--line); }
.ext { font-size: .7rem; font-weight: 700; color: var(--ink-3); text-transform: uppercase; }

/* ---------- print (invoice) ---------- */
@media print {
  .nr-sidebar, .nr-header, .nr-foot, .nr-scrim, .btn, .no-print { display: none !important; }
  .nr-main { margin-left: 0; }
  body { background: #fff; }
  .card { box-shadow: none; border: 0; }
}

/* Action cells: the views put an <a> next to an inline <form>, which used to
   wrap onto two lines. Keep them on one row without touching every view. */
.table td .btn + form.d-inline,
.table td form.d-inline + .btn { margin-left: .35rem; }
.table td form.d-inline { display: inline-flex; vertical-align: middle; }
.table td > .d-flex { flex-wrap: wrap; }
.table td .btn { vertical-align: middle; }

/* ==========================================================================
   Classes the pages use that the base set above did not cover.
   Found by diffing every class in the blade files against this stylesheet.
   ========================================================================== */

/* --- accent card (member dashboard profile) --- */
.nr-accent-card { border-top: 4px solid var(--primary); }

/* --- utility gaps --- */
.align-content-center{align-content:center}
.border-2{border-width:2px}
.border-dark{border-color:var(--ink)}
.border-left{border-left:1px solid var(--line)}
.rounded-bottom{border-bottom-left-radius:var(--r);border-bottom-right-radius:var(--r)}
.rounded-top{border-top-left-radius:var(--r);border-top-right-radius:var(--r)}
.f-w-400{font-weight:400}
.text-wrap{white-space:normal;word-break:break-word}
.opacity-70{opacity:.7}
.right-0{right:0}
.ht-1{height:1px}
.mt-20{margin-top:20px}
.mt-n5{margin-top:-1.5rem}
.mb0{margin-bottom:0}.mb3{margin-bottom:1rem}
.object-fit-cover{object-fit:cover}.object-fit-contain{object-fit:contain}
.img-fluid,.img{max-width:100%;height:auto}
.img-fit{width:100%;height:100%;object-fit:cover}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.d-lg-inline{display:inline}
@media (max-width:991.98px){.d-lg-inline{display:inline}}
.collapse:not(.show){display:none}
.d-print-none{}
@media print{.d-print-none{display:none!important}}

/* --- buttons --- */
.btn-block{display:flex;width:100%}
.btn-outline-light{--btn-bg:transparent;--btn-fg:var(--ink);--btn-bd:var(--line);--btn-bg-h:var(--canvas)}
.btn-outline-light:hover{color:var(--ink);border-color:var(--line-2)}
.btn-icon{width:36px;height:36px;padding:0;flex:0 0 auto}
.btn-plus,.btn-minus{
  width:34px;height:34px;padding:0;flex:0 0 auto;
  background:var(--secondary-050);border:1px solid var(--line);border-radius:9px;
  font-size:1rem;font-weight:700;color:var(--ink);cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
}
.btn-plus:hover,.btn-minus:hover{background:var(--primary);color:#fff;border-color:transparent}

/* --- forms --- */
.form-check-inline{display:inline-flex;align-items:center;gap:.4rem;margin-right:1rem}
.form-select-sm,.input-group-sm .form-control,.input-group-sm .input-group-text{padding:.38rem .65rem;font-size:.8rem}
.input-group-btn{display:flex}
.input-group-btn .btn{border-radius:0}
.border-form{border:1px solid var(--line);border-radius:var(--r);padding:1rem}
.billing-form-wrap{border:1px solid var(--line);border-radius:var(--r);padding:1.15rem;background:#fff}
.error{color:var(--danger);font-size:.78rem;display:block;margin-top:.2rem}
.quantity{display:inline-flex;align-items:center;gap:.35rem}
.quantity input,.quantity .form-control{width:56px;text-align:center;padding-inline:.3rem}
.delivery_type_radio,.payment_method,.self_hp_side{display:flex;flex-wrap:wrap;gap:.75rem}
.delivery_type_radio label,.payment_method label{margin:0}

/* --- tables --- */
.table-light th,.table-light td{background:var(--canvas)}
.table-primary th,.table-primary td{background:var(--primary-050);color:var(--primary-600)}
.table-xs th,.table-xs td{padding:.35rem .5rem;font-size:.75rem}

/* --- alerts --- */
.alert-dismissible{padding-right:2.75rem}
.alert-heading{font-weight:700;margin-bottom:.35rem;color:inherit}

/* --- dropdown link (used in some headers) --- */
.dropdown-link{display:flex;align-items:center;gap:.4rem;color:var(--ink-2)}

/* --- misc bits --- */
.bg-gold{background:linear-gradient(135deg,#F2B138,#E09B1F);color:#fff}
.title{font-weight:700;color:var(--ink)}
.c-preloader{display:none}
.c-scrollbar-light{overflow:auto}

/* --- product image tile (shop grid) --- */
.product-img-div{
  display:grid;place-items:center;height:180px;overflow:hidden;
  background:var(--canvas);border-radius:var(--r) var(--r) 0 0;
}
.product-img-div img{max-height:100%;width:auto;object-fit:contain}

/* --- cart / checkout totals --- */
.total-amount,.shipping-amount{font-weight:700;color:var(--ink)}

/* --- file uploader previews --- */
.file_preview_group{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.6rem}
.file_preview_item{
  position:relative;width:84px;height:84px;border-radius:10px;overflow:hidden;
  border:1px solid var(--line);background:var(--canvas);display:grid;place-items:center;
}
.file_preview_item img{width:100%;height:100%;object-fit:cover}
.file_deselect{
  position:absolute;top:3px;right:3px;width:20px;height:20px;
  display:grid;place-items:center;border:0;border-radius:50%;
  background:rgba(220,38,38,.92);color:#fff;font-size:11px;cursor:pointer;
}
.file_selector_input{display:none}
.file-uploader-paginate-btn{min-width:70px}

/* --- carousel (bootstrap markup) --- */
.carousel{position:relative}
.carousel-inner{position:relative;width:100%;overflow:hidden;border-radius:var(--r)}
.carousel-item{display:none;width:100%}
.carousel-item.active{display:block}
.carousel-control-prev,.carousel-control-next{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:38px;height:38px;display:grid;place-items:center;
  border:0;border-radius:50%;background:rgba(255,255,255,.9);box-shadow:var(--sh-1);cursor:pointer;
}
.carousel-control-prev{left:.6rem}.carousel-control-next{right:.6rem}
.carousel-control-prev-icon,.carousel-control-next-icon{
  width:9px;height:9px;border-top:2px solid var(--ink);border-right:2px solid var(--ink);
}
.carousel-control-prev-icon{transform:rotate(-135deg)}
.carousel-control-next-icon{transform:rotate(45deg)}
.carousel-indicators{display:flex;justify-content:center;gap:.35rem;padding:0;margin:.7rem 0 0;list-style:none}
.carousel-indicators [data-bs-target],.carousel-indicators button{
  width:7px;height:7px;padding:0;border:0;border-radius:50%;background:var(--line-2);cursor:pointer;
}
.carousel-indicators .active{background:var(--primary);width:18px;border-radius:99px}

/* --------------------------------------------------------------------------
   Icon unification.
   "Material Icons Two Tone" is a colour font: it paints its own greys and
   ignores `color`, which left every icon a flat dark glyph. Point that class
   at the outlined symbols font instead so all ~100 icons across the panel
   render in one style and follow text colour. Every ligature used in the
   views was checked against this font first.
   -------------------------------------------------------------------------- */
.material-icons-two-tone {
  font-family: 'Material Symbols Outlined', 'Material Icons Two Tone';
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  font-size: 20px;
  color: inherit;
}

/* Stat tiles: the dashboards put a lone icon in a .col-auto beside the value.
   Give it a soft tile so it reads as a deliberate element. */
.card-body .row.align-items-center > .col-auto > .material-icons-two-tone,
.card-body .row.align-items-center > .col-auto > .material-symbols-outlined {
  display: grid; place-items: center;
  width: 44px; height: 44px;
  border-radius: 13px;
  background: var(--primary-050);
  color: var(--primary);
  font-size: 22px;
}
.card-body .row.align-items-center > .col-auto > .material-icons-two-tone.text-success,
.card-body .row.align-items-center > .col-auto > .material-symbols-outlined.text-success { background: var(--success-050); color: var(--success); }
.card-body .row.align-items-center > .col-auto > .material-icons-two-tone.text-danger,
.card-body .row.align-items-center > .col-auto > .material-symbols-outlined.text-danger { background: var(--danger-050); color: var(--danger); }
.card-body .row.align-items-center > .col-auto > .material-icons-two-tone.text-warning,
.card-body .row.align-items-center > .col-auto > .material-symbols-outlined.text-warning { background: var(--warning-050); color: var(--warning); }

/* --- native file inputs (a few forms use them directly) --- */
input[type=file] {
  padding: .38rem .5rem;
  font-size: .8125rem;
  cursor: pointer;
}
input[type=file]::file-selector-button {
  margin-right: .7rem;
  padding: .38rem .85rem;
  font: inherit; font-size: .8rem; font-weight: 600;
  color: var(--ink); background: var(--secondary-050);
  border: 1px solid var(--line); border-radius: 8px;
  cursor: pointer; transition: background .18s, color .18s;
}
input[type=file]::file-selector-button:hover { background: var(--primary); color: #fff; border-color: transparent; }

/* --- table empty-state rows read better centred and muted --- */
.table td[colspan] { color: var(--ink-3); }

/* --- keep long tables from crushing action buttons --- */
.table td .btn-sm { white-space: nowrap; }

/* ==========================================================================
   Help guide
   ========================================================================== */
.nr-help { max-width: 940px; }
.nr-help .card-header h4 { color: var(--ink); }
.nr-help h5 { color: var(--ink); font-size: .95rem; font-weight: 700; }
.nr-help p, .nr-help li { line-height: 1.75; }

.nr-steps { margin: 0; padding-left: 1.35rem; display: grid; gap: .55rem; }
.nr-steps > li { padding-left: .2rem; }
.nr-steps ul { margin: .5rem 0 0; padding-left: 1.1rem; display: grid; gap: .3rem; }
.nr-help code {
  padding: .12rem .4rem; border-radius: 6px;
  background: var(--secondary-050); color: var(--ink);
  font-size: .85em; font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.nr-note {
  margin-top: 1.1rem; padding: .85rem 1.05rem;
  border-left: 3px solid var(--primary); border-radius: var(--r-sm);
  background: var(--primary-050); color: var(--ink-2); font-size: .9rem;
}
.nr-note--warn { border-left-color: var(--warning); background: var(--warning-050); }

.nr-formula {
  margin: .6rem 0; padding: .8rem 1.05rem;
  border: 1px dashed var(--line-2); border-radius: var(--r-sm);
  background: #fff; color: var(--ink);
  font-weight: 700; font-size: .95rem; text-align: center;
}

.nr-code {
  margin-top: .5rem; padding: .8rem 1rem;
  border-radius: var(--r-sm); background: var(--ink); color: #C9D6F5;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .8rem; line-height: 1.9; word-break: break-all;
}

/* the Help link stands slightly apart from the rest of the nav */
.nr-nav a.nr-help-link { color: #8FB3FF; }
.nr-nav a.nr-help-link:hover { background: rgba(143,179,255,.14); color: #fff; }

/* --------------------------------------------------------------------------
   CKEditor floating UI
   CKEditor appends its tooltips and balloons to <body>. On a narrow screen
   those sit past the right edge and make the whole page scroll sideways.
   Pinning the wrapper to a zero-size fixed box keeps the floating UI working
   while taking it out of the page's width calculation.
   -------------------------------------------------------------------------- */
.ck-body-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
}

/* The per-button hover tooltips are absolutely positioned inside the toolbar
   and stick out past the right edge on a phone, widening the page. They are
   hover-only hints, which a touch screen never shows anyway. */
@media (max-width: 991.98px) {
  .ck.ck-tooltip { display: none !important; }
}
.ck.ck-editor { max-width: 100%; }
