/* ==========================================================================
   Tilankhulane — admin (CMS) theme
   Loaded AFTER material-dashboard.css. Re-skins the Material Dashboard template
   with the public site's look: night/plum palette, coral accents,
   Playfair Display headings and Raleway body text.
   ========================================================================== */

:root {
  --night: #14041F;
  --plum: #1D0534;
  --plum-2: #2A1544;
  --plum-3: #3A2159;
  --plum-4: #4A2D6E;
  --pink: #FF5757;
  --pink-soft: #FF8A80;
  --pink-deep: #D63A3A;
  --pink-deeper: #BD2F2F;
  --amber: #FFB547;
  --cyan: #4FD1C5;
  --green: #3DBE8B;
  --text: #F6F0FA;
  --text-2: #D8CEE4;
  --text-3: #A597BA;
  --line: rgba(255, 255, 255, .12);
  --field: rgba(0, 0, 0, .25);
  --font-head: "Playfair Display", Georgia, serif;
  --font-body: "Raleway", "Helvetica Neue", Arial, sans-serif;
}

/* ---------- Base ---------- */
html, body { background: var(--plum) !important; }
body, .main-panel, .content, p, span, td, th, label, input, select, textarea, button, .btn, .dropdown-item, .nav-link, .card-description, .card-category {
  font-family: var(--font-body);
}
body { color: var(--text-2); }
h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .card-title, .modal-title, .title {
  font-family: var(--font-head) !important; color: var(--text) !important; font-weight: 700 !important;
}
h6, .h6 { font-family: var(--font-body); color: var(--text-3); letter-spacing: .14em; }
a { color: var(--pink-soft); }
a:hover, a:focus { color: #fff; }
hr { border-top-color: var(--line); }
.text-muted, small, .small { color: var(--text-3) !important; }
.text-primary { color: var(--pink-soft) !important; }
.text-danger { color: var(--pink) !important; }
.text-success { color: var(--green) !important; }
.text-info { color: var(--cyan) !important; }
.text-warning { color: var(--amber) !important; }
.text-dark, .text-black { color: var(--text) !important; }
::selection { background: var(--pink-deep); color: #fff; }
.main-panel > .content { margin-top: 70px; padding: 30px 15px; min-height: calc(100vh - 140px); }
.main-panel { background: var(--plum) !important; }

/* Scrollbars */
* { scrollbar-color: var(--plum-4) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--plum-4); border-radius: 10px; border: 2px solid var(--plum); }

/* ---------- Sidebar ---------- */
.sidebar, .sidebar[data-background-color="black"] {
  background: var(--night) !important;
  border-right: 1px solid var(--line);
  box-shadow: none !important;
}
.sidebar::after, .sidebar::before, .sidebar .sidebar-background { display: none !important; background: none !important; }
.sidebar .logo { padding: 18px 0 16px; text-align: center; }
.sidebar .logo::after { background: var(--line) !important; left: 20px !important; right: 20px !important; width: auto !important; }
.sidebar .logo a.logo-normal, .sidebar .logo a.logo-mini { display: block; padding: 0 !important; }
.sidebar .logo .logo-mini { display: none !important; }
.sidebar .logo .tlk-logo { height: 58px; width: auto; margin: 0 auto; display: block; }
.sidebar-mini .sidebar .logo .tlk-logo { height: 34px; }
.sidebar .sidebar-wrapper { background: transparent; }
.sidebar .user { padding-bottom: 16px; }
.sidebar .user::after { background: var(--line) !important; left: 20px !important; right: 20px !important; width: auto !important; }
.sidebar .user .photo { border: 2px solid var(--plum-4); }
.sidebar .user .user-info > a, .sidebar .user .user-info a span { color: var(--text) !important; font-weight: 600; }
.sidebar .nav { margin-top: 12px; }
.sidebar .nav li > a, .sidebar .nav li .dropdown-menu a {
  color: var(--text-2) !important; border-radius: 12px !important; margin: 4px 14px 0 !important;
  font-weight: 600; letter-spacing: .02em; transition: background .2s, color .2s;
}
.sidebar .nav li > a p { font-family: var(--font-body); font-weight: 600; text-transform: none; font-size: 14px; }
.sidebar .nav i, .sidebar .nav .sidebar-mini { color: var(--text-3) !important; }
.sidebar .nav li:not(.active) > a:hover, .sidebar .nav li:not(.active) > a:focus {
  background: rgba(255, 255, 255, .06) !important; color: #fff !important;
}
.sidebar .nav li.active > a, .sidebar[data-color] .nav li.active > a,
.sidebar .nav li.active > [data-toggle="collapse"] + div .nav li.active > a {
  background: var(--pink-deep) !important; color: #fff !important;
  box-shadow: 0 10px 24px -10px rgba(214, 58, 58, .8) !important;
}
.sidebar .nav li.active > a i, .sidebar .nav li.active > a .sidebar-mini { color: #fff !important; }
/* Parent of an active sub-page: subtle highlight only */
.sidebar .nav li.active > a[data-toggle="collapse"] {
  background: rgba(255, 255, 255, .06) !important; box-shadow: none !important;
}
.sidebar .nav li.active > a[data-toggle="collapse"] i { color: var(--pink-soft) !important; }
.sidebar .nav .collapse .nav li > a, .sidebar .nav .collapsing .nav li > a { margin-left: 28px !important; }
.sidebar .caret { border-top-color: var(--text-3); }
.tlk-viewsite {
  display: flex; align-items: center; gap: 10px; margin: 18px 14px 24px; padding: 12px 15px; border-radius: 12px;
  border: 1px dashed var(--line); color: var(--text-3) !important; font-size: 13px; font-weight: 600;
}
.tlk-viewsite:hover { border-color: var(--pink); color: #fff !important; }
.tlk-viewsite i { font-size: 18px; }

/* ---------- Top bar ---------- */
.main-panel > .navbar {
  background: rgba(29, 5, 52, .88) !important; backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line); box-shadow: none !important; min-height: 70px;
}
.navbar .navbar-brand { font-family: var(--font-head) !important; font-weight: 700; font-size: 20px !important; color: var(--text) !important; }
.navbar .navbar-nav .nav-link, .navbar .navbar-nav .nav-link i { color: var(--text-2) !important; }
.navbar .navbar-nav .nav-link:hover i { color: #fff !important; }
.navbar .navbar-toggler .icon-bar, .navbar .navbar-toggler .navbar-toggler-icon { background: var(--text) !important; }
.navbar-minimize .btn, .navbar-minimize .btn.btn-white {
  background: var(--plum-2) !important; color: var(--text) !important; border: 1px solid var(--line) !important; box-shadow: none !important;
}
.navbar-minimize .btn i { color: var(--text) !important; }
#SearchForm .input-group { background: var(--field); border: 1px solid var(--line); border-radius: 999px; padding: 0 4px 0 16px; align-items: center; }
#SearchForm .form-control { background: none !important; color: var(--text) !important; border: 0 !important; height: 40px; }
#SearchForm .form-control::placeholder { color: var(--text-3); }
#SearchForm .btn { background: var(--pink-deep) !important; box-shadow: none !important; width: 32px; height: 32px; min-width: 32px; margin: 4px 0 4px 6px !important; }
#SearchForm .btn i { color: #fff !important; }

/* Mobile off-canvas menu */
@media (max-width: 991px) {
  .navbar-collapse, .sidebar { background: var(--night) !important; }
  .nav-open .main-panel { background: var(--plum); }
  .close-layer { background: rgba(10, 2, 16, .6) !important; }
}

/* ---------- Cards ---------- */
.card {
  background: var(--plum-2) !important; color: var(--text-2) !important;
  border: 1px solid var(--line); border-radius: 20px !important;
  box-shadow: 0 18px 40px -24px rgba(0, 0, 0, .7) !important;
}
.card .card-body, .card .card-footer { color: var(--text-2); }
.card .card-footer { border-top: 1px solid var(--line) !important; }
.card .card-footer .stats, .card .card-footer .stats i { color: var(--text-3) !important; }
.card .card-category, .card-stats .card-header .card-category { color: var(--text-3) !important; font-weight: 600; }
.card .card-header { background: transparent; border-bottom: 0; }
.card-plain { background: transparent !important; border: 0; box-shadow: none !important; }

/* Coloured card headers -> brand gradients */
.card .card-header-primary:not(.card-header-icon):not(.card-header-text),
.card .card-header-rose:not(.card-header-icon):not(.card-header-text),
.card .card-header-danger:not(.card-header-icon):not(.card-header-text),
.card .card-header-info:not(.card-header-icon):not(.card-header-text),
.card .card-header-success:not(.card-header-icon):not(.card-header-text),
.card .card-header-warning:not(.card-header-icon):not(.card-header-text) {
  background: linear-gradient(135deg, var(--pink-deep), #7A1FA2) !important;
  box-shadow: 0 12px 24px -12px rgba(214, 58, 58, .6) !important; border-radius: 14px !important;
}
.card .card-header-info:not(.card-header-icon):not(.card-header-text) { background: linear-gradient(135deg, #2E9C94, #3B3B98) !important; box-shadow: 0 12px 24px -12px rgba(46, 156, 148, .6) !important; }
.card .card-header-success:not(.card-header-icon):not(.card-header-text) { background: linear-gradient(135deg, #2F9E6F, #1F6E62) !important; box-shadow: 0 12px 24px -12px rgba(47, 158, 111, .6) !important; }
.card .card-header-warning:not(.card-header-icon):not(.card-header-text) { background: linear-gradient(135deg, #E08A1E, var(--pink-deep)) !important; }
.card [class*="card-header-"]:not(.card-header-icon) .card-title,
.card [class*="card-header-"]:not(.card-header-icon) .card-category,
.card [class*="card-header-"]:not(.card-header-icon) p,
.card [class*="card-header-"]:not(.card-header-icon) a { color: #fff !important; }

/* Icon card headers (dashboard stats etc.) */
.card .card-header.card-header-icon .card-icon, .card .card-header.card-header-text .card-text {
  border-radius: 16px !important; box-shadow: 0 12px 24px -12px rgba(0, 0, 0, .6) !important;
  background: linear-gradient(135deg, var(--pink-deep), #7A1FA2) !important;
}
.card .card-header-success.card-header-icon .card-icon, .card .card-header-success.card-header-text .card-text { background: linear-gradient(135deg, #2F9E6F, #1F6E62) !important; }
.card .card-header-info.card-header-icon .card-icon, .card .card-header-info.card-header-text .card-text { background: linear-gradient(135deg, #2E9C94, #3B3B98) !important; }
.card .card-header-warning.card-header-icon .card-icon, .card .card-header-warning.card-header-text .card-text { background: linear-gradient(135deg, var(--amber), #E0691E) !important; }
.card .card-header-icon .card-icon i { color: #fff !important; }
.card-stats .card-header .card-title { font-size: 34px !important; }
.card .card-header-icon .card-title, .card .card-header-text .card-title { color: var(--text) !important; }

/* Tabs / pills inside cards */
.nav-pills .nav-item .nav-link, .nav-tabs .nav-item .nav-link { color: var(--text-2) !important; border-radius: 999px !important; background: rgba(255,255,255,.05); font-weight: 600; }
.nav-pills .nav-item .nav-link.active, .nav-pills.nav-pills-rose .nav-item .nav-link.active, .nav-pills.nav-pills-primary .nav-item .nav-link.active,
.nav-tabs .nav-item .nav-link.active, .card [class*="card-header-"] .nav-tabs .nav-item .nav-link.active {
  background: var(--pink-deep) !important; color: #fff !important; box-shadow: none !important;
}
.nav-tabs { border: 0 !important; background: transparent; }
.tab-content { color: var(--text-2); }

/* ---------- Buttons ---------- */
.btn {
  border-radius: 999px !important; font-weight: 700 !important; letter-spacing: .1em; text-transform: uppercase;
  box-shadow: none !important; transition: background .2s, transform .2s !important;
}
.btn:not(.btn-link):not(.btn-just-icon):hover { transform: translateY(-1px); }
.btn.btn-primary, .btn.btn-rose, .btn.btn-danger:not(.btn-link) { background: var(--pink-deep) !important; border-color: var(--pink-deep) !important; color: #fff !important; }
.btn.btn-primary:hover, .btn.btn-rose:hover, .btn.btn-danger:not(.btn-link):hover { background: var(--pink-deeper) !important; }
.btn.btn-success:not(.btn-link) { background: #2F9E6F !important; border-color: #2F9E6F !important; color: #fff !important; }
.btn.btn-info:not(.btn-link) { background: #2E8C85 !important; border-color: #2E8C85 !important; color: #fff !important; }
.btn.btn-warning:not(.btn-link) { background: var(--amber) !important; border-color: var(--amber) !important; color: var(--night) !important; }
.btn.btn-default:not(.btn-link), .btn.btn-secondary:not(.btn-link), .btn.btn-white:not(.btn-link) {
  background: rgba(255, 255, 255, .08) !important; border: 1px solid var(--line) !important; color: var(--text) !important;
}
.btn.btn-default:not(.btn-link):hover, .btn.btn-secondary:not(.btn-link):hover { background: rgba(255, 255, 255, .14) !important; }
.btn.btn-link { background: transparent !important; color: var(--text-2) !important; }
.btn.btn-link.btn-danger, .btn.btn-link.btn-rose, .btn.btn-link.btn-primary { color: var(--pink-soft) !important; }
.btn.btn-link.btn-info { color: var(--cyan) !important; }
.btn.btn-link.btn-success { color: var(--green) !important; }
.btn.btn-link:hover { color: #fff !important; background: rgba(255, 255, 255, .06) !important; }
.btn .material-icons, .btn i { color: inherit; }
.btn:focus, .btn.focus { outline: 2px solid var(--pink); outline-offset: 2px; }

/* ---------- Forms ---------- */
.form-control, .form-group .form-control, .bmd-form-group .form-control, select.form-control, textarea.form-control,
.input-group .form-control, .custom-select {
  background: var(--field) !important; background-image: none !important;
  border: 1px solid var(--line) !important; border-radius: 12px !important;
  color: var(--text) !important; padding: 10px 14px !important; height: auto !important; min-height: 44px;
  transition: border-color .2s, box-shadow .2s;
}
.form-control:focus, .is-focused .form-control {
  border-color: var(--pink) !important; box-shadow: 0 0 0 3px rgba(255, 87, 87, .2) !important; background: rgba(0,0,0,.35) !important;
}
.form-control::placeholder { color: rgba(255, 255, 255, .45) !important; }
.form-control[readonly], .form-control:disabled { background: rgba(255, 255, 255, .04) !important; color: var(--text-3) !important; }
select.form-control option, .custom-select option { background: var(--plum-2); color: var(--text); }
textarea.form-control { min-height: 110px; }
label, .bmd-label-floating, .bmd-label-static, .bmd-label-placeholder, .col-form-label, .form-control-label, .label-control {
  color: var(--text-3) !important; font-weight: 600 !important; font-size: 13px !important; letter-spacing: .04em;
}
/* Floating labels were designed for underline inputs; with boxed fields they sit above the field instead */
.bmd-form-group { padding-top: 0 !important; }
form .form-group select.form-control, form .form-group label[for="inputState"] { position: static !important; top: auto !important; }
.form-group > label, .bmd-form-group > label, .form-group > .control-label {
  position: static !important; transform: none !important; display: block; margin: 0 0 6px !important; line-height: 1.3 !important;
}
.bmd-form-group .bmd-label-floating, .bmd-form-group .bmd-label-placeholder, .bmd-form-group .bmd-label-static,
.bmd-form-group.is-filled .bmd-label-floating, .bmd-form-group.is-focused .bmd-label-floating {
  position: static !important; transform: none !important; display: block; margin: 0 0 6px !important; font-size: 12px !important; line-height: 1.3 !important;
}
.bmd-form-group.is-focused .bmd-label-floating { color: var(--pink-soft) !important; }
.is-focused [class^='bmd-label'], .is-focused [class*=' bmd-label'] { color: var(--pink-soft) !important; }
.form-group { margin-bottom: 18px; }
.input-group-text, .input-group-prepend .input-group-text { background: transparent !important; border: 0 !important; color: var(--text-3) !important; }
.form-check .form-check-sign .check { border-color: var(--text-3) !important; }
.form-check .form-check-input:checked + .form-check-sign .check { background: var(--pink-deep) !important; border-color: var(--pink-deep) !important; }
.form-check .form-check-label { color: var(--text-2) !important; }
.togglebutton label input[type=checkbox]:checked + .toggle { background-color: rgba(255, 87, 87, .5) !important; }
.togglebutton label input[type=checkbox]:checked + .toggle:after { border-color: var(--pink) !important; }
input[type="file"] { color: var(--text-2); }
input[type="file"]::file-selector-button {
  background: rgba(255, 255, 255, .08); border: 1px solid var(--line); color: var(--text); border-radius: 999px;
  padding: 8px 16px; margin-right: 12px; cursor: pointer; font-weight: 600;
}
.fileinput .thumbnail { background: var(--field); border: 1px solid var(--line); border-radius: 14px; box-shadow: none; }
.bootstrap-select .dropdown-toggle { background: var(--field) !important; color: var(--text) !important; border: 1px solid var(--line) !important; }

/* ---------- Tables ---------- */
.table, .table td, .table th, .dataTable td, .dataTable th { color: var(--text-2) !important; border-color: var(--line) !important; }
.table thead th, .table > thead > tr > th, .dataTable thead th, .dataTable-table thead th {
  color: var(--text-3) !important; font-family: var(--font-body); font-weight: 700 !important; font-size: 12px !important;
  text-transform: uppercase; letter-spacing: .12em; border-bottom: 1px solid var(--line) !important;
}
.table-striped tbody tr:nth-of-type(odd) { background: rgba(255, 255, 255, .03) !important; }
.table-hover tbody tr:hover, .table tbody tr:hover { background: rgba(255, 255, 255, .05) !important; }
.table .td-actions .btn { margin: 0 2px; }
.table img { border-radius: 10px; }
/* simple-datatables */
.dataTable-wrapper .dataTable-top, .dataTable-wrapper .dataTable-bottom { color: var(--text-3); }
.dataTable-input, .dataTable-selector {
  background: var(--field) !important; border: 1px solid var(--line) !important; color: var(--text) !important; border-radius: 999px !important; padding: 8px 14px !important;
}
.dataTable-sorter::before { border-top-color: var(--text-3) !important; }
.dataTable-sorter::after { border-bottom-color: var(--text-3) !important; }
.dataTable-pagination a { color: var(--text-2) !important; border-radius: 999px !important; }
.dataTable-pagination a:hover { background: rgba(255, 255, 255, .08) !important; }
.dataTable-pagination .active a, .dataTable-pagination .active a:hover { background: var(--pink-deep) !important; color: #fff !important; }
.dataTable-info { color: var(--text-3) !important; }
/* jQuery DataTables */
.dataTables_wrapper, .dataTables_wrapper label, .dataTables_info { color: var(--text-3) !important; }
.dataTables_wrapper .form-control { min-height: 36px; }
.page-item .page-link { background: transparent !important; color: var(--text-2) !important; border: 0 !important; border-radius: 999px !important; }
.page-item.active .page-link { background: var(--pink-deep) !important; color: #fff !important; box-shadow: none !important; }
.page-item.disabled .page-link { color: var(--text-3) !important; opacity: .5; }

/* ---------- Breadcrumbs, badges, alerts ---------- */
.breadcrumb { background: transparent !important; padding: 0 !important; margin-bottom: 18px; }
.breadcrumb-item, .breadcrumb-item a { color: var(--text-3) !important; font-weight: 600; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
.breadcrumb-item a:hover { color: #fff !important; }
.breadcrumb-item.active { color: var(--pink-soft) !important; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--plum-4) !important; }
.badge { border-radius: 999px; font-weight: 700; letter-spacing: .06em; padding: 5px 10px; }
.badge-primary, .badge-rose, .badge-danger { background: var(--pink-deep) !important; color: #fff !important; }
.badge-success { background: #2F9E6F !important; }
.badge-info { background: #2E8C85 !important; }
.badge-warning { background: var(--amber) !important; color: var(--night) !important; }
.badge-default, .badge-secondary { background: var(--plum-4) !important; color: var(--text) !important; }
.alert { border-radius: 14px !important; border: 1px solid var(--line); box-shadow: none !important; color: #fff !important; }
.alert.alert-success { background: rgba(47, 158, 111, .22) !important; border-color: rgba(47, 158, 111, .5); }
.alert.alert-danger { background: rgba(214, 58, 58, .22) !important; border-color: rgba(214, 58, 58, .55); }
.alert.alert-warning { background: rgba(255, 181, 71, .18) !important; border-color: rgba(255, 181, 71, .5); }
.alert.alert-info, .alert.alert-primary { background: rgba(79, 209, 197, .16) !important; border-color: rgba(79, 209, 197, .45); }

/* ---------- Dropdowns ---------- */
.dropdown-menu { background: var(--plum-2) !important; border: 1px solid var(--line) !important; border-radius: 14px !important; box-shadow: 0 20px 40px rgba(0, 0, 0, .5) !important; }
.dropdown-menu .dropdown-item, .dropdown-menu a { color: var(--text-2) !important; border-radius: 10px; }
.dropdown-menu .dropdown-item:hover, .dropdown-menu .dropdown-item:focus, .dropdown-menu a:hover {
  background: var(--pink-deep) !important; color: #fff !important; box-shadow: none !important;
}
.dropdown-divider { border-top-color: var(--line) !important; }

/* ---------- Modals ---------- */
.modal-content { background: var(--plum-2) !important; color: var(--text-2) !important; border: 1px solid var(--line) !important; border-radius: 20px !important; box-shadow: 0 30px 80px rgba(0, 0, 0, .6) !important; }
.modal-header { border-bottom: 1px solid var(--line) !important; padding: 20px 24px 16px !important; }
.modal-footer { border-top: 1px solid var(--line) !important; padding: 16px 24px !important; }
.modal-body { padding: 20px 24px !important; }
.modal-header .close, .modal-header .close i { color: var(--text-2) !important; opacity: 1; text-shadow: none; }
.modal-backdrop.show { background: #0A0210; opacity: .75 !important; }

/* ---------- Plugins ---------- */
/* SweetAlert2 */
.swal2-popup { background: var(--plum-2) !important; color: var(--text-2) !important; border: 1px solid var(--line); border-radius: 20px !important; }
.swal2-title { color: var(--text) !important; font-family: var(--font-head) !important; }
.swal2-content, .swal2-html-container { color: var(--text-2) !important; }
.swal2-styled.swal2-confirm { background: var(--pink-deep) !important; border-radius: 999px !important; }
/* Bootstrap-notify */
.alert[data-notify] { background: var(--plum-3) !important; }
/* TinyMCE / Summernote chrome (editing area itself stays white for true-to-print editing) */
.tox-tinymce { border-radius: 14px !important; border-color: var(--line) !important; }
.note-editor.note-frame { border-color: var(--line) !important; border-radius: 14px; overflow: hidden; }
/* Charts */
.ct-label { color: var(--text-3) !important; fill: var(--text-3) !important; }
.ct-grid { stroke: var(--line) !important; }
/* FullCalendar */
.fc-unthemed th, .fc-unthemed td, .fc-unthemed thead, .fc-unthemed tbody, .fc-unthemed .fc-divider, .fc-unthemed .fc-row, .fc-unthemed .fc-popover { border-color: var(--line) !important; }
.fc-unthemed .fc-today { background: rgba(255, 87, 87, .12) !important; }
.fc-toolbar h2 { color: var(--text) !important; }
/* Rich text rendered from the CMS inside cards */
.card-body span[style], .card-body p[style], .card-body font { color: inherit !important; background: transparent !important; font-family: inherit !important; }
.card-body img { max-width: 100%; height: auto; border-radius: 12px; }

/* Audio players in the CMS */
audio { width: 100%; border-radius: 999px; background: var(--field) !important; border: 1px solid var(--line) !important; color-scheme: dark; }

/* ---------- Footer ---------- */
.main-panel > .footer { border-top: 1px solid var(--line); background: transparent; }
.footer, .footer a, .footer .copyright { color: var(--text-3) !important; }
.footer a:hover { color: #fff !important; }
.footer .copyright i { color: var(--pink) !important; }

/* ---------- Auth pages (login, password reset, session expired) ---------- */
.off-canvas-sidebar .wrapper-full-page .page-header, .page-header.login-page, .page-header.lock-page, .page-header.header-filter {
  background-image:
    linear-gradient(180deg, rgba(29, 5, 52, .8), rgba(20, 4, 31, .94)),
    url("../../../assets/img/logo/hero_bg_3.jpg") !important;
  background-size: cover !important; background-position: center !important;
}
.page-header.header-filter::before, .page-header.header-filter::after { background: none !important; }
.off-canvas-sidebar .navbar, .off-canvas-sidebar .navbar .navbar-brand, .off-canvas-sidebar .navbar .nav-link { color: var(--text) !important; }
.login-page .container, .lock-page .container { padding-top: 12vh; }
.login-page .container::before, .lock-page .container::before {
  content: ""; display: block; height: 96px; margin: 0 auto 28px; max-width: 220px;
  background: url("../../../assets/img/logo/logo2.png") center / contain no-repeat;
}
.card-login, .card-lock, .login-page .card, .lock-page .card {
  background: rgba(42, 21, 68, .92) !important; backdrop-filter: blur(10px); border-radius: 24px !important; padding: 8px 6px 18px;
}
.card-login .card-header, .login-page .card .card-header {
  margin: -24px 24px 8px !important;
}
.card-login .card-title, .login-page .card .card-title { font-size: 26px !important; }
.card-login .card-description, .login-page .card-description, .login-page p { color: var(--text-2) !important; }
.card-login .input-group { background: var(--field); border: 1px solid var(--line); border-radius: 14px; padding-left: 4px; margin-top: 12px; }
.card-login .input-group .form-control { background: transparent !important; border: 0 !important; box-shadow: none !important; }
.card-login .input-group:focus-within { border-color: var(--pink); box-shadow: 0 0 0 3px rgba(255, 87, 87, .2); }
.card-login .card-footer { border-top: 0 !important; }
.card-login .btn.btn-link.btn-rose, .card-login input.btn-rose {
  background: var(--pink-deep) !important; color: #fff !important; padding: 12px 36px !important; font-size: 13px !important;
}
.card-login a.btn.btn-link.btn-info, .login-page a.btn-link { color: var(--text-3) !important; font-size: 12px !important; display: block; margin: 0 auto; }
.login-page .footer, .lock-page .footer { position: absolute; bottom: 0; width: 100%; border-top: 0; }
.login-page .footer .container::before, .lock-page .footer .container::before { display: none; }
.login-page .footer .container, .lock-page .footer .container { padding-top: 0; }

/* ---------- Misc template leftovers ---------- */
.fixed-plugin { display: none !important; }
.card .card-body .card-actions .btn { color: var(--text-3) !important; }
.img-raised, .img-thumbnail { background: var(--plum-3); border-color: var(--line); }
.card-profile .card-avatar { border: 4px solid var(--plum-2); box-shadow: 0 16px 38px -12px rgba(0, 0, 0, .6) !important; }
.card-profile .card-category, .card-profile .card-description { color: var(--text-3) !important; }
.list-group-item { background: transparent !important; color: var(--text-2) !important; border-color: var(--line) !important; }
.progress { background: rgba(255, 255, 255, .08) !important; border-radius: 999px; }
.progress .progress-bar { background: var(--pink-deep) !important; }
.tooltip-inner { background: var(--night); color: var(--text); border: 1px solid var(--line); }
.popover { background: var(--plum-2); border-color: var(--line); }
.popover .popover-header { background: var(--plum-3); color: var(--text); border-color: var(--line); }
.popover .popover-body { color: var(--text-2); }
code, pre { background: rgba(0, 0, 0, .3); color: var(--pink-soft); border-radius: 8px; }

/* ---------- Resumable audio uploader ---------- */
.tlk-up { margin-top: 10px; }
.tlk-up-bar { height: 8px; border-radius: 999px; background: rgba(255,255,255,.1); overflow: hidden; }
.tlk-up-fill { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--pink-deep), var(--amber)); transition: width .2s ease; }
.tlk-up-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 8px; flex-wrap: wrap; }
.tlk-up-status { font-size: 13px; color: var(--text-2); }
.tlk-up-status.tlk-up-ok { color: var(--green); font-weight: 600; }
.tlk-up-status.tlk-up-warn { color: var(--amber); font-weight: 600; }
.tlk-up-actions .btn { margin: 0; }
.tlk-file { color: var(--text-2); font-size: 13px; }
.tlk-up-resume .notice { font-size: 13px; }
.tlk-up-resume a { color: var(--pink-soft); text-decoration: underline; }
.tlk-up .notice { padding: 10px 14px; border-radius: 12px; background: rgba(255,181,71,.14); border: 1px solid rgba(255,181,71,.45); color: #FFE3B5; }

/* ---------- Episode "listen elsewhere" link repeater ---------- */
.tlk-links { margin: 8px 0 18px; }
.tlk-links-title { display: block; font-weight: 600; margin-bottom: 10px; }
.tlk-links-title span { display: block; font-weight: 400; font-size: 12px; color: var(--text-3); margin-top: 2px; }
.tlk-link-row { display: grid; grid-template-columns: 180px 1fr 1fr auto; gap: 8px; align-items: center; margin-bottom: 8px; }
.tlk-link-row .form-control { min-height: 42px; margin: 0; }
.tlk-link-row .tlk-link-remove { width: 42px; height: 42px; padding: 0; border-radius: 50% !important; line-height: 1; font-size: 20px; }
@media (max-width: 700px) { .tlk-link-row { grid-template-columns: 1fr 1fr; } .tlk-link-row .tlk-link-remove { grid-column: 2; justify-self: end; } }