@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Inter:wght@400;500;600&display=swap');

:root{
  --bg:#0a0a0d;
  --bg-2:#0e0e12;
  --card:#131317;
  --card-2:#1a1a20;
  --border:#26262e;
  --text:#f3f4f6;
  --text-dim:#8b8d98;
  --accent:#ef4444;
  --accent-2:#f87171;
  --accent-soft:rgba(239,68,68,.14);
  --teal:#2dd4bf;
  --violet:#a78bfa;
  --success:#22c55e;
  --warning:#f59e0b;
  --danger:#f43f5e;
  --info:#ef4444;
  --radius:14px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.3);
  --shadow-md: 0 4px 16px rgba(0,0,0,.35);
  --shadow-lg: 0 16px 40px rgba(0,0,0,.5);
  --sidebar-bg:#0e0e12;
  --sidebar-border:#26262e;
  --sidebar-text:#ffffff;
  --sidebar-text-dim:#9a9ca8;
  --sidebar-text-dimmer:#767a8c;
  --sidebar-section:#5c5e6b;
  --sidebar-hover-bg:#1a1a20;
}

:root[data-theme="light"]{
  --bg:#ffffff;
  --bg-2:#ffffff;
  --card:#ffffff;
  --card-2:#eef0f4;
  --border:#e2e4ea;
  --text:#1a1b23;
  --text-dim:#686b78;
  --accent:#dc2626;
  --accent-2:#ef4444;
  --accent-soft:rgba(220,38,38,.1);
  --teal:#0d9488;
  --violet:#7c3aed;
  --success:#16a34a;
  --warning:#d97706;
  --danger:#e11d48;
  --info:#dc2626;
  --shadow-sm: 0 1px 2px rgba(20,20,30,.06);
  --shadow-md: 0 4px 16px rgba(20,20,30,.08);
  --shadow-lg: 0 16px 40px rgba(20,20,30,.14);
  --sidebar-bg:#ffffff;
  --sidebar-border:#e2e4ea;
  --sidebar-text:#1a1b23;
  --sidebar-text-dim:#5c5f6c;
  --sidebar-text-dimmer:#868a97;
  --sidebar-section:#9a9ca8;
  --sidebar-hover-bg:#eef0f4;
}

body,.card,.stat-card,.modal,.profile-panel,.input,.btn-outline,.icon-btn,.bell-btn{
  transition:background .15s, border-color .15s, color .15s;
}

*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  background:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.brand{font-family:'Plus Jakarta Sans',sans-serif;}
a{text-decoration:none;color:inherit;}
ul{list-style:none;margin:0;padding:0;}
button{font-family:inherit;cursor:pointer;}
input,select,textarea{font-family:inherit;}

/* ===================== AUTH PAGES ===================== */
.auth-wrap{
  min-height:100vh;
  display:flex;
  align-items:stretch;
  background:var(--bg);
}
.auth-side{
  flex:1.1;
  background: radial-gradient(circle at 20% 20%, #ffffff 0%, var(--bg) 55%, #f4f5f7 100%);
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:60px;
  color:var(--text);
  border-right:1px solid var(--border);
}
.auth-side::before{
  content:'';
  position:absolute; inset:-20%;
  background:
    radial-gradient(circle at 80% 10%, rgba(220,38,38,.08), transparent 40%),
    radial-gradient(circle at 15% 85%, rgba(124,58,237,.06), transparent 45%);
  filter:blur(10px);
}
.auth-side .content{position:relative; z-index:1; max-width:460px;}
.auth-logo{display:flex;align-items:center;gap:12px;margin-bottom:48px;}
.auth-logo .brand-logo{
  width:52px;height:52px;border-radius:12px;object-fit:cover;display:block;flex-shrink:0;
}
.auth-logo span{font-size:20px;font-weight:800;letter-spacing:.2px;color:var(--text);}
.auth-side h1{font-size:36px;line-height:1.2;font-weight:800;margin:0 0 16px;color:var(--text);}
.auth-side p{color:var(--text-dim);font-size:15.5px;line-height:1.7;margin:0 0 36px;}
.auth-stats{display:flex;gap:28px;}
.auth-stats div b{display:block;font-size:26px;font-weight:800;color:var(--accent);}
.auth-stats div span{font-size:12.5px;color:var(--text-dim);}

.auth-form-side{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:40px 24px;
  background:var(--bg-2);
}
.auth-card{width:100%;max-width:400px;}
.auth-card h2{font-size:26px;font-weight:800;margin:0 0 6px;color:var(--text);}
.auth-card .sub{color:var(--text-dim);font-size:14.5px;margin-bottom:32px;}

.field{margin-bottom:18px;}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:7px;color:var(--text);}
.field .hint{font-size:12px;color:var(--text-dim);margin-top:5px;}
.input, select.input, textarea.input{
  width:100%;
  padding:12px 14px;
  border:1.5px solid var(--border);
  border-radius:10px;
  font-size:14.5px;
  background:var(--card);
  transition:.15s border-color, .15s box-shadow;
  color:var(--text);
}
.input::placeholder{color:#5b5e6b;}
.pw-wrap{position:relative;}
.pw-wrap .input{padding-right:42px;}
.pw-toggle-btn{
  position:absolute; top:50%; right:6px; transform:translateY(-50%);
  width:30px; height:30px; display:flex; align-items:center; justify-content:center;
  background:none; border:none; border-radius:7px; cursor:pointer;
  color:var(--text-dim); padding:0;
}
.pw-toggle-btn:hover{background:var(--border); color:var(--text);}
.pw-toggle-btn svg{width:17px; height:17px;}

.input:focus, select.input:focus, textarea.input:focus{
  outline:none;
  border-color:var(--accent);
  box-shadow:0 0 0 4px var(--accent-soft);
}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 20px;border-radius:10px;border:none;font-weight:700;font-size:14.5px;
  transition:.15s transform, .15s box-shadow, .15s opacity, .15s background;
}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover{background:var(--accent-2);}
.btn-block{width:100%;}
.btn-outline{background:transparent;border:1.5px solid var(--border);color:var(--text);}
.btn-outline:hover{border-color:var(--accent);color:var(--accent-2);}
.btn-sm{padding:8px 14px;font-size:13px;border-radius:9px;}
.btn-danger{background:rgba(244,63,94,.12);color:var(--danger);}
.btn-danger:hover{background:var(--danger);color:#fff;}
.btn-success{background:rgba(34,197,94,.12);color:var(--success);}
.btn-success:hover{background:var(--success);color:#fff;}
.btn-ghost{background:transparent;color:var(--text-dim);}
.btn-ghost:hover{background:var(--card-2);color:var(--text);}

.auth-foot{margin-top:26px;text-align:center;font-size:14px;color:var(--text-dim);}
.auth-foot a{color:var(--accent-2);font-weight:700;}
.alert{padding:12px 15px;border-radius:10px;font-size:13.5px;margin-bottom:18px;font-weight:500;}
.alert-danger{background:rgba(244,63,94,.1);color:#fb7185;border:1px solid rgba(244,63,94,.25);}
.alert-success{background:rgba(34,197,94,.1);color:#4ade80;border:1px solid rgba(34,197,94,.25);}
.alert-warning{background:rgba(245,158,11,.1);color:#fbbf24;border:1px solid rgba(245,158,11,.25);}
.role-note{margin-top:22px;padding:14px;background:var(--card);border:1px solid var(--border);border-radius:12px;font-size:12.5px;color:var(--text-dim);line-height:1.6;}
.role-note b{color:var(--text);}

/* ===================== APP SHELL ===================== */
.shell{display:flex;min-height:100vh;background:var(--bg);}

.sidebar{
  width:250px;
  background:var(--sidebar-bg);
  border-right:1px solid var(--sidebar-border);
  color:var(--sidebar-text);
  display:flex;
  flex-direction:column;
  padding:20px 14px;
  position:fixed;
  top:0;left:0;bottom:0;
  z-index:40;
}
.sidebar .brand{display:flex;align-items:center;gap:11px;padding:6px 8px 24px;}
.sidebar .brand .brand-logo{width:38px;height:38px;border-radius:9px;object-fit:cover;flex-shrink:0;display:block;}
.sidebar .brand span{font-weight:800;font-size:15.5px;}
.nav-section{font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--sidebar-section);margin:16px 10px 6px;font-weight:700;}
.nav-link{
  display:flex;align-items:center;gap:11px;
  padding:9px 11px;border-radius:8px;margin-bottom:1px;
  color:var(--sidebar-text-dim);font-size:13.8px;font-weight:600;
  transition:.15s all;
}
.nav-link svg{width:17px;height:17px;flex-shrink:0;opacity:.85;}
.nav-link:hover{background:var(--sidebar-hover-bg);color:var(--sidebar-text);}
.nav-link.active{background:var(--accent-soft);color:var(--accent-2);}
.sidebar-foot{margin-top:auto;padding-top:14px;border-top:1px solid var(--sidebar-border);}
.user-chip{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;transition:.15s background;}
.user-chip:hover{background:var(--sidebar-hover-bg);}
.user-chip .avatar{width:34px;height:34px;border-radius:9px;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12.5px;flex-shrink:0;}
.user-chip .who{overflow:hidden;}
.user-chip .who b{display:block;font-size:13px;color:var(--sidebar-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.user-chip .who span{font-size:11.5px;color:var(--sidebar-text-dimmer);text-transform:capitalize;}

.main{margin-left:250px;flex:1;display:flex;flex-direction:column;min-height:100vh;}

.topbar{
  height:66px;
  background:var(--bg);
  border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 26px;
  position:sticky;top:0;z-index:30;
}
.topbar h1{font-size:18px;font-weight:800;margin:0;color:var(--text);}
.topbar .sub{font-size:12.5px;color:var(--text-dim);margin-top:1px;}
.topbar-left{display:flex;align-items:center;gap:10px;min-width:0;}
.topbar-right{display:flex;align-items:center;gap:12px;}
.menu-toggle{
  display:none;
  width:38px;height:38px;flex-shrink:0;border-radius:10px;background:var(--card);border:1px solid var(--border);
  align-items:center;justify-content:center;color:var(--text-dim);
}
.menu-toggle svg{width:19px;height:19px;}
.sidebar-backdrop{
  display:none;
  position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:39;
}
.sidebar-backdrop.open{display:block;}

.bell-btn{
  width:40px;height:40px;border-radius:10px;background:var(--card);border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;position:relative;transition:.15s all;
}
.bell-btn:hover{background:var(--card-2);border-color:#33343d;}
.bell-btn svg{width:18px;height:18px;color:var(--text-dim);}

.theme-toggle{
  width:40px;height:40px;border-radius:10px;background:var(--card);border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;position:relative;transition:.15s all;
}
.theme-toggle:hover{background:var(--card-2);border-color:#33343d;}
.theme-toggle svg{width:18px;height:18px;color:var(--text-dim);}
.theme-toggle .icon-moon{display:none;}
:root[data-theme="light"] .theme-toggle .icon-sun{display:none;}
:root[data-theme="light"] .theme-toggle .icon-moon{display:block;}
.bell-dot{
  position:absolute;top:6px;right:6px;min-width:15px;height:15px;padding:0 3px;
  background:var(--danger);border-radius:20px;color:#fff;font-size:9.5px;font-weight:800;
  display:flex;align-items:center;justify-content:center;border:2px solid var(--bg);
}

/* ---- Profile dropdown (Settings / Clinic Settings / Notifications / Log out) ---- */
.profile-wrap{position:relative;}
.avatar-btn{width:40px;height:40px;border-radius:10px;background:var(--accent);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:13.5px;overflow:hidden;border:none;padding:0;}
.avatar-fill{width:100%;height:100%;display:flex;align-items:center;justify-content:center;}
.avatar-btn img,.user-chip .avatar img,.profile-avatar-lg img{width:100%;height:100%;object-fit:cover;border-radius:inherit;}
.user-chip .avatar{overflow:hidden;}

.profile-panel{
  position:absolute;top:50px;right:0;width:250px;
  background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-lg);
  display:none;z-index:50;padding:6px;
}
.profile-panel.open{display:block;}
.pp-head{padding:12px 12px 10px;border-bottom:1px solid var(--border);margin-bottom:6px;}
.pp-head b{display:block;font-size:13.5px;color:var(--text);}
.pp-head span{display:block;font-size:12px;color:var(--text-dim);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pp-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;font-size:13.3px;font-weight:600;color:var(--text-dim);position:relative;}
.pp-item svg{width:16px;height:16px;flex-shrink:0;}
.pp-item:hover{background:var(--card-2);color:var(--text);}
.pp-item.pp-danger{color:#fb7185;}
.pp-item.pp-danger:hover{background:rgba(244,63,94,.1);}
.pp-badge{margin-left:auto;background:var(--danger);color:#fff;font-size:10px;font-weight:800;padding:1px 6px;border-radius:20px;}
.pp-sep{height:1px;background:var(--border);margin:6px 4px;}

.avatar-upload-row{display:flex;align-items:center;gap:18px;margin-bottom:22px;}
.profile-avatar-lg{width:84px;height:84px;border-radius:16px;background:var(--accent);color:#fff;font-weight:800;font-size:30px;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;}

.content{padding:26px;flex:1;}

/* ===================== CARDS / STATS / TABLES ===================== */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:24px;}
.stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden;}
.stat-card .ic{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;margin-bottom:14px;font-size:18px;}
.stat-card h3{font-size:25px;font-weight:800;margin:0 0 2px;color:var(--text);}
.stat-card p{margin:0;font-size:12.8px;color:var(--text-dim);font-weight:600;}
.stat-card.teal .ic{background:rgba(45,212,191,.12);color:var(--teal);}
.stat-card.indigo .ic{background:var(--accent-soft);color:var(--accent-2);}
.stat-card.amber .ic{background:rgba(245,158,11,.12);color:var(--warning);}
.stat-card.rose .ic{background:rgba(244,63,94,.12);color:var(--danger);}

.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);}
.card-head{padding:18px 20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;}
.card-head h2{font-size:15.5px;font-weight:800;margin:0;color:var(--text);display:flex;align-items:center;gap:10px;}
.card-head .sub{font-size:12.5px;color:var(--text-dim);margin-top:2px;}
.card-body{padding:20px;}

table{width:100%;border-collapse:collapse;}
th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);padding:12px 16px;border-bottom:1.5px solid var(--border);font-weight:700;}
td{padding:14px 16px;border-bottom:1px solid var(--border);font-size:13.8px;color:var(--text);}
tr:last-child td{border-bottom:none;}
.table-wrap{overflow-x:auto;}
.name-cell{display:flex;align-items:center;gap:11px;}
.av{width:34px;height:34px;border-radius:9px;background:var(--accent-soft);color:var(--accent-2);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;flex-shrink:0;overflow:hidden;}
.av img{width:100%;height:100%;object-fit:cover;border-radius:inherit;}
.av.av-lg{width:56px;height:56px;font-size:20px;}
.name-cell b{display:block;font-size:13.5px;color:var(--text);}
.name-cell span{font-size:11.8px;color:var(--text-dim);}

.badge{display:inline-flex;padding:4px 11px;border-radius:20px;font-size:11.2px;font-weight:700;}
.badge-success{background:rgba(34,197,94,.12);color:#4ade80;}
.badge-warning{background:rgba(245,158,11,.12);color:#fbbf24;}
.badge-danger{background:rgba(244,63,94,.12);color:#fb7185;}
.badge-info{background:var(--accent-soft);color:var(--accent-2);}
.badge-muted{background:var(--card-2);color:var(--text-dim);}

.actions{display:flex;gap:8px;}
.icon-btn{width:32px;height:32px;border-radius:9px;border:1px solid var(--border);background:var(--card);display:flex;align-items:center;justify-content:center;color:var(--text-dim);transition:.15s all;}
.icon-btn:hover{border-color:var(--accent);color:var(--accent-2);}
.icon-btn svg{width:15px;height:15px;}

.empty-state{text-align:center;padding:60px 20px;color:var(--text-dim);}
.empty-state svg{width:50px;height:50px;margin-bottom:14px;opacity:.35;}
.empty-state p{font-size:13.5px;margin:0;}

/* NOTE: an old hand-rolled modal system (.modal-bg/.modal/.modal-head/.modal-close)
   used to live here. It's unused anywhere in the app now, and its ".modal" rule was
   colliding with Bootstrap's own ".modal" class — clamping every Bootstrap modal
   (reschedule, walk-in, etc.) to max-width:480px with its own internal scrollbar
   instead of letting Bootstrap size and center it. Removed. */


.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.chart-box{position:relative;width:100%;height:260px;}
.tabs{display:flex;gap:6px;border-bottom:1px solid var(--border);margin-bottom:22px;}
.tab{padding:11px 4px;margin-right:20px;font-size:13.5px;font-weight:700;color:var(--text-dim);border:none;border-bottom:2.5px solid transparent;cursor:pointer;background:none;font-family:inherit;}
.tab.active{color:var(--accent-2);border-color:var(--accent);}

.page-head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:14px;margin-bottom:22px;}
.page-head h1{font-size:22px;font-weight:800;margin:0 0 4px;color:var(--text);}
.page-head p{margin:0;color:var(--text-dim);font-size:13.5px;}

.search-bar{display:flex;gap:10px;}
.search-bar .input{width:240px;}

/* ---- Notifications page ---- */
.notif-item{display:flex;gap:12px;padding:13px 20px;border-bottom:1px solid var(--border);transition:.1s background;}
.notif-item:hover{background:var(--card-2);}
.notif-item.unread{background:var(--card-2);}
.notif-item:last-child{border-bottom:none;}
.notif-item-lg{padding:16px 20px;}
.notif-ico{width:34px;height:34px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:15px;}
.notif-ico.info{background:var(--accent-soft);color:var(--accent-2);}
.notif-ico.success{background:rgba(34,197,94,.12);color:var(--success);}
.notif-ico.warning{background:rgba(245,158,11,.12);color:var(--warning);}
.notif-ico.danger{background:rgba(244,63,94,.12);color:var(--danger);}
.notif-body{flex:1;min-width:0;}
.notif-body b{display:flex;align-items:center;gap:7px;font-size:13.2px;font-weight:700;margin-bottom:2px;color:var(--text);}
.notif-body p{margin:0;font-size:12.5px;color:var(--text-dim);line-height:1.5;}
.notif-body .t{font-size:11px;color:#5c5e6b;margin-top:4px;}
.notif-unread-dot{width:7px;height:7px;border-radius:50%;background:var(--text-dim);flex-shrink:0;}
.notif-empty{padding:40px 20px;text-align:center;color:var(--text-dim);font-size:13.5px;}

@media (max-width: 980px){
  .sidebar{transform:translateX(-100%);transition:.2s;z-index:41;}
  .sidebar.open{transform:translateX(0);box-shadow:var(--shadow-lg);}
  .main{margin-left:0;}
  .menu-toggle{display:flex;}
  .grid-2{grid-template-columns:1fr;}
  .profile-panel{width:230px;right:-10px;}
  .chart-box{height:220px;}
  .topbar{padding:0 16px;}
  .topbar h1{font-size:16px;}
  .content{padding:18px;}
  .search-bar{flex-wrap:wrap;}
  .search-bar .input{width:100%;}
  .page-head{align-items:flex-start;}
}

@media (max-width: 480px){
  .topbar h1{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .topbar .sub{display:none;}
  .stat-card h3{font-size:21px;}
  .card-head{padding:14px 16px;}
  .card-body{padding:16px;}
  th,td{padding:10px 12px;font-size:12.8px;}
}

/* ===================== AUTH PAGES (RESPONSIVE) ===================== */
@media (max-width: 900px){
  .auth-wrap{
    flex-direction:column;
    min-height:auto;
  }
  .auth-side{
    flex:none;
    width:100%;
    padding:36px 24px;
    border-right:none;
    border-bottom:1px solid var(--border);
  }
  .auth-side .content{max-width:100%;}
  .auth-side h1{font-size:26px;}
  .auth-side p{margin-bottom:20px;}
  .auth-stats{flex-wrap:wrap;gap:20px;}
  .auth-form-side{
    flex:none;
    width:100%;
    padding:32px 20px 48px;
  }
  .auth-card{max-width:100%;}
}

@media (max-width: 560px){
  .row-2{grid-template-columns:1fr;}
  .auth-logo span{font-size:17px;}
  .auth-side{padding:28px 18px;}
  .auth-side h1{font-size:22px;}
  .auth-card h2{font-size:22px;}
}

/* ===================== THIRD-PARTY OVERRIDES (dark mode) ===================== */
/* Bootstrap modals used for add/edit dialogs */
.modal-content{background:var(--card);color:var(--text);border:1px solid var(--border);}
.modal-header,.modal-footer{border-color:var(--border) !important;}
.modal-title{color:var(--text);}
.btn-close{filter:invert(1) grayscale(1) brightness(1.4);opacity:.7;}
.btn-close:hover{opacity:1;}
.modal-backdrop.show{opacity:.65;}

/* DataTables chrome (search box, length select, pagination, info text) */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select{
  background:var(--card);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:6px 10px;
}
.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus{outline:none;border-color:var(--accent);}
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter label{color:var(--text-dim);font-size:12.8px;}
.dataTables_wrapper .dataTables_paginate .paginate_button{
  color:var(--text-dim) !important;border-radius:8px !important;border:1px solid transparent !important;
  background:transparent !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button:hover{
  background:var(--card-2) !important;color:var(--text) !important;border-color:var(--border) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled{color:#4a4c56 !important;}
table.dataTable thead th{border-bottom:1.5px solid var(--border) !important;}
table.dataTable.display>tbody>tr>*{box-shadow:none !important;}
table.dataTable>tbody>tr.selected>*{background:var(--card-2) !important;color:var(--text) !important;box-shadow:none !important;}

/* SweetAlert2 popups */
.swal2-popup{background:var(--card) !important;color:var(--text) !important;border:1px solid var(--border);border-radius:16px !important;}
.swal2-title{color:var(--text) !important;}
.swal2-html-container{color:var(--text-dim) !important;}
.swal2-confirm{background:var(--accent) !important;box-shadow:none !important;}
.swal2-cancel{background:var(--card-2) !important;color:var(--text) !important;}
.swal2-icon.swal2-success{border-color:var(--success) !important;color:var(--success) !important;}
.swal2-icon.swal2-error{border-color:var(--danger) !important;color:var(--danger) !important;}
.swal2-icon.swal2-success .swal2-success-ring{border-color:rgba(34,197,94,.3) !important;}

/* ============ TIME SLOT PICKER (appointment booking) ============ */
.slot-picker{display:grid;grid-template-columns:290px 1fr;gap:22px;}
@media (max-width:640px){.slot-picker{grid-template-columns:1fr;}}

/* -- Calendar -- */
.slot-cal{border:1.5px solid var(--border);border-radius:12px;padding:14px;background:var(--card);}
.slot-cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.slot-cal-head .slot-cal-title{font-weight:800;font-size:14px;color:var(--text);}
.slot-cal-nav{border:none;background:transparent;color:var(--text-dim);cursor:pointer;font-size:16px;padding:4px 8px;border-radius:6px;line-height:1;}
.slot-cal-nav:hover:not(:disabled){background:var(--card-2);color:var(--text);}
.slot-cal-nav:disabled{opacity:.3;cursor:not-allowed;}
.slot-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center;}
.slot-cal-dow{font-size:10.5px;font-weight:800;color:var(--text-dim);padding:4px 0;text-transform:uppercase;}
.slot-cal-day{
  position:relative;aspect-ratio:1;display:flex;align-items:center;justify-content:center;
  border-radius:8px;font-size:12.5px;font-weight:700;cursor:pointer;border:1.5px solid transparent;
  background:rgba(34,197,94,.10);color:var(--success);
}
.slot-cal-day:hover:not(.slot-cal-disabled){border-color:var(--info);}
.slot-cal-day.slot-cal-full{background:rgba(244,63,94,.08);color:var(--danger);cursor:not-allowed;}
.slot-cal-day.slot-cal-disabled{background:transparent;color:var(--text-dim);opacity:.35;cursor:not-allowed;}
.slot-cal-day.slot-cal-empty{visibility:hidden;cursor:default;}
.slot-cal-day.slot-cal-selected{background:var(--info);color:#fff;border-color:var(--info);}
.slot-cal-legend{display:flex;gap:16px;margin-top:12px;font-size:11.5px;color:var(--text-dim);}
.slot-cal-legend span{display:inline-flex;align-items:center;gap:5px;}
.slot-cal-legend i{width:9px;height:9px;border-radius:3px;display:inline-block;}
.slot-cal-legend .lg-avail i{background:var(--success);}
.slot-cal-legend .lg-full i{background:var(--danger);}

/* -- Time slot list -- */
.slot-list{display:flex;flex-direction:column;gap:2px;}
.slot-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 14px;border-radius:10px;cursor:pointer;border:1.5px solid transparent;
  transition:background .12s;
}
.slot-row:hover:not(.slot-row-disabled){background:var(--card-2);}
.slot-row.slot-row-selected{background:var(--accent-soft);border-color:var(--info);}
.slot-row-disabled{cursor:not-allowed;opacity:.65;}
.slot-row-left{display:flex;align-items:center;gap:10px;}
.slot-row-radio{width:16px;height:16px;border-radius:50%;border:2px solid var(--border);flex:none;position:relative;}
.slot-row.slot-row-selected .slot-row-radio{border-color:var(--info);}
.slot-row.slot-row-selected .slot-row-radio::after{content:'';position:absolute;inset:3px;border-radius:50%;background:var(--info);}
.slot-row-time{font-size:14px;font-weight:600;color:var(--text);}
.slot-row-status{font-size:12.5px;font-weight:800;letter-spacing:.02em;}
.slot-row-status.status-available{color:var(--info);}
.slot-row-status.status-full{color:var(--danger);}
.slot-row-status.status-past{color:var(--text-dim);}
.slot-note{padding:12px 14px;border-radius:10px;background:var(--card-2);color:var(--text-dim);font-size:13px;}
.slot-note-danger{background:rgba(244,63,94,.1);color:var(--danger);font-weight:600;}
.slot-loading{padding:12px 14px;color:var(--text-dim);font-size:13px;}

/* Shared public-site footer (index/about/services/pricing/blog/contact) */
.site-footer{border-top:1px solid var(--border)}
.site-footer-inner{max-width:1200px;margin:auto;padding:50px 6% 30px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.site-footer h4{font-size:13px;margin:0 0 16px;color:var(--text)}
.site-footer-brand{display:flex;flex-direction:column}
.site-footer-logo{display:flex;align-items:center;gap:12px;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;color:var(--text);text-decoration:none}
.site-footer-logo img{width:42px;height:42px;border-radius:12px;display:block;object-fit:cover;flex-shrink:0}
.site-footer-brand p{color:var(--text-dim);font-size:13px;line-height:1.7;margin:14px 0 0;max-width:340px}
.site-footer-links{display:grid;gap:10px}
.site-footer-links a{color:var(--text-dim);font-size:13px;text-decoration:none}
.site-footer-links a:hover{color:var(--accent-2)}
.site-footer-contact{display:grid;gap:10px;color:var(--text-dim);font-size:13px;line-height:1.6}
.site-footer-contact strong{color:var(--text);display:block;font-size:12px;margin-bottom:2px}
.site-footer-bottom{max-width:1200px;margin:auto;padding:20px 6% 30px;border-top:1px solid var(--border);text-align:center;color:var(--text-dim);font-size:12px}
@media(max-width:900px){.site-footer-inner{grid-template-columns:1fr}}

/* Pricing page */
.pricing-grid{max-width:900px;margin:auto;padding:20px 6% 40px;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.pricing-card{border:1px solid var(--border);border-radius:20px;padding:34px 28px;background:var(--card);text-align:center}
.pricing-card.featured{background:linear-gradient(145deg,var(--card),var(--card-2));border-color:var(--accent-2);box-shadow:var(--shadow-md)}
.pricing-card .pricing-tag{display:inline-flex;padding:6px 12px;border-radius:999px;background:var(--accent-soft);color:var(--accent-2);font-size:11.5px;font-weight:800;letter-spacing:.04em;margin-bottom:18px}
.pricing-card .pricing-amount{font-size:44px;font-weight:800;letter-spacing:-1.5px;margin:0}
.pricing-card .pricing-amount small{font-size:14px;font-weight:600;color:var(--text-dim)}
.pricing-card .pricing-desc{color:var(--text-dim);font-size:13.5px;margin:10px 0 22px;line-height:1.6}
.pricing-card ul{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:10px;text-align:left}
.pricing-card ul li{display:flex;gap:10px;align-items:flex-start;color:var(--text-dim);font-size:13.5px;line-height:1.5}
.pricing-note{max-width:900px;margin:0 auto 40px;padding:0 6%;color:var(--text-dim);font-size:12.5px;text-align:center}
@media(max-width:700px){.pricing-grid{grid-template-columns:1fr}}

/* Shared nav logo image (About/Services/Pricing/Blog/Contact) */
.brand-mark-img{width:42px;height:42px;border-radius:12px;display:block;object-fit:cover;flex-shrink:0}