
/*
  TalkEase Modern UI – Light Purple Design System
  Purpose: global redesign for TalkEase pages with a lighter, cleaner,
  more organized interface and colorful modern buttons.
*/

:root{
  --te-primary:#521fbe;
  --te-primary-2:#7c3aed;
  --te-primary-3:#8b5cf6;
  --te-primary-soft:#f3efff;
  --te-primary-soft-2:#faf7ff;
  --te-secondary:#f472b6;
  --te-secondary-2:#f9a8d4;
  --te-info:#3b82f6;
  --te-info-2:#60a5fa;
  --te-success:#10b981;
  --te-success-2:#34d399;
  --te-warning:#f59e0b;
  --te-warning-2:#fcd34d;
  --te-danger:#ef4444;
  --te-danger-2:#fb7185;
  --te-text:#1e1b4b;
  --te-text-soft:#312e81;
  --te-muted:#7c7aa0;
  --te-muted-2:#9ca3af;
  --te-bg:#faf9ff;
  --te-bg-2:#f5f3ff;
  --te-surface:#ffffff;
  --te-surface-soft:#fcfbff;
  --te-border:#ece8ff;
  --te-border-strong:#dcd3ff;
  --te-ring:rgba(124,58,237,.18);
  --te-radius-xs:10px;
  --te-radius-sm:14px;
  --te-radius:18px;
  --te-radius-lg:24px;
  --te-shadow-xs:0 4px 10px rgba(82,31,190,.05);
  --te-shadow-sm:0 8px 20px rgba(82,31,190,.07);
  --te-shadow:0 14px 36px rgba(82,31,190,.10);
  --te-shadow-lg:0 24px 58px rgba(82,31,190,.14);
  --te-sidebar-width:268px;
  --te-header-height:74px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  min-height:100vh;
  color:var(--te-text) !important;
  background:
    radial-gradient(900px 420px at 105% -5%, rgba(139,92,246,.08), transparent 66%),
    radial-gradient(720px 340px at -8% 110%, rgba(244,114,182,.06), transparent 64%),
    linear-gradient(180deg, #ffffff 0%, var(--te-bg) 100%) !important;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg,video,canvas{ max-width:100%; }
a{ text-underline-offset:3px; }
hr{ border-color:var(--te-border) !important; opacity:1; }
.flex-fill{ min-width:0; }
.min-w-0{ min-width:0 !important; }
.text-truncate{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* main content spacing */
.te-main-pane{ min-width:0; }
main.p-4,
.te-main-content,
.te-public-main{
  min-height:calc(100vh - var(--te-header-height));
  padding:clamp(1rem, 2vw, 1.6rem) !important;
}
.te-page-shell,
.bulk-shell,
.ca-shell,
.act-shell,
.admin-main-wrap,
.dashboard-shell,
.coach-dashboard-shell,
.student-dashboard-shell{
  width:min(100%, 1220px) !important;
  margin-inline:auto !important;
}

/* layout cards */
.card,
.card-clean,
.ca-card,
.bulk-card,
.act-card,
.act-header-card,
.kpi-card,
.list-card,
.student-card,
.pr-card,
.te-card,
.te-panel,
.te-feedback-item,
.bulk-row,
.stat,
.role-card{
  border:1px solid var(--te-border) !important;
  border-radius:var(--te-radius-lg) !important;
  background:rgba(255,255,255,.96) !important;
  box-shadow:var(--te-shadow-sm) !important;
  overflow:hidden;
}
.card:hover,
.card-clean:hover,
.ca-card:hover,
.bulk-card:hover,
.act-card:hover,
.bulk-row:hover,
.stat:hover,
.student-card:hover,
.te-panel:hover{
  box-shadow:var(--te-shadow) !important;
}
.card-header,
.card-clean .card-header{
  border-bottom:1px solid var(--te-border) !important;
  background:linear-gradient(180deg,#ffffff,var(--te-primary-soft-2)) !important;
  border-top-left-radius:var(--te-radius-lg) !important;
  border-top-right-radius:var(--te-radius-lg) !important;
}
.bg-light,
.bg-light-subtle{ background:var(--te-surface-soft) !important; }
.border,
.border-top,
.border-bottom,
.border-start,
.border-end{ border-color:var(--te-border) !important; }
.rounded-3{ border-radius:var(--te-radius-sm) !important; }
.rounded-4{ border-radius:var(--te-radius-lg) !important; }
.shadow,
.shadow-sm,
.shadow-lg{ box-shadow:var(--te-shadow) !important; }
.sticky-top{ top:calc(var(--te-header-height) + 1rem) !important; }

/* typography */
h1,h2,h3,h4,h5,h6,.fw-bold,.fw-semibold{
  letter-spacing:-.025em;
  color:var(--te-text);
}
h1{ font-size:clamp(2rem, 4vw, 3rem); }
h2{ font-size:clamp(1.7rem, 3vw, 2.4rem); }
h3{ font-size:clamp(1.35rem, 2.4vw, 1.9rem); }
.text-muted{ color:var(--te-muted) !important; }
.small,small{ line-height:1.45; }

/* sidebar / navigation */
.sidebar-coach,
.sidebar-student,
.sidebar-admin{
  width:var(--te-sidebar-width) !important;
  background:rgba(255,255,255,.88) !important;
  border-right:1px solid var(--te-border) !important;
  box-shadow:14px 0 40px rgba(82,31,190,.05) !important;
  backdrop-filter:blur(16px);
  padding:18px 14px !important;
}
.sidebar-coach.min,
.sidebar-student.min,
.sidebar-admin.min{ width:88px !important; }
.sidebar-brand{
  min-height:58px;
  padding:8px 8px 16px !important;
  margin-bottom:12px !important;
  border-bottom:1px solid rgba(124,58,237,.10) !important;
  letter-spacing:-.015em;
}
.sidebar-brand a{ color:inherit !important; }
.mic-badge,
.sidebar-brand .brand-ico,
.role-logo{
  width:42px !important;
  height:42px !important;
  border-radius:14px !important;
  background:linear-gradient(135deg, var(--te-primary), var(--te-primary-3)) !important;
  color:#fff !important;
  box-shadow:0 12px 24px rgba(82,31,190,.18) !important;
}
.sidebar-user{
  display:flex; align-items:center; gap:.75rem;
  padding:.95rem; margin:6px 6px 12px;
  border-radius:18px;
  border:1px solid var(--te-border);
  background:linear-gradient(180deg,#fff,var(--te-primary-soft-2));
  box-shadow:var(--te-shadow-xs);
}
.sidebar-user .name{ font-weight:800; color:var(--te-text); }
.sidebar-user .role{ color:var(--te-muted); font-size:.78rem; }
.sidebar-section{
  padding:14px 10px 6px !important;
  color:var(--te-muted) !important;
  font-size:.72rem !important;
  font-weight:800 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase;
}
.nav-clean{
  display:flex !important;
  flex-direction:column !important;
  gap:6px !important;
  padding:6px !important;
}
.nav-clean .nav-link{
  position:relative;
  min-height:50px;
  border-radius:15px !important;
  border:1px solid transparent !important;
  color:#241f53 !important;
  font-weight:750 !important;
  line-height:1.15;
  gap:.75rem !important;
  transition:background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease !important;
}
.nav-clean .nav-link > i:not(.fa-chevron-down),
.nav-clean .nav-link .ico{
  width:38px;
  min-width:38px;
  height:38px;
  border-radius:12px;
  display:inline-grid;
  place-items:center;
  background:rgba(124,58,237,.08);
  color:var(--te-primary);
  box-shadow:inset 0 0 0 1px rgba(124,58,237,.08);
}
.nav-clean .nav-link:hover{
  background:linear-gradient(90deg, var(--te-primary-soft), #ffffff) !important;
  border-color:var(--te-border) !important;
  color:var(--te-primary) !important;
  transform:translateY(-1px);
  box-shadow:var(--te-shadow-xs) !important;
}
.nav-clean .nav-link.active{
  background:linear-gradient(90deg, rgba(82,31,190,.14), rgba(244,114,182,.08)) !important;
  border-color:var(--te-border-strong) !important;
  color:var(--te-primary) !important;
  box-shadow:var(--te-shadow-sm) !important;
}
.nav-clean .nav-link.active > i:not(.fa-chevron-down),
.nav-clean .nav-link.active .ico{
  background:linear-gradient(135deg, var(--te-primary), var(--te-primary-3)) !important;
  color:#fff !important;
  box-shadow:0 10px 22px rgba(82,31,190,.18) !important;
}
.nav-clean .nav-link::before{
  content:"";
  position:absolute;
  left:-6px;
  top:50%;
  transform:translateY(-50%);
  width:4px;
  height:22px;
  border-radius:999px;
  background:transparent;
}
.nav-clean .nav-link.active::before{ background:var(--te-primary); }
.sidebar-coach.min .nav-clean .nav-link,
.sidebar-student.min .nav-clean .nav-link,
.sidebar-admin.min .nav-clean .nav-link{
  justify-content:center !important;
  padding:.55rem !important;
}
.sidebar-coach.min .nav-clean .nav-link > i:not(.fa-chevron-down),
.sidebar-student.min .nav-clean .nav-link .ico,
.sidebar-admin.min .nav-clean .nav-link > i:not(.fa-chevron-down){
  min-width:42px;
  width:42px;
  height:42px;
}
.sb-toggle,
.te-mini-toggle{
  min-height:46px;
  width:100%;
  border-radius:15px !important;
  border:1px solid var(--te-border) !important;
  color:var(--te-text) !important;
  background:#fff !important;
  box-shadow:0 4px 14px rgba(82,31,190,.04) !important;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
}
.sb-toggle:hover,
.te-mini-toggle:hover{
  border-color:var(--te-border-strong) !important;
  box-shadow:var(--te-shadow-xs) !important;
}
.offcanvas.te-sidebar{
  background:rgba(255,255,255,.94) !important;
  border-right:1px solid var(--te-border) !important;
  backdrop-filter:blur(14px);
}
.offcanvas.te-sidebar .offcanvas-header{ border-bottom:1px solid var(--te-border) !important; }
.offcanvas.te-sidebar .offcanvas-body{ padding:12px 10px 16px !important; }

/* headers */
.coach-header,
.student-header,
.admin-header{
  min-height:var(--te-header-height);
  position:sticky;
  top:0;
  z-index:1010;
  background:rgba(255,255,255,.84) !important;
  border-bottom:1px solid var(--te-border) !important;
  border-radius:0 !important;
  box-shadow:0 8px 28px rgba(82,31,190,.05) !important;
  backdrop-filter:blur(16px);
}
.coach-header .btn.btn-light,
.student-header .btn.btn-light,
.admin-header .btn.btn-light{
  width:42px !important;
  height:42px !important;
  min-height:42px !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding:0 !important;
  border-radius:14px !important;
}
.coach-header .dropdown > button,
.student-header .dropdown > button,
.admin-header .dropdown > button{
  max-width:320px;
  border-radius:16px !important;
  padding:.3rem .35rem .3rem .65rem !important;
}
.coach-header .dropdown > button:hover,
.student-header .dropdown > button:hover,
.admin-header .dropdown > button:hover{
  background:rgba(82,31,190,.05) !important;
}
.profile-pic{
  width:42px !important;
  height:42px !important;
  border-radius:999px !important;
  object-fit:cover !important;
  border:3px solid #fff !important;
  box-shadow:0 0 0 1px var(--te-border-strong), 0 10px 22px rgba(82,31,190,.12) !important;
}
.dropdown-menu{
  border:1px solid var(--te-border) !important;
  border-radius:18px !important;
  box-shadow:var(--te-shadow-lg) !important;
  padding:.5rem !important;
}
.dropdown-item{
  border-radius:12px !important;
  padding:.65rem .8rem !important;
  font-weight:650;
}
.dropdown-item:hover{ background:var(--te-primary-soft) !important; color:var(--te-primary) !important; }

/* buttons / badges */
.btn{
  border-radius:14px !important;
  font-weight:750 !important;
  letter-spacing:-.005em;
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  padding:.6rem 1rem !important;
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease !important;
  white-space:nowrap;
}
.btn-sm{ min-height:35px; border-radius:12px !important; font-size:.84rem !important; padding:.45rem .8rem !important; }
.btn-lg{ min-height:50px; border-radius:16px !important; }
.btn:hover{ transform:translateY(-1px); }
.btn:active{ transform:translateY(0); }
.btn-primary{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, var(--te-primary), var(--te-primary-3)) !important;
  box-shadow:0 10px 22px rgba(82,31,190,.18) !important;
}
.btn-secondary{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, var(--te-secondary), #c084fc) !important;
  box-shadow:0 10px 22px rgba(244,114,182,.18) !important;
}
.btn-info{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, var(--te-info), var(--te-info-2)) !important;
  box-shadow:0 10px 22px rgba(59,130,246,.18) !important;
}
.btn-success{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, var(--te-success), var(--te-success-2)) !important;
  box-shadow:0 10px 22px rgba(16,185,129,.18) !important;
}
.btn-warning{
  color:#7c2d12 !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, #fde68a, var(--te-warning-2)) !important;
  box-shadow:0 10px 22px rgba(245,158,11,.16) !important;
}
.btn-danger{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, var(--te-danger), var(--te-danger-2)) !important;
  box-shadow:0 10px 22px rgba(239,68,68,.18) !important;
}
.btn-light{
  color:var(--te-text) !important;
  border:1px solid var(--te-border) !important;
  background:#fff !important;
  box-shadow:var(--te-shadow-xs) !important;
}
.btn-light:hover{ background:var(--te-primary-soft-2) !important; }
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-info,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger{
  background:#fff !important;
  border-width:1px !important;
}
.btn-outline-primary{
  color:var(--te-primary) !important;
  border-color:rgba(82,31,190,.22) !important;
  background:rgba(243,239,255,.55) !important;
}
.btn-outline-primary:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, var(--te-primary), var(--te-primary-3)) !important;
}
.btn-outline-secondary{
  color:#be185d !important;
  border-color:rgba(244,114,182,.22) !important;
  background:rgba(253,242,248,.85) !important;
}
.btn-outline-secondary:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, var(--te-secondary), #c084fc) !important;
}
.btn-outline-info{
  color:var(--te-info) !important;
  border-color:rgba(59,130,246,.22) !important;
  background:rgba(239,246,255,.9) !important;
}
.btn-outline-info:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, var(--te-info), var(--te-info-2)) !important;
}
.btn-outline-success{
  color:#047857 !important;
  border-color:rgba(16,185,129,.22) !important;
  background:rgba(236,253,245,.9) !important;
}
.btn-outline-success:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, var(--te-success), var(--te-success-2)) !important;
}
.btn-outline-warning{
  color:#b45309 !important;
  border-color:rgba(245,158,11,.22) !important;
  background:rgba(255,251,235,.95) !important;
}
.btn-outline-warning:hover{
  color:#7c2d12 !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, #fde68a, var(--te-warning-2)) !important;
}
.btn-outline-danger{
  color:#dc2626 !important;
  border-color:rgba(239,68,68,.22) !important;
  background:rgba(254,242,242,.92) !important;
}
.btn-outline-danger:hover{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg, var(--te-danger), var(--te-danger-2)) !important;
}
.btn-link{
  min-height:auto;
  padding-inline:.25rem !important;
  border-radius:10px !important;
  color:var(--te-primary) !important;
}
.btn-group{ gap:6px; flex-wrap:wrap; }
.btn-group>.btn{ border-radius:12px !important; margin-inline:0 !important; }
.badge{
  border-radius:999px !important;
  font-weight:800 !important;
  letter-spacing:-.01em;
  padding:.42em .74em;
}
.bg-primary-subtle{ background:rgba(82,31,190,.10) !important; }
.bg-success-subtle{ background:rgba(16,185,129,.12) !important; }
.bg-warning-subtle{ background:rgba(245,158,11,.14) !important; }
.bg-danger-subtle{ background:rgba(239,68,68,.12) !important; }
.text-primary{ color:var(--te-primary) !important; }
.text-success{ color:#047857 !important; }
.text-info{ color:var(--te-info) !important; }
.text-warning{ color:#b45309 !important; }
.text-danger{ color:#dc2626 !important; }

/* forms */
.form-label,
.ca-label,
.bulk-label{
  color:#241f53 !important;
  font-weight:800 !important;
  margin-bottom:.35rem !important;
}
.ca-help,
.bulk-help,
.form-text{ color:var(--te-muted) !important; line-height:1.45; }
.form-control,
.form-select,
.input-group-text{
  border-color:rgba(124,58,237,.12) !important;
  background:#fff !important;
  color:var(--te-text) !important;
}
.form-control:not(.form-control-sm),
.form-select:not(.form-select-sm){
  min-height:46px;
  border-radius:14px !important;
  padding:.65rem .9rem;
}
.form-control-sm,
.form-select-sm{
  min-height:36px;
  border-radius:11px !important;
}
textarea.form-control{ min-height:112px; resize:vertical; }
.input-group>.form-control,
.input-group>.form-select{ border-radius:14px !important; }
.input-group-text{
  border-radius:14px !important;
  min-height:46px;
}
.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.btn:focus,
.dropdown-item:focus,
a.nav-link:focus{
  border-color:var(--te-primary) !important;
  box-shadow:0 0 0 4px var(--te-ring) !important;
  outline:0 !important;
}
.form-check-input{
  border-color:rgba(124,58,237,.35) !important;
  cursor:pointer;
}
.form-check-input:checked{
  background-color:var(--te-primary) !important;
  border-color:var(--te-primary) !important;
}
.form-switch .form-check-input{ width:2.7em; height:1.35em; }

/* tables, lists */
.table-responsive{ border-radius:var(--te-radius-lg); }
.table{ --bs-table-bg: transparent; margin-bottom:0; }
.table thead th{
  background:var(--te-primary-soft-2) !important;
  color:#5b5a7a !important;
  border-bottom:1px solid var(--te-border) !important;
  font-size:.76rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:900;
  white-space:nowrap;
}
.table>:not(caption)>*>*{
  padding:.85rem .95rem;
  border-color:rgba(236,232,255,.92) !important;
  vertical-align:middle;
}
.table tbody tr{ transition:background .14s ease; }
.table tbody tr:hover{ background:rgba(243,239,255,.55) !important; }
.table td:last-child .btn-group,
.table td:last-child form{
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex-wrap:wrap;
}
.list-group-item{
  border-color:var(--te-border) !important;
  padding:.9rem 1rem;
  background:transparent !important;
}
.student-item,
.bulk-student-list .student-item{
  border:1px solid transparent;
  transition:background .14s ease, border-color .14s ease;
  padding:.8rem;
  border-radius:16px;
}
.student-item:hover,
.bulk-student-list .student-item:hover{
  background:var(--te-primary-soft);
  border-color:var(--te-border);
}
.bulk-student-list{
  max-height:360px;
  overflow:auto;
  border:1px solid var(--te-border) !important;
  border-radius:18px;
  padding:.4rem;
  background:#fff;
}

/* utility surface classes */
.alert{
  border:1px solid transparent !important;
  border-radius:18px !important;
  box-shadow:var(--te-shadow-xs) !important;
}
.alert-success{ border-color:rgba(16,185,129,.16) !important; }
.alert-danger{ border-color:rgba(239,68,68,.16) !important; }
.alert-warning{ border-color:rgba(245,158,11,.16) !important; }
.pagination .page-link{
  border-radius:12px !important;
  margin:0 3px;
  border-color:var(--te-border) !important;
  color:var(--te-primary) !important;
}
.pagination .page-item.active .page-link{
  background:linear-gradient(135deg, var(--te-primary), var(--te-primary-3)) !important;
  border-color:transparent !important;
  color:#fff !important;
}
.progress{
  height:.55rem;
  border-radius:999px !important;
  background:rgba(82,31,190,.10) !important;
}
.progress-bar{ background:linear-gradient(90deg, var(--te-primary), var(--te-primary-3)) !important; }

/* auth / public pages */
.te-app-layout,
.role-page,
.login-page{
  background:
    radial-gradient(900px 450px at 100% 0%, rgba(139,92,246,.10), transparent 62%),
    radial-gradient(760px 360px at 0% 100%, rgba(244,114,182,.06), transparent 60%),
    linear-gradient(180deg,#ffffff 0%, var(--te-bg) 100%) !important;
}
.te-public-main{
  display:flex;
  align-items:center;
  justify-content:center;
}
.login-page .card,
.role-card,
.register-page .card{ box-shadow:var(--te-shadow-lg) !important; }

/* bulk create page */
.bulk-page{ padding-bottom:1rem; }
.bulk-hero-card{
  background:
    radial-gradient(780px 260px at 100% 0%, rgba(124,58,237,.10), transparent 60%),
    radial-gradient(640px 280px at 0% 100%, rgba(244,114,182,.08), transparent 62%),
    #fff !important;
}
.bulk-action-bar,
.ca-action-bar,
.act-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}
.bulk-row{
  padding:1rem !important;
  overflow:hidden;
}
.bulk-row-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  margin-bottom:1rem;
  flex-wrap:wrap;
}
.bulk-row-title{
  display:flex;
  align-items:center;
  gap:.75rem;
  font-weight:900;
  min-width:0;
}
.bulk-row-index{
  width:36px;
  height:36px;
  border-radius:12px;
  display:inline-grid;
  place-items:center;
  background:var(--te-primary-soft);
  color:var(--te-primary);
  border:1px solid var(--te-border);
  flex-shrink:0;
}
.bulk-grid{ align-items:start; }
.bulk-empty-note{
  border:1px dashed var(--te-border-strong);
  background:var(--te-primary-soft);
  border-radius:16px;
  padding:1rem;
  color:var(--te-muted);
}

/* responsiveness */
@media (max-width: 1199.98px){
  .te-page-shell,
  .bulk-shell,
  .ca-shell,
  .act-shell,
  .admin-main-wrap{ width:min(100%, 1120px) !important; }
}
@media (max-width: 991.98px){
  .sidebar-coach,
  .sidebar-student,
  .sidebar-admin{ display:none !important; }
  main.p-4,
  .te-main-content,
  .te-public-main{ padding:1rem !important; }
  .sticky-top{ position:static !important; top:auto !important; }
}
@media (max-width: 767.98px){
  .coach-header,
  .student-header,
  .admin-header{ padding:.8rem 1rem !important; }
  .bulk-action-bar,
  .ca-action-bar,
  .act-toolbar,
  .bulk-row-header{ align-items:stretch; }
  .bulk-row-header .btn,
  .bulk-action-bar .btn{ width:100%; }
  .btn-group{ width:100%; }
  .btn-group>.btn{ flex:1 1 auto; }
  .table-responsive{ border-radius:18px; }
}
@media (max-width: 575.98px){
  main.p-4,
  .te-main-content,
  .te-public-main{ padding:.9rem !important; }
  .btn{ width:100%; }
  .btn.btn-light,
  .coach-header .btn.btn-light,
  .student-header .btn.btn-light,
  .admin-header .btn.btn-light{ width:42px !important; }
  .dropdown > .btn{ width:auto; }
}

/* =========================================================
   TalkEase Student Responsive Polish – May 2026
   Purpose: cleaner student pages, safe mobile/tablet layouts,
   no overlapping buttons, cards, tables, tabs, or select icons.
========================================================= */
html,
body{
  max-width:100%;
  overflow-x:hidden;
}

.te-main-pane,
.te-main-content,
.te-page,
.container,
.container-fluid,
.row,
[class*="col-"]{
  min-width:0;
}

.te-main-content{
  width:100%;
}

/* Responsive page max-widths */
.student-clean-page,
.te-page,
.ex-card,
.te-student-page-shell{
  margin-left:auto;
  margin-right:auto;
}

/* Make horizontally-scrolled controls feel intentional instead of broken */
.te-scroll-tabs,
.te-tabs,
.status-tabs,
.filter-tabs,
ul[aria-label*="tabs"],
.nav-pills,
.nav-tabs{
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
}
.te-scroll-tabs::-webkit-scrollbar,
.te-tabs::-webkit-scrollbar,
.status-tabs::-webkit-scrollbar,
.filter-tabs::-webkit-scrollbar,
ul[aria-label*="tabs"]::-webkit-scrollbar,
.nav-pills::-webkit-scrollbar,
.nav-tabs::-webkit-scrollbar{
  height:6px;
}
.te-scroll-tabs::-webkit-scrollbar-thumb,
.te-tabs::-webkit-scrollbar-thumb,
.status-tabs::-webkit-scrollbar-thumb,
.filter-tabs::-webkit-scrollbar-thumb,
ul[aria-label*="tabs"]::-webkit-scrollbar-thumb,
.nav-pills::-webkit-scrollbar-thumb,
.nav-tabs::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:rgba(82,31,190,.18);
}

/* Fix icon + select text collision on the Exercise Select page */
.ex-card .position-relative{
  isolation:isolate;
}
.ex-icon-wrap{
  width:1.35rem;
  text-align:center;
  z-index:4;
}
.ex-icon-wrap + .form-select,
.ex-icon-wrap + select.form-select,
.ex-select{
  padding-left:3.25rem !important;
  padding-inline-start:3.25rem !important;
  text-indent:.08rem;
  background-position:right 1rem center !important;
}

/* Buttons inside compact action rows should never overlap. */
.te-action,
.te-card-actions,
.te-mobile-activity-actions,
.te-mobile-card-actions,
.student-action-row{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  align-items:center;
}
.te-action .btn,
.te-card-actions .btn,
.student-action-row .btn{
  min-width:max-content;
}

/* Tables stay readable on tablet/desktop; mobile pages can provide card alternatives. */
.table-responsive{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.table-responsive > .table{
  min-width:720px;
}

/* Activity mobile cards shared styling */
.te-mobile-activity-list{
  display:grid;
  gap:.85rem;
}
.te-mobile-activity-card{
  border:1px solid rgba(221,214,254,.95);
  border-radius:24px;
  background:
    radial-gradient(240px 130px at 0% 0%, rgba(124,58,237,.10), transparent 65%),
    radial-gradient(220px 130px at 100% 100%, rgba(16,185,129,.09), transparent 65%),
    #fff;
  box-shadow:0 14px 32px rgba(37,37,91,.07);
  padding:1rem;
  overflow:hidden;
}
.te-mobile-activity-card-title{
  font-weight:900;
  color:#202157;
  line-height:1.2;
  overflow-wrap:anywhere;
}
.te-mobile-activity-card-desc{
  color:#737197;
  font-size:.86rem;
  line-height:1.35;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.te-mobile-activity-meta{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.55rem;
  margin:.8rem 0;
}
.te-mobile-activity-meta span{
  min-height:40px;
  border:1px solid rgba(221,214,254,.78);
  border-radius:15px;
  background:rgba(255,255,255,.78);
  color:#4c496f;
  font-size:.78rem;
  font-weight:800;
  display:flex;
  align-items:center;
  gap:.45rem;
  padding:.45rem .6rem;
  min-width:0;
}
.te-mobile-activity-meta span i{
  color:#6f57e7;
  flex:0 0 auto;
}
.te-mobile-activity-meta span b,
.te-mobile-activity-meta span strong{
  color:#202157;
}
.te-mobile-activity-actions{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.65rem;
  margin-top:.9rem;
}
.te-mobile-activity-actions .btn{
  width:100% !important;
  min-width:0 !important;
  min-height:48px;
}

/* Mobile-friendly cards/forms */
@media (max-width: 991.98px){
  body{
    background:
      radial-gradient(520px 260px at -10% 12%, rgba(111,87,231,.15), transparent 72%),
      radial-gradient(480px 260px at 105% 75%, rgba(71,134,252,.14), transparent 72%),
      linear-gradient(135deg,#fbfaff 0%, #f5f7ff 100%) !important;
  }

  .te-main-content{
    padding:16px 14px calc(136px + env(safe-area-inset-bottom)) !important;
  }

  .card,
  .card-clean,
  .te-card,
  .te-panel{
    border-radius:24px !important;
  }

  .table-responsive > .table{
    min-width:680px;
  }

  .student-header{
    min-height:80px !important;
  }
}

@media (max-width: 767.98px){
  .te-header,
  .student-page-header,
  .student-action-row{
    align-items:stretch !important;
  }

  .te-header-actions,
  .student-action-row,
  .student-page-header-actions{
    width:100%;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:.6rem !important;
  }

  .te-header-actions .btn,
  .student-action-row .btn,
  .student-page-header-actions .btn{
    width:100% !important;
    min-width:0 !important;
  }

  .te-mobile-activity-meta{
    grid-template-columns:1fr;
  }
}

@media (max-width: 575.98px){
  main.p-4,
  .te-main-content,
  .te-public-main{
    padding:14px 12px calc(142px + env(safe-area-inset-bottom)) !important;
  }

  /* The old global mobile rule made every .btn full width, which caused
     table/action overlap. Keep only page-level action buttons full width. */
  .te-action .btn,
  .table .btn,
  .table-responsive .btn,
  .te-item-row .btn,
  .dropdown-menu .btn,
  .student-header .btn,
  .te-mobile-profile-toggle{
    width:auto !important;
  }

  .te-mobile-activity-actions{
    grid-template-columns:1fr;
  }

  .te-tabs .nav-link,
  .te-scroll-tabs .nav-link,
  .nav-pills .nav-link,
  .nav-tabs .nav-link{
    min-height:44px;
    display:inline-flex;
    align-items:center;
  }

  .form-control:not(.form-control-sm),
  .form-select:not(.form-select-sm),
  .ex-select{
    min-height:54px !important;
    font-size:1rem;
  }
}

/* =========================================================
   TalkEase Coach UI Polish + Global Light/Dark Mode
   Applies to: coach dashboard, students, activities, reviews,
   analytics, create/edit/show/submitted pages, mobile/tablet/desktop.
========================================================= */
html[data-te-theme="dark"]{
  color-scheme:dark;
  --te-primary:#a78bfa;
  --te-primary-2:#c084fc;
  --te-primary-3:#8b5cf6;
  --te-primary-soft:rgba(124,58,237,.18);
  --te-primary-soft-2:rgba(124,58,237,.10);
  --te-info:#60a5fa;
  --te-success:#34d399;
  --te-warning:#fbbf24;
  --te-danger:#fb7185;
  --te-text:#eef2ff;
  --te-text-soft:#dbeafe;
  --te-muted:#a8b3cf;
  --te-muted-2:#94a3b8;
  --te-bg:#090b19;
  --te-bg-2:#111827;
  --te-surface:#151c2f;
  --te-surface-soft:#1e293b;
  --te-border:rgba(148,163,184,.20);
  --te-border-strong:rgba(167,139,250,.34);
  --te-ring:rgba(167,139,250,.26);
  --blue-50:rgba(96,165,250,.10);
  --blue-100:rgba(148,163,184,.20);
  --blue-200:rgba(147,197,253,.26);
  --blue-300:rgba(147,197,253,.34);
  --blue-400:#60a5fa;
  --blue-500:#60a5fa;
  --blue-600:#93c5fd;
  --blue-700:#bfdbfe;
  --txt:#eef2ff;
  --mut:#a8b3cf;
  --brd:rgba(148,163,184,.20);
  --card:#151c2f;
  --te-shadow-xs:0 5px 16px rgba(0,0,0,.16);
  --te-shadow-sm:0 10px 26px rgba(0,0,0,.22);
  --te-shadow:0 16px 42px rgba(0,0,0,.28);
  --te-shadow-lg:0 26px 70px rgba(0,0,0,.34);
}
html[data-te-theme="dark"] body{
  background:
    radial-gradient(900px 420px at 105% -5%, rgba(124,58,237,.18), transparent 66%),
    radial-gradient(720px 340px at -8% 110%, rgba(14,165,233,.10), transparent 64%),
    linear-gradient(180deg, #090b19 0%, #111827 100%) !important;
  color:var(--te-text) !important;
}
html[data-te-theme="dark"] h1,
html[data-te-theme="dark"] h2,
html[data-te-theme="dark"] h3,
html[data-te-theme="dark"] h4,
html[data-te-theme="dark"] h5,
html[data-te-theme="dark"] h6,
html[data-te-theme="dark"] .fw-bold,
html[data-te-theme="dark"] .fw-semibold,
html[data-te-theme="dark"] .text-dark,
html[data-te-theme="dark"] .kpi-number,
html[data-te-theme="dark"] .kpi-card .val,
html[data-te-theme="dark"] .te-kpi .val,
html[data-te-theme="dark"] .student-name,
html[data-te-theme="dark"] .rt-title,
html[data-te-theme="dark"] .rt-row-title,
html[data-te-theme="dark"] .rt-item-title,
html[data-te-theme="dark"] .bulk-stat .value,
html[data-te-theme="dark"] .te-mobile-activity-card-title{
  color:var(--te-text) !important;
}
html[data-te-theme="dark"] .text-muted,
html[data-te-theme="dark"] .te-muted,
html[data-te-theme="dark"] .small.text-muted,
html[data-te-theme="dark"] .form-text,
html[data-te-theme="dark"] .bulk-help,
html[data-te-theme="dark"] .ca-help,
html[data-te-theme="dark"] .kpi-label,
html[data-te-theme="dark"] .student-email,
html[data-te-theme="dark"] .bulk-stat .label,
html[data-te-theme="dark"] .te-mobile-activity-card-desc{
  color:var(--te-muted) !important;
}
html[data-te-theme="dark"] .card,
html[data-te-theme="dark"] .card-clean,
html[data-te-theme="dark"] .ca-card,
html[data-te-theme="dark"] .bulk-card,
html[data-te-theme="dark"] .act-card,
html[data-te-theme="dark"] .act-header-card,
html[data-te-theme="dark"] .kpi-card,
html[data-te-theme="dark"] .list-card,
html[data-te-theme="dark"] .student-card,
html[data-te-theme="dark"] .pr-card,
html[data-te-theme="dark"] .te-card,
html[data-te-theme="dark"] .te-panel,
html[data-te-theme="dark"] .te-surface,
html[data-te-theme="dark"] .te-field,
html[data-te-theme="dark"] .te-kpi,
html[data-te-theme="dark"] .te-info,
html[data-te-theme="dark"] .rt-panel,
html[data-te-theme="dark"] .rt-kpi,
html[data-te-theme="dark"] .rt-feed-item,
html[data-te-theme="dark"] .rt-attention-item,
html[data-te-theme="dark"] .coach-recent-card,
html[data-te-theme="dark"] .coach-urgent-card,
html[data-te-theme="dark"] .coach-action-card,
html[data-te-theme="dark"] .bulk-row,
html[data-te-theme="dark"] .student-item,
html[data-te-theme="dark"] .te-mobile-activity-card,
html[data-te-theme="dark"] .accordion-button,
html[data-te-theme="dark"] .accordion-body,
html[data-te-theme="dark"] .list-group-item,
html[data-te-theme="dark"] .modal-content{
  background:linear-gradient(180deg, rgba(21,28,47,.97), rgba(15,23,42,.97)) !important;
  border-color:var(--te-border) !important;
  color:var(--te-text) !important;
  box-shadow:var(--te-shadow-sm) !important;
}
html[data-te-theme="dark"] .act-header-card,
html[data-te-theme="dark"] .ca-header-card,
html[data-te-theme="dark"] .bulk-hero,
html[data-te-theme="dark"] .bulk-hero-card,
html[data-te-theme="dark"] .te-hero,
html[data-te-theme="dark"] .coach-welcome,
html[data-te-theme="dark"] .te-dashboard-hero{
  background:
    radial-gradient(760px 260px at 100% 0%, rgba(124,58,237,.20), transparent 60%),
    radial-gradient(640px 280px at 0% 100%, rgba(14,165,233,.12), transparent 62%),
    linear-gradient(135deg, rgba(21,28,47,.98), rgba(15,23,42,.98)) !important;
  border-color:rgba(167,139,250,.24) !important;
}
html[data-te-theme="dark"] .card-header,
html[data-te-theme="dark"] .student-card-header,
html[data-te-theme="dark"] .table thead th,
html[data-te-theme="dark"] .te-table thead th,
html[data-te-theme="dark"] thead[style],
html[data-te-theme="dark"] .bg-white,
html[data-te-theme="dark"] .bg-light,
html[data-te-theme="dark"] .bg-light-subtle{
  background:rgba(30,41,59,.78) !important;
  color:var(--te-text) !important;
  border-color:var(--te-border) !important;
}
html[data-te-theme="dark"] .table,
html[data-te-theme="dark"] .table > :not(caption) > * > *,
html[data-te-theme="dark"] .te-table > :not(caption) > * > *{
  color:var(--te-text) !important;
  border-color:var(--te-border) !important;
  background:transparent !important;
}
html[data-te-theme="dark"] .table tbody tr:hover,
html[data-te-theme="dark"] .te-table tbody tr:hover{
  background:rgba(124,58,237,.10) !important;
}
html[data-te-theme="dark"] .form-control,
html[data-te-theme="dark"] .form-select,
html[data-te-theme="dark"] .input-group-text,
html[data-te-theme="dark"] textarea,
html[data-te-theme="dark"] .te-input{
  background:rgba(15,23,42,.88) !important;
  border-color:rgba(148,163,184,.24) !important;
  color:var(--te-text) !important;
}
html[data-te-theme="dark"] .form-control::placeholder,
html[data-te-theme="dark"] textarea::placeholder{
  color:#7f8aa8 !important;
}
html[data-te-theme="dark"] .form-label,
html[data-te-theme="dark"] .ca-label,
html[data-te-theme="dark"] .bulk-label,
html[data-te-theme="dark"] label{
  color:var(--te-text-soft) !important;
}
html[data-te-theme="dark"] .dropdown-menu,
html[data-te-theme="dark"] .dropdown-item{
  background:rgba(17,24,39,.96) !important;
  color:var(--te-text) !important;
}
html[data-te-theme="dark"] .dropdown-item:hover,
html[data-te-theme="dark"] .dropdown-item:focus{
  background:rgba(124,58,237,.18) !important;
  color:#fff !important;
}
html[data-te-theme="dark"] .btn-light,
html[data-te-theme="dark"] .btn-outline-primary,
html[data-te-theme="dark"] .btn-outline-secondary,
html[data-te-theme="dark"] .btn-outline-info,
html[data-te-theme="dark"] .btn-outline-success,
html[data-te-theme="dark"] .btn-outline-warning,
html[data-te-theme="dark"] .btn-outline-danger,
html[data-te-theme="dark"] .btn-outline-dark,
html[data-te-theme="dark"] .page-link{
  background:rgba(30,41,59,.84) !important;
  border-color:rgba(148,163,184,.24) !important;
  color:var(--te-text) !important;
}
html[data-te-theme="dark"] .btn-outline-primary:hover,
html[data-te-theme="dark"] .btn-outline-secondary:hover,
html[data-te-theme="dark"] .btn-outline-info:hover,
html[data-te-theme="dark"] .btn-outline-success:hover,
html[data-te-theme="dark"] .btn-outline-warning:hover,
html[data-te-theme="dark"] .btn-outline-danger:hover,
html[data-te-theme="dark"] .btn-outline-dark:hover{
  color:#fff !important;
  border-color:transparent !important;
}
html[data-te-theme="dark"] .badge.bg-light,
html[data-te-theme="dark"] .badge.text-bg-light,
html[data-te-theme="dark"] .act-pill.bg-light,
html[data-te-theme="dark"] .te-pill,
html[data-te-theme="dark"] .badge-level{
  background:rgba(30,41,59,.92) !important;
  border-color:rgba(148,163,184,.24) !important;
  color:var(--te-text) !important;
}
html[data-te-theme="dark"] .alert{
  background:rgba(21,28,47,.92) !important;
  color:var(--te-text) !important;
  border-color:var(--te-border) !important;
}
html[data-te-theme="dark"] audio,
html[data-te-theme="dark"] video{
  background:#0f172a !important;
  border-radius:14px;
}
html[data-te-theme="dark"] .student-progress-bar,
html[data-te-theme="dark"] .te-progress,
html[data-te-theme="dark"] .progress{
  background:rgba(148,163,184,.18) !important;
}
html[data-te-theme="dark"] .border,
html[data-te-theme="dark"] .border-top,
html[data-te-theme="dark"] .border-bottom,
html[data-te-theme="dark"] .border-start,
html[data-te-theme="dark"] .border-end{
  border-color:var(--te-border) !important;
}

/* Global coach responsive fixes: no overlapping buttons, cleaner cards, safer mobile flow. */
.coach-header-actions{
  min-width:0;
}
.coach-theme-toggle{
  flex:0 0 auto;
}
.te-main-content .btn,
.te-main-content .badge,
.te-main-content .dropdown-item,
.coach-bottom-nav a,
.nav-clean .nav-link{
  overflow-wrap:anywhere;
}
.te-main-content .btn,
.table .btn,
.table-responsive .btn,
.te-actionbar .btn,
.act-toolbar .btn,
.bulk-action-bar .btn,
.ca-action-bar .btn,
.student-row-actions .btn,
.coach-action-card,
.coach-mobile-summary-btn{
  max-width:100%;
}
.te-actionbar,
.act-toolbar,
.bulk-action-bar,
.ca-action-bar,
.student-row-actions,
.coach-page-actions,
.coach-header-tools,
.rt-panel-head,
.bulk-row-header,
.act-header-card,
.ca-header-card{
  min-width:0;
}
.te-actionbar,
.student-row-actions,
.table td:last-child .btn-group,
.table td:last-child form,
.act-card td:last-child .btn-group,
.act-card td:last-child form{
  gap:.45rem !important;
}
.table td:last-child .btn-group,
.table td:last-child form,
.act-card td:last-child .btn-group,
.act-card td:last-child form{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex-wrap:nowrap !important;
  white-space:nowrap !important;
}
.table td:last-child .btn,
.act-card td:last-child .btn,
.te-table td:last-child .btn{
  width:auto !important;
  min-width:38px !important;
  padding-inline:.65rem !important;
}
.table td,
.table th,
.te-table td,
.te-table th{
  overflow-wrap:break-word;
}
.table-responsive{
  border:1px solid var(--te-border) !important;
  background:var(--te-surface) !important;
  box-shadow:var(--te-shadow-xs) !important;
}
.table-responsive > .table{
  min-width:760px;
}
.coach-action-grid,
.te-mobile-activity-list{
  align-items:stretch;
}
.coach-action-card,
.kpi-card,
.stat-card-clean,
.student-card,
.list-card,
.act-card,
.bulk-card,
.ca-card,
.te-card{
  min-width:0;
}
.coach-action-card,
.stat-card-clean,
.kpi-card.coach-kpi-card{
  height:100%;
}
.bulk-stat{
  flex:1 1 128px;
}
.bulk-item-row,
.student-row,
.rt-row,
.rt-feed-item,
.rt-attention-item{
  min-width:0;
}
.bulk-item-row .form-control,
.student-row-main,
.student-text,
.rt-row-title,
.rt-item-title{
  min-width:0;
}
.bulk-item-row .remove-item{
  width:42px !important;
  min-width:42px !important;
  padding-inline:0 !important;
}
.act-header-card,
.ca-header-card,
.bulk-card.bulk-hero{
  overflow:hidden;
}

@media (max-width: 991.98px){
  .te-main-content{
    padding:16px 14px calc(132px + env(safe-area-inset-bottom)) !important;
  }
  .coach-header-actions{
    gap:.45rem !important;
  }
  .coach-theme-toggle{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    padding:0 !important;
    border-radius:16px !important;
  }
  .coach-theme-toggle .theme-label{
    display:none !important;
  }
  .act-header-card,
  .ca-header-card,
  .bulk-card.bulk-hero,
  .te-hero,
  .te-dashboard-hero{
    border-radius:24px !important;
  }
  .act-header-card > .d-flex,
  .ca-header-card > .d-flex,
  .bulk-card.bulk-hero > .d-flex,
  .bulk-card.bulk-hero .d-flex.flex-wrap.justify-content-between{
    align-items:stretch !important;
  }
  .table-responsive > .table{
    min-width:720px;
  }
  .sticky-create,
  .sticky-top{
    position:static !important;
    top:auto !important;
  }
}

@media (max-width: 767.98px){
  .act-header-card,
  .ca-header-card,
  .bulk-card.bulk-hero{
    padding:1rem !important;
  }
  .act-header-card .d-flex.flex-wrap.gap-2,
  .ca-header-card .d-flex.flex-wrap.gap-2,
  .bulk-card .d-flex.flex-wrap.gap-2,
  .bulk-card .d-flex.flex-wrap.justify-content-between,
  .te-actionbar,
  .act-toolbar,
  .bulk-action-bar,
  .ca-action-bar,
  .student-row-actions{
    width:100%;
  }
  .te-actionbar,
  .act-toolbar,
  .bulk-action-bar,
  .ca-action-bar{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:.65rem !important;
  }
  .te-actionbar .btn,
  .act-toolbar .btn,
  .bulk-action-bar .btn,
  .ca-action-bar .btn{
    width:100% !important;
    min-width:0 !important;
  }
  .student-row{
    align-items:flex-start !important;
  }
  .student-row-actions{
    margin-left:0 !important;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
  .student-row-actions .btn{
    width:100% !important;
  }
  .coach-action-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 575.98px){
  .te-main-content{
    padding:14px 12px calc(138px + env(safe-area-inset-bottom)) !important;
  }
  .te-main-content .btn:not(.coach-theme-toggle):not(.coach-profile-btn):not(.dropdown-item):not(.btn-close),
  .te-main-content .btn-group .btn,
  .table-responsive .btn,
  .table .btn,
  .te-actionbar .btn,
  .act-toolbar .btn,
  .bulk-action-bar .btn,
  .ca-action-bar .btn,
  .student-row-actions .btn{
    width:auto !important;
  }
  .act-header-card > .d-flex.flex-wrap > .d-flex.flex-wrap,
  .ca-header-card > .d-flex.flex-wrap > .d-flex.flex-wrap,
  .bulk-card.bulk-hero .d-flex.flex-wrap.gap-2{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100%;
  }
  .act-header-card > .d-flex.flex-wrap > .d-flex.flex-wrap .btn,
  .ca-header-card > .d-flex.flex-wrap > .d-flex.flex-wrap .btn,
  .bulk-card.bulk-hero .d-flex.flex-wrap.gap-2 .btn,
  .bulk-card.bulk-hero .bulk-stat{
    width:100% !important;
  }
  .te-actionbar,
  .act-toolbar,
  .bulk-action-bar,
  .ca-action-bar,
  .student-row-actions{
    grid-template-columns:1fr !important;
  }
  .te-actionbar .btn,
  .act-toolbar .btn,
  .bulk-action-bar .btn,
  .ca-action-bar .btn,
  .student-row-actions .btn{
    width:100% !important;
  }
  .btn-group,
  .table td:last-child .btn-group,
  .act-card td:last-child .btn-group{
    width:auto !important;
  }
  .bulk-item-row{
    grid-template-columns:34px minmax(0, 1fr) 40px !important;
    gap:.45rem !important;
    padding:.55rem !important;
  }
  .bulk-num{
    width:32px !important;
    height:32px !important;
    border-radius:12px !important;
  }
  .bulk-item-row .remove-item{
    width:40px !important;
    min-width:40px !important;
    height:42px !important;
  }
  .table-responsive > .table{
    min-width:680px;
  }
  .coach-action-grid{
    grid-template-columns:1fr !important;
  }
}
