/**
 * Nischinto Dark Premium — unique identity, no white surfaces
 */

body.up-premium {
    --up-bg: #070b12;
    --up-bg-mesh: radial-gradient(ellipse 80% 60% at 10% 20%, color-mix(in srgb, var(--up-accent) 8%, transparent), transparent),
                 radial-gradient(ellipse 60% 50% at 90% 80%, color-mix(in srgb, var(--up-glow) 6%, transparent), transparent),
                 #070b12;
    --up-surface: #111827;
    --up-surface-2: #1a2235;
    --up-surface-3: #222d42;
    --up-border: rgba(255, 255, 255, 0.07);
    --up-border-accent: color-mix(in srgb, var(--up-accent) 35%, transparent);
    --up-text: #e8edf5;
    --up-muted: #7a8ba3;
    --up-radius: 14px;
    --up-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
    --up-shadow-glow: 0 0 24px color-mix(in srgb, var(--up-glow) 25%, transparent);
    --pd-theme-from: var(--up-from);
    --pd-theme-to: var(--up-to);
    --pd-theme-accent: var(--up-accent);
    background: var(--up-bg-mesh) !important;
    color: var(--up-text) !important;
}

body.up-premium .tw-text-gray-900 { color: var(--up-text) !important; }
body.up-premium .tw-text-gray-600 { color: var(--up-muted) !important; }
body.up-premium .tw-text-gray-400 { color: var(--up-muted) !important; }
body.up-premium .tw-text-gray-500 { color: var(--up-muted) !important; }

html.up-html-dark,
body.up-premium html.up-html-dark {
    background: #070b12 !important;
}

body.up-premium .tw-bg-white,
body.up-premium .tw-bg-gray-100,
body.up-premium .tw-dw-bg-base-100 {
    background: var(--up-surface-2) !important;
}
body.up-premium main.tw-bg-transparent,
body.up-premium #scrollable-container {
    background: transparent !important;
}
body.up-premium .hover\:tw-bg-gray-100:hover,
body.up-premium .hover\:tw-bg-white\/60:hover {
    background: color-mix(in srgb, var(--up-accent) 12%, var(--up-surface-2)) !important;
    color: var(--up-text) !important;
}
body.up-premium .tw-ring-gray-200 {
    --tw-ring-color: var(--up-border) !important;
}

/* Scroll area */
body.up-premium #scrollable-container {
    background: transparent;
    scrollbar-width: thin;
    scrollbar-color: var(--up-accent) transparent;
}

/* ── Header ── */
body.up-premium .up-header {
    background: linear-gradient(135deg, var(--up-from) 0%, var(--up-mid) 45%, var(--up-to) 100%) !important;
    border-bottom: 1px solid var(--up-border-accent) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5), var(--up-shadow-glow);
    position: relative;
    z-index: 10;
}
body.up-premium .up-header::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--up-accent) 12%, transparent), transparent);
    animation: upShimmer 8s ease-in-out infinite;
    pointer-events: none;
}
@keyframes upShimmer {
    0%, 100% { opacity: 0.3; transform: translateX(-30%); }
    50% { opacity: 0.6; transform: translateX(30%); }
}
body.up-premium .up-header::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 20% 0%, color-mix(in srgb, var(--up-glow) 20%, transparent), transparent 60%);
    pointer-events: none;
}
body.up-premium .up-header > div { position: relative; z-index: 1; }

body.up-premium .up-header button,
body.up-premium .up-header summary,
body.up-premium .up-header a[class*="tw-inline-flex"],
body.up-premium .up-header a[class*="sm:tw-inline-flex"] {
    background: color-mix(in srgb, var(--up-accent) 18%, transparent) !important;
    border: 1px solid var(--up-border-accent) !important;
    backdrop-filter: blur(10px);
    border-radius: 10px !important;
    color: #fff !important;
    transition: all 0.25s ease !important;
}
body.up-premium .up-header button:hover,
body.up-premium .up-header summary:hover,
body.up-premium .up-header a[class*="tw-inline-flex"]:hover,
body.up-premium .up-header a[class*="sm:tw-inline-flex"]:hover {
    background: color-mix(in srgb, var(--up-accent) 32%, transparent) !important;
    box-shadow: var(--up-shadow-glow);
    transform: translateY(-1px);
}

/* Header dropdowns — dark glass */
body.up-premium .up-header .tw-dw-dropdown-content,
body.up-premium .up-header ul[role="menu"] {
    background: var(--up-surface-2) !important;
    border: 1px solid var(--up-border-accent) !important;
    box-shadow: var(--up-shadow), var(--up-shadow-glow) !important;
    backdrop-filter: blur(16px);
}
body.up-premium .up-header .tw-dw-dropdown-content a,
body.up-premium .up-header ul[role="menu"] a {
    color: var(--up-muted) !important;
    border-radius: 8px !important;
}
body.up-premium .up-header .tw-dw-dropdown-content a:hover,
body.up-premium .up-header ul[role="menu"] a:hover {
    background: color-mix(in srgb, var(--up-accent) 15%, transparent) !important;
    color: var(--up-text) !important;
}
body.up-premium .up-header .tw-dw-dropdown-content p,
body.up-premium .up-header ul[role="menu"] p {
    color: var(--up-muted) !important;
}

/* ── Sidebar — dark panel ── */
body.up-premium .up-sidebar {
    background: linear-gradient(180deg, var(--up-from) 0%, #0a0f18 100%) !important;
    border-right: 1px solid var(--up-border-accent) !important;
    box-shadow: 4px 0 30px rgba(0, 0, 0, 0.4);
    height: 100vh !important;
    max-height: 100vh !important;
    overflow: hidden !important;
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 50 !important;
    pointer-events: auto !important;
}
body.up-premium .up-sidebar-brand {
    background: linear-gradient(135deg, var(--up-mid), var(--up-to)) !important;
    border-bottom: 1px solid var(--up-border-accent) !important;
    box-shadow: 0 4px 20px color-mix(in srgb, var(--up-glow) 15%, transparent);
    flex-shrink: 0;
}
body.up-premium .up-sidebar-brand::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 70% 30%, color-mix(in srgb, var(--up-glow) 25%, transparent), transparent 65%);
    pointer-events: none;
}
body.up-premium .up-sidebar-brand .side-bar-heading {
    position: relative; z-index: 1;
    font-weight: 800 !important;
    text-shadow: 0 2px 8px rgba(0,0,0,.4);
}
body.up-premium #side-bar {
    background: transparent !important;
    border-color: var(--up-border) !important;
    scrollbar-color: var(--up-accent) transparent;
    scrollbar-width: thin;
    flex: 1 1 0 !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    position: relative;
    z-index: 2;
    pointer-events: auto !important;
}
body.up-premium #side-bar a,
body.up-premium #side-bar .drop_down,
body.up-premium #side-bar .up-nav-child {
    pointer-events: auto !important;
    cursor: pointer;
    position: relative;
    z-index: 3;
}
body.up-premium #side-bar::-webkit-scrollbar {
    width: 6px;
}
body.up-premium #side-bar::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--up-accent) 50%, transparent);
    border-radius: 999px;
}
body.up-premium #side-bar::-webkit-scrollbar-track {
    background: transparent;
}
body.up-premium .up-nav-child-line {
    background: var(--up-border-accent) !important;
}
body.up-premium .up-nav-dropdown-wrap.is-open > .drop_down .svg {
    color: var(--up-accent) !important;
}
body.up-premium .drop_down {
    cursor: pointer;
    user-select: none;
}
body.up-premium .drop_down .svg {
    color: var(--up-muted);
    transition: transform 0.2s ease, color 0.2s ease;
}

body.up-premium .up-nav-link {
    color: var(--up-muted) !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    border: 1px solid transparent;
    transition: all 0.22s ease !important;
}
body.up-premium .up-nav-link:hover {
    background: color-mix(in srgb, var(--up-accent) 12%, transparent) !important;
    color: var(--up-text) !important;
    border-color: var(--up-border);
}
body.up-premium .up-nav-link.is-active,
body.up-premium .up-nav-link.up-nav-active {
    background: color-mix(in srgb, var(--up-accent) 18%, transparent) !important;
    color: var(--up-accent) !important;
    border-color: var(--up-border-accent) !important;
    box-shadow: inset 3px 0 0 var(--up-accent), var(--up-shadow-glow);
}
body.up-premium .up-nav-header {
    color: color-mix(in srgb, var(--up-accent) 60%, var(--up-muted)) !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: 0.14em !important;
}
body.up-premium .up-nav-child { color: var(--up-muted) !important; }
body.up-premium .up-nav-child:hover,
body.up-premium .up-nav-child.is-active {
    color: var(--up-accent) !important;
    background: color-mix(in srgb, var(--up-accent) 10%, transparent);
}
body.up-premium #side-bar .tw-bg-gray-200 { background: var(--up-border) !important; }

/* Notifications & dropdown menus */
body.up-premium .dropdown-menu,
body.up-premium .up-header .dropdown-menu {
    background: var(--up-surface-2) !important;
    border: 1px solid var(--up-border-accent) !important;
    box-shadow: var(--up-shadow), var(--up-shadow-glow) !important;
    color: var(--up-muted) !important;
}
body.up-premium .dropdown-menu > li > a,
body.up-premium .notification-li {
    color: var(--up-muted) !important;
}
body.up-premium .dropdown-menu > li > a:hover,
body.up-premium .notification-li:hover {
    background: color-mix(in srgb, var(--up-accent) 12%, transparent) !important;
    color: var(--up-text) !important;
}
body.up-premium .dropdown-menu .divider {
    background: var(--up-border) !important;
}

/* Legacy sweetalert (extracss) */
body.up-premium .swal-modal {
    background: var(--up-surface) !important;
    color: var(--up-text) !important;
}
body.up-premium .swal-content__input,
body.up-premium .swal-content__textarea {
    background: var(--up-surface-2) !important;
    border-color: var(--up-border) !important;
    color: var(--up-text) !important;
}
body.up-premium .swal-title { color: var(--up-text) !important; }
body.up-premium .swal-text { color: var(--up-muted) !important; }

/* Daterangepicker & popovers */
body.up-premium .daterangepicker,
body.up-premium .popover {
    background: var(--up-surface-2) !important;
    border: 1px solid var(--up-border-accent) !important;
    color: var(--up-text) !important;
}
body.up-premium .daterangepicker .calendar-table {
    background: var(--up-surface) !important;
    border-color: var(--up-border) !important;
}
body.up-premium .daterangepicker td.off,
body.up-premium .daterangepicker td.off.in-range {
    background: var(--up-surface) !important;
    color: var(--up-muted) !important;
}
body.up-premium .daterangepicker td.active,
body.up-premium .daterangepicker td.active:hover {
    background: var(--up-accent) !important;
    color: #070b12 !important;
}

/* ── Footer ── */
body.up-premium .up-footer {
    background: linear-gradient(135deg, var(--up-from), var(--up-mid)) !important;
    border-top: 1px solid var(--up-border-accent) !important;
    padding: 18px 32px !important;
    box-shadow: 0 -4px 24px rgba(0,0,0,.3);
}
body.up-premium .up-footer p {
    color: color-mix(in srgb, var(--up-accent) 70%, #fff) !important;
    font-size: 12px !important;
    letter-spacing: 0.02em;
}

/* ── Inner pages — dark glass boxes ── */
body.up-premium #scrollable-container .box,
body.up-premium #scrollable-container .tw-bg-white,
body.up-premium #scrollable-container .tw-bg-white.tw-shadow-sm {
    background: var(--up-surface) !important;
    border-radius: var(--up-radius) !important;
    border: 1px solid var(--up-border) !important;
    box-shadow: var(--up-shadow) !important;
    color: var(--up-text) !important;
}
body.up-premium #scrollable-container .box-header,
body.up-premium #scrollable-container .box-footer {
    background: var(--up-surface-2) !important;
    border-color: var(--up-border) !important;
    color: var(--up-text) !important;
}
body.up-premium #scrollable-container .box-body {
    background: var(--up-surface) !important;
    color: var(--up-text) !important;
}
body.up-premium #scrollable-container .box-title {
    font-weight: 700 !important;
    color: var(--up-text) !important;
}
body.up-premium #scrollable-container .content-header h1,
body.up-premium #scrollable-container .content-header h3,
body.up-premium #scrollable-container .content-header h4 {
    color: var(--up-text) !important;
    font-weight: 800 !important;
}
body.up-premium #scrollable-container .breadcrumb > li,
body.up-premium #scrollable-container .breadcrumb > li > a {
    color: var(--up-muted) !important;
}
body.up-premium #scrollable-container .breadcrumb > .active {
    color: var(--up-accent) !important;
}

/* Buttons */
body.up-premium #scrollable-container .btn-primary,
body.up-premium #scrollable-container .tw-dw-btn-primary {
    background: linear-gradient(135deg, var(--up-mid), var(--up-accent)) !important;
    border: 1px solid var(--up-border-accent) !important;
    color: #fff !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    box-shadow: var(--up-shadow-glow);
}
body.up-premium #scrollable-container .btn-primary:hover {
    box-shadow: 0 0 32px color-mix(in srgb, var(--up-glow) 40%, transparent);
    transform: translateY(-1px);
}
body.up-premium #scrollable-container .btn-default,
body.up-premium #scrollable-container .btn-app {
    background: var(--up-surface-2) !important;
    border: 1px solid var(--up-border) !important;
    color: var(--up-muted) !important;
    border-radius: 10px !important;
}
body.up-premium #scrollable-container .btn-default:hover {
    background: var(--up-surface-3) !important;
    color: var(--up-text) !important;
    border-color: var(--up-border-accent) !important;
}

/* Forms */
body.up-premium #scrollable-container .form-control,
body.up-premium #scrollable-container select.form-control,
body.up-premium .select2-container--default .select2-selection--single {
    background: var(--up-surface-2) !important;
    border: 1px solid var(--up-border) !important;
    color: var(--up-text) !important;
    border-radius: 10px !important;
}
body.up-premium #scrollable-container .form-control:focus {
    border-color: var(--up-accent) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--up-accent) 20%, transparent) !important;
    background: var(--up-surface-3) !important;
}
body.up-premium #scrollable-container label,
body.up-premium #scrollable-container .control-label {
    color: var(--up-muted) !important;
}

/* Tables */
body.up-premium #scrollable-container table.table {
    color: var(--up-text) !important;
    background: var(--up-surface) !important;
}
body.up-premium #scrollable-container table.table thead th,
body.up-premium #scrollable-container .table-bordered > thead > tr > th {
    background: var(--up-surface-2) !important;
    color: var(--up-accent) !important;
    border-color: var(--up-border) !important;
    font-size: 11px !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
body.up-premium #scrollable-container table.table tbody td {
    border-color: var(--up-border) !important;
    background: var(--up-surface) !important;
}
body.up-premium #scrollable-container table.table-striped > tbody > tr:nth-of-type(odd) > td {
    background: var(--up-surface-2) !important;
}
body.up-premium #scrollable-container table.table tbody tr:hover td {
    background: color-mix(in srgb, var(--up-accent) 8%, var(--up-surface)) !important;
}
body.up-premium #scrollable-container .dataTables_wrapper {
    color: var(--up-muted) !important;
}
body.up-premium #scrollable-container .dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: var(--up-accent) !important;
    border-color: var(--up-accent) !important;
    color: #070b12 !important;
    border-radius: 8px !important;
    font-weight: 700;
}

/* Modals */
body.up-premium .modal-content {
    background: var(--up-surface) !important;
    border: 1px solid var(--up-border-accent) !important;
    border-radius: 18px !important;
    box-shadow: var(--up-shadow), var(--up-shadow-glow) !important;
    color: var(--up-text) !important;
}
body.up-premium .modal-header {
    background: linear-gradient(135deg, var(--up-from), var(--up-mid)) !important;
    border-bottom: 1px solid var(--up-border-accent) !important;
    color: #fff !important;
}
body.up-premium .modal-body { background: var(--up-surface) !important; color: var(--up-text) !important; }
body.up-premium .modal-footer {
    background: var(--up-surface-2) !important;
    border-top: 1px solid var(--up-border) !important;
}

/* Info boxes & widgets */
body.up-premium #scrollable-container .info-box,
body.up-premium #scrollable-container .info-box-new-style,
body.up-premium #scrollable-container .widget-box {
    background: var(--up-surface) !important;
    border: 1px solid var(--up-border) !important;
    box-shadow: var(--up-shadow) !important;
    color: var(--up-text) !important;
}
body.up-premium #scrollable-container .info-box-content { color: var(--up-text) !important; }
body.up-premium #scrollable-container .info-box-text { color: var(--up-muted) !important; }
body.up-premium #scrollable-container .nav-tabs-custom {
    background: var(--up-surface) !important;
    border: 1px solid var(--up-border) !important;
}
body.up-premium #scrollable-container .nav-tabs-custom > .nav-tabs > li > a {
    color: var(--up-muted) !important;
}
body.up-premium #scrollable-container .nav-tabs-custom > .nav-tabs > li.active {
    border-top-color: var(--up-accent) !important;
}
body.up-premium #scrollable-container .nav-tabs-custom > .nav-tabs > li.active > a {
    color: var(--up-accent) !important;
    background: var(--up-surface-2) !important;
}

/* Select2 dropdown */
body.up-premium .select2-dropdown {
    background: var(--up-surface-2) !important;
    border: 1px solid var(--up-border-accent) !important;
}
body.up-premium .select2-results__option { color: var(--up-muted) !important; }
body.up-premium .select2-results__option--highlighted {
    background: color-mix(in srgb, var(--up-accent) 20%, transparent) !important;
    color: var(--up-text) !important;
}

/* Scroll top */
body.up-premium .scrolltop .scroll {
    background: linear-gradient(135deg, var(--up-mid), var(--up-accent)) !important;
    border: 1px solid var(--up-border-accent);
    box-shadow: var(--up-shadow-glow) !important;
}

body.up-premium .overlay {
    backdrop-filter: blur(6px);
    background: rgba(0, 0, 0, 0.7) !important;
    z-index: 40;
    pointer-events: none;
}
body.up-premium .overlay.is-active {
    pointer-events: auto;
}
body.up-premium .swal2-popup {
    background: var(--up-surface) !important;
    border: 1px solid var(--up-border-accent) !important;
    color: var(--up-text) !important;
    border-radius: 18px !important;
}

/* ── Auth / Login — dark glass card ── */
body.up-auth-page {
    background: var(--up-bg-mesh, linear-gradient(135deg, #070b12, #0f1623)) !important;
    min-height: 100vh;
}
body.up-auth-page::before {
    content: '';
    position: fixed;
    inset: 0;
    background: radial-gradient(ellipse 70% 50% at 50% 0%, color-mix(in srgb, var(--up-accent) 15%, transparent), transparent),
                radial-gradient(circle, rgba(255,255,255,.03) 1px, transparent 1px);
    background-size: 100% 100%, 24px 24px;
    pointer-events: none;
}
body.up-auth-page .box,
body.up-auth-page .widget-box {
    background: color-mix(in srgb, var(--up-surface, #111827) 85%, transparent) !important;
    border: 1px solid color-mix(in srgb, var(--up-accent) 30%, transparent) !important;
    border-radius: 20px !important;
    box-shadow: 0 24px 64px rgba(0,0,0,.5), 0 0 40px color-mix(in srgb, var(--up-accent) 15%, transparent) !important;
    backdrop-filter: blur(20px);
    color: #e8edf5 !important;
}
body.up-auth-page .box-header,
body.up-auth-page .box-footer {
    background: color-mix(in srgb, var(--up-accent) 8%, #111827) !important;
    border-color: rgba(255,255,255,.07) !important;
    color: #e8edf5 !important;
}
body.up-auth-page .box-body { color: #c8d3e0 !important; }
body.up-auth-page .form-control {
    background: #1a2235 !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    color: #e8edf5 !important;
    border-radius: 12px !important;
}
body.up-auth-page .form-control:focus {
    border-color: var(--up-accent) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--up-accent) 20%, transparent) !important;
}
body.up-auth-page .btn-primary {
    background: linear-gradient(135deg, var(--up-mid, #162544), var(--up-accent, #4f8cff)) !important;
    border: 1px solid color-mix(in srgb, var(--up-accent) 50%, transparent) !important;
    box-shadow: 0 0 24px color-mix(in srgb, var(--up-accent) 30%, transparent);
    border-radius: 12px !important;
    font-weight: 700 !important;
}
body.up-auth-page .btn-app {
    background: #1a2235 !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    color: #c8d3e0 !important;
}

/* Auth layout overrides */
body.up-auth-page .right-col,
body.up-auth-page .up-auth-main {
    background: transparent !important;
    min-height: 100vh;
}
body.up-auth-page .up-auth-link {
    color: color-mix(in srgb, var(--up-accent) 75%, #fff) !important;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.2s ease;
}
body.up-auth-page .up-auth-link:hover {
    color: #fff !important;
}
body.up-auth-page .up-auth-register-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.45rem 1.1rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--up-accent) 45%, transparent);
    background: color-mix(in srgb, var(--up-accent) 15%, transparent);
    color: #fff !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s ease;
}
body.up-auth-page .up-auth-register-btn:hover {
    background: color-mix(in srgb, var(--up-accent) 28%, transparent);
    box-shadow: 0 0 20px color-mix(in srgb, var(--up-accent) 25%, transparent);
    color: #fff !important;
}

/* Login card */
body.up-auth-page .up-login-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 140px);
    padding: 1rem 0 2rem;
}
body.up-auth-page .up-login-card {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    padding: 2rem 1.75rem;
    border-radius: 22px;
    background: color-mix(in srgb, var(--up-surface, #111827) 88%, transparent);
    border: 1px solid color-mix(in srgb, var(--up-accent) 35%, transparent);
    box-shadow: 0 24px 64px rgba(0,0,0,.55), 0 0 48px color-mix(in srgb, var(--up-accent) 12%, transparent);
    backdrop-filter: blur(18px);
}
body.up-auth-page .up-login-card::before {
    content: '';
    display: block;
    height: 4px;
    border-radius: 999px;
    margin: -0.5rem auto 1.25rem;
    width: 56px;
    background: linear-gradient(90deg, var(--up-mid, #162544), var(--up-accent, #4f8cff));
    box-shadow: 0 0 16px color-mix(in srgb, var(--up-accent) 40%, transparent);
}
body.up-auth-page .up-login-title {
    color: #e8edf5 !important;
    font-size: 1.35rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em;
    text-align: center;
}
body.up-auth-page .up-login-subtitle {
    color: #7a8ba3 !important;
    font-size: 0.875rem;
    text-align: center;
    margin-top: 0.35rem;
}
body.up-auth-page .up-login-label {
    color: #9aa8bc !important;
    font-size: 0.8rem;
    font-weight: 600;
}
body.up-auth-page .up-login-input {
    width: 100%;
    height: 48px;
    padding: 0 0.9rem;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.1);
    background: #1a2235 !important;
    color: #e8edf5 !important;
    font-weight: 500;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
body.up-auth-page .up-login-input::placeholder {
    color: #6b7c93;
}
body.up-auth-page .up-login-input:focus {
    border-color: var(--up-accent) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--up-accent) 20%, transparent) !important;
}
body.up-auth-page .up-login-field {
    position: relative;
}
body.up-auth-page .up-login-forgot {
    color: var(--up-accent) !important;
    font-size: 0.78rem;
    font-weight: 600;
    text-decoration: none;
}
body.up-auth-page .up-login-forgot:hover {
    color: #fff !important;
    text-decoration: underline;
}
body.up-auth-page .up-login-remember {
    color: #9aa8bc !important;
    font-size: 0.82rem;
    font-weight: 500;
}
body.up-auth-page .up-login-btn {
    width: 100%;
    height: 48px;
    border: none;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--up-mid, #162544), var(--up-accent, #4f8cff)) !important;
    color: #fff !important;
    font-weight: 700;
    font-size: 0.95rem;
    box-shadow: 0 0 24px color-mix(in srgb, var(--up-accent) 30%, transparent);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
body.up-auth-page .up-login-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 0 32px color-mix(in srgb, var(--up-accent) 45%, transparent);
}
body.up-auth-page .up-login-footer-link {
    color: #7a8ba3 !important;
    font-size: 0.82rem;
    text-align: center;
}
body.up-auth-page .up-login-footer-link a {
    color: var(--up-accent) !important;
    font-weight: 700;
}
body.up-auth-page .show_hide_icon {
    position: absolute;
    top: 38px;
    right: 10px;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    color: #7a8ba3;
}
body.up-auth-page .show_hide_icon svg {
    stroke: #9aa8bc !important;
}
body.up-auth-page .up-login-demo {
    width: 100%;
    max-width: 720px;
    margin: 0 auto 1.5rem;
}