/* =======================================================
   iFraldas Design System → งานบริการการศึกษา
   Design Tokens (ฟอนต์เปลี่ยนเป็น Sarabun ทั้งระบบ)
   ======================================================= */
:root {
  /* Iris Blue (Primary) */
  --iris-50:#e6f8f9; --iris-100:#ccf0f2; --iris-200:#b3e9eb; --iris-300:#99e2e4;
  --iris-400:#80dbdd; --iris:#214183; --iris-600:#019296; --iris-700:#016d71;
  --iris-800:#01474a; --iris-900:#002425;
  /* Blue Marguerite (Accent) */
  --marguerite-50:#f0eef9; --marguerite-100:#e2e1f6; --marguerite-200:#d4d1f0;
  --marguerite-300:#c6c3ea; --marguerite-400:#b8b5e8; --marguerite:#dc5f09;
  --marguerite-600:#5953a8; --marguerite-700:#3f3d7e; --marguerite-800:#2c2a54; --marguerite-900:#161428;
  /* Slate (Text / Borders) */
  --slate-50:#ebebee; --slate-100:#d7d7dd; --slate-200:#c3c3ca; --slate-300:#afafba;
  --slate-400:#9a9ba9; --slate:#363853; --slate-600:#2b2d42; --slate-700:#201f31;
  --slate-800:#161621; --slate-900:#0b0b10;
  /* Neutral (Backgrounds) */
  --neutral-50:#fafbfc; --neutral-100:#f7f8f9; --neutral-200:#eff1f3; --neutral-300:#eff1f3;
  --neutral-400:#ebedf0; --neutral:#d8dbe1; --neutral-600:#adadb4; --neutral-700:#828387;
  --neutral-800:#565859; --neutral-900:#2b2b2d;
  /* Salmon (Secondary) */
  --salmon-50:#ffe8f6; --salmon-100:#ffe8f6; --salmon-200:#ffddee; --salmon-300:#ffd1e6;
  --salmon-400:#ffc6dd; --salmon:#ff8da1; --salmon-600:#cc7081; --salmon-700:#995561;
  /* Error */
  --error-50:#ffe9f0; --error-100:#ffd7de; --error-200:#ffc4cf; --error-300:#ffb0bd;
  --error-400:#ff9dac; --error:#ff395b; --error-600:#cc2e48; --error-700:#992237;
  /* Yellow */
  --yellow-50:#fffbf0; --yellow-100:#fff6e1; --yellow-200:#fff0ca; --yellow-300:#ffeab3;
  --yellow-400:#ffe49c; --yellow-500:#efb100; --yellow-600:#b88600; --yellow-700:#805c00;
  /* Success */
  --success:#22c55e; --success-50:#f0fdf4;

  /* Spacing */
  --sp-0:0; --sp-05:2px; --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px;
  --sp-6:24px; --sp-8:32px; --sp-12:48px;
  /* Radius */
  --r-xsm:4px; --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:24px; --r-full:9999px;
  /* Shadow */
  --shadow-sm:0 1px 2px rgba(0,0,0,.05);
  --shadow-md:0 4px 6px rgba(0,0,0,.1);
  --shadow-lg:0 10px 15px rgba(0,0,0,.15);
  --shadow-xl:0 20px 25px rgba(0,0,0,.2);
  /* Font */
  --font-base:'Sarabun','Noto Sans Thai',system-ui,sans-serif;
  --sidebar-w:266px;

  /* Bootstrap override */
  --bs-primary:#01b6bc; --bs-primary-rgb:1,182,188;
  --bs-body-font-family:var(--font-base);
  --bs-body-color:var(--slate-600);
  --bs-border-radius:var(--r-md);
}

/* ---------- Base ---------- */
* { -webkit-tap-highlight-color: transparent; }
body {
  font-family: var(--font-base);
  font-size: 1rem;
  line-height: 1.5;
  color: var(--slate-600);
  background: var(--neutral-100);
}
h1,h2,h3,h4,h5,h6 { font-family: var(--font-base); font-weight: 700; line-height: 1.15; color: var(--slate); }
h1 { font-size: clamp(1.75rem, 5vw, 3rem); }
h2 { font-size: clamp(1.5rem, 4vw, 2.25rem); }
h3 { font-size: clamp(1.25rem, 3.5vw, 1.875rem); }
h4 { font-size: clamp(1rem, 2.5vw, 1.5rem); }
h5 { font-size: clamp(1rem, 2vw, 1.25rem); }
h6 { font-size: 1rem; }
a { color: var(--iris-600); text-decoration: none; transition: 200ms ease; }
a:hover { color: var(--iris-700); }
code, pre, .font-mono { font-family: Menlo, Consolas, monospace; }

/* ---------- ปุ่ม ---------- */
.btn { border-radius: var(--r-full); font-weight: 700; transition: 200ms ease; }
.btn-primary { background: var(--iris); border-color: var(--iris); color: #fff; }
.btn-primary:hover { background: var(--iris-600); border-color: var(--iris-600); box-shadow: var(--shadow-md); color:#fff; }
.btn-primary:active,.btn-primary:focus { background: var(--iris-700) !important; border-color: var(--iris-700) !important; }
.btn-outline-primary { color: var(--iris-600); border-color: var(--iris); }
.btn-outline-primary:hover { background: var(--iris); border-color: var(--iris); color:#fff; box-shadow: var(--shadow-md); }
.btn-accent { background: var(--marguerite); border-color: var(--marguerite); color:#fff; }
.btn-accent:hover { background: var(--marguerite-600); color:#fff; box-shadow: var(--shadow-md); }
.btn-soft { background: var(--iris-50); color: var(--iris-700); border:1px solid var(--iris-100); }
.btn-soft:hover { background: var(--iris-100); color: var(--iris-800); }
.btn:disabled,.btn.disabled { opacity:.6; cursor:not-allowed; }
.btn:focus-visible { outline:2px solid var(--iris); outline-offset:2px; box-shadow:var(--shadow-md); }

/* ---------- ฟอร์ม ---------- */
.form-control, .form-select {
  border-radius: var(--r-full);
  border:1px solid var(--slate-300);
  padding: .5rem 1rem;
  font-family: var(--font-base);
  transition: 200ms ease;
}
textarea.form-control { border-radius: var(--r-md); }
.form-control:hover, .form-select:hover { border-color: var(--slate-400); box-shadow: var(--shadow-sm); }
.form-control:focus, .form-select:focus {
  border-color: var(--iris); box-shadow: var(--shadow-md), 0 0 0 .1rem rgba(1,182,188,.25);
}
.form-control:disabled, .form-select:disabled { background: var(--slate-50); border-color: var(--slate-100); cursor:not-allowed; opacity:.6; }
.form-label { font-weight: 600; color: var(--slate); margin-bottom: .35rem; }
.form-check-input { border-radius: var(--r-xsm); border-color: var(--slate-300); width:1.15em; height:1.15em; }
.form-check-input:checked { background-color: var(--iris); border-color: var(--iris); }
.form-switch .form-check-input { border-radius: var(--r-full); width: 2.6em; height:1.35em; }
.form-check-input:focus { border-color: var(--iris); box-shadow: 0 0 0 .2rem rgba(1,182,188,.25); }
.is-invalid-msg { color: var(--error-600); font-size:.875rem; }

/* ---------- การ์ด ---------- */
.card { border:1px solid var(--iris-100); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); background:#fff; }
.card-hover { transition: 200ms ease; }
.card-hover:hover { box-shadow: var(--shadow-lg); transform: translateY(-3px); border-color: var(--iris-300); }
.card-header { background:#fff; border-bottom:1px solid var(--neutral-400); border-radius: var(--r-lg) var(--r-lg) 0 0 !important; font-weight:700; color:var(--slate); }
/* ---------- Badge ---------- */
.badge { border-radius: var(--r-xsm); font-weight:700; font-size:.8rem; padding:.35em .7em; }
.badge-primary{background:var(--iris);color:#fff}
.badge-success{background:var(--success);color:#fff}
.badge-warning{background:var(--yellow-500);color:var(--slate)}
.badge-error{background:var(--error);color:#fff}
.badge-neutral{background:var(--slate-300);color:#fff}
.badge-accent{background:var(--marguerite);color:#fff}
.badge-soft{background:var(--iris-50);color:var(--iris-700);border:1px solid var(--iris-200)}

/* ---------- Alert ---------- */
.alert { border-radius: var(--r-sm); border:0; border-left:4px solid var(--iris); background: var(--iris-50); color: var(--slate-600); }
.alert-success{background:var(--success-50);border-left-color:var(--success)}
.alert-danger{background:var(--error-50);border-left-color:var(--error)}
.alert-warning{background:var(--yellow-50);border-left-color:var(--yellow-500)}
.alert-info{background:var(--iris-50);border-left-color:var(--iris)}

/* ---------- Progress ---------- */
.progress { height:8px; border-radius: var(--r-full); background: var(--slate-200); }
.progress-bar { background: var(--iris); transition: 300ms ease; }

/* ---------- Layout: Sidebar ซ้ายมือ ---------- */
.layout { display:flex; min-height:100vh; }
.sidebar {
  width: var(--sidebar-w); flex: 0 0 var(--sidebar-w);
  background: linear-gradient(180deg, var(--slate) 0%, var(--slate-700) 100%);
  color:#fff; position:fixed; inset:0 auto 0 0; z-index:1045;
  display:flex; flex-direction:column; transition: transform .25s ease;
  box-shadow: var(--shadow-lg);
}
.sidebar-brand { padding: var(--sp-4); border-bottom:1px solid rgba(255,255,255,.12); display:flex; gap:12px; align-items:center; }
.sidebar-brand .logo {
  width:44px;height:44px;border-radius:var(--r-md);background:var(--iris);
  display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:#fff;flex:0 0 44px;
}
.sidebar-brand b { color:#fff; font-size:1.02rem; line-height:1.2; display:block; }
.sidebar-brand small { color: var(--slate-300); font-size:.75rem; }
.sidebar-nav { padding: var(--sp-3); overflow-y:auto; flex:1; }
.sidebar-nav .nav-title { color: var(--slate-300); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; margin: var(--sp-4) var(--sp-2) var(--sp-2); }
.sidebar-nav a {
  display:flex; align-items:center; gap:12px; padding:10px 14px; border-radius: var(--r-md);
  color: var(--slate-100); font-size:.95rem; margin-bottom:2px; transition:200ms ease;
}
.sidebar-nav a i { font-size:1.05rem; width:20px; text-align:center; }
.sidebar-nav a:hover { background: rgba(255,255,255,.08); color:#fff; }
.sidebar-nav a.active { background: var(--iris); color:#fff; box-shadow: var(--shadow-md); font-weight:600; }
.sidebar-footer { padding: var(--sp-3) var(--sp-4); border-top:1px solid rgba(255,255,255,.12); font-size:.8rem; color: var(--slate-300); }
.main { flex:1; margin-left: var(--sidebar-w); min-width:0; display:flex; flex-direction:column; }
.topbar {
  background:#fff; border-bottom:1px solid var(--neutral-400); padding:.75rem 1rem;
  display:flex; align-items:center; gap:12px; position:sticky; top:0; z-index:1030; box-shadow: var(--shadow-sm);
}
.content { padding: var(--sp-6) var(--sp-4); flex:1; }
.sidebar-backdrop { position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:1040; display:none; }
@media (max-width: 991.98px) {
  .sidebar { transform: translateX(-100%); }
  .sidebar.show { transform: translateX(0); }
  .main { margin-left:0; }
  .sidebar-backdrop.show { display:block; }
}
.btn-burger { border:1px solid var(--neutral-400); background:#fff; border-radius:var(--r-md); width:40px;height:40px; }
@media (min-width: 992px) { .btn-burger { display:none; } }


/* ---------- Layout: เมนูด้านบน (หน้าบ้าน) ---------- */
body.has-topnav { display:flex; flex-direction:column; min-height:100vh; }
body.has-topnav .footer-site { margin-top:auto; }

.header-top {
  background: linear-gradient(120deg, var(--iris-700) 0%, var(--iris) 55%, var(--marguerite) 130%);
  color:#fff;
}
.header-logo {
  width:auto; height:50px; border-radius: var(--r-md); background: rgba(255,255,255,.18);
  display:inline-flex; align-items:center; justify-content:center; font-size:1.5rem; color:#fff; flex:0 0 46px;
}
.header-logo-sm { width:36px;height:36px;font-size:1.15rem;flex:0 0 36px; background: var(--iris); }
.header-name { display:block; color:#fff; font-weight:700; font-size:1.15rem; line-height:1.25; }
.header-tagline { display:block; color:rgba(255,255,255,.8); font-size:.8rem; }
.header-contact { color: rgba(255,255,255,.9); white-space:nowrap; }
.btn-header { background: rgba(255,255,255,.18); color:#fff; border:1px solid rgba(255,255,255,.35); font-weight:600; }
.btn-header:hover { background:#fff; color: var(--iris-700); border-color:#fff; }

.navbar-main {
  background:#fff; border-bottom:1px solid var(--neutral-400); box-shadow: var(--shadow-sm);
  padding-top:.35rem; padding-bottom:.35rem; z-index:1030;
}
.navbar-main .navbar-brand { display:flex; align-items:center; gap:10px; font-weight:700; color: var(--slate); }
.navbar-main .brand-text { font-size:1rem; }
.navbar-main .navbar-toggler { border:1px solid var(--neutral-400); border-radius: var(--r-md); padding:.3rem .6rem; color: var(--slate); }
.navbar-main .navbar-toggler:focus { box-shadow:0 0 0 .2rem rgba(1,182,188,.25); }
.navbar-main .navbar-toggler i { font-size:1.4rem; line-height:1; }
.navbar-main .nav-link {
  display:flex; align-items:center; gap:7px; color: var(--slate-600); font-weight:600; font-size:.95rem;
  padding:.5rem .85rem; margin:2px; border-radius: var(--r-full); transition:200ms ease; white-space:nowrap;
}
.navbar-main .nav-link i { font-size:1.02rem; }
.navbar-main .nav-link:hover { background: var(--iris-50); color: var(--iris-700); }
.navbar-main .nav-link.active { background: var(--iris); color:#fff; box-shadow: var(--shadow-sm); }
.navbar-main .nav-link.active:hover { background: var(--iris-600); color:#fff; }
.navbar-main .dropdown-menu {
  border:1px solid var(--iris-100); border-radius: var(--r-md); box-shadow: var(--shadow-lg); padding:.4rem;
}
.navbar-main .dropdown-item { border-radius: var(--r-sm); padding:.5rem .75rem; font-size:.93rem; color: var(--slate-600); }
.navbar-main .dropdown-item:hover { background: var(--iris-50); color: var(--iris-800); }
.navbar-main .dropdown-item.active { background: var(--iris); color:#fff; }
.nav-search { min-width:220px; }
@media (max-width: 991.98px) {
  .navbar-main .navbar-collapse { max-height:75vh; overflow-y:auto; padding:.5rem 0 .75rem; }
  .navbar-main .nav-link { margin:1px 0; }
  .nav-search { min-width:100%; margin-top:.5rem; }
}

.page-bar { background:#fff; border-bottom:1px solid var(--neutral-400); }
.page-bar-title { font-size:1.15rem; font-weight:700; color: var(--slate); }
.page-bar .breadcrumb-item a { color: var(--iris-700); }
.page-bar .breadcrumb-item.active { color: var(--neutral-700); }

.site-content { padding: var(--sp-6) var(--sp-4); flex:1; width:100%; }
@media (max-width: 767.98px) { .site-content { padding: var(--sp-4) var(--sp-3); } }

.btn-to-top {
  position:fixed; right:18px; bottom:18px; width:44px; height:44px; border-radius:50%;
  background: var(--iris); color:#fff; border:0; box-shadow: var(--shadow-lg);
  display:none; align-items:center; justify-content:center; font-size:1.2rem; z-index:1040; transition:200ms ease;
}
.btn-to-top:hover { background: var(--iris-600); transform: translateY(-2px); }
.btn-to-top.show { display:flex; }


/* ---------- Hero Slider (รูปภาพหมุนหน้าแรก) ---------- */
.hero-slider { box-shadow: var(--shadow-lg); }
.hero-slider .carousel-item { min-height: 320px; position:relative; }
.hero-slide-bg {
  position:absolute; inset:0; background-size:cover; background-position:center;
  background-repeat:no-repeat; min-height:320px;
}
/*
.hero-slide-overlay {
  position:absolute; inset:0;
  background: linear-gradient(100deg, rgba(1,71,74,.78) 0%, rgba(1,71,74,.45) 45%, rgba(1,71,74,.1) 75%);
}
*/
.hero-slide-caption { position:relative; z-index:2; padding: clamp(28px,6vw,56px) 0; color:#fff; }
.hero-slide-caption h1 { color:#fff; }
.hero-slide-caption p { color: rgba(255,255,255,.92); font-size:1.05rem; max-width:640px; }
.hero-slider .carousel-inner { min-height:320px; }
@media (max-width: 767.98px) {
  .hero-slider .carousel-item, .hero-slide-bg, .hero-slider .carousel-inner { min-height:260px; }
}
.hero-slider .carousel-indicators { z-index:3; margin-bottom:.75rem; }
.hero-slider .carousel-indicators [data-bs-target] {
  width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.55); border:0; margin:0 4px;
}
.hero-slider .carousel-indicators .active { background:#fff; }
.hero-nav-icon {
  width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.22);
  display:inline-flex; align-items:center; justify-content:center; color:#fff; font-size:1.2rem;
  backdrop-filter: blur(2px); transition:200ms ease;
}
.hero-slider .carousel-control-prev:hover .hero-nav-icon,
.hero-slider .carousel-control-next:hover .hero-nav-icon { background: rgba(255,255,255,.4); }
.hero-slider .carousel-control-prev, .hero-slider .carousel-control-next { width:8%; z-index:3; }

/* ---------- หน้าบ้าน ---------- */
.hero {
  background: linear-gradient(135deg, var(--iris-700) 0%, var(--iris) 55%, var(--marguerite) 130%);
  color:#fff; border-radius: var(--r-xl); padding: clamp(24px,5vw,48px);
  box-shadow: var(--shadow-lg); position:relative; overflow:hidden;
}
.hero h1 { color:#fff; }
.hero p { color: rgba(255,255,255,.9); margin-bottom:0; }
.hero::after {
  content:''; position:absolute; right:-60px; top:-60px; width:240px; height:240px;
  border-radius:50%; background: rgba(255,255,255,.12);
}
.section-title { display:flex; align-items:center; gap:12px; margin-bottom: var(--sp-4); }
.section-title h2 { margin:0; font-size: clamp(1.25rem,3vw,1.75rem); }
.section-title .line { flex:1; height:1px; background: var(--neutral-400); }
/* auto-fill : การ์ดคงความกว้างคอลัมน์ แม้มีรายการน้อย (ไม่ยืดใบเดียวเต็มจอ) */
.grid-auto { display:grid; grid-template-columns: repeat(auto-fill, minmax(280px,1fr)); gap: var(--sp-4); }
.grid-auto-sm { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: var(--sp-4); }
 
/* object-position top : รูปโปสเตอร์แนวตั้งจะเห็นส่วนหัวของภาพ (ชื่อเรื่อง/โลโก้) */
.news-thumb { aspect-ratio:16/9; width:100%; object-fit:cover; object-position:center top; background: var(--neutral-200); border-radius: var(--r-md); }
.news-date { font-size:.8rem; color: var(--marguerite-600); font-weight:600; }
.link-item { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius: var(--r-md); transition:200ms ease; color:var(--slate-600); }
.link-item:hover { background: var(--iris-50); border-left:3px solid var(--iris); color: var(--iris-800); }

.person-card { text-align:center; background:#fff; border:1px solid var(--iris-100); border-radius: var(--r-lg); padding: var(--sp-4); box-shadow: var(--shadow-sm); transition:200ms ease; }
.person-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-3px); }
.person-photo { width:110px;height:110px;object-fit:cover;object-position:50% 20%;border-radius:50%; border:3px solid var(--iris-100); background: var(--neutral-200); }
.person-name { font-weight:700; color: var(--slate); margin:.6rem 0 .1rem; font-size:1rem; }
.person-pos { font-size:.875rem; color: var(--marguerite-600); }
.person-meta { font-size:.8rem; color: var(--neutral-700); }

.accordion-item { border:1px solid var(--iris-200); border-radius: var(--r-md) !important; margin-bottom: var(--sp-2); overflow:hidden; box-shadow: var(--shadow-sm); }
.accordion-button { font-family: var(--font-base); font-weight:600; color: var(--slate); background:#fff; }
.accordion-button:not(.collapsed) { background: var(--iris-50); color: var(--iris-800); box-shadow:none; }
.accordion-button:focus { box-shadow:none; border-color: var(--iris-300); }

.timeline { position:relative; padding-left: 28px; }
.timeline::before { content:''; position:absolute; left:9px; top:6px; bottom:6px; width:2px; background: var(--iris-100); }
.timeline-item { position:relative; margin-bottom: var(--sp-4); }
.timeline-item::before { content:''; position:absolute; left:-24px; top:6px; width:12px;height:12px;border-radius:50%; background: var(--iris); border:2px solid #fff; box-shadow:0 0 0 2px var(--iris-200); }

.footer-site { background: var(--slate); color: var(--slate-100); padding: var(--sp-8) var(--sp-4) var(--sp-4); margin-top: var(--sp-8); }
.footer-site a { color: var(--iris-200); }
.footer-site a:hover { color:#fff; }

/* ---------- ตาราง / DataTable ---------- */
table.dataTable { font-size:.93rem; }
table.dataTable thead th { background: var(--iris-50); color: var(--slate); border-bottom:2px solid var(--iris-100) !important; white-space:nowrap; }
table.dataTable tbody tr:hover { background: var(--neutral-100); }
.dataTables_wrapper .form-control, .dataTables_wrapper .form-select { border-radius: var(--r-md); }
.page-link { color: var(--iris-700); border-radius: var(--r-sm) !important; margin:0 2px; border-color: var(--neutral-400); }
.page-item.active .page-link { background: var(--iris); border-color: var(--iris); }
.thumb-sm { width:44px;height:44px;object-fit:cover;object-position:50% 20%;border-radius:var(--r-sm);background:var(--neutral-200); }
.thumb-round { border-radius:50%; }

/* ---------- อื่น ๆ ---------- */
.stat-card { border-radius: var(--r-lg); padding: var(--sp-4); background:#fff; border:1px solid var(--iris-100); box-shadow: var(--shadow-sm); display:flex; gap:14px; align-items:center; }
.stat-icon { width:48px;height:48px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:#fff; }
.stat-num { font-size:1.6rem; font-weight:700; color: var(--slate); line-height:1; }
.stat-label { font-size:.85rem; color: var(--neutral-700); }
.bg-iris{background:var(--iris)!important}.bg-marguerite{background:var(--marguerite)!important}
.bg-salmon{background:var(--salmon)!important}.bg-yellow{background:var(--yellow-500)!important}
.bg-error{background:var(--error)!important}.bg-success{background:var(--success)!important}
.text-iris{color:var(--iris-700)!important}.text-marguerite{color:var(--marguerite-600)!important}
.bg-iris-50{background:var(--iris-50)!important}
.rounded-lg{border-radius:var(--r-lg)!important}.rounded-pill-full{border-radius:var(--r-full)!important}
.shadow-soft{box-shadow:var(--shadow-md)!important}
.content-html img { max-width:100%; height:auto; border-radius: var(--r-md); }
.content-html table { width:100%; border-collapse:collapse; margin-bottom:1rem; }
.content-html table td, .content-html table th { border:1px solid var(--neutral-400); padding:8px; }
.gallery-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(150px,1fr)); gap: var(--sp-2); }
.gallery-grid img { width:100%; aspect-ratio:1/1; object-fit:cover; border-radius: var(--r-md); cursor:pointer; transition:200ms ease; }
.gallery-grid img:hover { transform: scale(1.03); box-shadow: var(--shadow-md); }
::-webkit-scrollbar { width:8px;height:8px; }
::-webkit-scrollbar-thumb { background: var(--slate-300); border-radius: var(--r-full); }
.tox-tinymce-aux, .swal2-container { z-index: 20000 !important; }
@media (max-width: 767.98px) {
  .content { padding: var(--sp-4) var(--sp-3); }
  .card-body { padding: 1rem; }
  .btn-sm { font-size:.8rem; }
}