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

:root {
    --dt-red: #e31c24;
    --dt-red-hover: #c4181f;
    --dt-red-soft: #fdecec;
    --dt-ink: #111318;
    --dt-ink-2: #1a1d23;
    --dt-sidebar: #14171c;
    --dt-sidebar-2: #1c2026;
    --dt-text: #1a1d23;
    --dt-muted: #6b7280;
    --dt-line: #e6e8ec;
    --dt-bg: #f4f5f7;
    --dt-white: #ffffff;
    --dt-footer: #0e1116;
    --dt-shadow: 0 8px 24px rgba(17, 19, 24, 0.06);
    --dt-radius: 12px;
}

/* =========================================================
   Auth / login screens
   ========================================================= */
body.drishi-auth {
    font-family: Inter, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    background: linear-gradient(145deg, #0a0c10 0%, #14171c 48%, #1a1f28 100%) !important;
    color: var(--dt-text);
    min-height: 100vh;
}

body.drishi-auth::before {
    content: "";
    position: fixed;
    width: 560px;
    height: 560px;
    right: -140px;
    top: -100px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(227, 28, 36, 0.42), transparent 68%);
    pointer-events: none;
    z-index: 0;
}

body.drishi-auth::after {
    content: "";
    position: fixed;
    width: 460px;
    height: 460px;
    left: -160px;
    bottom: -140px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(227, 28, 36, 0.16), transparent 70%);
    pointer-events: none;
    z-index: 0;
}

body.drishi-auth .top-content,
body.drishi-auth .inner-bg,
body.drishi-auth .container {
    position: relative;
    z-index: 1;
}

body.drishi-auth .top-content {
    min-height: 100vh;
    display: flex;
    align-items: center;
}

body.drishi-auth .inner-bg {
    width: 100%;
    padding: 32px 0 !important;
}

body.drishi-auth .loginbg,
body.drishi-auth .ded-login-card {
    background: #fff !important;
    border-radius: 20px !important;
    box-shadow: 0 28px 70px rgba(8, 10, 14, 0.42) !important;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.06);
}

body.drishi-auth .form-top {
    background: linear-gradient(145deg, #0e1116 0%, #1c2026 100%) !important;
    padding: 30px 24px 22px !important;
    text-align: center;
    position: relative;
}

body.drishi-auth .form-top::after {
    content: "";
    position: absolute;
    right: -40px;
    top: -30px;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(227, 28, 36, 0.45), transparent 70%);
}

body.drishi-auth .form-top-left,
body.drishi-auth .logowidth {
    float: none !important;
    width: 100% !important;
    text-align: center;
}

body.drishi-auth .form-top-left img {
    max-height: 52px;
    margin: 0 auto;
}

body.drishi-auth .form-bottom {
    background: #fff !important;
    padding: 26px 28px 28px !important;
}

body.drishi-auth .ded-login-head {
    margin-bottom: 18px;
}

body.drishi-auth .form-bottom h3,
body.drishi-auth h3.font-white,
body.drishi-auth .ded-login-head h3 {
    color: var(--dt-ink) !important;
    font-weight: 800 !important;
    letter-spacing: -0.03em;
    margin: 0 0 4px !important;
    font-size: 22px !important;
}

body.drishi-auth .ded-login-sub {
    margin: 0;
    font-size: 13px;
    color: var(--dt-muted);
    font-weight: 500;
}

body.drishi-auth .ded-field {
    margin-bottom: 14px !important;
}

body.drishi-auth .ded-field-label {
    display: block;
    margin: 0 0 6px;
    font-size: 12px;
    font-weight: 700;
    color: #374151;
}

body.drishi-auth .ded-input-wrap {
    position: relative;
}

body.drishi-auth input[type="text"],
body.drishi-auth input[type="password"],
body.drishi-auth .form-control {
    background: #f4f5f7 !important;
    border: 1px solid #e6e8ec !important;
    border-radius: 12px !important;
    color: var(--dt-ink) !important;
    font-family: Inter, sans-serif !important;
    height: 50px !important;
    padding: 10px 46px 10px 14px !important;
    box-shadow: none !important;
    font-size: 14px !important;
}

body.drishi-auth input:focus {
    border-color: var(--dt-red) !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(227, 28, 36, 0.14) !important;
}

body.drishi-auth .ded-input-icon,
body.drishi-auth .form-control-feedback {
    position: absolute !important;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
    margin: 0 !important;
    color: #9ca3af !important;
    pointer-events: none;
    font-size: 15px;
}

body.drishi-auth .ded-pass-toggle {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #6b7280;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    z-index: 3;
    transition: background .15s ease, color .15s ease;
}

body.drishi-auth .ded-pass-toggle:hover {
    background: var(--dt-red-soft);
    color: var(--dt-red);
}

body.drishi-auth .ded-pass-toggle:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(227, 28, 36, 0.16);
}

body.drishi-auth .ded-pass-toggle .fa {
    font-size: 16px;
    pointer-events: none;
}

body.drishi-auth button.btn,
body.drishi-auth .btn,
body.drishi-auth .ded-login-btn {
    width: 100%;
    height: 50px;
    margin-top: 6px;
    background: linear-gradient(135deg, #e31c24 0%, #c4181f 100%) !important;
    border: 0 !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em;
    font-size: 15px !important;
    box-shadow: 0 12px 28px rgba(227, 28, 36, 0.3) !important;
}

body.drishi-auth button.btn:hover,
body.drishi-auth .ded-login-btn:hover {
    opacity: 1 !important;
    background: #c4181f !important;
}

body.drishi-auth .ded-login-foot {
    margin-top: 16px;
    text-align: center;
}

body.drishi-auth a.forgot,
body.drishi-auth a {
    color: var(--dt-red) !important;
    font-weight: 600;
    font-size: 13px;
    text-decoration: none !important;
}

body.drishi-auth a.forgot:hover {
    text-decoration: underline !important;
}

body.drishi-auth .alert {
    border-radius: 10px !important;
    margin-bottom: 14px !important;
}

body.drishi-auth .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background: var(--dt-red) !important;
}

body.drishi-auth .h3,
body.drishi-auth .loginright h3,
body.drishi-auth .loginright h4 {
    color: #fff !important;
}

body.drishi-auth .bgoffsetbgno {
    background: transparent !important;
    border-right: 0 !important;
    box-shadow: none !important;
    border-radius: 20px !important;
}

/* =========================================================
   Admin / student app shell — DrishiDesk look
   ========================================================= */
body.hold-transition,
body.sidebar-mini {
    font-family: Inter, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    background: var(--dt-bg) !important;
}

.content-wrapper,
.right-side {
    background: var(--dt-bg) !important;
}

.main-header .logo,
.main-header .navbar {
    background: #fff !important;
    border-bottom: 1px solid var(--dt-line) !important;
    box-shadow: none !important;
}

    .main-header .logo {
        background: #fff !important;
        color: var(--dt-ink) !important;
    }

.main-header .navbar .sidebar-toggle,
.main-header .navbar .nav > li > a {
    color: var(--dt-ink) !important;
}

.main-header .navbar .nav > li > a:hover,
.main-header .navbar .sidebar-toggle:hover {
    background: var(--dt-red-soft) !important;
    color: var(--dt-red) !important;
}

.main-sidebar,
.left-side {
    background: var(--dt-sidebar) !important;
}

.sidebar-menu > li.header {
    color: #8b919c !important;
    background: transparent !important;
}

.sidebar-menu > li > a {
    color: #c5cad3 !important;
    border-left: 3px solid transparent !important;
}

.sidebar-menu > li:hover > a,
.sidebar-menu > li.active > a,
.sidebar-menu > li.menu-open > a {
    background: #1c2026 !important;
    color: #fff !important;
    border-left-color: var(--dt-red) !important;
}

.sidebar-menu > li > .treeview-menu {
    background: #101318 !important;
}

.treeview-menu > li > a {
    color: #9aa1ac !important;
}

.treeview-menu > li.active > a,
.treeview-menu > li > a:hover {
    color: #fff !important;
}

.sidebar a {
    color: #c5cad3;
}

.box,
.nav-tabs-custom,
.info-box {
    border: 1px solid var(--dt-line) !important;
    border-radius: var(--dt-radius) !important;
    box-shadow: var(--dt-shadow) !important;
    overflow: hidden;
}

.box-header {
    background: #fff !important;
    color: var(--dt-ink) !important;
}

.box.box-primary,
.box.box-info,
.box.box-success,
.box.box-warning,
.box.box-danger {
    border-top-color: var(--dt-red) !important;
}

.btn-primary,
.btn-info,
.bg-blue,
.bg-aqua,
.label-primary,
.pagination > .active > a,
.pagination > .active > span {
    background: var(--dt-red) !important;
    border-color: var(--dt-red) !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-info:hover {
    background: var(--dt-red-hover) !important;
    border-color: var(--dt-red-hover) !important;
}

a {
    color: var(--dt-red);
}

.alert-success {
    background: #ecfdf3 !important;
    border-color: #abefc6 !important;
    color: #067647 !important;
}

.alert-danger {
    background: var(--dt-red-soft) !important;
    border-color: #f7b6b8 !important;
    color: var(--dt-red) !important;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header {
    background: linear-gradient(135deg, #0e1116 0%, #1c2026 100%) !important;
}

.main-header .dropdown-user.ded-user-dropdown,
.main-header .dropdown-menu.dropdown-user {
    width: 260px !important;
    min-width: 260px !important;
    right: 0 !important;
    left: auto !important;
    padding: 0 !important;
    overflow: hidden;
    border: 1px solid var(--dt-line) !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 40px rgba(17, 19, 24, 0.14) !important;
}

.ded-user-dropdown .sstopuser {
    padding: 14px !important;
    clear: both;
}

.ded-user-dropdown .ssuserleft {
    float: left;
    padding: 0 12px 0 0 !important;
}

.ded-user-dropdown .ssuserleft img,
.ded-user-dropdown .sstopuser img {
    width: 52px !important;
    height: 52px !important;
    border-radius: 12px !important;
    object-fit: cover;
}

.ded-user-dropdown .sstopuser-test {
    float: left;
    max-width: calc(100% - 70px);
}

.ded-user-dropdown .sstopuser-test h4 {
    margin: 4px 0 2px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    color: var(--dt-ink) !important;
}

.ded-user-dropdown .sstopuser-test h5 {
    margin: 0 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--dt-muted) !important;
}

.ded-user-dropdown .divider {
    clear: both;
    border-top: 1px solid var(--dt-line);
    margin: 12px 0 8px !important;
}

.ded-user-dropdown .sspass {
    clear: both;
    display: flex !important;
    flex-direction: column;
    gap: 2px;
}

.ded-user-dropdown .sspass a,
.ded-user-dropdown .sspass a.pl25,
.ded-user-dropdown .sspass a.pull-right {
    float: none !important;
    clear: none !important;
    display: flex !important;
    align-items: center;
    gap: 10px;
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    border-radius: 10px !important;
    color: var(--dt-ink) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-align: left !important;
    background: transparent !important;
}

.ded-user-dropdown .sspass a i {
    width: 16px;
    text-align: center;
    color: var(--dt-muted);
}

.ded-user-dropdown .sspass a:hover {
    background: var(--dt-red-soft) !important;
    color: var(--dt-red) !important;
}

.ded-user-dropdown .sspass a:hover i {
    color: var(--dt-red);
}

.ded-user-dropdown .sspass a.ded-logout {
    color: var(--dt-red) !important;
}

.topaleart {
    display: none !important;
}

/* Product header — one clean 64px row */
.main-header {
    height: 64px !important;
    max-height: 64px !important;
    overflow: visible !important;
    box-shadow: 0 1px 0 var(--dt-line);
}

.main-header .logo,
.main-header .navbar {
    height: 64px !important;
    min-height: 64px !important;
    line-height: 64px !important;
    background: #fff !important;
    border-bottom: 1px solid var(--dt-line) !important;
}

.main-header .logo {
    width: 230px !important;
    padding: 0 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    float: left !important;
    overflow: hidden !important;
    text-align: left !important;
}

.main-header .navbar {
    margin-left: 230px !important;
    display: flex !important;
    align-items: center;
    line-height: normal !important;
}

.main-header .sidebar-toggle {
    position: relative !important;
    float: none !important;
    height: 64px !important;
    width: 44px !important;
    min-width: 44px;
    padding: 0 !important;
    margin: 0 8px 0 6px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: var(--dt-ink) !important;
    z-index: 2;
    flex: 0 0 44px;
}

.main-header .sidebar-toggle:before {
    font-size: 18px;
    line-height: 1;
}

.main-header .logo .logo-lg {
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    line-height: 1 !important;
    height: 64px;
}

.main-header .logo .logo-mini {
    display: none !important;
}

.sidebar-mini.sidebar-collapse .main-header .logo .logo-lg {
    display: none !important;
}

.sidebar-mini.sidebar-collapse .main-header .logo .logo-mini {
    display: flex !important;
    align-items: center;
    justify-content: center;
    height: 64px;
}

.main-header .logo .ded-product-logo,
.ded-product-logo {
    display: block !important;
    height: 38px !important;
    max-height: 38px !important;
    width: auto !important;
    max-width: 206px !important;
    object-fit: contain !important;
}

.ded-product-mark {
    width: 32px !important;
    height: 32px !important;
    border-radius: 8px;
    object-fit: cover;
    display: block;
}

.sidebar-mini.sidebar-collapse .main-header .logo {
    width: 50px !important;
    padding: 0 !important;
    justify-content: center !important;
}

.sidebar-mini.sidebar-collapse .main-header .navbar {
    margin-left: 50px !important;
}

.ded-header-bar {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
    height: 64px;
    padding: 0 16px 0 8px;
    min-width: 0;
    overflow: visible !important;
}

.main-header .navbar,
.main-header .navbar-custom-menu,
.main-header .headertopmenu,
.main-header .headertopmenu > li.user-menu {
    overflow: visible !important;
    position: relative;
}

.main-header .headertopmenu > li.user-menu {
    z-index: 1050;
}

.main-header .headertopmenu > li.user-menu.open > .dropdown-menu,
.main-header .headertopmenu > li.user-menu.show > .dropdown-menu {
    display: block !important;
}

.main-header .dropdown-user.ded-user-dropdown,
.main-header .dropdown-menu.dropdown-user {
    z-index: 1060 !important;
}

.ded-session-badge {
    flex: 0 0 auto;
    white-space: nowrap;
    color: var(--dt-muted);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
    padding: 6px 10px;
    border: 1px solid var(--dt-line);
    border-radius: 8px;
    background: #f8f9fb;
}

.ded-session-badge strong {
    color: var(--dt-ink);
    font-weight: 700;
    margin-left: 4px;
}

.ded-header-search,
.main-header .navbar-form {
    flex: 1 1 auto;
    max-width: 340px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    float: none !important;
}

.ded-header-search .input-group {
    width: 100%;
}

.main-header .navbar-custom-menu {
    float: none !important;
    margin-left: auto;
    display: flex;
    align-items: center;
    height: 64px;
}

.main-header .langdiv,
.main-header .bootstrap-select,
.main-header #languageSwitcher {
    display: none !important;
}

.main-header .headertopmenu {
    display: flex;
    align-items: center;
    margin: 0;
    float: none !important;
}

.main-header .search-form3 {
    background: #f4f5f7 !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 999px 0 0 999px !important;
    box-shadow: none !important;
    height: 38px !important;
    line-height: 38px !important;
}

.main-header .topsidesearchbtn {
    background: #f4f5f7 !important;
    border: 1px solid var(--dt-line) !important;
    border-left: 0 !important;
    border-radius: 0 999px 999px 0 !important;
    height: 38px !important;
    color: var(--dt-muted) !important;
}

.main-header .headertopmenu > li > a {
    width: 36px;
    height: 36px;
    line-height: 36px !important;
    text-align: center;
    border-radius: 10px !important;
    margin: 0 2px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.main-header .headertopmenu > li.user-menu > a {
    width: auto;
    padding: 0 4px !important;
}

.main-header .topuser-image {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    margin: 0;
}

.content-wrapper,
.right-side,
.main-footer {
    margin-left: 230px !important;
    padding-top: 0;
}

body.fixed .content-wrapper,
body.fixed .right-side {
    padding-top: 64px !important;
}

.main-sidebar,
.left-side {
    width: 230px;
    padding-top: 64px !important;
    background: var(--dt-sidebar) !important;
}

.sidebar-mini.sidebar-collapse .content-wrapper,
.sidebar-mini.sidebar-collapse .right-side,
.sidebar-mini.sidebar-collapse .main-footer {
    margin-left: 50px !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar {
    width: 50px !important;
}

/* Client card in sidebar */
.fixedmenu,
.sessionul.fixedmenu {
    background: var(--dt-sidebar) !important;
    width: 230px !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    padding: 10px 12px 4px !important;
    margin: 0 !important;
    position: relative !important;
}

.sessionul {
    color: #fff;
}

.ded-client-wrap {
    list-style: none;
    margin: 0;
    position: relative;
}

.ded-session-edit {
    display: none !important;
}

.ded-session-switch {
    display: none !important;
}

.ded-client-card {
    display: flex !important;
    align-items: center;
    gap: 10px;
    padding: 10px 36px 10px 10px !important;
    border-radius: 12px !important;
    background: #1c2026 !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #fff !important;
    text-decoration: none !important;
}

.ded-client-card:hover {
    background: #22262d !important;
    color: #fff !important;
}

.ded-client-avatar {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #fff;
    color: var(--dt-red);
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
    font-size: 15px;
}

.ded-client-avatar img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #fff;
}

.ded-client-copy {
    min-width: 0;
    display: block;
    line-height: 1.2;
}

.ded-client-name {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-weight: 700;
    font-size: 13px;
    color: #fff;
    white-space: normal;
    overflow: hidden;
    line-height: 1.25;
}

.ded-client-meta {
    display: block;
    font-size: 11px;
    color: #8b919c;
    margin-top: 2px;
}

.ded-session-switch a {
    color: #8b919c !important;
    font-size: 11px !important;
    padding: 6px 10px !important;
}

.sidebar-mini.sidebar-collapse .fixedmenu,
.sidebar-mini.sidebar-collapse .sessionul.fixedmenu {
    width: 50px !important;
    padding: 10px 6px !important;
}

.sidebar-mini.sidebar-collapse .ded-client-copy,
.sidebar-mini.sidebar-collapse .ded-session-switch {
    display: none !important;
}

.sidebar-mini.sidebar-collapse .ded-client-card {
    justify-content: center;
    padding: 8px !important;
}

.sidebar-menu.verttop,
ul.sidebar-menu.verttop,
.sidebar .sidebar-menu.verttop {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.sidebar-menu > li > a {
    margin: 2px 10px !important;
    padding: 11px 12px !important;
    border-radius: 10px !important;
    border-left: 0 !important;
    color: #c5cad3 !important;
}

.sidebar-menu > li:hover > a,
.sidebar-menu > li.menu-open > a {
    background: #1c2026 !important;
    color: #fff !important;
    border-left: 0 !important;
}

.sidebar-menu > li.active > a {
    background: var(--dt-red) !important;
    color: #fff !important;
    border-left: 0 !important;
    box-shadow: 0 8px 18px rgba(227, 28, 36, 0.28);
}

.sidebar-menu > li > a > .fa,
.sidebar-menu > li > a > .glyphicon,
.sidebar-menu > li > a > .ion {
    width: 22px;
}

.sidebar-menu > li > .treeview-menu {
    background: transparent !important;
    padding: 0 10px 8px 18px !important;
}

.treeview-menu > li > a {
    border-radius: 8px;
    padding: 8px 10px !important;
}

.treeview-menu > li.active > a,
.treeview-menu > li > a:hover {
    background: rgba(255, 255, 255, 0.04);
    color: #fff !important;
}

/* Dashboard */
section.content {
    padding: 10px 22px 28px !important;
}

.content-wrapper > .content {
    padding-top: 10px !important;
}

.ded-dash {
    background: transparent;
}

/* Premium school hero */
.ded-hero {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin: 0 0 20px;
    width: 100%;
}

.ded-hero.ded-hero--with-side,
.ded-hero:has(.ded-hero-side) {
    grid-template-columns: 1.6fr 1fr;
}

@media (max-width: 991px) {
    .ded-hero,
    .ded-hero.ded-hero--with-side,
    .ded-hero:has(.ded-hero-side) {
        grid-template-columns: 1fr;
    }
}

.ded-hero-main {
    position: relative;
    overflow: hidden;
    width: 100%;
    max-width: 100%;
    background:
        radial-gradient(ellipse 80% 120% at 100% -20%, rgba(227, 28, 36, 0.45), transparent 55%),
        linear-gradient(135deg, #0c0f14 0%, #151922 48%, #1a1f28 100%);
    color: #fff;
    border-radius: 20px;
    padding: 26px 28px;
    min-height: 168px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 18px;
    box-shadow: 0 20px 48px rgba(12, 15, 20, 0.22);
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.ded-hero-brand {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    position: relative;
    z-index: 1;
}

.ded-hero-logo {
    flex: 0 0 78px;
    width: 78px;
    height: 78px;
    border-radius: 18px;
    background: #fff;
    padding: 6px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
    display: flex;
    align-items: center;
    justify-content: center;
}

.ded-hero-logo img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 10px;
}

.ded-hero-logo-fallback {
    background: linear-gradient(145deg, #e31c24, #9b1218);
    color: #fff;
    font-size: 32px;
    font-weight: 800;
}

.ded-hero-meta {
    min-width: 0;
    flex: 1;
}

.ded-hero-kicker {
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 600;
    color: #f3b0b3;
    letter-spacing: 0.02em;
}

.ded-hero-school {
    margin: 0 0 8px;
    font-size: 30px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: #fff;
}

.ded-hero-address {
    margin: 0 0 12px;
    color: #aeb6c2;
    font-size: 13px;
}

.ded-hero-address i {
    margin-right: 4px;
    color: #e31c24;
}

.ded-hero-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ded-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #e8ecf2;
    font-size: 12px;
    font-weight: 600;
}

.ded-chip i {
    color: #f3b0b3;
}

.ded-hero-actions {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.ded-hero-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 12px;
    background: #e31c24;
    color: #fff !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none !important;
    box-shadow: 0 8px 20px rgba(227, 28, 36, 0.35);
    transition: transform .15s ease, box-shadow .15s ease;
}

.ded-hero-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(227, 28, 36, 0.45);
    color: #fff !important;
}

.ded-hero-btn-ghost {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: none;
}

.ded-hero-btn-ghost:hover {
    background: rgba(255, 255, 255, 0.14);
    box-shadow: none;
}

.ded-hero-side {
    min-height: 168px;
}

.ded-hero-ann {
    height: 100%;
    background: #fff;
    border-radius: 20px;
    border: 1px solid #e8ecf1;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.06);
    padding: 18px 18px 14px;
    display: flex;
    flex-direction: column;
}

.ded-hero-ann-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.ded-hero-ann-head strong {
    font-size: 14px;
    color: #111827;
}

.ded-hero-ann-head i {
    color: #e31c24;
    margin-right: 4px;
}

.ded-chip-soft {
    background: #fff1f2;
    color: #e31c24;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 8px;
    border-radius: 999px;
}

.ded-hero-ann-list {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
}

.ded-hero-ann-list li a {
    display: grid;
    grid-template-columns: 8px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid #f1f5f9;
    color: #1f2937 !important;
    text-decoration: none !important;
}

.ded-hero-ann-list li:last-child a {
    border-bottom: 0;
}

.ded-ann-pri {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #94a3b8;
}

.ded-ann-pri-high { background: #f59e0b; }
.ded-ann-pri-urgent { background: #e31c24; }
.ded-ann-pri-normal { background: #64748b; }

.ded-ann-title {
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ded-ann-date {
    font-size: 11px;
    color: #94a3b8;
    font-weight: 600;
}

.ded-hero-ann-all {
    display: block;
    margin-top: 8px;
    font-size: 12px;
    font-weight: 700;
    color: #e31c24 !important;
}

/* Legacy welcome kept for safety */
.ded-welcome {
    display: none;
}

.ded-kpi {
    background: #fff;
    border: 1px solid #e8ecf1;
    border-radius: 16px;
    padding: 16px 16px 12px;
    margin-bottom: 16px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
    transition: transform .15s ease, box-shadow .15s ease;
}

.ded-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.08);
}

.ded-kpi-top {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.ded-kpi-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}

.ded-kpi-rose {
    background: #fff1f2;
    color: #e31c24;
}

.ded-kpi-ink {
    background: #eef2ff;
    color: #4338ca;
}

.ded-kpi-amber {
    background: #fff7ed;
    color: #c2410c;
}

.ded-kpi-mint {
    background: #ecfdf5;
    color: #047857;
}

.ded-kpi-label {
    margin: 0 0 2px;
    font-size: 12px;
    color: #64748b;
    font-weight: 600;
}

.ded-kpi-value {
    margin: 0;
    font-size: 22px;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.02em;
}

.ded-kpi-value span {
    font-size: 13px;
    font-weight: 600;
    color: #94a3b8;
}

.ded-dash .info-box {
    border-radius: 14px;
    border: 1px solid #e8ecf1;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04);
    overflow: hidden;
}

.ded-dash .info-box-icon {
    border-radius: 0;
    width: 70px;
}

.ded-role-box .ded-role-icon {
    background: linear-gradient(145deg, #111827, #1f2937) !important;
    color: #fff !important;
}

.ded-dash .box {
    border-radius: 16px;
    border: 1px solid #e8ecf1;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.ded-dash .box.box-primary {
    border-top: 0;
}

.ded-dash .box-header {
    border-bottom: 1px solid #f1f5f9;
    padding: 14px 16px;
}

.ded-dash .box-header .box-title {
    font-weight: 700;
    font-size: 15px;
    color: #0f172a;
}

.ded-dash .topprograssstart {
    border-radius: 16px;
    border: 1px solid #e8ecf1;
    background: #fff;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04);
}

/* Dashboard metric + staff panel */
.ded-dash .info-box.ded-metric {
    border-radius: 16px !important;
    border: 1px solid #e8ecf1 !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04) !important;
    min-height: 88px;
    background: #fff !important;
}

.ded-dash .info-box.ded-metric .info-box-icon {
    background: #111827 !important;
    color: #fff !important;
    border-radius: 14px !important;
    width: 56px !important;
    height: 56px !important;
    line-height: 56px !important;
    font-size: 22px !important;
    margin: 16px 0 16px 14px !important;
}

.ded-dash .info-box.ded-metric .info-box-icon.bg-green { background: #ecfdf5 !important; color: #047857 !important; }
.ded-dash .info-box.ded-metric .info-box-icon.bg-red { background: #fff1f2 !important; color: #e31c24 !important; }
.ded-dash .info-box.ded-metric .info-box-icon.bg-aqua { background: #eff6ff !important; color: #1d4ed8 !important; }

.ded-staff-panel {
    background: #fff;
    border: 1px solid #e8ecf1;
    border-radius: 16px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04);
    overflow: hidden;
    margin-bottom: 16px;
}

.ded-staff-panel-head {
    padding: 14px 16px;
    font-size: 13px;
    font-weight: 800;
    color: #0f172a;
    border-bottom: 1px solid #f1f5f9;
    letter-spacing: 0.02em;
}

.ded-staff-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-bottom: 1px solid #f8fafc;
}

.ded-staff-row:last-child {
    border-bottom: 0;
}

.ded-staff-ico {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #111827;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
}

.ded-staff-name {
    flex: 1;
    font-size: 13px;
    font-weight: 600;
    color: #334155;
}

.ded-staff-count {
    font-size: 16px;
    font-weight: 800;
    color: #0f172a;
}

/* Announcement compose */
.ded-ann-page {
    max-width: 1200px;
}

.ded-ann-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 18px;
}

.ded-ann-kicker {
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #e31c24;
}

.ded-ann-head h1 {
    margin: 0 0 4px;
    font-size: 26px;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.02em;
}

.ded-ann-sub {
    margin: 0;
    color: #64748b;
    font-size: 13px;
}

.ded-ann-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #e8ecf1;
    color: #334155 !important;
    font-weight: 600;
    font-size: 13px;
    text-decoration: none !important;
}

.ded-ann-card {
    background: #fff;
    border: 1px solid #e8ecf1;
    border-radius: 18px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
    padding: 22px 22px 20px;
    margin-bottom: 18px;
}

.ded-ann-card-title {
    font-size: 14px;
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 16px;
}

.ded-ann-side .form-group {
    margin-bottom: 14px;
}

.ded-input,
.ded-ann-card .form-control {
    border-radius: 12px !important;
    border-color: #e2e8f0 !important;
    box-shadow: none !important;
    min-height: 42px;
}

.ded-ann-section-label {
    margin: 8px 0 10px;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #94a3b8;
}

.ded-seg {
    display: flex;
    gap: 6px;
    background: #f1f5f9;
    padding: 4px;
    border-radius: 12px;
}

.ded-seg-item {
    flex: 1;
    margin: 0 !important;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    color: #64748b;
    border-radius: 10px;
    padding: 8px 4px;
    cursor: pointer;
}

.ded-seg-item input {
    display: none;
}

.ded-seg-item.is-active {
    background: #fff;
    color: #0f172a;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

.ded-aud-grid,
.ded-notify-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 12px;
}

.ded-aud-tile {
    margin: 0 !important;
    cursor: pointer;
}

.ded-aud-tile input {
    display: none;
}

.ded-aud-tile span {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 12px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    background: #fff;
    font-size: 13px;
    font-weight: 600;
    color: #334155;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}

.ded-aud-tile span i {
    color: #94a3b8;
}

.ded-aud-tile input:checked + span {
    border-color: #e31c24;
    background: #fff1f2;
    color: #9f1239;
}

.ded-aud-tile input:checked + span i {
    color: #e31c24;
}

.ded-aud-sub {
    margin: -4px 0 10px;
}

.ded-check-inline {
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    margin: 0 !important;
}

.ded-ann-note {
    background: #fff7ed;
    border: 1px solid #fed7aa;
    color: #9a3412;
    border-radius: 12px;
    padding: 10px 12px;
    font-size: 12px;
    margin-bottom: 12px;
}

.ded-filedrop {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    border: 1.5px dashed #cbd5e1;
    border-radius: 14px;
    background: #f8fafc;
    cursor: pointer;
    margin: 0;
    width: 100%;
}

.ded-filedrop input {
    display: none;
}

.ded-filedrop-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #e2e8f0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #e31c24;
    font-size: 18px;
}

.ded-filedrop-text {
    font-size: 13px;
    color: #64748b;
}

.ded-ann-actions {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #f1f5f9;
}

.ded-ann-actions .btn-primary {
    border-radius: 12px;
    padding: 10px 18px;
    font-weight: 700;
}

.ded-ann-actions .btn-default {
    border-radius: 12px;
}

.ded-ann-page .select2-container--default .select2-selection--multiple {
    border-radius: 12px !important;
    border-color: #e2e8f0 !important;
    min-height: 42px;
}

.ded-ann-page .wysihtml5-toolbar {
    background: #f8fafc;
    border-radius: 12px 12px 0 0;
    padding: 8px;
    border: 1px solid #e2e8f0;
    border-bottom: 0;
}

.ded-ann-page iframe.wysihtml5-sandbox,
.ded-ann-page textarea.wysihtml5 {
    border-radius: 0 0 12px 12px !important;
    border-color: #e2e8f0 !important;
}

@media (max-width: 767px) {
    .ded-ann-head {
        flex-direction: column;
    }
    .ded-aud-grid,
    .ded-notify-row {
        grid-template-columns: 1fr;
    }
}

/* WhatsApp settings */
.ded-wa-hint {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #1e3a8a;
    border-radius: 14px;
    padding: 14px 16px;
    margin-bottom: 16px;
    font-size: 13px;
    line-height: 1.5;
}

.ded-wa-hint i {
    margin-top: 2px;
    color: #2563eb;
}

.ded-wa-ready {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    background: #ecfdf3;
    border: 1px solid #abefc6;
    border-radius: 14px;
    padding: 14px 16px;
    margin-bottom: 16px;
}

.ded-wa-ready-title {
    margin: 0;
    font-weight: 800;
    color: #067647;
}

.ded-wa-ready-title i {
    margin-right: 4px;
}

.ded-wa-ready-meta {
    margin: 4px 0 0;
    font-size: 13px;
    color: #344054;
}

.ded-wa-enable {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 12px 14px;
    border-radius: 12px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    font-weight: 700;
    color: #0f172a;
    cursor: pointer;
}

.ded-wa-enable input {
    margin: 0;
    transform: scale(1.15);
}

.ded-wa-token {
    min-height: 110px !important;
    font-family: Consolas, Monaco, monospace;
    font-size: 13px;
    resize: vertical;
}

.ded-wa-test {
    display: flex;
    gap: 10px;
    align-items: center;
    max-width: 480px;
}

.ded-wa-test .form-control {
    flex: 1;
}

.ded-wa-test .btn {
    border-radius: 12px;
    white-space: nowrap;
}

/* ========== Global ERP theme polish (forms / communicate / boxes) ========== */
.content-wrapper > .content-header {
    padding: 18px 22px 0 !important;
    background: transparent !important;
}

.content-wrapper > .content-header > h1 {
    font-size: 24px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    letter-spacing: -0.02em;
}

.content-wrapper > .content-header > h1 > small {
    color: #94a3b8 !important;
    font-weight: 600 !important;
}

.nav-tabs-custom {
    background: #fff !important;
    border: 1px solid #e8ecf1 !important;
    border-radius: 18px !important;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05) !important;
    margin-bottom: 20px !important;
    overflow: hidden;
}

.nav-tabs-custom > .nav-tabs {
    background: #f8fafc !important;
    border-bottom: 1px solid #e8ecf1 !important;
    margin: 0 !important;
    border-radius: 18px 18px 0 0 !important;
    padding: 0 8px;
}

.nav-tabs-custom > .nav-tabs > li {
    margin-bottom: -1px !important;
}

.nav-tabs-custom > .nav-tabs > li > a {
    border: 0 !important;
    border-radius: 0 !important;
    color: #64748b !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    padding: 16px 14px !important;
    margin: 0 !important;
    background: transparent !important;
}

.nav-tabs-custom > .nav-tabs > li.active > a,
.nav-tabs-custom > .nav-tabs > li.active > a:hover,
.nav-tabs-custom > .nav-tabs > li.active > a:focus {
    color: #e31c24 !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 2px solid #e31c24 !important;
}

.nav-tabs-custom > .nav-tabs > li.header {
    float: left !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    line-height: 48px !important;
    padding: 0 12px !important;
    border: 0 !important;
}

.nav-tabs-custom > .tab-content {
    padding: 20px 22px !important;
    background: #fff !important;
}

.box.box-primary,
.box.box-info,
.box.box-success,
.box.box-warning,
.box.box-danger,
.box {
    border-radius: 16px !important;
    border: 1px solid #e8ecf1 !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04) !important;
}

.box.box-primary {
    border-top: 0 !important;
}

.box-header.with-border {
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 14px 18px !important;
}

.box-header .box-title {
    font-weight: 800 !important;
    font-size: 15px !important;
    color: #0f172a !important;
}

.box-body {
    padding: 18px !important;
}

.box-footer {
    background: #f8fafc !important;
    border-top: 1px solid #f1f5f9 !important;
    border-radius: 0 0 16px 16px !important;
    padding: 14px 18px !important;
}

.form-control {
    border-radius: 12px !important;
    border-color: #e2e8f0 !important;
    box-shadow: none !important;
    min-height: 40px;
}

.form-control:focus {
    border-color: #fca5a5 !important;
    box-shadow: 0 0 0 3px rgba(227, 28, 36, 0.12) !important;
}

label {
    font-weight: 700 !important;
    color: #334155 !important;
    font-size: 13px !important;
}

.btn-primary {
    background: #e31c24 !important;
    border-color: #e31c24 !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    padding: 9px 18px !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background: #c4181f !important;
    border-color: #c4181f !important;
}

.btn-default {
    border-radius: 12px !important;
    font-weight: 600 !important;
}

.well,
.well.minheight303,
.well.minheight260 {
    background: #f8fafc !important;
    border: 1px solid #e8ecf1 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    padding: 14px 16px !important;
    min-height: auto !important;
    max-height: 420px;
    overflow-y: auto;
}

.well .checkbox {
    margin: 0 0 8px !important;
    padding: 8px 10px !important;
    border-radius: 10px !important;
    background: #fff;
    border: 1px solid #eef2f7;
}

.well .checkbox label {
    font-weight: 600 !important;
    color: #334155 !important;
}

.well .checkbox input[type=checkbox] {
    margin-top: 2px;
}

.bootstrap-filestyle .form-control,
.bootstrap-filestyle .group-span-filestyle .btn {
    border-radius: 12px !important;
}

.bootstrap-filestyle .group-span-filestyle .btn {
    background: #111827 !important;
    color: #fff !important;
    border: 0 !important;
    font-weight: 700 !important;
}

/* CKEditor chrome */
.cke_chrome {
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: none !important;
}

.cke_top {
    background: #f8fafc !important;
    border-bottom: 1px solid #e8ecf1 !important;
    padding: 6px !important;
}

.cke_bottom {
    background: #f8fafc !important;
    border-top: 1px solid #e8ecf1 !important;
}

.alert {
    border-radius: 12px !important;
}

.table > thead > tr > th {
    background: #f8fafc !important;
    border-bottom: 1px solid #e8ecf1 !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    font-size: 12px !important;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ded-compose-wrap .list-group-item {
    border-radius: 10px !important;
    margin-bottom: 6px !important;
    border: 1px solid #e8ecf1 !important;
}

.ded-compose-wrap {
    max-width: 100%;
    overflow-x: hidden;
}
.ded-compose-wrap .row {
    margin-left: -10px;
    margin-right: -10px;
}
.ded-compose-wrap [class*="col-"] {
    min-width: 0;
}
.ded-compose-wrap .nav-tabs-custom {
    max-width: 100%;
    overflow: visible;
}
.ded-compose-wrap .tab-content,
.ded-compose-wrap .box-body {
    overflow-x: hidden;
    max-width: 100%;
}

.ded-welcome-link:hover {
    color: #fff !important;
}

.topprograssstart,
.ded-kpi {
    background: #fff !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 14px !important;
    box-shadow: var(--dt-shadow) !important;
    padding: 16px 16px 14px !important;
    margin-bottom: 16px !important;
    min-height: 118px;
}

.ded-kpi-top {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
}

.ded-kpi-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 16px;
}

.ded-kpi-rose {
    background: #fdecec;
    color: var(--dt-red);
}

.ded-kpi-ink {
    background: #111318;
    color: #fff;
}

.ded-kpi-amber {
    background: #fff4e5;
    color: #c2410c;
}

.ded-kpi-mint {
    background: #ecfdf3;
    color: #067647;
}

.ded-kpi-label {
    margin: 0 0 4px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--dt-muted) !important;
    line-height: 1.3;
}

.ded-kpi-value {
    margin: 0 !important;
    font-size: 26px !important;
    font-weight: 800 !important;
    color: var(--dt-ink) !important;
    letter-spacing: -0.03em;
    line-height: 1;
}

.ded-kpi-value span {
    font-size: 15px;
    font-weight: 600;
    color: var(--dt-muted);
}

.progress-minibar {
    height: 6px !important;
    border-radius: 999px !important;
    background: #eef0f3 !important;
    box-shadow: none !important;
    margin: 0 !important;
}

.progress-minibar .progress-bar,
.progress-bar-aqua,
.progress-bar-red,
.progress-bar-green,
.progress-bar-yellow {
    background: var(--dt-red) !important;
    border-radius: 999px;
}

.box,
.nav-tabs-custom,
.info-box {
    border: 1px solid var(--dt-line) !important;
    border-radius: 14px !important;
    box-shadow: var(--dt-shadow) !important;
}

.box.box-primary,
.box.box-info,
.box.box-success,
.box.box-warning,
.box.box-danger,
.box.borderwhite {
    border-top: 1px solid var(--dt-line) !important;
}

.box-header.with-border {
    border-bottom: 1px solid var(--dt-line) !important;
    padding: 16px 18px 12px !important;
}

.box-header .box-title {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: var(--dt-ink) !important;
}

.box-body {
    padding: 16px 18px 20px !important;
}

.info-box {
    min-height: 92px;
    padding: 8px 8px 8px 0;
}

.info-box-icon {
    border-radius: 12px !important;
    width: 72px !important;
    height: 72px !important;
    line-height: 72px !important;
    margin: 10px 0 10px 10px !important;
}

.info-box-icon.bg-green,
.info-box-icon.bg-aqua,
.info-box-icon.bg-yellow,
.info-box-icon.bg-red,
.info-box-icon.bg-blue {
    background: var(--dt-red-soft) !important;
    color: var(--dt-red) !important;
}

.info-box-text {
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--dt-muted);
}

.info-box-number {
    font-size: 22px;
    font-weight: 800;
    color: var(--dt-ink);
}

.ded-auth-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    position: relative;
    z-index: 1;
}

body.drishi-auth .form-top-left img,
body.drishi-auth .ded-product-logo,
.ded-auth-brand .ded-product-logo {
    max-height: 64px !important;
    max-width: 280px !important;
    width: auto !important;
    height: auto !important;
    background: #fff;
    border-radius: 12px;
    padding: 8px 12px;
    margin: 0 auto;
}

.form-top .ded-product-logo {
    max-height: 64px !important;
    max-width: 280px !important;
    width: auto !important;
    height: auto !important;
    background: #fff;
    border-radius: 12px;
    padding: 8px 12px;
}

body.drishi-auth .ded-client {
    margin-top: 8px;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    padding: 4px 12px;
}

@media (max-width: 767px) {
    .main-header .logo,
    .main-header .navbar,
    .content-wrapper,
    .right-side,
    .main-footer {
        margin-left: 0 !important;
        width: auto !important;
    }

    /* Do NOT set .main-sidebar { width: auto } — that breaks the off-canvas drawer */

    .ded-welcome {
        flex-direction: column;
        align-items: flex-start;
        padding: 22px 18px;
        overflow: visible;
    }

    .ded-welcome h2 {
        font-size: 22px;
    }

    .ded-welcome-link {
        white-space: normal;
    }
}

/* =========================================================
   Site-wide premium forms, tables, options, modules
   ========================================================= */
.content-wrapper,
.right-side {
    font-family: Inter, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.content-header {
    padding: 18px 15px 8px !important;
}

.content-header > h1,
.content-header h1 {
    margin: 0 !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    letter-spacing: -0.03em;
    color: var(--dt-ink) !important;
    line-height: 1.25;
}

.content-header > h1 > i,
.content-header h1 i {
    color: var(--dt-red);
    margin-right: 8px;
}

.content {
    padding: 10px 15px 24px !important;
}

.box {
    overflow: visible !important;
}

.box-header::before,
.box-header::after,
.box-header.with-border::before,
.box-header.with-border::after,
.box-header.ptbnull::before,
.box-header.ptbnull::after,
.box-header.ded-page-head::before,
.box-header.ded-page-head::after {
    display: none !important;
    content: none !important;
}

.box-header.with-border,
.box-header.ptbnull,
.box-header.ded-page-head {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: #fff !important;
    position: relative !important;
}

.titlefix {
    text-align: left !important;
    position: static !important;
}

.box-header .box-title,
.box-header h3.box-title,
.box-header .titlefix,
h3.box-title.titlefix {
    float: none !important;
    position: static !important;
    display: block !important;
    width: auto !important;
    flex: 0 1 auto !important;
    margin: 0 !important;
    text-align: left !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    color: var(--dt-ink) !important;
    line-height: 1.3 !important;
}

.box-header .box-tools,
.box-header > .box-tools,
.box-header .box-tools.pull-right {
    float: none !important;
    position: static !important;
    right: auto !important;
    top: auto !important;
    margin: 0 0 0 auto !important;
    display: flex !important;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.content-wrapper .form-group {
    margin-bottom: 14px;
}

.content-wrapper label,
.content-wrapper .control-label {
    display: inline-block;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #374151 !important;
    margin-bottom: 6px;
}

.content-wrapper small.req,
.content-wrapper .req {
    color: var(--dt-red) !important;
    font-weight: 700;
}

.content-wrapper .form-control,
.content-wrapper select.form-control,
.content-wrapper textarea.form-control,
.content-wrapper .input-group .form-control,
.content-wrapper input[type="text"],
.content-wrapper input[type="email"],
.content-wrapper input[type="number"],
.content-wrapper input[type="password"],
.content-wrapper input[type="search"],
.content-wrapper input[type="tel"],
.content-wrapper input[type="url"],
.content-wrapper input[type="date"] {
    height: 40px !important;
    padding: 8px 12px !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 10px !important;
    background: #f8f9fb !important;
    box-shadow: none !important;
    font-size: 13px !important;
    color: var(--dt-ink) !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.content-wrapper textarea.form-control,
.content-wrapper textarea {
    height: auto !important;
    min-height: 84px !important;
    resize: vertical;
    line-height: 1.45;
}

.content-wrapper .form-control:focus,
.content-wrapper select.form-control:focus,
.content-wrapper textarea:focus,
.content-wrapper input[type="text"]:focus,
.content-wrapper input[type="email"]:focus,
.content-wrapper input[type="number"]:focus,
.content-wrapper input[type="password"]:focus,
.content-wrapper input[type="search"]:focus,
.content-wrapper input[type="tel"]:focus {
    border-color: var(--dt-red) !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(227, 28, 36, 0.12) !important;
    outline: 0;
}

.content-wrapper .input-group-addon {
    background: #f8f9fb !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 10px !important;
    color: var(--dt-muted) !important;
}

.content-wrapper .input-group .form-control {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.content-wrapper .input-group-addon:first-child {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.content-wrapper .input-group-addon:last-child {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.content-wrapper label.radio-inline,
.content-wrapper label.checkbox-inline,
.ded-choice-pills .radio-inline,
.ded-choice-pills .checkbox-inline {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    margin: 0 8px 8px 0 !important;
    padding: 9px 14px !important;
    border: 1px solid var(--dt-line);
    border-radius: 10px;
    background: #f8f9fb;
    font-size: 13px;
    font-weight: 600;
    color: var(--dt-ink);
    cursor: pointer;
    line-height: 1.2;
}

.content-wrapper label.radio-inline input,
.content-wrapper label.checkbox-inline input,
.ded-choice-pills input {
    margin: 0 !important;
    position: static !important;
}

.content-wrapper label.radio-inline:has(input:checked),
.content-wrapper label.checkbox-inline:has(input:checked),
.ded-choice-pills .radio-inline:has(input:checked),
.ded-choice-pills .checkbox-inline:has(input:checked) {
    border-color: var(--dt-red);
    background: var(--dt-red-soft);
    color: var(--dt-red);
}

.content-wrapper .checkbox,
.content-wrapper .radio {
    margin-top: 4px;
}

.btn,
.box-tools .btn,
div.dt-buttons .dt-button {
    border-radius: 10px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    letter-spacing: 0.01em;
}

.btn-sm,
.btn-xs,
div.dt-buttons .dt-button {
    border-radius: 8px !important;
}

.btn-default,
.btn-default:focus {
    background: #fff !important;
    border: 1px solid var(--dt-line) !important;
    color: var(--dt-ink) !important;
}

.btn-default:hover {
    background: var(--dt-red-soft) !important;
    border-color: #f7b6b8 !important;
    color: var(--dt-red) !important;
}

.btn-primary,
.btn-info,
.btn-danger,
.bg-blue,
.bg-aqua {
    background: linear-gradient(135deg, #e31c24 0%, #c4181f 100%) !important;
    border: 0 !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-info:hover,
.btn-danger:hover {
    background: var(--dt-red-hover) !important;
    color: #fff !important;
}

.btn-success {
    background: var(--dt-ink) !important;
    border: 0 !important;
    color: #fff !important;
}

.btn-warning {
    background: #111318 !important;
    border: 0 !important;
    color: #fff !important;
}

.ded-add-form-btn,
.ded-cancel-btn {
    margin-left: 0 !important;
    height: 36px;
    padding: 0 14px !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.ded-form-page-box {
    max-width: 920px;
    margin: 0 auto 20px !important;
}

.ded-form-page-box .box-footer {
    background: transparent !important;
    border-top: 1px solid var(--dt-line);
    padding: 16px 4px 4px !important;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.ded-form-page-box .box-footer .btn {
    min-width: 120px;
    height: 40px;
    float: none !important;
}

.table {
    margin-bottom: 0 !important;
    background: #fff;
}

.table > thead > tr > th,
.table > thead > tr > td {
    background: #f8f9fb !important;
    border-bottom: 1px solid var(--dt-line) !important;
    border-top: 0 !important;
    color: #6b7280 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 0.045em;
    padding: 12px 14px !important;
    white-space: nowrap;
    vertical-align: middle !important;
}

.table > tbody > tr > td,
.table > tbody > tr > th {
    padding: 12px 14px !important;
    border-top: 1px solid #eef0f3 !important;
    vertical-align: middle !important;
    font-size: 13px;
    color: var(--dt-ink);
}

.table-bordered,
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > td {
    border-color: #eef0f3 !important;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background: #fcfcfd !important;
}

.table-hover > tbody > tr:hover,
.table > tbody > tr:hover {
    background: #fff7f7 !important;
}

.table .btn-xs {
    min-width: 30px;
    height: 28px;
    padding: 4px 8px !important;
}

.mailbox-messages {
    padding: 0 !important;
}

.dataTables_wrapper {
    padding-top: 4px;
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
    margin-bottom: 10px;
}

.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input {
    height: 36px !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 8px !important;
    background: #f8f9fb !important;
    padding: 4px 10px !important;
    box-shadow: none !important;
}

.dataTables_wrapper .dataTables_filter input:focus {
    border-color: var(--dt-red) !important;
    background: #fff !important;
}

.dataTables_wrapper .dataTables_info {
    color: var(--dt-muted);
    padding-top: 14px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    letter-spacing: .01em;
}

/* Premium DataTables pagination — global */
.dataTables_wrapper .dataTables_paginate {
    padding: 6px !important;
    margin-top: 4px !important;
    float: right;
    background: #f8f9fb;
    border: 1px solid var(--dt-line);
    border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    display: inline-flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px;
}

.dataTables_wrapper .dataTables_paginate > span {
    display: inline-flex !important;
    align-items: center;
    gap: 2px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button,
.dataTables_wrapper .dataTables_paginate span .paginate_button {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 36px !important;
    height: 36px !important;
    margin: 0 3px !important;
    padding: 0 12px !important;
    border-radius: 10px !important;
    border: 1px solid var(--dt-line) !important;
    background: #fff !important;
    color: var(--dt-ink) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    box-shadow: 0 1px 2px rgba(17, 19, 24, 0.04) !important;
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .15s ease !important;
    cursor: pointer !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button:focus {
    background: var(--dt-red-soft) !important;
    border-color: #f0a8ab !important;
    color: var(--dt-red) !important;
    box-shadow: 0 4px 12px rgba(227, 28, 36, 0.12) !important;
    transform: translateY(-1px);
    outline: none !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--dt-red) !important;
    border-color: var(--dt-red) !important;
    color: #fff !important;
    box-shadow: 0 6px 16px rgba(227, 28, 36, 0.28) !important;
    transform: none;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    background: #f8f9fb !important;
    border-color: var(--dt-line) !important;
    color: #c4c9d2 !important;
    box-shadow: none !important;
    cursor: default !important;
    transform: none !important;
    opacity: 1 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.previous,
.dataTables_wrapper .dataTables_paginate .paginate_button.next {
    min-width: 36px !important;
    padding: 0 !important;
    font-size: 14px !important;
    color: var(--dt-muted) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.previous:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.next:hover {
    color: var(--dt-red) !important;
}

.dataTables_wrapper .dataTables_paginate .ellipsis {
    color: var(--dt-muted) !important;
    padding: 0 4px !important;
}

div.dt-buttons {
    float: none !important;
    display: inline-flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin: 0 0 12px !important;
    padding: 6px;
    background: #f8f9fb;
    border: 1px solid var(--dt-line);
    border-radius: 12px;
}

/* ===== Global DataTables Search & Export toolbar ===== */
.ded-dt-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    padding: 12px 14px;
    margin: 0 0 14px;
    background: linear-gradient(180deg, #fafbfc 0%, #f3f5f8 100%);
    border: 1px solid var(--dt-line);
    border-radius: 14px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}
.ded-dt-toolbar-left {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1 1 240px;
    min-width: 0;
    flex-wrap: wrap;
}
.ded-dt-toolbar-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 0 0 auto;
    margin-left: auto;
}
.ded-dt-toolbar-title {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
    min-width: 0;
}
.ded-dt-toolbar-title strong {
    font-size: 13px;
    font-weight: 700;
    color: var(--dt-ink);
    letter-spacing: .01em;
}
.ded-dt-toolbar-title small {
    font-size: 11px;
    font-weight: 500;
    color: var(--dt-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 280px;
}
.ded-dt-toolbar .dataTables_filter {
    float: none !important;
    margin: 0 !important;
    text-align: left !important;
    display: block !important;
}
.ded-dt-toolbar .dataTables_filter label {
    margin: 0 !important;
    font-weight: 500 !important;
    display: block !important;
}
.ded-dt-search-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.ded-dt-search-wrap > i.fa-search {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #9aa3af;
    font-size: 13px;
    pointer-events: none;
    z-index: 1;
}
.ded-dt-toolbar .dataTables_filter input,
.ded-dt-search-wrap input {
    width: 220px !important;
    max-width: 100%;
    height: 38px !important;
    margin: 0 !important;
    padding: 6px 12px 6px 34px !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 1px 2px rgba(17, 19, 24, 0.04) !important;
    font-size: 13px !important;
    color: var(--dt-ink) !important;
}
.ded-dt-toolbar .dataTables_filter input:focus,
.ded-dt-search-wrap input:focus {
    border-color: var(--dt-red) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(227, 28, 36, 0.12) !important;
}
.ded-dt-toolbar div.dt-buttons {
    margin: 0 !important;
    padding: 4px !important;
    background: #fff !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 12px !important;
}
/* When page has top filters — search hidden; export-only bar stays compact */
.dataTables_wrapper.ded-dt-has-filters .ded-dt-toolbar .dataTables_filter {
    display: none !important;
}
/* Hide raw filter/buttons that somehow remain outside the toolbar */
.dataTables_wrapper.ded-dt-has-search > .dataTables_filter,
.dataTables_wrapper.ded-dt-has-filters > .dataTables_filter {
    display: none !important;
}
.dataTables_wrapper.ded-dt-has-search > div.dt-buttons,
.dataTables_wrapper.ded-dt-has-filters > div.dt-buttons {
    display: none !important;
}

div.dt-buttons .dt-button,
div.dt-buttons a.dt-button,
div.dt-buttons button.dt-button {
    background: #fff !important;
    border: 1px solid var(--dt-line) !important;
    color: var(--dt-ink) !important;
    padding: 7px 11px !important;
    margin: 0 !important;
    min-width: 36px;
    height: 34px;
    line-height: 1 !important;
    border-radius: 9px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-shadow: none !important;
    transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}

div.dt-buttons .dt-button:hover,
div.dt-buttons a.dt-button:hover,
div.dt-buttons button.dt-button:hover {
    background: #fff !important;
    color: var(--dt-red) !important;
    border-color: #f0a8ab !important;
    transform: translateY(-1px);
}

div.dt-buttons .dt-button:active,
div.dt-buttons .dt-button.active {
    background: var(--dt-red-soft) !important;
    border-color: var(--dt-red) !important;
    color: var(--dt-red) !important;
}

/* Column visibility / collection dropdown */
div.dt-button-collection,
ul.dt-button-collection,
div.dt-button-collection.dropdown-menu,
ul.dt-button-collection.dropdown-menu {
    position: absolute !important;
    z-index: 2000 !important;
    min-width: 220px !important;
    max-width: 280px;
    padding: 8px !important;
    margin: 6px 0 0 !important;
    background: #fff !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 40px rgba(17, 19, 24, 0.16) !important;
    overflow: hidden;
}

div.dt-button-collection:before,
ul.dt-button-collection:before {
    content: "Show columns";
    display: block;
    padding: 8px 12px 10px;
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--dt-muted);
    border-bottom: 1px solid var(--dt-line);
}

div.dt-button-collection .dt-button,
div.dt-button-collection a.dt-button,
div.dt-button-collection button.dt-button,
ul.dt-button-collection > li,
ul.dt-button-collection .dt-button {
    display: flex !important;
    align-items: center;
    gap: 10px;
    width: 100% !important;
    margin: 2px 0 !important;
    padding: 10px 12px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: var(--dt-ink) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-align: left !important;
    box-shadow: none !important;
    float: none !important;
    white-space: nowrap;
    cursor: pointer;
}

div.dt-button-collection .dt-button:hover,
ul.dt-button-collection > li:hover,
ul.dt-button-collection .dt-button:hover {
    background: #f8f9fb !important;
    color: var(--dt-ink) !important;
    transform: none !important;
}

div.dt-button-collection .dt-button:before,
ul.dt-button-collection .dt-button:before {
    content: "";
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    border-radius: 5px;
    border: 1.5px solid #d1d5db;
    background: #fff;
    box-sizing: border-box;
}

div.dt-button-collection .dt-button.active:before,
div.dt-button-collection a.dt-button.active:before,
ul.dt-button-collection .dt-button.active:before {
    border-color: var(--dt-red);
    background: var(--dt-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' d='M2.5 6.2l2.4 2.4 4.6-5'%3E%3C/path%3E%3C/svg%3E") center/12px 12px no-repeat;
}

div.dt-button-collection .buttons-colvisRestore,
div.dt-button-collection a.buttons-colvisRestore,
ul.dt-button-collection .buttons-colvisRestore {
    margin-top: 6px !important;
    padding-top: 12px !important;
    border-top: 1px solid var(--dt-line) !important;
    border-radius: 0 0 10px 10px !important;
    color: var(--dt-red) !important;
    font-weight: 700 !important;
    justify-content: center;
}

div.dt-button-collection .buttons-colvisRestore:before,
ul.dt-button-collection .buttons-colvisRestore:before {
    display: none !important;
}

div.dt-button-collection .buttons-colvisRestore:hover,
ul.dt-button-collection .buttons-colvisRestore:hover {
    background: var(--dt-red-soft) !important;
}

div.dt-button-background {
    background: rgba(17, 19, 24, 0.18) !important;
    backdrop-filter: blur(1px);
}

/* Keep list toolbar tidy with Add button */
.box .box-header.ded-page-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.box .box-header.ded-page-head .box-title {
    margin: 0 !important;
    float: none !important;
}

.box .box-header.ded-page-head .box-tools {
    float: none !important;
    position: static !important;
    display: flex;
    align-items: center;
    gap: 8px;
}

.dataTables_wrapper .top,
.dataTables_wrapper .dt-buttons + .dataTables_filter,
div.dt-buttons {
    vertical-align: middle;
}

.dataTables_wrapper .dataTables_filter {
    float: right;
}

@media (max-width: 767px) {
    div.dt-buttons {
        width: 100%;
    }
    .dataTables_wrapper .dataTables_filter {
        float: none;
        width: 100%;
    }
    .dataTables_wrapper .dataTables_filter input {
        width: 100% !important;
    }
}

.nav-tabs-custom {
    box-shadow: var(--dt-shadow) !important;
}

.nav-tabs-custom > .nav-tabs {
    background: #f8f9fb !important;
    border-bottom: 1px solid var(--dt-line) !important;
}

.nav-tabs-custom > .nav-tabs > li {
    margin-right: 2px;
}

.nav-tabs-custom > .nav-tabs > li > a {
    color: var(--dt-muted) !important;
    font-weight: 600;
    border-radius: 10px 10px 0 0 !important;
}

.nav-tabs-custom > .nav-tabs > li.active {
    border-top: 0 !important;
    border-top-color: transparent !important;
}

/* Payment Methods: kill AdminLTE orange/red top stripe entirely */
.ded-payment-card.nav-tabs-custom > .nav-tabs > li.active,
.ded-payment-card .ded-pay-tabs > li.active,
.nav-tabs-custom.ded-payment-card > .nav-tabs > li.active {
    border-top: 0 !important;
    border-top-color: transparent !important;
    border-bottom-color: transparent !important;
}

.nav-tabs-custom > .nav-tabs > li.active > a,
.nav-tabs-custom > .nav-tabs > li.active > a:hover {
    color: var(--dt-red) !important;
    font-weight: 800;
    border-bottom: 2px solid var(--dt-red) !important;
}

.nav-tabs-custom > .tab-content {
    background: #fff;
    padding: 16px 18px;
}

.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    min-height: 40px !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 10px !important;
    background: #f8f9fb !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 38px !important;
    color: var(--dt-ink) !important;
    padding-left: 12px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 38px !important;
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--dt-red) !important;
    background: #fff !important;
}

.select2-dropdown {
    border: 1px solid var(--dt-line) !important;
    border-radius: 10px !important;
    overflow: hidden;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: var(--dt-red) !important;
}

/* Premium Bootstrap / CI pagination — global */
.pagination {
    display: inline-flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    margin: 0 !important;
    padding: 6px !important;
    background: #f8f9fb;
    border: 1px solid var(--dt-line);
    border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.pagination > li {
    display: inline-flex !important;
}

.pagination > li > a,
.pagination > li > span {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 36px !important;
    height: 36px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    border-radius: 10px !important;
    border: 1px solid var(--dt-line) !important;
    background: #fff !important;
    color: var(--dt-ink) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    box-shadow: 0 1px 2px rgba(17, 19, 24, 0.04) !important;
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .15s ease !important;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    background: var(--dt-red-soft) !important;
    border-color: #f0a8ab !important;
    color: var(--dt-red) !important;
    box-shadow: 0 4px 12px rgba(227, 28, 36, 0.12) !important;
    transform: translateY(-1px);
    z-index: 2;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    background: var(--dt-red) !important;
    border-color: var(--dt-red) !important;
    color: #fff !important;
    box-shadow: 0 6px 16px rgba(227, 28, 36, 0.28) !important;
    transform: none;
    z-index: 3;
}

.pagination > .disabled > a,
.pagination > .disabled > span,
.pagination > .disabled > a:hover,
.pagination > .disabled > span:hover,
.pagination > .disabled > a:focus,
.pagination > .disabled > span:focus {
    background: #f8f9fb !important;
    border-color: var(--dt-line) !important;
    color: #c4c9d2 !important;
    box-shadow: none !important;
    cursor: default !important;
    transform: none !important;
}

.label-success,
.badge-success {
    background: #067647 !important;
}

.label-danger,
.badge-danger,
.label-warning,
.label-info,
.label-primary {
    background: var(--dt-red) !important;
}

.dropdown-menu {
    border: 1px solid var(--dt-line) !important;
    border-radius: 12px !important;
    box-shadow: 0 16px 40px rgba(17, 19, 24, 0.12) !important;
    padding: 6px !important;
}

.dropdown-menu > li > a {
    border-radius: 8px;
    padding: 8px 12px;
    font-weight: 500;
}

.dropdown-menu > li > a:hover {
    background: var(--dt-red-soft) !important;
    color: var(--dt-red) !important;
}

.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.today {
    background: var(--dt-red) !important;
    border-color: var(--dt-red) !important;
}

.well,
.panel,
.modal-content {
    border-radius: 14px !important;
    border-color: var(--dt-line) !important;
}

.modal-header {
    border-bottom: 1px solid var(--dt-line) !important;
}

.modal-footer {
    border-top: 1px solid var(--dt-line) !important;
}

.modal-title {
    font-weight: 800 !important;
    color: var(--dt-ink) !important;
}

.box-header .box-title i,
.box-title i {
    color: var(--dt-red);
    margin-right: 6px;
}

.form-group.row > label,
.form-horizontal .control-label {
    padding-top: 10px !important;
}

.bootstrap-filestyle .form-control {
    height: 40px !important;
}

.ded-form-modal .box-body > .alert {
    margin-bottom: 12px;
}

.ded-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
    align-items: start;
}

.ded-form-grid > .form-group {
    margin-bottom: 0 !important;
}

.ded-form-grid > .ded-span-all,
.ded-form-grid > .form-group.ded-span-all {
    grid-column: 1 / -1;
}

.ded-choice-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
}

.ded-form-modal .modal-dialog {
    margin-top: 36px;
    width: 880px;
    max-width: calc(100% - 32px);
}

.ded-form-modal .modal-content {
    border: 0 !important;
    border-radius: 16px !important;
    box-shadow: 0 28px 70px rgba(17, 19, 24, 0.2) !important;
    overflow: hidden;
}

.ded-form-modal .modal-header {
    position: relative;
    padding: 16px 52px 16px 22px;
    background: #fff;
}

.ded-form-modal .modal-header .close {
    position: absolute;
    right: 16px;
    top: 14px;
    z-index: 2;
    font-size: 22px;
    opacity: 0.45;
}

.ded-form-modal .modal-body {
    max-height: calc(100vh - 140px);
    overflow-y: auto;
    padding: 8px 22px 20px;
    background: #fff;
}

.ded-form-modal .box,
.ded-form-modal .box.box-primary {
    border: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
    background: transparent !important;
}

.ded-form-modal .box-header {
    display: none !important;
}

.ded-form-modal .box-body {
    padding: 0 !important;
}

.ded-form-modal .box-footer {
    background: transparent !important;
    border-top: 1px solid var(--dt-line);
    padding: 16px 0 4px !important;
    margin-top: 8px;
    display: flex;
    justify-content: flex-end;
}

.ded-form-modal .box-footer .btn {
    min-width: 120px;
    height: 40px;
    float: none !important;
}

.ded-form-modal label {
    display: block;
    margin-bottom: 6px;
}

.ded-form-modal .form-control,
.ded-form-modal select.form-control {
    height: 40px !important;
}

.ded-form-modal textarea.form-control {
    min-height: 80px !important;
    height: 80px !important;
}

@media (max-width: 767px) {
    .ded-form-modal .modal-dialog {
        width: auto;
        margin: 12px;
    }

    .ded-form-grid {
        grid-template-columns: 1fr;
    }

    .box-header.with-border,
    .box-header.ptbnull {
        flex-direction: column;
        align-items: flex-start;
    }

    ul.tablists {
        flex-direction: column;
    }
}

/* =========================================================
   Filters, setup tabs, listings, attendance
   ========================================================= */
.content-header h1 small {
    display: block;
    margin-top: 4px;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--dt-muted) !important;
    letter-spacing: 0;
}

.box-header.ptbnull:empty {
    display: none !important;
    padding: 0 !important;
    border: 0 !important;
}

.box .nav-tabs-custom,
.nav-tabs-custom.border0,
.nav-tabs-custom.navnoshadow {
    border: 0 !important;
    box-shadow: none !important;
    margin-bottom: 0 !important;
    background: transparent;
}

.content-wrapper .row > .col-md-2:has(ul.tablists),
.content-wrapper .row > .col-lg-2:has(ul.tablists),
.content-wrapper .row > .col-sm-2:has(ul.tablists) {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin-bottom: 14px;
}

.content-wrapper .row > .col-md-2:has(ul.tablists) .box,
.content-wrapper .row > .col-md-2:has(ul.tablists) .box.border0 {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    margin: 0 !important;
    overflow: visible !important;
}

ul.tablists {
    display: flex !important;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 !important;
    padding: 6px !important;
    list-style: none;
    background: #fff;
    border: 1px solid var(--dt-line) !important;
    border-radius: 14px;
    box-shadow: var(--dt-shadow);
}

ul.tablists li {
    display: block !important;
    border-bottom: 0 !important;
    flex: 1 1 0;
    margin: 0 !important;
}

ul.tablists li a {
    display: block !important;
    text-align: center;
    padding: 10px 14px !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    color: var(--dt-muted) !important;
    text-decoration: none !important;
    background: transparent;
}

ul.tablists li a.active,
ul.tablists li a:hover {
    background: var(--dt-red) !important;
    color: #fff !important;
}

.ded-filter-box .box-body > .row,
.ded-filter-box form > .box-body > .row,
.ded-filter-box .box-body > form > .row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    margin-left: 0 !important;
    margin-right: 0 !important;
    gap: 12px 16px;
}

.ded-filter-box .box-body > .row > [class*="col-"],
.ded-filter-box form > .box-body > .row > [class*="col-"],
.ded-filter-box .box-body > form > .row > [class*="col-"] {
    float: none;
    padding-left: 0;
    padding-right: 0;
    flex: 1 1 200px;
    width: auto !important;
    max-width: none;
}

.ded-filter-box .box-body > .row > [class*="col-"] > .row,
.ded-filter-box form .box-body .row > [class*="col-"] > .row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 12px 16px;
    margin: 0 !important;
}

.ded-filter-box .box-body > .row > [class*="col-"] > .row > [class*="col-"] {
    float: none;
    padding-left: 0;
    padding-right: 0;
    flex: 1 1 160px;
    width: auto !important;
    max-width: none;
}

.content-wrapper .box-body [class*="col-sm-12"]:has(> .form-group > button),
.content-wrapper .box-body [class*="col-sm-12"]:has(> button),
.content-wrapper .box-body [class*="col-"]:has(> .form-group > button[type="submit"]),
.content-wrapper .box-body [class*="col-"]:has(> button[type="submit"]),
.ded-filter-btn-col {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    margin-left: auto;
}

.content-wrapper .box-body .btn.pull-right,
.content-wrapper .box-body button.pull-right {
    float: none !important;
}

.ded-filter-btn,
.content-wrapper .box-body button[name="search"],
.content-wrapper .box-body button[value="search_filter"],
.content-wrapper .box-body button[value="search_full"] {
    height: 40px;
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.ded-filter-box .form-group {
    margin-bottom: 0 !important;
}

.mailbox-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
    min-height: 40px;
}

.mailbox-controls .pull-right {
    float: none !important;
    margin-left: auto;
}

.mailbox-controls .btn {
    height: 36px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.content-wrapper .radio.radio-inline,
.content-wrapper .checkbox.checkbox-inline {
    display: inline-flex !important;
    align-items: center;
    float: none !important;
    white-space: nowrap;
    margin: 0 6px 4px 0 !important;
    padding: 5px 10px 5px 8px !important;
    border: 1px solid var(--dt-line);
    border-radius: 8px;
    background: #f8f9fb;
    min-height: 32px;
    font-size: 12px;
    font-weight: 600;
}

.content-wrapper .radio.radio-inline:has(input:checked),
.content-wrapper .checkbox.checkbox-inline:has(input:checked) {
    border-color: var(--dt-red);
    background: var(--dt-red-soft);
    color: var(--dt-red);
}

.content-wrapper .radio.radio-inline label,
.content-wrapper .checkbox.checkbox-inline label {
    margin: 0 !important;
    padding: 0 0 0 4px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

.table td .form-control {
    min-width: 140px;
}

.download_label {
    display: none !important;
}

/* Payment gateway tabs — pill style, no AdminLTE orange/red top stripe */
.ded-payment-card.nav-tabs-custom,
.ded-payment-card.nav-tabs-custom > .nav-tabs {
    border: 0 !important;
    box-shadow: none !important;
}

.ded-payment-card.nav-tabs-custom > .nav-tabs {
    border-bottom: 1px solid var(--dt-line) !important;
    margin: 0 !important;
}

.ded-payment-card.nav-tabs-custom > .nav-tabs > li,
.ded-payment-card.nav-tabs-custom > .nav-tabs > li.active,
.ded-payment-card.nav-tabs-custom > .nav-tabs > li:hover,
.ded-pay-tabs > li,
.ded-pay-tabs > li.active {
    border: 0 !important;
    border-top: 0 !important;
    border-top-color: transparent !important;
    margin-bottom: 0 !important;
    background: transparent !important;
}

.ded-payment-card.nav-tabs-custom > .nav-tabs > li.active > a,
.ded-payment-card.nav-tabs-custom > .nav-tabs > li.active > a:hover,
.ded-payment-card.nav-tabs-custom > .nav-tabs > li.active > a:focus {
    border: 0 !important;
    border-top: 0 !important;
    box-shadow: none !important;
}

.ded-pay-tabs {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px 16px 12px !important;
    margin: 0 !important;
    background: #fff !important;
    border-bottom: 1px solid var(--dt-line) !important;
    float: none !important;
}

.ded-pay-tabs > li {
    float: none !important;
    margin: 0 !important;
    flex: 1 1 0;
    border-top: none !important;
}

.ded-pay-tabs > li > a {
    display: block !important;
    margin: 0 !important;
    padding: 11px 14px !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 10px !important;
    border-top: 1px solid var(--dt-line) !important;
    background: #f8f9fb !important;
    color: var(--dt-muted) !important;
    font-weight: 700 !important;
    text-align: center;
    box-shadow: none !important;
}

.ded-pay-tabs > li.active > a,
.ded-pay-tabs > li.active > a:hover,
.ded-pay-tabs > li.active > a:focus,
.ded-pay-tabs > li > a:hover {
    background: var(--dt-ink) !important;
    border-color: var(--dt-ink) !important;
    border-top-color: var(--dt-ink) !important;
    color: #fff !important;
    box-shadow: 0 6px 16px rgba(17, 19, 24, 0.18) !important;
}

.ded-payment-card .tab-content {
    padding: 8px 8px 0;
}

.ded-payment-card .box-footer,
.ded-payment-card form .box-footer {
    background: transparent !important;
    border-top: 1px solid var(--dt-line);
    display: flex;
    justify-content: flex-end;
}

.ded-payment-card form .box-footer .btn {
    float: none !important;
    margin: 0 !important;
}

.ded-gateway-box .box-header {
    padding: 14px 16px 10px !important;
}

.ded-gateway-box .box-body {
    padding: 12px 16px 8px !important;
}

.ded-gateway-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 10px;
}

.ded-gateway-option {
    display: flex !important;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin: 0 !important;
    padding: 11px 12px !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 10px !important;
    background: #f8f9fb !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--dt-ink) !important;
    cursor: pointer;
    line-height: 1.2 !important;
}

.ded-gateway-option input[type="radio"] {
    position: static !important;
    margin: 0 !important;
    float: none !important;
    flex: 0 0 auto;
}

.ded-gateway-option span {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ded-gateway-option:has(input:checked) {
    border-color: var(--dt-red) !important;
    background: var(--dt-red-soft) !important;
    color: var(--dt-red) !important;
}

.ded-gateway-box .box-footer {
    background: transparent !important;
    border-top: 1px solid var(--dt-line);
    padding: 12px 16px !important;
}

.ded-gateway-box .box-footer .btn {
    width: 100%;
    float: none !important;
}

.ded-payment-card .disblock {
    padding-top: 8px;
}

.ded-payment-card .disblock img {
    max-width: 160px;
    height: auto;
}

.ded-payment-card .disblock p {
    margin-top: 8px;
    font-size: 12px;
    font-weight: 600;
}

/* General settings — roomy premium layout */
.ded-logo-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}

.ded-logo-card {
    background: #fff;
    border: 1px solid var(--dt-line);
    border-radius: 14px;
    box-shadow: var(--dt-shadow);
    padding: 16px 14px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 150px;
}

.ded-logo-card img {
    max-width: 100%;
    max-height: 64px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.ded-logo-card .ded-favicon-preview {
    width: 56px;
    height: 56px;
    object-fit: contain;
    background: #fff;
    border: 1px solid var(--dt-line);
    border-radius: 10px;
    padding: 4px;
}

.ded-logo-hint {
    margin: 0;
    font-size: 11px;
    color: var(--dt-muted);
    line-height: 1.35;
}

.ded-settings-box > .box-body,
#schsetting_form .box-body {
    padding: 22px 24px 12px !important;
}

#schsetting_form .box-body > .row {
    margin-left: -10px !important;
    margin-right: -10px !important;
    margin-bottom: 6px;
}

#schsetting_form .box-body > .row > [class*="col-"] {
    padding-left: 10px;
    padding-right: 10px;
    float: left;
    width: auto;
}

#schsetting_form .box-body > .row > .col-md-6 {
    width: 50%;
}

#schsetting_form .box-body > .row > .col-md-12 {
    width: 100%;
}

#schsetting_form .form-group.row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 18px !important;
}

#schsetting_form .form-group.row > [class*="col-"] {
    width: 100% !important;
    float: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: block !important;
}

#schsetting_form .form-group.row > label {
    display: block !important;
    float: none !important;
    width: 100% !important;
    padding-top: 0 !important;
    margin: 0 0 7px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #374151 !important;
    line-height: 1.3;
}

#schsetting_form .settinghr {
    margin: 22px 0 10px !important;
    border-top: 1px solid var(--dt-line);
}

#schsetting_form .session-head {
    margin: 0 0 16px !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    color: var(--dt-ink) !important;
    letter-spacing: -0.02em;
}

#schsetting_form .radio-inline {
    margin: 0 8px 8px 0 !important;
}

#schsetting_form .box-footer {
    padding: 16px 24px 20px !important;
    background: transparent !important;
    border-top: 1px solid var(--dt-line);
}

@media (max-width: 991px) {
    .ded-logo-strip {
        grid-template-columns: 1fr 1fr;
    }

    #schsetting_form .box-body > .row > .col-md-6 {
        width: 100%;
    }
}

@media (max-width: 575px) {
    .ded-logo-strip {
        grid-template-columns: 1fr;
    }
}

/* WhatsApp Settings */
.ded-wa-status {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 18px;
    padding: 14px 16px;
    border-radius: 12px;
    border: 1px solid #bbf7d0;
    background: #ecfdf5;
}
.ded-wa-status.is-warn {
    border-color: #fde68a;
    background: #fffbeb;
}
.ded-wa-status-title {
    margin: 0;
    font-size: 14px;
    font-weight: 800;
    color: #065f46;
}
.ded-wa-status.is-warn .ded-wa-status-title { color: #92400e; }
.ded-wa-status-meta {
    margin: 4px 0 0;
    font-size: 13px;
    color: #047857;
}
.ded-wa-status.is-warn .ded-wa-status-meta { color: #a16207; }
.ded-wa-disconnect {
    border-color: #fecaca !important;
    color: #b91c1c !important;
}
.ded-wa-card {
    border: 1px solid var(--dt-line);
    border-radius: 14px;
    padding: 18px 18px 16px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(17, 19, 24, 0.04);
}
.ded-wa-heading {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 800;
    color: var(--dt-ink);
}
.ded-wa-copy {
    margin: 0 0 14px;
    font-size: 13px;
    line-height: 1.55;
    color: var(--dt-muted);
}
.ded-wa-after {
    margin-top: 18px;
    padding: 12px 14px;
    border-radius: 10px;
    background: #f8f9fb;
    border: 1px solid var(--dt-line);
}
.ded-wa-after-title {
    margin: 0 0 6px;
    font-weight: 700;
    color: var(--dt-ink);
}
.ded-wa-after ul {
    margin: 0;
    padding-left: 18px;
    color: var(--dt-muted);
    font-size: 13px;
}
.ded-wa-label {
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--dt-muted);
}
.ded-wa-mono {
    margin: 0;
    padding: 10px 12px;
    border-radius: 8px;
    background: #f8f9fb;
    border: 1px solid var(--dt-line);
    font-family: Consolas, Monaco, monospace;
    font-size: 12px;
    word-break: break-all;
    color: var(--dt-ink);
}
.ded-wa-dl {
    margin: 0;
}
.ded-wa-dl > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 1px solid #f1f3f5;
    font-size: 13px;
}
.ded-wa-dl dt { margin: 0; color: var(--dt-muted); font-weight: 500; }
.ded-wa-dl dd { margin: 0; font-weight: 700; color: var(--dt-ink); text-align: right; }

.ded-wa-unavailable {
    margin-top: 4px;
    padding: 16px 18px;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    background: #f8f9fb;
}
.ded-wa-unavailable-title {
    margin: 0 0 4px;
    font-size: 15px;
    font-weight: 800;
    color: var(--dt-ink);
}
.ded-wa-unavailable-copy {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--dt-muted);
}

/* =========================================================
   Student Search & Filter � premium unified panel
   ========================================================= */
.ded-page-intro {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 16px;
    padding: 4px 2px 0;
}
.ded-page-intro-title {
    margin: 0 !important;
    font-size: 26px !important;
    font-weight: 800 !important;
    letter-spacing: -0.03em;
    color: var(--dt-ink) !important;
}
.ded-page-intro-sub {
    margin: 4px 0 0;
    color: var(--dt-muted);
    font-size: 13px;
    font-weight: 500;
}
.ded-student-filter {
    border: 1px solid var(--dt-line) !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 30px rgba(17, 19, 24, 0.06) !important;
    overflow: hidden;
}
.ded-student-filter > .box-header,
.ded-student-filter-head {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px 12px !important;
    background: #fff !important;
    border-bottom: 1px solid var(--dt-line) !important;
}
.ded-student-filter-head .box-title {
    float: none !important;
    margin: 0 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    color: var(--dt-ink) !important;
}
.ded-student-filter-head .box-title i {
    color: var(--dt-red);
    margin-right: 6px;
}
.ded-student-filter-head .box-tools {
    float: none !important;
    position: static !important;
}
.ded-clear-filters {
    border-radius: 999px !important;
    padding: 5px 12px !important;
    font-size: 12px !important;
}
.ded-student-filter > .box-body {
    padding: 18px !important;
    background: #fff !important;
}
.ded-filter-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1.6fr;
    gap: 14px;
    margin-bottom: 16px;
}
.ded-filter-grid.ded-filter-2 {
    grid-template-columns: 1fr 1.6fr;
}
.ded-filter-grid.ded-filter-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.ded-filter-panel .ded-filter-field #date_result,
.ded-student-filter .ded-filter-field #date_result {
    display: contents;
}
.ded-filter-panel #date_result .form-group,
.ded-student-filter #date_result .form-group {
    margin-bottom: 0;
}
.ded-filter-field label {
    display: block;
    margin: 0 0 7px;
    font-size: 12px;
    font-weight: 700;
    color: #374151;
}
.ded-field-icon-wrap {
    position: relative;
}
.ded-field-icon-wrap > i {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #9ca3af;
    font-size: 14px;
    z-index: 2;
    pointer-events: none;
}
.ded-student-filter .ded-field-icon-wrap .form-control,
.ded-unified-search .ded-field-icon-wrap .form-control {
    height: 46px !important;
    padding-left: 40px !important;
    border-radius: 12px !important;
    background: #f8f9fb !important;
    border: 1px solid var(--dt-line) !important;
    box-shadow: none !important;
    font-weight: 500;
}
.ded-student-filter .ded-field-icon-wrap .form-control:focus {
    background: #fff !important;
    border-color: var(--dt-red) !important;
    box-shadow: 0 0 0 3px rgba(227, 28, 36, 0.12) !important;
}
.ded-filter-actions {
    display: flex;
    justify-content: flex-end;
}
.ded-search-students-btn {
    min-width: 200px;
    height: 46px !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 20px !important;
    float: none !important;
    line-height: 1 !important;
}
.ded-search-students-btn > span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.ded-search-students-btn .fa-arrow-right {
    font-size: 12px;
    opacity: .9;
    margin: 0 !important;
}
.ded-search-students-btn .fa-search {
    margin: 0 !important;
}
.ded-collect-fee-btn,
a.btn.ded-collect-fee-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    min-height: 32px !important;
    min-width: 0 !important;
    height: auto !important;
    padding: 7px 14px !important;
    line-height: 1.2 !important;
    float: none !important;
    white-space: nowrap;
    border-radius: 8px !important;
}
.ded-collect-fee-btn i,
.ded-collect-fee-btn span {
    margin: 0 !important;
    float: none !important;
}
.ded-print-fee-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    min-height: 32px !important;
    padding: 7px 12px !important;
    line-height: 1.2 !important;
    float: none !important;
    white-space: nowrap;
    border-radius: 8px !important;
    margin-left: 4px !important;
}
.ded-fee-action-btns {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    float: none !important;
}
.ded-fee-row-actions {
    white-space: nowrap;
    min-width: 160px;
}
.ded-fee-balance {
    font-weight: 700;
}
.ded-fee-balance.is-due {
    color: var(--dt-red);
}
.ded-fee-balance.is-clear {
    color: #067647;
}
.ded-results-panel {
    margin-top: 0 !important;
    border-top: 1px solid var(--dt-line) !important;
    padding: 0 0 8px;
}
.ded-results-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px 10px;
}
.ded-results-title-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
}
.ded-results-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    height: 40px;
    padding: 0 14px;
    border-radius: 12px;
    background: var(--dt-red);
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .02em;
    box-shadow: 0 6px 16px rgba(227, 28, 36, 0.25);
}
.ded-results-title-text {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}
.ded-results-title-text strong {
    font-size: 15px;
    color: var(--dt-ink);
    font-weight: 700;
}
.ded-results-title-text small {
    font-size: 12px;
    color: var(--dt-muted);
    font-weight: 500;
}
.ded-results-bar {
    display: flex !important;
    justify-content: flex-end;
    padding: 10px 16px 0 !important;
}
.ded-results-count {
    font-size: 12px;
    font-weight: 700;
    color: var(--dt-muted);
    background: #f8f9fb;
    border: 1px solid var(--dt-line);
    border-radius: 999px;
    padding: 5px 12px;
}
.ded-student-filter .nav-tabs-custom {
    box-shadow: none !important;
    margin-bottom: 0 !important;
}
@media (max-width: 991px) {
    .ded-filter-grid {
        grid-template-columns: 1fr 1fr;
    }
    .ded-filter-keyword {
        grid-column: 1 / -1;
    }
}
@media (max-width: 575px) {
    .ded-filter-grid {
        grid-template-columns: 1fr;
    }
    .ded-search-students-btn {
        width: 100%;
    }
    .ded-filter-actions {
        justify-content: stretch;
    }
}

/* Premium pagination — mobile + shared polish */
@media (max-width: 767px) {
    .dataTables_wrapper .dataTables_info,
    .dataTables_wrapper .dataTables_paginate {
        float: none !important;
        text-align: center !important;
        width: 100% !important;
        justify-content: center;
    }
    .dataTables_wrapper .dataTables_paginate {
        margin: 10px auto 0 !important;
    }
    .pagination {
        justify-content: center;
    }
}

.pager {
    display: inline-flex !important;
    gap: 6px;
    padding: 6px !important;
    background: #f8f9fb;
    border: 1px solid var(--dt-line);
    border-radius: 12px;
}
.pager li > a,
.pager li > span {
    border-radius: 10px !important;
    border: 1px solid var(--dt-line) !important;
    background: #fff !important;
    color: var(--dt-ink) !important;
    font-weight: 600 !important;
    padding: 8px 14px !important;
    box-shadow: 0 1px 2px rgba(17, 19, 24, 0.04) !important;
}
.pager li > a:hover {
    background: var(--dt-red-soft) !important;
    border-color: #f0a8ab !important;
    color: var(--dt-red) !important;
}

/* Student academic history tab */
.ded-history-wrap {
    padding: 16px 18px 22px;
}
.ded-history-intro {
    margin-bottom: 14px;
}
.ded-history-intro h4 {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 700;
    color: var(--dt-ink);
}
.ded-history-intro p {
    margin: 0;
    color: var(--dt-muted);
    font-size: 13px;
}
.ded-history-table thead th {
    background: #f8f9fb !important;
    color: var(--dt-ink) !important;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .03em;
    border-bottom: 1px solid var(--dt-line) !important;
}
.ded-history-table tbody td {
    vertical-align: middle !important;
    font-size: 13px;
}
.ded-history-table tr.ded-history-current td {
    background: var(--dt-red-soft) !important;
}
.ded-history-table .label-danger {
    background: var(--dt-red) !important;
    font-weight: 600;
    font-size: 10px;
    padding: 3px 7px;
    border-radius: 999px;
    vertical-align: middle;
    margin-left: 6px;
}

/* Kill leftover session-edit + sidebar top gap (style-main .verttop:56px) */
.ded-session-edit,
a[data-target="#sessionModal"] {
    display: none !important;
}
.sidebar-menu.verttop,
.sidebar-menu.verttop38,
ul.sidebar-menu.verttop {
    padding-top: 0 !important;
}
.main-sidebar .fixedmenu + .sidebar,
.main-sidebar .sessionul + section,
.sidebar > .sidebar-menu {
    margin-top: 0 !important;
}

/* =========================================================
   Premium mobile / WebView app shell (all portals)
   ========================================================= */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    overscroll-behavior-y: contain;
    -webkit-tap-highlight-color: rgba(227, 28, 36, 0.12);
}

.ded-mobile-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1010;
    background: rgba(14, 17, 22, 0.55);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    opacity: 0;
    transition: opacity .2s ease;
}

.ded-mobile-backdrop.is-visible {
    display: block;
    opacity: 1;
}

/* Profile drawer — same left slide shell as hamburger sidebar */
.ded-profile-drawer {
    position: fixed;
    top: 0;
    left: 0;
    right: auto;
    width: min(86vw, 300px);
    max-width: 300px;
    height: 100%;
    z-index: 1045;
    background: var(--dt-sidebar) !important;
    color: #fff;
    box-shadow: none;
    transform: translateX(-105%);
    transition: transform .28s cubic-bezier(.2, .8, .2, 1);
    display: flex;
    flex-direction: column;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 0 calc(16px + env(safe-area-inset-bottom, 0px));
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.ded-profile-drawer.is-open {
    transform: translateX(0);
    box-shadow: 16px 0 40px rgba(0, 0, 0, 0.28);
}

.ded-profile-drawer-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding: 14px 14px 16px;
    margin: 0 0 4px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.ded-profile-drawer-user {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    flex: 1;
}

.ded-profile-drawer-user img {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    object-fit: cover;
    background: #e8eaed;
    border: 0;
    flex: 0 0 auto;
}

.ded-profile-drawer-copy {
    min-width: 0;
}

.ded-profile-drawer-user strong {
    display: block;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    text-transform: capitalize;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ded-profile-drawer-user span {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    font-weight: 500;
    color: #9aa0a6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ded-profile-drawer-close {
    border: 0;
    background: #2a2f36;
    color: #fff;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
}

.ded-profile-drawer-close:hover,
.ded-profile-drawer-close:focus {
    background: #353b44;
    color: #fff;
}

.ded-profile-drawer-nav.sidebar-menu,
ul.ded-profile-drawer-nav {
    list-style: none;
    margin: 0 !important;
    padding: 8px 0 12px !important;
    width: 100%;
    float: none !important;
}

.ded-profile-drawer-nav > li {
    margin: 0 !important;
    float: none !important;
    display: block !important;
}

.ded-profile-drawer-nav > li > a {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 48px !important;
    margin: 3px 10px !important;
    padding: 13px 14px !important;
    border-radius: 12px !important;
    border-left: 0 !important;
    color: #fff !important;
    background: transparent !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    box-shadow: none !important;
}

.ded-profile-drawer-nav > li > a > i,
.ded-profile-drawer-nav > li > a > .fa {
    width: 20px !important;
    min-width: 20px;
    text-align: center !important;
    color: var(--dt-red) !important;
    font-size: 15px !important;
    margin: 0 !important;
}

.ded-profile-drawer-nav > li > a > span {
    color: inherit;
    line-height: 1.2;
}

.ded-profile-drawer-nav > li > a:hover,
.ded-profile-drawer-nav > li > a:focus {
    background: #1c2026 !important;
    color: #fff !important;
}

.ded-profile-drawer-nav > li > a.is-logout,
.ded-profile-drawer-nav > li > a.is-logout:hover,
.ded-profile-drawer-nav > li > a.is-logout:focus {
    color: #fff !important;
}

.ded-profile-drawer-nav > li > a.is-logout > i {
    color: var(--dt-red) !important;
}

body.ded-profile-open {
    overflow: hidden;
}

body.ded-profile-open .ded-mobile-backdrop.is-visible {
    display: block;
    opacity: 1;
}

.main-header .ded-profile-trigger {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

@media (max-width: 991px) {
    .ded-profile-drawer {
        width: min(86vw, 300px) !important;
        max-width: 300px !important;
        z-index: 1045 !important;
    }
}

@media (max-width: 991px) {
    body {
        padding-bottom: env(safe-area-inset-bottom, 0);
    }

    .main-header {
        padding-left: env(safe-area-inset-left, 0);
        padding-right: env(safe-area-inset-right, 0);
        box-shadow: 0 4px 20px rgba(17, 19, 24, 0.08) !important;
    }

    .main-header .logo {
        width: 54px !important;
        padding: 0 8px !important;
    }

    .main-header .logo .logo-lg {
        display: none !important;
    }

    .main-header .logo .logo-mini {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 64px;
    }

    .main-header .navbar {
        margin-left: 54px !important;
        min-height: 64px;
    }

    .main-header .sidebar-toggle {
        width: 44px !important;
        height: 44px !important;
        padding: 12px !important;
        margin: 10px 4px !important;
        border-radius: 12px !important;
    }

    .ded-header-bar {
        gap: 8px !important;
        padding-right: 8px;
        flex-wrap: nowrap;
        overflow: visible !important;
    }

    .main-header {
        max-height: none !important;
        height: auto !important;
        min-height: 64px !important;
        overflow: visible !important;
        z-index: 1035 !important;
    }

    .main-header .navbar {
        overflow: visible !important;
        z-index: 1035 !important;
    }

    .main-header .navbar-custom-menu {
        position: relative;
        z-index: 1040;
        overflow: visible !important;
    }

    .main-header .headertopmenu > li.user-menu > .dropdown-menu {
        position: absolute !important;
        top: calc(100% + 6px) !important;
        right: 0 !important;
        left: auto !important;
        width: min(280px, calc(100vw - 24px)) !important;
        min-width: 220px !important;
        display: none;
        z-index: 2000 !important;
    }

    .main-header .headertopmenu > li.user-menu.open > .dropdown-menu {
        display: block !important;
    }

    .ded-session-badge {
        flex-shrink: 0;
        font-size: 11px !important;
        padding: 6px 10px !important;
        max-width: 42vw;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .ded-header-search {
        flex: 1 1 auto;
        min-width: 0;
        margin: 0 !important;
    }

    .ded-header-search .form-control {
        height: 40px !important;
        border-radius: 999px !important;
        font-size: 13px !important;
    }

    .navbar-custom-menu > .nav > li > a {
        width: 40px;
        height: 40px;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        padding: 0 !important;
        margin: 0 2px;
        border-radius: 12px;
    }

    /* Drawer sidebar — always off-canvas on phone (never mini 50px strip) */
    .main-sidebar,
    .left-side,
    .sidebar-mini .main-sidebar,
    .sidebar-mini.sidebar-collapse .main-sidebar,
    .sidebar-mini.sidebar-collapse .left-side {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        padding-top: calc(64px + env(safe-area-inset-top, 0px)) !important;
        width: min(86vw, 300px) !important;
        max-width: 300px !important;
        margin-left: 0 !important;
        transform: translate3d(-105%, 0, 0) !important;
        -webkit-transform: translate3d(-105%, 0, 0) !important;
        transition: transform .28s cubic-bezier(.2, .8, .2, 1), -webkit-transform .28s cubic-bezier(.2, .8, .2, 1) !important;
        box-shadow: none !important;
        z-index: 1030 !important;
    }

    .sidebar-open .main-sidebar,
    .sidebar-open .left-side,
    .sidebar-open.sidebar-mini .main-sidebar,
    .sidebar-open.sidebar-mini.sidebar-collapse .main-sidebar,
    .sidebar-open.sidebar-mini.sidebar-collapse .left-side {
        transform: translate3d(0, 0, 0) !important;
        -webkit-transform: translate3d(0, 0, 0) !important;
        box-shadow: 16px 0 40px rgba(0, 0, 0, 0.28) !important;
    }

    .fixedmenu,
    .sessionul.fixedmenu,
    .sidebar-mini.sidebar-collapse .fixedmenu,
    .sidebar-mini.sidebar-collapse .sessionul.fixedmenu {
        width: 100% !important;
        max-width: 300px !important;
    }

    .content-wrapper,
    .right-side,
    .main-footer,
    .sidebar-mini.sidebar-collapse .content-wrapper,
    .sidebar-mini.sidebar-collapse .right-side,
    .sidebar-mini.sidebar-collapse .main-footer,
    .sidebar-mini .content-wrapper,
    .sidebar-mini .right-side,
    .sidebar-mini .main-footer {
        margin-left: 0 !important;
        padding-top: calc(64px + env(safe-area-inset-top, 0px)) !important;
    }

    body.fixed .content-wrapper,
    body.fixed .right-side {
        padding-top: calc(64px + env(safe-area-inset-top, 0px)) !important;
    }

    .sidebar-menu > li > a {
        min-height: 48px !important;
        padding: 13px 14px !important;
        font-size: 14px !important;
        margin: 3px 10px !important;
        border-radius: 12px !important;
    }

    .sidebar-menu > li > .treeview-menu > li > a {
        min-height: 42px;
        padding: 10px 14px 10px 28px !important;
        font-size: 13px;
    }

    section.content,
    .content {
        padding: 12px 12px calc(28px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .content-header {
        padding: 12px 12px 6px !important;
    }

    .content-header > h1,
    .content-header h1 {
        font-size: 20px !important;
    }

    .box,
    .nav-tabs-custom {
        border-radius: 16px !important;
        margin-bottom: 14px !important;
    }

    .box-header.with-border,
    .box-header.ptbnull,
    .box-header.ded-page-head {
        flex-wrap: wrap;
        gap: 8px;
        padding: 14px 14px 10px !important;
    }

    .box-body {
        padding: 12px 14px !important;
    }

    .box-footer {
        padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
        position: sticky;
        bottom: 0;
        background: rgba(255, 255, 255, 0.96);
        backdrop-filter: blur(8px);
        z-index: 5;
        border-top: 1px solid var(--dt-line) !important;
    }

    .btn,
    .btn-sm,
    .btn-primary,
    button.btn {
        min-height: 44px;
        padding-left: 16px !important;
        padding-right: 16px !important;
        border-radius: 12px !important;
        font-weight: 600 !important;
    }

    .btn-xs,
    .btn.btn-xs {
        min-height: 36px;
        min-width: 36px;
        padding: 8px 10px !important;
        border-radius: 10px !important;
    }

    .form-control,
    select.form-control,
    textarea.form-control,
    .content-wrapper .form-control {
        min-height: 44px !important;
        border-radius: 12px !important;
        font-size: 16px !important; /* avoids iOS zoom */
    }

    textarea.form-control {
        min-height: 96px !important;
    }

    .form-group.row > [class*="col-"],
    .box-body .row > [class*="col-md-"],
    .box-body .row > [class*="col-sm-"] {
        width: 100% !important;
        float: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-bottom: 10px;
    }

    .form-group.row > label[class*="col-"] {
        margin-bottom: 6px;
        padding-top: 0 !important;
    }

    label.radio-inline,
    label.checkbox-inline,
    .content-wrapper label.radio-inline,
    .content-wrapper label.checkbox-inline {
        display: inline-flex !important;
        align-items: center;
        min-height: 42px;
        margin: 0 8px 8px 0 !important;
        padding: 8px 14px !important;
        border-radius: 12px !important;
    }

    .table-responsive {
        border-radius: 12px;
        margin: 0 -2px;
        -webkit-overflow-scrolling: touch;
    }

    table.table thead th {
        white-space: nowrap;
        font-size: 11px !important;
    }

    table.table tbody td {
        font-size: 13px !important;
        vertical-align: middle !important;
    }

    .dataTables_wrapper .dataTables_filter,
    .dataTables_wrapper .dataTables_length,
    .dataTables_wrapper .dt-buttons {
        float: none !important;
        width: 100% !important;
        text-align: left !important;
        margin-bottom: 10px !important;
    }

    .dataTables_wrapper .dataTables_filter input {
        width: 100% !important;
        margin-left: 0 !important;
    }

    div.dt-buttons {
        width: 100%;
        justify-content: flex-start;
    }

    .ded-dt-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    .ded-dt-toolbar-left,
    .ded-dt-toolbar-right {
        width: 100%;
        margin-left: 0;
        justify-content: flex-start;
    }
    .ded-dt-toolbar-title small {
        max-width: 100%;
        white-space: normal;
    }
    .ded-dt-toolbar .dataTables_filter input,
    .ded-dt-search-wrap input,
    .ded-dt-search-wrap {
        width: 100% !important;
    }
    .ded-dt-toolbar div.dt-buttons {
        width: 100%;
        justify-content: flex-start;
    }

    .modal-dialog {
        margin: 12px !important;
        width: auto !important;
        max-width: calc(100vw - 24px);
    }

    .modal-content {
        border-radius: 16px !important;
    }

    .pagination,
    .dataTables_wrapper .dataTables_paginate {
        width: 100%;
        justify-content: center !important;
        float: none !important;
    }

    .ded-welcome {
        border-radius: 18px;
        padding: 20px 18px !important;
        min-height: 0;
    }

    .ded-page-intro {
        margin-bottom: 12px;
    }

    .ded-page-intro-title {
        font-size: 22px !important;
    }

    .ded-student-filter .ded-filter-grid {
        grid-template-columns: 1fr !important;
    }

    .ded-results-head {
        padding: 12px 12px 8px;
    }

    .ded-results-badge {
        min-width: 48px;
        height: 36px;
        font-size: 14px;
    }

    .main-footer {
        text-align: center !important;
        padding: 12px 12px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
        font-size: 11px;
    }

    /* Student / parent portal share same shell */
    .wrapper {
        overflow-x: hidden;
    }
}

@media (max-width: 575px) {
    .ded-header-search {
        display: none !important;
    }

    .ded-session-badge strong {
        display: inline;
    }

    .navbar-custom-menu .headertopmenu > li.cal15,
    .navbar-custom-menu .headertopmenu > li:has(a[href*="calendar"]) {
        /* keep calendar */
    }

    .content-wrapper .box-body .btn.pull-right,
    .box-footer .btn.pull-right,
    .edit_setting,
    .submit_schsetting {
        float: none !important;
        width: 100% !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    .nav-tabs-custom > .nav-tabs > li {
        float: none;
        display: block;
        margin: 0 !important;
    }

    .nav-tabs-custom > .nav-tabs > li > a {
        margin: 0 !important;
        border-radius: 0 !important;
        padding: 14px 16px !important;
        border-bottom: 1px solid var(--dt-line) !important;
    }

    .nav-tabs-custom > .nav-tabs > li.active > a {
        background: var(--dt-red-soft) !important;
        color: var(--dt-red) !important;
        border-left: 3px solid var(--dt-red) !important;
    }

    .impbtntitle3,
    .relative .btn-info {
        position: static !important;
        display: block;
        width: 100%;
        margin-top: 8px;
    }
}

/* Login / auth also app-like on phones */
@media (max-width: 767px) {
    body.drishi-auth,
    body.login-page {
        background: #0e1116 !important;
    }

    body.login-page .login-box,
    body.drishi-auth .login-box {
        width: auto !important;
        margin: 24px 16px !important;
        max-width: 100%;
    }
}

/* =========================================================
   Toastr — theme (red / black / white)
   ========================================================= */
#toast-container {
    z-index: 99999 !important;
}
#toast-container > div {
    opacity: 1 !important;
    filter: none !important;
    -ms-filter: none !important;
    box-shadow: 0 12px 32px rgba(17, 19, 24, 0.18) !important;
    border-radius: 12px !important;
    padding: 15px 15px 15px 50px !important;
    width: 340px !important;
    border: 0 !important;
    font-family: Inter, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
    color: #fff !important;
    background-position: 15px center !important;
    background-repeat: no-repeat !important;
    background-size: 24px 24px !important;
}
#toast-container > div:hover {
    box-shadow: 0 16px 36px rgba(17, 19, 24, 0.24) !important;
    opacity: 1 !important;
}
#toast-container > .toast-success {
    background-color: #067647 !important;
}
#toast-container > .toast-error {
    background-color: var(--dt-red) !important;
}
#toast-container > .toast-info {
    background-color: var(--dt-ink) !important;
}
#toast-container > .toast-warning {
    background-color: #b45309 !important;
}
.toast-close-button,
#toast-container .toast-close-button {
    color: #fff !important;
    opacity: .8 !important;
    text-shadow: none !important;
    font-weight: 400 !important;
}
.toast-close-button:hover,
#toast-container .toast-close-button:hover {
    color: #fff !important;
    opacity: 1 !important;
}
.toast-message,
#toast-container .toast-message {
    color: #fff !important;
    font-weight: 600 !important;
}
.toast-progress {
    background: rgba(255, 255, 255, 0.35) !important;
    opacity: 1 !important;
}

/* =========================================================
   Mobile app bottom tabs (keep header hamburger)
   ========================================================= */
.ded-mobile-tabs {
    display: none;
}

@media (max-width: 991px) {
    .ded-mobile-tabs {
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1040;
        align-items: stretch;
        justify-content: space-around;
        gap: 2px;
        min-height: 64px;
        padding: 6px 6px calc(6px + env(safe-area-inset-bottom, 0px));
        background: rgba(255, 255, 255, 0.96);
        border-top: 1px solid var(--dt-line);
        box-shadow: 0 -8px 28px rgba(17, 19, 24, 0.1);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
    }

    .ded-mobile-tab {
        flex: 1 1 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        min-height: 52px;
        padding: 6px 4px;
        border-radius: 14px;
        color: #6b7280 !important;
        text-decoration: none !important;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: .02em;
        transition: background .15s ease, color .15s ease, transform .15s ease;
        -webkit-tap-highlight-color: transparent;
    }

    .ded-mobile-tab i {
        font-size: 20px;
        line-height: 1;
    }

    .ded-mobile-tab span {
        line-height: 1.1;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .ded-mobile-tab.is-active {
        color: var(--dt-red) !important;
        background: var(--dt-red-soft);
    }

    .ded-mobile-tab:active {
        transform: scale(0.96);
    }

    .ded-mobile-tab-menu.is-active,
    .ded-mobile-tab-menu {
        color: #6b7280 !important;
    }

    body.ded-webview-ready .content-wrapper,
    body.ded-webview-ready .right-side {
        padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
    }

    body.ded-webview-ready .main-footer {
        display: none !important;
    }

    /* Keep sticky form footers above bottom tabs */
    body.ded-webview-ready .box-footer {
        bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
    }
}

/* ===== Collect Fees modal ===== */
.ded-fee-collect-modal .modal-dialog {
    width: 560px;
    max-width: calc(100% - 24px);
    margin: 40px auto;
}
.ded-fee-collect-modal .modal-content {
    border: 0;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 18px 50px rgba(17, 19, 24, .18);
}
.ded-fee-collect-modal .modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--dt-line);
    background: #fff;
}
.ded-fee-collect-modal .modal-header .close {
    float: none;
    margin: 0;
    opacity: .55;
    font-size: 26px;
    line-height: 1;
}
.ded-fee-collect-modal .modal-header .close:hover {
    opacity: 1;
}
.ded-fee-collect-modal .modal-title {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: var(--dt-ink);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.ded-fee-collect-modal .modal-title i {
    color: var(--dt-red);
    font-size: 15px;
}
.ded-fee-collect-modal .modal-body {
    padding: 18px 20px 8px;
    background: #fafbfc;
}
.ded-fee-collect-modal .modal-footer {
    padding: 12px 20px 16px;
    border-top: 1px solid var(--dt-line);
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}
.ded-fee-collect-modal .modal-footer .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    min-height: 38px !important;
    padding: 8px 16px !important;
    line-height: 1.2 !important;
    border-radius: 10px !important;
    float: none !important;
    margin: 0 !important;
}
.ded-fee-collect-modal .modal-footer .btn i {
    margin: 0 !important;
}
.ded-fee-pay-btn {
    background: var(--dt-red) !important;
    border-color: var(--dt-red) !important;
    color: #fff !important;
    font-weight: 600 !important;
    min-width: 108px;
}
.ded-fee-pay-btn:hover,
.ded-fee-pay-btn:focus {
    background: var(--dt-red-hover) !important;
    border-color: var(--dt-red-hover) !important;
}

.ded-fee-collect {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.ded-fee-collect-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 14px;
}
.ded-fee-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}
.ded-fee-field-full {
    grid-column: 1 / -1;
}
.ded-fee-field > label {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .01em;
    color: #4b5563;
}
.ded-fee-field .form-control,
.ded-fee-field-wrap .form-control {
    height: 40px;
    border-radius: 10px !important;
    border: 1px solid var(--dt-line) !important;
    box-shadow: none !important;
    background: #fff !important;
    padding: 8px 12px;
    font-size: 13.5px;
    color: var(--dt-ink);
}
.ded-fee-field textarea.form-control {
    height: auto;
    min-height: 78px;
    resize: vertical;
}
.ded-fee-field .form-control:focus,
.ded-fee-field-wrap .form-control:focus {
    border-color: #f3a4a7 !important;
    box-shadow: 0 0 0 3px rgba(227, 28, 36, .08) !important;
}
.ded-fee-field-wrap {
    position: relative;
}
.ded-fee-field-wrap > i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #9ca3af;
    pointer-events: none;
    font-size: 13px;
}
.ded-fee-field-wrap .form-control {
    padding-left: 34px;
}

.ded-pay-modes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.ded-pay-mode {
    margin: 0 !important;
    cursor: pointer;
    font-weight: 500;
}
.ded-pay-mode input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.ded-pay-mode span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid var(--dt-line);
    background: #fff;
    color: #374151;
    font-size: 12.5px;
    line-height: 1;
    transition: .15s ease;
    user-select: none;
}
.ded-pay-mode:hover span {
    border-color: #f3a4a7;
    color: var(--dt-red);
}
.ded-pay-mode input:checked + span {
    background: var(--dt-red-soft);
    border-color: #f3a4a7;
    color: var(--dt-red);
    font-weight: 600;
    box-shadow: inset 0 0 0 1px rgba(227, 28, 36, .12);
}

.ded-pay-extra {
    padding: 12px;
    border-radius: 12px;
    border: 1px dashed #f0b4b7;
    background: #fff7f7;
}
.ded-pay-extra .ded-fee-collect-grid {
    gap: 10px 12px;
}
.ded-pay-extra .form-control {
    background: #fff !important;
}

.ded-fee-pay-summary {
    margin-top: 2px;
    border: 1px solid var(--dt-line);
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}
.ded-fee-pay-summary-title {
    padding: 10px 14px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #6b7280;
    background: #f8fafc;
    border-bottom: 1px solid var(--dt-line);
}
.ded-fee-pay-list {
    padding: 4px 0;
    max-height: 180px;
    overflow: auto;
}
.ded-fee-pay-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
}
.ded-fee-pay-item + .ded-fee-pay-item {
    border-top: 1px solid #f1f3f5;
}
.ded-fee-pay-item-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.ded-fee-pay-item-copy strong {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--dt-ink);
    line-height: 1.3;
}
.ded-fee-pay-item-copy span {
    font-size: 11.5px;
    color: #9ca3af;
}
.ded-fee-pay-item-amt {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--dt-red);
    white-space: nowrap;
}
.ded-fee-pay-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border-top: 1px solid var(--dt-line);
    background: #fffafa;
}
.ded-fee-pay-total span {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
}
.ded-fee-pay-total strong {
    font-size: 18px;
    font-weight: 800;
    color: var(--dt-ink);
    letter-spacing: -.02em;
}

/* Single-fee modal shares the same field language */
#myFeesModal.ded-fee-collect-modal .modal-body,
#myFeesModal .ded-fee-collect {
    background: #fafbfc;
}
#myFeesModal .ded-fee-collect-grid {
    margin: 0;
}
#myFeesModal .box-body {
    padding: 0;
}

@media (max-width: 575px) {
    .ded-fee-collect-modal .modal-dialog {
        width: auto;
        margin: 12px;
    }
    .ded-fee-collect-grid {
        grid-template-columns: 1fr;
    }
    .ded-fee-collect-modal .modal-footer {
        flex-wrap: wrap;
    }
    .ded-fee-collect-modal .modal-footer .btn {
        flex: 1 1 auto;
    }
}

/* =========================================================
   Global ERP polish — tabs, compose, forms, empty states
   (loaded last so AdminLTE / earlier rules cannot win)
   ========================================================= */

/* Kill AdminLTE orange top stripe; brand-red bottom underline */
.nav-tabs-custom > .nav-tabs > li {
    border-top: 0 !important;
    margin-bottom: -1px !important;
}
.nav-tabs-custom > .nav-tabs > li.active,
.nav-tabs-custom > .nav-tabs > li.active:hover,
.nav-tabs-custom > .nav-tabs > li:hover {
    border-top: 0 !important;
    border-top-color: transparent !important;
}
.nav-tabs-custom > .nav-tabs > li > a {
    border: 0 !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    margin: 0 !important;
    color: var(--dt-muted) !important;
    font-weight: 700 !important;
    background: transparent !important;
}
.nav-tabs-custom > .nav-tabs > li.active > a,
.nav-tabs-custom > .nav-tabs > li.active > a:hover,
.nav-tabs-custom > .nav-tabs > li.active > a:focus,
.nav-tabs-custom > .nav-tabs > li > a:hover {
    border: 0 !important;
    border-bottom: 2px solid var(--dt-red) !important;
    color: var(--dt-red) !important;
    background: transparent !important;
    box-shadow: none !important;
}
.nav-tabs-custom > .nav-tabs > li:not(.active) > a:hover {
    border-bottom-color: rgba(227, 28, 36, 0.35) !important;
    color: var(--dt-ink) !important;
}

/* Compose: recipients — stacked so col-md-4 never overflows */
.ded-compose-wrap .ded-recipient-picker {
    position: relative;
    margin-bottom: 10px;
    width: 100%;
    max-width: 100%;
}
.ded-compose-wrap .ded-recipient-type {
    width: 100%;
    margin-bottom: 8px;
    position: relative;
}
.ded-compose-wrap .ded-recipient-type > .btn {
    height: 40px;
    width: 100%;
    text-align: left;
    border-radius: 10px !important;
    border-color: var(--dt-line) !important;
    background: #f8f9fb !important;
    font-weight: 600;
    padding-right: 28px;
}
.ded-compose-wrap .ded-recipient-type > .btn .caret {
    position: absolute;
    right: 12px;
    top: 50%;
    margin-top: -2px;
}
.ded-compose-wrap .ded-recipient-type .dropdown-menu {
    width: 100%;
    max-height: 240px;
    overflow-y: auto;
}
.ded-compose-wrap .ded-recipient-search {
    display: flex;
    width: 100%;
    max-width: 100%;
    gap: 0;
    align-items: stretch;
}
.ded-compose-wrap .ded-recipient-search .form-control {
    flex: 1 1 auto;
    min-width: 0;
    width: auto !important;
    height: 40px !important;
    border-radius: 10px 0 0 10px !important;
    border-color: var(--dt-line) !important;
    box-shadow: none !important;
}
.ded-compose-wrap .ded-recipient-search .add-btn {
    flex: 0 0 auto;
    height: 40px;
    border-radius: 0 10px 10px 0 !important;
    padding: 0 14px !important;
    font-weight: 700;
    white-space: nowrap;
}
.ded-compose-wrap #suggesstion-box {
    position: absolute;
    left: 0;
    right: 0;
    top: auto;
    z-index: 40;
    margin-top: 4px;
}
.ded-compose-wrap #suggesstion-box ul {
    list-style: none;
    margin: 0;
    padding: 6px;
    background: #fff;
    border: 1px solid var(--dt-line);
    border-radius: 12px;
    box-shadow: var(--dt-shadow);
    max-height: 220px;
    overflow-y: auto;
}
.ded-compose-wrap #suggesstion-box li {
    padding: 8px 10px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 13px;
}
.ded-compose-wrap #suggesstion-box li:hover {
    background: var(--dt-red-soft);
    color: var(--dt-red);
}
.ded-compose-wrap .ded-recipient-box {
    background: #f8f9fb !important;
    border: 1px dashed #d5dae3 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    padding: 12px !important;
    min-height: 260px;
}
.ded-compose-wrap .ded-recipient-box .input-group .form-control {
    border-radius: 10px 0 0 10px !important;
    height: 36px !important;
}
.ded-compose-wrap .ded-recipient-box .input-group-addon {
    border-radius: 0 10px 10px 0 !important;
    background: #fff !important;
}
.ded-compose-wrap .ded-empty-recipients {
    text-align: center;
    color: #94a3b8;
    padding: 48px 16px 28px;
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.55;
}
.ded-compose-wrap .ded-empty-recipients i {
    display: inline-block;
    font-size: 28px;
    color: #cbd5e1;
    margin-bottom: 10px;
}
.ded-compose-wrap .ded-empty-recipients span {
    display: block;
    font-weight: 500;
    color: #a0aec0;
    margin-top: 4px;
}
.ded-compose-wrap .send_list .list-group-item {
    border-radius: 10px !important;
    border: 1px solid var(--dt-line) !important;
    margin-bottom: 6px !important;
    background: #fff !important;
    font-size: 13px;
    font-weight: 600;
}

/* Slimmer CKEditor chrome */
.ded-compose-wrap .cke_chrome {
    border: 1px solid var(--dt-line) !important;
    border-radius: 12px !important;
    overflow: hidden;
    box-shadow: none !important;
    max-width: 100%;
}
.ded-compose-wrap .cke_top {
    background: #f8f9fb !important;
    border-bottom: 1px solid var(--dt-line) !important;
    padding: 6px 8px !important;
    white-space: normal !important;
}
.ded-compose-wrap .dual-list,
.ded-compose-wrap .ded-recipient-box,
.ded-compose-wrap .col-md-4,
.ded-compose-wrap .col-md-8 {
    max-width: 100%;
    box-sizing: border-box;
}
.ded-compose-wrap .ded-recipient-box .row {
    margin-left: 0;
    margin-right: 0;
}
.ded-compose-wrap .ded-recipient-box .row > [class*="col-"] {
    padding-left: 0;
    padding-right: 0;
}
.ded-compose-wrap .cke_toolgroup {
    margin: 0 4px 0 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
.ded-compose-wrap .cke_button {
    padding: 4px !important;
}
.ded-compose-wrap .cke_bottom {
    display: none !important;
}

/* Stronger form contrast ERP-wide */
.content-wrapper .form-control,
.content-wrapper .select2-container--default .select2-selection--single,
.content-wrapper .select2-container--default .select2-selection--multiple {
    border-color: #d5dae3 !important;
    background: #fff !important;
}
.content-wrapper .form-control:focus {
    border-color: rgba(227, 28, 36, 0.55) !important;
    box-shadow: 0 0 0 3px rgba(227, 28, 36, 0.12) !important;
}
.content-wrapper label {
    font-weight: 700 !important;
    color: var(--dt-ink) !important;
    font-size: 13px;
}
.content-wrapper .box {
    border-radius: 16px !important;
}
.content-wrapper .box.box-primary,
.content-wrapper .box.box-info,
.content-wrapper .box.box-success,
.content-wrapper .box.box-warning,
.content-wrapper .box.box-danger {
    border-top-color: var(--dt-red) !important;
}
.content-wrapper .box-header.with-border {
    border-bottom-color: var(--dt-line) !important;
}
.content-wrapper .btn-primary {
    background: var(--dt-red) !important;
    border-color: var(--dt-red) !important;
}
.content-wrapper .btn-primary:hover,
.content-wrapper .btn-primary:focus,
.content-wrapper .btn-primary:active {
    background: var(--dt-red-hover) !important;
    border-color: var(--dt-red-hover) !important;
}

/* Dropzone / attachment */
.ded-compose-wrap .dropify-wrapper,
.ded-compose-wrap .file-upload-wrapper,
.ded-compose-wrap .dropzone {
    border-radius: 12px !important;
    border-color: #d5dae3 !important;
}

@media (max-width: 991px) {
    .ded-compose-wrap .ded-recipient-search {
        flex-direction: column;
        gap: 8px;
    }
    .ded-compose-wrap .ded-recipient-search .form-control,
    .ded-compose-wrap .ded-recipient-search .add-btn {
        width: 100%;
        border-radius: 10px !important;
    }
}

/* =========================================================
   ERP-wide legacy AdminLTE cleanup (filters, modals, iCheck)
   ========================================================= */

/* Legacy "Select criteria" filter rows → grid */
.content-wrapper .box.box-primary:not(.ded-student-filter) > .box-body.row {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 14px;
    padding: 18px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.content-wrapper .box.box-primary:not(.ded-student-filter) > .box-body.row > [class*="col-"] {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
}
.content-wrapper .box.box-primary:not(.ded-student-filter) > .box-body.row > .form-group:last-child {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0;
}
.content-wrapper .box.box-primary:not(.ded-student-filter) .checkbox-toggle.pull-right {
    float: none !important;
    min-height: 46px;
    padding: 0 20px !important;
    border-radius: 12px !important;
    font-weight: 700;
}

/* Premium filter look for search/filter boxes without special class */
.content-wrapper .box.box-primary:has(> .box-header .fa-filter),
.content-wrapper .box.box-primary:has(> .box-header .fa-search),
.content-wrapper .box.box-info:has(> .box-header .fa-filter),
.content-wrapper .box.box-info:has(> .box-header .fa-search) {
    border: 1px solid var(--dt-line) !important;
    border-radius: 16px !important;
    box-shadow: var(--dt-shadow) !important;
    overflow: hidden;
}
.content-wrapper .box.box-primary:has(> .box-header .fa-filter) > .box-header,
.content-wrapper .box.box-primary:has(> .box-header .fa-search) > .box-header,
.content-wrapper .box.box-info:has(> .box-header .fa-filter) > .box-header,
.content-wrapper .box.box-info:has(> .box-header .fa-search) > .box-header {
    background: #f8f9fb !important;
    border-bottom: 1px solid var(--dt-line) !important;
    padding: 14px 18px !important;
}
.content-wrapper .box.box-primary:has(> .box-header .fa-filter) > .box-header .box-title,
.content-wrapper .box.box-primary:has(> .box-header .fa-search) > .box-header .box-title {
    font-weight: 800 !important;
    font-size: 15px !important;
}

/* Hide duplicate page chrome when modern intros/filters exist */
.content-wrapper:has(.ded-student-filter) > .content-header h1 .pull-right {
    display: none !important;
}
.content-wrapper:has(.ded-page-intro) > .content-header {
    display: none !important;
}

/* Branded media modals (front office etc.) */
.modal-media-content {
    border: 0 !important;
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.28) !important;
}
.modal-media-header {
    background: linear-gradient(145deg, #0e1116, #1c2026) !important;
    border: 0 !important;
    color: #fff !important;
    padding: 16px 20px !important;
}
.modal-media-header .box-title,
.modal-media-header h4,
.modal-media-header .modal-title {
    color: #fff !important;
    font-weight: 800 !important;
    margin: 0;
}
.modal-media-header .close {
    color: #fff !important;
    opacity: 0.85;
    text-shadow: none;
}
.modal-media-header .close:hover {
    opacity: 1;
}
.modal-media-body {
    padding: 18px 20px !important;
    background: #fff;
}

/* Kill huge inline min-heights on short pages */
.content-wrapper[style*="min-height"] {
    min-height: auto !important;
}
body.fixed .content-wrapper {
    min-height: calc(100vh - 64px) !important;
}

/* iCheck / radio accents → brand red */
.icheckbox_flat-blue.checked,
.iradio_flat-blue.checked {
    background-color: var(--dt-red) !important;
    border-color: var(--dt-red) !important;
}
.content-wrapper .radio-primary input[type="radio"]:checked + label::before,
.content-wrapper .radio-primary input[type="radio"]:checked + label::after,
.content-wrapper .checkbox-primary input[type="checkbox"]:checked + label::before {
    border-color: var(--dt-red) !important;
    background-color: var(--dt-red) !important;
}
.content-wrapper .radio label::before,
.content-wrapper .checkbox label::before {
    border-radius: 50%;
}

/* Nested list sections inside one box */
.box .bordertop {
    border-top: 1px solid var(--dt-line) !important;
    margin-top: 4px;
}
.box .bordertop > .box-header {
    background: #f8fafc !important;
    border-bottom: 1px solid var(--dt-line) !important;
}
.box .bordertop .box-body {
    padding-top: 12px !important;
}
.box-body .table-responsive {
    border-top: 1px solid var(--dt-line);
    margin-top: 8px;
    padding-top: 8px;
}

/* Hide duplicate DataTables search when page already has criteria row */
.box.box-primary:has(> .box-body.row) .dataTables_wrapper > .dataTables_filter,
.box.box-info:has(> .box-body.row) .dataTables_wrapper > .dataTables_filter {
    display: none !important;
}

/* Generic modal polish */
.content-wrapper ~ .modal .modal-content,
.modal .modal-content {
    border-radius: 16px !important;
    border: 0 !important;
    overflow: hidden;
}
.modal .modal-header {
    border-bottom: 1px solid var(--dt-line) !important;
}
.modal .modal-footer {
    border-top: 1px solid var(--dt-line) !important;
    background: #f8f9fb;
}

/* Pagination / DataTables length select */
.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input {
    border: 1px solid #d5dae3 !important;
    border-radius: 10px !important;
    height: 36px !important;
    padding: 4px 10px !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--dt-red) !important;
    border-color: var(--dt-red) !important;
    color: #fff !important;
    border-radius: 8px !important;
}