/* =============================================================================
 * Renter Admin — Industrial Dark Theme
 * Loaded AFTER app.css so it cascades on top of Bootstrap + Material Dashboard.
 * scope: login + OTP. Phases 2–4 will extend the same tokens.
 * ============================================================================= */

:root {
 /* Base — charcoal / graphite / gunmetal / steel */
 --rt-bg-0: #0a0c10; /* page background */
 --rt-bg-1: #12161d; /* panel, card, sidebar */
 --rt-bg-2: #1a1f28; /* elevated surface, hover */
 --rt-bg-3: #232932; /* borders, dividers */
 --rt-fg-0: #e8ebf0; /* primary text */
 --rt-fg-1: #9aa3b2; /* secondary text */
 --rt-fg-2: #5c6473; /* disabled, captions */

 /* Accents — sparse, intentional */
 --rt-accent-blue: #2a8bff;
 --rt-accent-green: #2dd4a4;
 --rt-accent-amber: #ffb347;
 --rt-accent-red: #ff4d5a;

 /* Brand hold-over */
 --rt-brand: #2049ee;

 /* Typography */
 --rt-font-body: "Cairo", system-ui, -apple-system, sans-serif;
 --rt-font-mono: "Menlo", "Monaco", "Consolas", monospace;
}

/* =============================================================================
 * Auth shell (login + OTP)
 * ============================================================================= */

body.rt-auth {
 background: var(--rt-bg-0);
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 min-height: 100vh;
 margin: 0;
 /* Subtle blueprint grid — industrial atmosphere without distraction */
 background-image:
 linear-gradient(rgba(42, 139, 255, 0.025) 1px, transparent 1px),
 linear-gradient(90deg, rgba(42, 139, 255, 0.025) 1px, transparent 1px);
 background-size: 32px 32px;
 background-position: -1px -1px;
}

body.rt-auth #app {
 min-height: 100vh;
 display: flex;
 align-items: center;
 justify-content: center;
 padding: 24px;
}

.rt-auth-shell {
 width: 100%;
 max-width: 440px;
 display: flex;
 flex-direction: column;
 align-items: stretch;
 gap: 24px;
}

.rt-auth-brand {
 display: flex;
 justify-content: center;
 margin-bottom: 8px;
}

/* Force the brand SVG to render monochrome white in dark mode */
.rt-auth-brand svg path {
 fill: var(--rt-fg-0) !important;
}

.rt-auth-card {
 background: var(--rt-bg-1);
 border: 1px solid var(--rt-bg-3);
 border-radius: 4px;
 padding: 36px 32px 28px;
 position: relative;
}

/* Confidential-mode top strip — industrial alarm bar */
.rt-auth-card::before {
 content: "";
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 height: 2px;
 background: linear-gradient(
 90deg,
 var(--rt-accent-blue) 0%,
 var(--rt-accent-blue) 50%,
 var(--rt-accent-green) 100%
 );
 border-top-left-radius: 4px;
 border-top-right-radius: 4px;
}

.rt-auth-lock {
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 8px;
 color: var(--rt-fg-1);
 font-size: 11px;
 font-weight: 600;
 letter-spacing: 0.16em;
 text-transform: uppercase;
 margin-bottom: 20px;
}

.rt-auth-lock svg {
 width: 14px;
 height: 14px;
}

.rt-auth-heading {
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 font-size: 26px;
 font-weight: 700;
 line-height: 1.2;
 letter-spacing: -0.01em;
 margin: 0 0 6px 0;
 text-align: center;
}

.rt-auth-subheading {
 color: var(--rt-fg-1);
 font-size: 14px;
 font-weight: 400;
 line-height: 1.5;
 text-align: center;
 margin-bottom: 28px;
}

/* =============================================================================
 * Form fields
 * ============================================================================= */

.rt-field {
 margin-bottom: 18px;
}

.rt-field-label {
 display: block;
 color: var(--rt-fg-1);
 font-size: 11px;
 font-weight: 600;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 margin-bottom: 8px;
}

.rt-field-wrap {
 display: flex;
 align-items: center;
 gap: 10px;
 background: var(--rt-bg-2);
 border: 1px solid var(--rt-bg-3);
 border-radius: 4px;
 padding: 12px 14px;
 transition:
 border-color 120ms ease,
 background 120ms ease;
}

.rt-field-wrap:focus-within {
 border-color: var(--rt-accent-blue);
 background: var(--rt-bg-1);
}

.rt-field-input,
.rt-field-input.form-control,
input.rt-field-input.login-input {
 flex: 1;
 background: transparent !important;
 border: none !important;
 outline: none !important;
 box-shadow: none !important;
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-body);
 font-size: 15px;
 font-weight: 500;
 padding: 0 !important;
 height: auto !important;
 margin: 0;
}

.rt-field-input::placeholder {
 color: var(--rt-fg-2);
 font-weight: 400;
}

.rt-field-icon {
 color: var(--rt-fg-2);
 flex-shrink: 0;
 display: flex;
 align-items: center;
}

.rt-field-icon svg {
 width: 18px;
 height: 18px;
}

.rt-field-error {
 color: var(--rt-accent-red);
 font-size: 12px;
 font-weight: 500;
 margin-top: 6px;
 display: block;
}

/* =============================================================================
 * Buttons
 * ============================================================================= */

.rt-btn-primary {
 width: 100%;
 background: var(--rt-accent-blue);
 color: #fff;
 border: 1px solid var(--rt-accent-blue);
 border-radius: 4px;
 padding: 13px 16px;
 font-family: var(--rt-font-body);
 font-size: 14px;
 font-weight: 700;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 cursor: pointer;
 transition:
 background 120ms ease,
 transform 80ms ease;
 appearance: none;
 -webkit-appearance: none;
}

.rt-btn-primary:hover {
 background: #1a78e8;
}

.rt-btn-primary:active {
 transform: translateY(1px);
}

.rt-btn-primary:disabled {
 background: var(--rt-bg-3);
 border-color: var(--rt-bg-3);
 color: var(--rt-fg-2);
 cursor: not-allowed;
}

/* =============================================================================
 * Auth meta row (back link + resend)
 * ============================================================================= */

.rt-auth-meta {
 display: flex;
 justify-content: space-between;
 align-items: center;
 margin: 14px 0 20px;
}

.rt-auth-link {
 color: var(--rt-fg-1);
 font-size: 13px;
 font-weight: 500;
 text-decoration: none;
 background: none;
 border: none;
 padding: 0;
 cursor: pointer;
 font-family: var(--rt-font-body);
}

.rt-auth-link:hover {
 color: var(--rt-fg-0);
 text-decoration: none;
}

.rt-auth-link.rt-accent {
 color: var(--rt-accent-blue);
}

.rt-auth-link:disabled {
 color: var(--rt-fg-2);
 cursor: not-allowed;
}

/* =============================================================================
 * OTP — 4 separate digit boxes
 * ============================================================================= */

.rt-otp-row {
 display: flex;
 justify-content: center;
 gap: 12px;
 margin-bottom: 8px;
}

.rt-otp-digit {
 width: 60px;
 height: 68px;
 background: var(--rt-bg-2);
 border: 1px solid var(--rt-bg-3);
 border-radius: 4px;
 color: var(--rt-fg-0);
 font-family: var(--rt-font-mono);
 font-size: 28px;
 font-weight: 700;
 text-align: center;
 outline: none;
 transition:
 border-color 120ms ease,
 background 120ms ease;
}

.rt-otp-digit:focus {
 border-color: var(--rt-accent-blue);
 background: var(--rt-bg-1);
}

.rt-otp-digit.rt-filled {
 border-color: var(--rt-accent-green);
}

.rt-otp-phone {
 background: var(--rt-bg-2);
 border: 1px solid var(--rt-bg-3);
 border-radius: 4px;
 padding: 12px 14px;
 margin-bottom: 24px;
 text-align: center;
}

.rt-otp-phone-label {
 color: var(--rt-fg-1);
 font-size: 10px;
 font-weight: 600;
 letter-spacing: 0.16em;
 text-transform: uppercase;
 margin-bottom: 4px;
}

.rt-otp-phone-number {
 color: var(--rt-fg-0);
 font-family: var(--rt-font-mono);
 font-size: 16px;
 font-weight: 600;
 letter-spacing: 0.08em;
}

/* =============================================================================
 * Footer strip — system status / build / session identifier
 * Adds the "operations terminal" vibe.
 * ============================================================================= */

.rt-auth-footer {
 display: flex;
 justify-content: space-between;
 align-items: center;
 color: var(--rt-fg-2);
 font-family: var(--rt-font-mono);
 font-size: 10px;
 font-weight: 500;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 padding: 0 4px;
}

.rt-auth-footer-status {
 display: flex;
 align-items: center;
 gap: 6px;
}

.rt-auth-footer-status::before {
 content: "";
 width: 6px;
 height: 6px;
 border-radius: 50%;
 background: var(--rt-accent-green);
 box-shadow: 0 0 8px var(--rt-accent-green);
}

/* =============================================================================
 * Error alert
 * ============================================================================= */

.rt-alert-error {
 background: rgba(255, 77, 90, 0.08);
 border: 1px solid rgba(255, 77, 90, 0.3);
 border-left: 3px solid var(--rt-accent-red);
 border-radius: 4px;
 padding: 10px 14px;
 margin-bottom: 16px;
 color: var(--rt-fg-0);
 font-size: 13px;
}

.rt-alert-error ul {
 margin: 0;
 padding-left: 16px;
}

/* =============================================================================
 * Admin shell (body, content, sidebar, navbar, footer)
 * Scope: body.rt-admin namespace. The existing `.dark-mode` classes from
 * app-extension.css continue to apply; these rules cascade on top.
 * The spinner (#spinner-container / .spinner-admin in app.css ~31613) is
 * intentionally NOT touched — user requirement.
 * ============================================================================= */

body.rt-admin {
 background: var(--rt-bg-0) !important;
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 background-image:
 linear-gradient(rgba(42, 139, 255, 0.018) 1px, transparent 1px),
 linear-gradient(90deg, rgba(42, 139, 255, 0.018) 1px, transparent 1px);
 background-size: 32px 32px;
 background-attachment: fixed;
}

body.rt-admin #app,
body.rt-admin #wrapper {
 background: transparent !important;
}

body.rt-admin .content-wrapper,
body.rt-admin .content-wrapper.dark-mode,
body.rt-admin .content-wrapper.dark-mode-home {
 background: transparent !important;
 scrollbar-color: var(--rt-bg-2) var(--rt-bg-0);
}

body.rt-admin .content-wrapper::-webkit-scrollbar {
 width: 8px;
 height: 8px;
}
body.rt-admin .content-wrapper::-webkit-scrollbar-track {
 background: var(--rt-bg-0);
}
body.rt-admin .content-wrapper::-webkit-scrollbar-thumb {
 background: var(--rt-bg-3);
 border-radius: 2px;
}
body.rt-admin .content-wrapper::-webkit-scrollbar-thumb:hover {
 background: var(--rt-fg-2);
}

/* ----- Sidebar ----- */

body.rt-admin #sidebar-wrapper,
body.rt-admin #sidebar-wrapper.dark-mode {
 background: var(--rt-bg-1) !important;
 border-right: 1px solid var(--rt-bg-3);
}

body.rt-admin #sidebar-wrapper .brand-logo {
 background: var(--rt-bg-1) !important;
 border-bottom: 1px solid var(--rt-bg-3);
 padding: 18px 16px;
}

/* Monochrome brand logo in dark shell */
body.rt-admin #sidebar-wrapper .brand-logo svg path {
 fill: var(--rt-fg-0) !important;
}

body.rt-admin .sidebar-menu-header {
 color: var(--rt-fg-2) !important;
 font-family: var(--rt-font-body);
 font-size: 10px !important;
 font-weight: 700 !important;
 letter-spacing: 0.14em;
 text-transform: uppercase;
 padding: 18px 22px 8px !important;
 margin: 0 !important;
}

body.rt-admin .sidebar-menu li a {
 color: var(--rt-fg-1) !important;
 padding: 10px 22px !important;
 display: block;
 transition:
 background 120ms ease,
 color 120ms ease,
 border-color 120ms ease;
 border-left: 3px solid transparent;
 font-size: 14px;
 font-weight: 500;
}

body.rt-admin .sidebar-menu li a:hover {
 background: var(--rt-bg-2) !important;
 color: var(--rt-fg-0) !important;
 text-decoration: none;
}

body.rt-admin .sidebar-menu li a:hover .icon-text svg path,
body.rt-admin .sidebar-menu li a:hover .icon-text svg g path {
 stroke: var(--rt-fg-0) !important;
 fill: var(--rt-fg-0);
}

/* Active page link — left accent bar + brighter text. Existing dark-mode CSS
 * adds an .active class on the matching link via Blade route helpers. */
body.rt-admin .sidebar-menu li a.active,
body.rt-admin .sidebar-menu li.active > a {
 background: var(--rt-bg-2) !important;
 color: var(--rt-fg-0) !important;
 border-left-color: var(--rt-accent-blue) !important;
}

body.rt-admin .sidebar-menu li a.active .icon-text svg path,
body.rt-admin .sidebar-menu li a.active .icon-text svg g path,
body.rt-admin .sidebar-menu li.active > a .icon-text svg path,
body.rt-admin .sidebar-menu li.active > a .icon-text svg g path {
 stroke: var(--rt-accent-blue) !important;
}

body.rt-admin .sidebar-menu li a .icon-text {
 display: flex;
 align-items: center;
 gap: 12px;
}

body.rt-admin .sidebar-menu li a .icon-text svg path,
body.rt-admin .sidebar-menu li a .icon-text svg g path {
 stroke: var(--rt-fg-1);
 transition: stroke 120ms ease;
}

body.rt-admin .sidebar-menu-name {
 color: inherit !important;
 font-family: var(--rt-font-body);
 font-size: 14px;
 font-weight: 500;
}

/* Submenu indent for nested ul */
body.rt-admin .sidebar-menu li ul li a {
 padding-left: 30px !important;
 font-size: 13px;
}

/* ----- Navbar (topbar) ----- */

body.rt-admin .topbar-nav .navbar,
body.rt-admin .topbar-nav .navbar.dark-mode,
body.rt-admin .topbar-nav .navbar.dark-mode-home {
 background: var(--rt-bg-1) !important;
 border-bottom: 1px solid var(--rt-bg-3) !important;
 box-shadow: none !important;
}

body.rt-admin .topbar-nav .navbar .user-profile img {
 border: 1px solid var(--rt-bg-3);
 background: var(--rt-bg-2);
 padding: 2px;
 width: 38px;
 height: 38px;
 border-radius: 50%;
}

body.rt-admin .topbar-nav .navbar .nav-link {
 color: var(--rt-fg-1) !important;
}

body.rt-admin .topbar-nav .navbar .nav-link:hover {
 color: var(--rt-fg-0) !important;
}

body.rt-admin .topbar-nav .navbar #icon_sidebar.menu-icon {
 color: var(--rt-fg-1);
 font-size: 22px;
 transition: color 120ms ease;
}

body.rt-admin .topbar-nav .navbar a:hover #icon_sidebar.menu-icon {
 color: var(--rt-fg-0);
}

/* Profile dropdown */
body.rt-admin .dropdown-menu,
body.rt-admin .dropdown-menu.dark-mode {
 background: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
 padding: 6px 0 !important;
}

body.rt-admin .dropdown-menu .dropdown-item,
body.rt-admin .dropdown-menu .dropdown-item a {
 color: var(--rt-fg-1) !important;
 padding: 10px 16px !important;
 font-size: 13px;
 font-weight: 500;
 transition:
 background 120ms ease,
 color 120ms ease;
}

body.rt-admin .dropdown-menu .dropdown-item:hover,
body.rt-admin .dropdown-menu .dropdown-item a:hover {
 background: var(--rt-bg-2) !important;
 color: var(--rt-fg-0) !important;
 text-decoration: none;
}

body.rt-admin .dropdown-menu .dropdown-divider {
 border-color: var(--rt-bg-3) !important;
 margin: 4px 0 !important;
}

body.rt-admin .dropdown-menu .user-details {
 padding: 14px 16px !important;
}

body.rt-admin .dropdown-menu .user-details .user-title {
 color: var(--rt-fg-0) !important;
 font-size: 14px !important;
 font-weight: 700 !important;
 margin: 0 0 2px !important;
}

body.rt-admin .dropdown-menu .user-details .user-subtitle {
 color: var(--rt-fg-2) !important;
 font-family: var(--rt-font-mono) !important;
 font-size: 12px !important;
 margin: 0 !important;
}

body.rt-admin .dropdown-menu .user-details .avatar img {
 border: 1px solid var(--rt-bg-3);
 background: var(--rt-bg-2);
 border-radius: 50%;
 width: 40px;
 height: 40px;
 padding: 2px;
}

/* ----- Footer ----- */

body.rt-admin .footer,
body.rt-admin .footer.dark-mode,
body.rt-admin .footer.dark-mode-home {
 background: var(--rt-bg-1) !important;
 border-top: 1px solid var(--rt-bg-3) !important;
 color: var(--rt-fg-2) !important;
 font-family: var(--rt-font-mono);
 font-size: 10px !important;
 font-weight: 500;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 padding: 14px 0 !important;
}

body.rt-admin .footer strong {
 color: var(--rt-fg-2) !important;
 font-weight: 500 !important;
}

/* =============================================================================
 * Dashboard home (cards, stat numbers, charts, tables, chips)
 * Cascades on top of existing Bootstrap + Material Dashboard + inline styles.
 * Inline styles in Blades are aggressive — most rules use !important to win
 * specificity battles without editing the 1000+ line home.blade.php.
 * ============================================================================= */

/* ----- Bootstrap cards (used on dashboard + every list page) ----- */

body.rt-admin .card {
 background: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 box-shadow: none !important;
 color: var(--rt-fg-0);
 overflow: hidden;
}

body.rt-admin .card-header {
 background: var(--rt-bg-1) !important;
 border-bottom: 1px solid var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
 padding: 16px 20px !important;
 font-family: var(--rt-font-body);
 font-size: 13px;
 font-weight: 700;
 letter-spacing: 0.06em;
 text-transform: uppercase;
}

body.rt-admin .card-body {
 background: var(--rt-bg-1) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .card-footer {
 background: var(--rt-bg-1) !important;
 border-top: 1px solid var(--rt-bg-3) !important;
 color: var(--rt-fg-1) !important;
}

/* Override the existing inline shadow + radius on .card-header-chart */
body.rt-admin .card-header-chart {
 background: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 box-shadow: none !important;
 color: var(--rt-fg-0) !important;
}

/* Override .red / .blue color helpers used on home page */
body.rt-admin .card-header-chart.red {
 background: var(--rt-bg-1) !important;
 border-left: 3px solid var(--rt-accent-red) !important;
}
body.rt-admin .card-header-chart.blue {
 background: var(--rt-bg-1) !important;
 border-left: 3px solid var(--rt-accent-blue) !important;
}

body.rt-admin .value-header-chart,
body.rt-admin .value-header-chart-second {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-mono);
}

body.rt-admin .chart-border {
 background: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 box-shadow: none !important;
 padding: 18px !important;
}

/* ----- Stat header cards (card-header-hm in extras/headers/) ----- */

body.rt-admin .card-header-hm {
 background: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 padding: 20px !important;
 display: flex !important;
 flex-direction: column;
 gap: 14px;
 position: relative;
 overflow: hidden;
 transition:
 border-color 120ms ease,
 background 120ms ease;
}

/* Subtle hover lift — industrial, no scale transforms */
body.rt-admin .card-header-hm:hover {
 background: var(--rt-bg-2) !important;
 border-color: var(--rt-fg-2) !important;
}

/* The big number — monospace, 32px, no decoration */
body.rt-admin .card-header-hm .card-data-count {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-mono) !important;
 font-size: 32px !important;
 font-weight: 700 !important;
 line-height: 1.1 !important;
 letter-spacing: -0.01em;
 margin: 4px 0 !important;
}

/* The label above the number — uppercase tracked */
body.rt-admin
 .card-header-hm
 > div:first-child
 > div:first-child
 > div:first-child {
 color: var(--rt-fg-1) !important;
 font-size: 10px !important;
 font-weight: 700 !important;
 letter-spacing: 0.14em !important;
 text-transform: uppercase !important;
 line-height: 1 !important;
}

/* Icon container background → dark with accent tint */
body.rt-admin .card-header-hm [data-show-linear-bg="true"] {
 background: rgba(42, 139, 255, 0.1) !important;
 border-radius: 4px !important;
 width: 40px !important;
 height: 40px !important;
}

/* Icon SVG fills → accent blue, fill opacity backgrounds → transparent */
body.rt-admin
 .card-header-hm
 [data-show-linear-bg="true"]
 svg
 > path:first-child[fill-opacity] {
 fill: transparent !important;
}
body.rt-admin
 .card-header-hm
 [data-show-linear-bg="true"]
 svg
 path[fill="#1036CE"] {
 fill: var(--rt-accent-blue) !important;
}

/* Bottom delta row — month label + percentage */
body.rt-admin .card-header-hm > div:last-child > div > div:first-child {
 color: var(--rt-fg-1) !important;
 font-size: 11px !important;
 font-weight: 500 !important;
}
body.rt-admin .card-header-hm > div:last-child > div > div:nth-child(2) {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-mono) !important;
 font-size: 12px !important;
 font-weight: 700 !important;
 margin-left: 4px;
}

/* ----- Tables (.th-new / .td-new / .tbody-tr used in event reports etc) ----- */

body.rt-admin table {
 color: var(--rt-fg-0);
 background: transparent;
}

body.rt-admin .th-new,
body.rt-admin th.th-new {
 color: var(--rt-fg-1) !important;
 background: var(--rt-bg-2) !important;
 border-bottom: 1px solid var(--rt-bg-3) !important;
 border-top: none !important;
 font-family: var(--rt-font-body);
 font-size: 11px !important;
 font-weight: 700 !important;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 padding: 12px 16px !important;
 text-align: left;
}

body.rt-admin .td-new,
body.rt-admin td.td-new {
 color: var(--rt-fg-0) !important;
 background: transparent !important;
 border-bottom: 1px solid var(--rt-bg-3) !important;
 border-top: none !important;
 padding: 12px 16px !important;
 font-size: 13px !important;
 font-weight: 500;
}

body.rt-admin .tbody-tr {
 background: transparent !important;
 transition: background 120ms ease;
}

body.rt-admin .tbody-tr:hover {
 background: var(--rt-bg-2) !important;
}

/* Numbers in table cells default to monospace */
body.rt-admin table td.td-new:last-child {
 font-family: var(--rt-font-mono);
 font-weight: 700;
}

/* Existing rgba(255,255,255,0.05) row backgrounds override (totals row) */
body.rt-admin table tr[style*="rgba(255, 255, 255, 0.05)"] {
 background: var(--rt-bg-2) !important;
}
body.rt-admin table tr[style*="rgba(255, 255, 255, 0.05)"] td {
 color: var(--rt-fg-0) !important;
 border-top: 1px solid var(--rt-bg-3) !important;
}

/* ----- DataTables theming (every list page uses this) ----- */

body.rt-admin .dataTables_wrapper {
 color: var(--rt-fg-0);
}

body.rt-admin .dataTables_wrapper .dataTables_length,
body.rt-admin .dataTables_wrapper .dataTables_filter,
body.rt-admin .dataTables_wrapper .dataTables_info,
body.rt-admin .dataTables_wrapper .dataTables_paginate {
 color: var(--rt-fg-1) !important;
 font-size: 13px;
 padding: 12px 16px;
}

body.rt-admin .dataTables_wrapper .dataTables_length select,
body.rt-admin .dataTables_wrapper .dataTables_filter input {
 background: var(--rt-bg-2) !important;
 color: var(--rt-fg-0) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 padding: 6px 10px !important;
}

body.rt-admin .dataTables_wrapper .dataTables_filter input:focus {
 border-color: var(--rt-accent-blue) !important;
 outline: none !important;
 box-shadow: none !important;
}

body.rt-admin table.dataTable {
 background: var(--rt-bg-1) !important;
 border-collapse: separate !important;
 border-spacing: 0;
}

body.rt-admin table.dataTable thead th,
body.rt-admin table.dataTable thead td {
 background: var(--rt-bg-2) !important;
 color: var(--rt-fg-1) !important;
 border-bottom: 1px solid var(--rt-bg-3) !important;
 font-family: var(--rt-font-body);
 font-size: 11px !important;
 font-weight: 700 !important;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 padding: 12px 16px !important;
}

body.rt-admin table.dataTable tbody tr {
 background: transparent !important;
 transition: background 120ms ease;
}

body.rt-admin table.dataTable tbody tr:hover {
 background: var(--rt-bg-2) !important;
}

body.rt-admin table.dataTable tbody td {
 color: var(--rt-fg-0) !important;
 border-bottom: 1px solid var(--rt-bg-3) !important;
 padding: 12px 16px !important;
 font-size: 13px !important;
}

body.rt-admin table.dataTable.stripe tbody tr.odd,
body.rt-admin table.dataTable.display tbody tr.odd {
 background: transparent !important;
}

body.rt-admin .dataTables_wrapper .dataTables_paginate .paginate_button {
 background: var(--rt-bg-2) !important;
 color: var(--rt-fg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 margin: 0 2px !important;
 padding: 6px 12px !important;
}

body.rt-admin .dataTables_wrapper .dataTables_paginate .paginate_button.current,
body.rt-admin
 .dataTables_wrapper
 .dataTables_paginate
 .paginate_button.current:hover {
 background: var(--rt-accent-blue) !important;
 color: #fff !important;
 border-color: var(--rt-accent-blue) !important;
}

body.rt-admin .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
 background: var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
 border-color: var(--rt-fg-2) !important;
}

/* ----- Status chips (active / paid / cancelled / refunded / pending) ----- */

.rt-chip {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 padding: 3px 10px;
 border-radius: 4px;
 font-family: var(--rt-font-body);
 font-size: 10px;
 font-weight: 700;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 border: 1px solid transparent;
}

.rt-chip::before {
 content: "";
 width: 6px;
 height: 6px;
 border-radius: 50%;
 background: currentColor;
}

.rt-chip-active,
.rt-chip-success {
 background: rgba(45, 212, 164, 0.1);
 color: var(--rt-accent-green);
 border-color: rgba(45, 212, 164, 0.25);
}

.rt-chip-paid,
.rt-chip-info {
 background: rgba(42, 139, 255, 0.1);
 color: var(--rt-accent-blue);
 border-color: rgba(42, 139, 255, 0.25);
}

.rt-chip-pending,
.rt-chip-warning {
 background: rgba(255, 179, 71, 0.1);
 color: var(--rt-accent-amber);
 border-color: rgba(255, 179, 71, 0.25);
}

.rt-chip-cancelled,
.rt-chip-refunded,
.rt-chip-danger {
 background: rgba(255, 77, 90, 0.1);
 color: var(--rt-accent-red);
 border-color: rgba(255, 77, 90, 0.25);
}

/* ----- ApexCharts dark theming (CSS-only — series colors come from JS) ----- */

body.rt-admin .apexcharts-canvas {
 background: transparent !important;
}

body.rt-admin .apexcharts-text,
body.rt-admin .apexcharts-text tspan,
body.rt-admin .apexcharts-yaxis-label,
body.rt-admin .apexcharts-xaxis-label,
body.rt-admin .apexcharts-legend-text {
 fill: var(--rt-fg-1) !important;
 color: var(--rt-fg-1) !important;
 font-family: var(--rt-font-body) !important;
}

body.rt-admin .apexcharts-gridline,
body.rt-admin .apexcharts-grid-borders line,
body.rt-admin .apexcharts-grid line {
 stroke: var(--rt-bg-3) !important;
 stroke-dasharray: 2, 4;
}

body.rt-admin .apexcharts-xaxis line,
body.rt-admin .apexcharts-yaxis line {
 stroke: var(--rt-bg-3) !important;
}

/* Tooltip — override the existing inline white background */
body.rt-admin .apexcharts-tooltip {
 background: var(--rt-bg-2) !important;
 border: 1px solid var(--rt-bg-3) !important;
 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .apexcharts-tooltip.apexcharts-theme-light,
body.rt-admin
 .apexcharts-tooltip.apexcharts-theme-light
 .apexcharts-tooltip-title {
 background: var(--rt-bg-2) !important;
 border-color: var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .apexcharts-tooltip-text,
body.rt-admin .apexcharts-tooltip-y-group,
body.rt-admin .apexcharts-tooltip-text-y-label,
body.rt-admin .apexcharts-tooltip-text-y-value {
 color: var(--rt-fg-0) !important;
}

body.rt-admin .apexcharts-menu {
 background: var(--rt-bg-2) !important;
 border: 1px solid var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .apexcharts-menu-item:hover {
 background: var(--rt-bg-3) !important;
}

/* Pie / donut legend labels */
body.rt-admin .apexcharts-pie-label,
body.rt-admin .apexcharts-datalabel-label,
body.rt-admin .apexcharts-datalabel-value {
 fill: var(--rt-fg-0) !important;
}

/* ----- ECharts container — background + tooltip ----- */

body.rt-admin div[_echarts_instance_],
body.rt-admin .echarts {
 background: transparent !important;
}

/* ----- Global JS palette for ApexCharts (loaded after the charts init) -----
 * Charts that are constructed inline in the Blades read window.RT_CHART_COLORS.
 * Existing chart code that hard-codes colors is unaffected; we'll migrate
 * those to the palette in a follow-up if needed.
 * ============================================================================= */

/* Existing legend boxes used on home dashboard */
body.rt-admin .legend-item {
 color: var(--rt-fg-1) !important;
 font-size: 12px;
}

body.rt-admin .legend-color-box {
 border-radius: 2px !important;
}

/* GMV box at top of home — restyle the inline card */
body.rt-admin .gmv-container {
 background: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 box-shadow: none !important;
 color: var(--rt-fg-0);
}

body.rt-admin .gmv-value {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-mono);
}

body.rt-admin .gmv-prev {
 color: var(--rt-fg-2) !important;
}

body.rt-admin .gmv-trend.up {
 color: var(--rt-accent-green) !important;
}
body.rt-admin .gmv-trend.down {
 color: var(--rt-accent-red) !important;
}

/* Sidebar-style Roboto headings on home — keep but in our colors */
body.rt-admin .text-style-new {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-mono) !important;
 letter-spacing: 0.02em !important;
}

/* ----- Page section titles — h1/h2/h3/h4/h5 in content ----- */

body.rt-admin .content-wrapper h1,
body.rt-admin .content-wrapper h2,
body.rt-admin .content-wrapper h3,
body.rt-admin .content-wrapper h4,
body.rt-admin .content-wrapper h5,
body.rt-admin .content-wrapper h6 {
 color: var(--rt-fg-0);
}

body.rt-admin .content-wrapper .text-muted {
 color: var(--rt-fg-2) !important;
}

/* =============================================================================
 * Global theming for every dashboard page
 * Cascades through the 77 dashboard Blades via Bootstrap class selectors.
 * Forms, buttons, modals, alerts, pagination, tabs, badges, breadcrumbs,
 * bootstrap-toggle, SweetAlert dialogs, Toastr toasts.
 * ============================================================================= */

/* ----- Form inputs (text, select, textarea, date, file) ----- */

body.rt-admin .form-control,
body.rt-admin select.form-control,
body.rt-admin textarea.form-control,
body.rt-admin input.form-control,
body.rt-admin input[type="text"]:not(.rt-field-input),
body.rt-admin input[type="email"]:not(.rt-field-input),
body.rt-admin input[type="number"]:not(.rt-field-input),
body.rt-admin input[type="search"]:not(.rt-field-input),
body.rt-admin input[type="tel"]:not(.rt-field-input),
body.rt-admin input[type="url"]:not(.rt-field-input),
body.rt-admin input[type="password"]:not(.rt-field-input),
body.rt-admin input[type="date"]:not(.rt-field-input),
body.rt-admin input[type="time"]:not(.rt-field-input),
body.rt-admin input[type="datetime-local"]:not(.rt-field-input),
body.rt-admin input[type="month"]:not(.rt-field-input):not(.rt-toolbar-month-input),
body.rt-admin select:not(.rt-field-input),
body.rt-admin textarea:not(.rt-field-input) {
 background-color: var(--rt-bg-2) !important;
 color: var(--rt-fg-0) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 box-shadow: none !important;
 padding: 12px 14px !important;
 font-family: var(--rt-font-body);
 font-size: 14px;
 line-height: 1.4 !important;
 min-height: 44px;
 transition:
 border-color 120ms ease,
 background 120ms ease;
}

/* Selects need explicit height to keep the visible value from clipping;
 * native select height is ~px-line-height + padding which can render short. */
body.rt-admin select.form-control,
body.rt-admin select:not(.rt-field-input) {
 height: 44px;
 padding-right: 36px !important;
}

/* Textareas: keep auto-height (rows attr) but keep the padding generous */
body.rt-admin textarea.form-control,
body.rt-admin textarea:not(.rt-field-input) {
 height: auto;
 min-height: 96px;
 line-height: 1.5 !important;
}

body.rt-admin .form-control:focus,
body.rt-admin select.form-control:focus,
body.rt-admin textarea.form-control:focus,
body.rt-admin input.form-control:focus,
body.rt-admin input[type="text"]:not(.rt-field-input):focus,
body.rt-admin input[type="email"]:not(.rt-field-input):focus,
body.rt-admin input[type="number"]:not(.rt-field-input):focus,
body.rt-admin input[type="search"]:not(.rt-field-input):focus,
body.rt-admin select:not(.rt-field-input):focus,
body.rt-admin textarea:not(.rt-field-input):focus {
 background-color: var(--rt-bg-1) !important;
 border-color: var(--rt-accent-blue) !important;
 outline: none !important;
 box-shadow: 0 0 0 1px var(--rt-accent-blue) !important;
}

body.rt-admin .form-control::placeholder,
body.rt-admin input::placeholder,
body.rt-admin textarea::placeholder {
 color: var(--rt-fg-2) !important;
 opacity: 1;
}

body.rt-admin .form-control:disabled,
body.rt-admin .form-control[readonly] {
 background-color: var(--rt-bg-1) !important;
 color: var(--rt-fg-2) !important;
 cursor: not-allowed;
}

body.rt-admin .form-group label,
body.rt-admin label:not(.custom-control-label):not(.rt-field-label) {
 color: var(--rt-fg-1) !important;
 font-size: 11px;
 font-weight: 700;
 letter-spacing: 0.1em;
 text-transform: uppercase;
 margin-bottom: 6px;
 display: block;
}

body.rt-admin .form-text,
body.rt-admin .help-block,
body.rt-admin small.form-text {
 color: var(--rt-fg-2) !important;
 font-size: 12px;
}

body.rt-admin .invalid-feedback,
body.rt-admin .text-danger {
 color: var(--rt-accent-red) !important;
}

/* Select dropdown native arrow — keep visible on dark bg */
body.rt-admin select.form-control,
body.rt-admin select:not(.rt-field-input) {
 background-image:
 linear-gradient(45deg, transparent 50%, var(--rt-fg-1) 50%),
 linear-gradient(135deg, var(--rt-fg-1) 50%, transparent 50%) !important;
 background-position:
 calc(100% - 18px) 52%,
 calc(100% - 13px) 52% !important;
 background-size:
 5px 5px,
 5px 5px !important;
 background-repeat: no-repeat !important;
 appearance: none !important;
 -webkit-appearance: none !important;
}

/* File input */
body.rt-admin .custom-file-label,
body.rt-admin input[type="file"] {
 background-color: var(--rt-bg-2) !important;
 color: var(--rt-fg-0) !important;
 border: 1px solid var(--rt-bg-3) !important;
}

body.rt-admin .custom-file-label::after {
 background-color: var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
 border-left: 1px solid var(--rt-bg-3);
}

/* Input groups */
body.rt-admin .input-group-text {
 background-color: var(--rt-bg-2) !important;
 color: var(--rt-fg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
}

/* ----- Custom controls (Bootstrap 4 checkbox/radio/switch) ----- */

body.rt-admin .custom-control-label {
 color: var(--rt-fg-0) !important;
 font-size: 14px;
 font-weight: 500;
 letter-spacing: 0;
 text-transform: none;
}

body.rt-admin .custom-control-label::before {
 background-color: var(--rt-bg-2) !important;
 border: 1px solid var(--rt-bg-3) !important;
}

body.rt-admin .custom-control-input:checked ~ .custom-control-label::before {
 background-color: var(--rt-accent-blue) !important;
 border-color: var(--rt-accent-blue) !important;
}

body.rt-admin .custom-control-input:focus ~ .custom-control-label::before {
 box-shadow: 0 0 0 2px rgba(42, 139, 255, 0.25) !important;
}

/* ----- Buttons ----- */

body.rt-admin .btn {
 border-radius: 4px !important;
 font-family: var(--rt-font-body);
 font-size: 13px !important;
 font-weight: 700 !important;
 letter-spacing: 0.06em;
 padding: 9px 18px !important;
 border-width: 1px !important;
 transition:
 background 120ms ease,
 color 120ms ease,
 border-color 120ms ease,
 transform 80ms ease;
 box-shadow: none !important;
 text-transform: uppercase;
}

body.rt-admin .btn:active {
 transform: translateY(1px);
}

body.rt-admin .btn-primary,
body.rt-admin .btn-primary:not(:disabled):not(.disabled) {
 background-color: var(--rt-accent-blue) !important;
 border-color: var(--rt-accent-blue) !important;
 color: #fff !important;
}
body.rt-admin .btn-primary:hover,
body.rt-admin .btn-primary:focus {
 background-color: #1a78e8 !important;
 border-color: #1a78e8 !important;
}

body.rt-admin .btn-secondary,
body.rt-admin .btn-default {
 background-color: var(--rt-bg-2) !important;
 border-color: var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
}
body.rt-admin .btn-secondary:hover,
body.rt-admin .btn-default:hover {
 background-color: var(--rt-bg-3) !important;
 border-color: var(--rt-fg-2) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .btn-success {
 background-color: var(--rt-accent-green) !important;
 border-color: var(--rt-accent-green) !important;
 color: #0a0c10 !important;
}
body.rt-admin .btn-success:hover {
 background-color: #22b88c !important;
 border-color: #22b88c !important;
}

body.rt-admin .btn-danger {
 background-color: var(--rt-accent-red) !important;
 border-color: var(--rt-accent-red) !important;
 color: #fff !important;
}
body.rt-admin .btn-danger:hover {
 background-color: #e53846 !important;
 border-color: #e53846 !important;
}

body.rt-admin .btn-warning {
 background-color: var(--rt-accent-amber) !important;
 border-color: var(--rt-accent-amber) !important;
 color: #0a0c10 !important;
}
body.rt-admin .btn-warning:hover {
 background-color: #e89e30 !important;
 border-color: #e89e30 !important;
}

body.rt-admin .btn-info {
 background-color: var(--rt-bg-2) !important;
 border-color: var(--rt-accent-blue) !important;
 color: var(--rt-accent-blue) !important;
}
body.rt-admin .btn-info:hover {
 background-color: rgba(42, 139, 255, 0.12) !important;
}

body.rt-admin .btn-link {
 color: var(--rt-accent-blue) !important;
 text-decoration: none;
}
body.rt-admin .btn-link:hover {
 color: #1a78e8 !important;
 text-decoration: underline;
}

/* Outline variants */
body.rt-admin .btn-outline-primary {
 background: transparent !important;
 border-color: var(--rt-accent-blue) !important;
 color: var(--rt-accent-blue) !important;
}
body.rt-admin .btn-outline-primary:hover {
 background: var(--rt-accent-blue) !important;
 color: #fff !important;
}
body.rt-admin .btn-outline-secondary {
 background: transparent !important;
 border-color: var(--rt-bg-3) !important;
 color: var(--rt-fg-1) !important;
}
body.rt-admin .btn-outline-secondary:hover {
 background: var(--rt-bg-2) !important;
 color: var(--rt-fg-0) !important;
}
body.rt-admin .btn-outline-success {
 background: transparent !important;
 border-color: var(--rt-accent-green) !important;
 color: var(--rt-accent-green) !important;
}
body.rt-admin .btn-outline-danger {
 background: transparent !important;
 border-color: var(--rt-accent-red) !important;
 color: var(--rt-accent-red) !important;
}

body.rt-admin .btn-sm {
 padding: 6px 12px !important;
 font-size: 11px !important;
}
body.rt-admin .btn-lg {
 padding: 13px 22px !important;
 font-size: 14px !important;
}

body.rt-admin .btn:disabled,
body.rt-admin .btn.disabled {
 background-color: var(--rt-bg-3) !important;
 border-color: var(--rt-bg-3) !important;
 color: var(--rt-fg-2) !important;
 cursor: not-allowed;
 opacity: 0.6 !important;
}

/* ----- Modals ----- */

body.rt-admin .modal-backdrop,
body.rt-admin .modal-backdrop.show {
 background-color: rgba(10, 12, 16, 0.75) !important;
 opacity: 1 !important;
}

body.rt-admin .modal-content {
 background-color: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 color: var(--rt-fg-0) !important;
 box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5) !important;
 overflow: hidden;
 position: relative;
}

/* Industrial accent strip on modal top */
body.rt-admin .modal-content::before {
 content: "";
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 height: 2px;
 background: linear-gradient(
 90deg,
 var(--rt-accent-blue) 0%,
 var(--rt-accent-green) 100%
 );
}

body.rt-admin .modal-header {
 background-color: var(--rt-bg-1) !important;
 border-bottom: 1px solid var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
 padding: 18px 20px !important;
}

body.rt-admin .modal-title {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-body);
 font-size: 14px !important;
 font-weight: 700 !important;
 letter-spacing: 0.06em;
 text-transform: uppercase;
}

body.rt-admin .modal-body {
 background-color: var(--rt-bg-1) !important;
 color: var(--rt-fg-0) !important;
 padding: 20px !important;
}

body.rt-admin .modal-footer {
 background-color: var(--rt-bg-1) !important;
 border-top: 1px solid var(--rt-bg-3) !important;
 padding: 14px 20px !important;
}

body.rt-admin .modal-header .close,
body.rt-admin .modal-content .close {
 color: var(--rt-fg-1) !important;
 text-shadow: none !important;
 opacity: 1 !important;
 transition: color 120ms ease;
}
body.rt-admin .modal-header .close:hover,
body.rt-admin .modal-content .close:hover {
 color: var(--rt-fg-0) !important;
}

/* ----- Alerts ----- */

body.rt-admin .alert {
 border-radius: 4px !important;
 border-width: 1px !important;
 border-left-width: 3px !important;
 padding: 12px 16px !important;
 font-size: 13px;
 font-weight: 500;
}

body.rt-admin .alert-success,
body.rt-admin .alert.alert-success {
 background-color: rgba(45, 212, 164, 0.08) !important;
 border-color: rgba(45, 212, 164, 0.25) !important;
 border-left-color: var(--rt-accent-green) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .alert-danger,
body.rt-admin .alert.alert-danger {
 background-color: rgba(255, 77, 90, 0.08) !important;
 border-color: rgba(255, 77, 90, 0.25) !important;
 border-left-color: var(--rt-accent-red) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .alert-warning,
body.rt-admin .alert.alert-warning {
 background-color: rgba(255, 179, 71, 0.08) !important;
 border-color: rgba(255, 179, 71, 0.25) !important;
 border-left-color: var(--rt-accent-amber) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .alert-info,
body.rt-admin .alert.alert-info,
body.rt-admin .alert-primary,
body.rt-admin .alert.alert-primary {
 background-color: rgba(42, 139, 255, 0.08) !important;
 border-color: rgba(42, 139, 255, 0.25) !important;
 border-left-color: var(--rt-accent-blue) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .alert ul {
 margin: 0;
 padding-left: 18px;
}

body.rt-admin .alert .close {
 color: var(--rt-fg-1) !important;
 text-shadow: none !important;
 opacity: 1 !important;
}

/* ----- Pagination (Bootstrap + custom _links.blade.php) ----- */

body.rt-admin .pagination .page-link,
body.rt-admin .pagination .page-item .page-link {
 background-color: var(--rt-bg-2) !important;
 border: 1px solid var(--rt-bg-3) !important;
 color: var(--rt-fg-1) !important;
 border-radius: 4px !important;
 margin: 0 2px !important;
 padding: 7px 12px !important;
 font-size: 13px;
 font-weight: 500;
 transition:
 background 120ms ease,
 color 120ms ease,
 border-color 120ms ease;
}

body.rt-admin .pagination .page-link:hover {
 background-color: var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
 border-color: var(--rt-fg-2) !important;
}

body.rt-admin .pagination .page-item.active .page-link {
 background-color: var(--rt-accent-blue) !important;
 border-color: var(--rt-accent-blue) !important;
 color: #fff !important;
}

body.rt-admin .pagination .page-item.disabled .page-link {
 background-color: var(--rt-bg-1) !important;
 color: var(--rt-fg-2) !important;
 border-color: var(--rt-bg-3) !important;
}

/* ----- Nav tabs ----- */

body.rt-admin .nav-tabs {
 border-bottom: 1px solid var(--rt-bg-3) !important;
}

body.rt-admin .nav-tabs .nav-link {
 background: transparent !important;
 border: none !important;
 border-bottom: 2px solid transparent !important;
 color: var(--rt-fg-1) !important;
 padding: 10px 18px !important;
 font-size: 13px;
 font-weight: 600;
 letter-spacing: 0.04em;
 text-transform: uppercase;
 transition:
 color 120ms ease,
 border-color 120ms ease;
 margin-bottom: -1px;
}

body.rt-admin .nav-tabs .nav-link:hover {
 color: var(--rt-fg-0) !important;
 border-bottom-color: var(--rt-bg-3) !important;
}

body.rt-admin .nav-tabs .nav-link.active,
body.rt-admin .nav-tabs .nav-item.show .nav-link {
 background: transparent !important;
 color: var(--rt-fg-0) !important;
 border-bottom-color: var(--rt-accent-blue) !important;
}

body.rt-admin .nav-pills .nav-link {
 color: var(--rt-fg-1) !important;
 border-radius: 4px !important;
}
body.rt-admin .nav-pills .nav-link.active {
 background-color: var(--rt-accent-blue) !important;
 color: #fff !important;
}

/* ----- Breadcrumbs ----- */

body.rt-admin .breadcrumb {
 background-color: transparent !important;
 padding: 0 !important;
 margin-bottom: 16px;
 font-size: 12px;
}

body.rt-admin .breadcrumb-item {
 color: var(--rt-fg-1) !important;
 font-weight: 500;
 letter-spacing: 0.04em;
 text-transform: uppercase;
}

body.rt-admin .breadcrumb-item a {
 color: var(--rt-fg-1) !important;
 text-decoration: none;
}
body.rt-admin .breadcrumb-item a:hover {
 color: var(--rt-fg-0) !important;
}

body.rt-admin .breadcrumb-item.active {
 color: var(--rt-fg-0) !important;
}

body.rt-admin .breadcrumb-item + .breadcrumb-item::before {
 color: var(--rt-fg-2) !important;
 content: "›";
 padding: 0 8px;
}

/* ----- Badges ----- */

body.rt-admin .badge {
 border-radius: 4px !important;
 padding: 4px 8px !important;
 font-family: var(--rt-font-body);
 font-size: 10px !important;
 font-weight: 700 !important;
 letter-spacing: 0.1em;
 text-transform: uppercase;
}

body.rt-admin .badge-primary,
body.rt-admin .badge.badge-primary {
 background-color: rgba(42, 139, 255, 0.15) !important;
 color: var(--rt-accent-blue) !important;
}
body.rt-admin .badge-success,
body.rt-admin .badge.badge-success {
 background-color: rgba(45, 212, 164, 0.15) !important;
 color: var(--rt-accent-green) !important;
}
body.rt-admin .badge-danger,
body.rt-admin .badge.badge-danger {
 background-color: rgba(255, 77, 90, 0.15) !important;
 color: var(--rt-accent-red) !important;
}
body.rt-admin .badge-warning,
body.rt-admin .badge.badge-warning {
 background-color: rgba(255, 179, 71, 0.15) !important;
 color: var(--rt-accent-amber) !important;
}
body.rt-admin .badge-info,
body.rt-admin .badge.badge-info {
 background-color: rgba(42, 139, 255, 0.15) !important;
 color: var(--rt-accent-blue) !important;
}
body.rt-admin .badge-secondary,
body.rt-admin .badge.badge-secondary {
 background-color: var(--rt-bg-3) !important;
 color: var(--rt-fg-1) !important;
}

/* ----- List groups ----- */

body.rt-admin .list-group-item {
 background-color: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .list-group-item.active {
 background-color: var(--rt-accent-blue) !important;
 border-color: var(--rt-accent-blue) !important;
 color: #fff !important;
}

/* ----- bootstrap-toggle (used heavily on settings + posts pages) ----- */

body.rt-admin .toggle {
 border-radius: 4px !important;
 background-color: var(--rt-bg-3) !important;
}

body.rt-admin .toggle.btn {
 border: 1px solid var(--rt-bg-3) !important;
}

body.rt-admin .toggle-on,
body.rt-admin .toggle.btn-success {
 background-color: var(--rt-accent-green) !important;
 border-color: var(--rt-accent-green) !important;
 color: #0a0c10 !important;
}

body.rt-admin .toggle-off,
body.rt-admin .toggle.btn-default {
 background-color: var(--rt-bg-3) !important;
 color: var(--rt-fg-1) !important;
 border-color: var(--rt-bg-3) !important;
}

body.rt-admin .toggle-handle {
 background-color: var(--rt-fg-0) !important;
 border: 1px solid var(--rt-bg-3) !important;
}

/* ----- SweetAlert (the disable-post confirm dialog) ----- */

body.rt-admin .swal-modal,
body.rt-admin .swal2-popup {
 background-color: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .swal2-title,
body.rt-admin .swal-title {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-body);
 font-weight: 700 !important;
 font-size: 18px !important;
 letter-spacing: 0;
}

body.rt-admin .swal2-html-container,
body.rt-admin .swal2-content,
body.rt-admin .swal-text {
 color: var(--rt-fg-1) !important;
 font-size: 14px !important;
}

body.rt-admin .swal2-confirm,
body.rt-admin .swal2-confirm.swal2-styled {
 background-color: var(--rt-accent-blue) !important;
 border-color: var(--rt-accent-blue) !important;
 color: #fff !important;
 border-radius: 4px !important;
 font-weight: 700 !important;
 letter-spacing: 0.06em !important;
 text-transform: uppercase !important;
 box-shadow: none !important;
}

body.rt-admin .swal2-cancel,
body.rt-admin .swal2-cancel.swal2-styled {
 background-color: var(--rt-bg-2) !important;
 border-color: var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
 border-radius: 4px !important;
 font-weight: 700 !important;
 letter-spacing: 0.06em !important;
 text-transform: uppercase !important;
 box-shadow: none !important;
}

body.rt-admin .swal2-icon.swal2-warning {
 border-color: var(--rt-accent-amber) !important;
 color: var(--rt-accent-amber) !important;
}

body.rt-admin .swal2-icon.swal2-error {
 border-color: var(--rt-accent-red) !important;
 color: var(--rt-accent-red) !important;
}

body.rt-admin .swal2-icon.swal2-success .swal2-success-ring {
 border-color: var(--rt-accent-green) !important;
}

/* ----- Toastr (success/error/info pop-ups, top-left per existing config) ----- */

body.rt-admin .toast-success {
 background-color: var(--rt-bg-1) !important;
 border-left: 3px solid var(--rt-accent-green) !important;
 color: var(--rt-fg-0) !important;
 border-radius: 4px !important;
 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

body.rt-admin .toast-error {
 background-color: var(--rt-bg-1) !important;
 border-left: 3px solid var(--rt-accent-red) !important;
 color: var(--rt-fg-0) !important;
 border-radius: 4px !important;
 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

body.rt-admin .toast-warning {
 background-color: var(--rt-bg-1) !important;
 border-left: 3px solid var(--rt-accent-amber) !important;
 color: var(--rt-fg-0) !important;
 border-radius: 4px !important;
 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

body.rt-admin .toast-info {
 background-color: var(--rt-bg-1) !important;
 border-left: 3px solid var(--rt-accent-blue) !important;
 color: var(--rt-fg-0) !important;
 border-radius: 4px !important;
 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

/* ----- Dropdowns (non-navbar — filter dropdowns, action menus) ----- */

body.rt-admin .dropdown-menu:not(.show) {
 /* default state — no styling needed */
}

body.rt-admin .dropdown-toggle::after {
 color: var(--rt-fg-1);
}

/* ----- Links inside content ----- */

body.rt-admin
 .content-wrapper
 a:not(.nav-link):not(.dropdown-item):not(.btn):not(.page-link):not(
 .breadcrumb-item a
 ) {
 color: var(--rt-accent-blue);
 text-decoration: none;
}

body.rt-admin
 .content-wrapper
 a:not(.nav-link):not(.dropdown-item):not(.btn):not(.page-link):hover {
 color: #1a78e8;
 text-decoration: underline;
}

/* ----- Page action toolbar (above tables — search box + new button) ----- */

body.rt-admin .row > .col input.form-control[placeholder*="search" i],
body.rt-admin .row > .col input.form-control[name="search"] {
 background-color: var(--rt-bg-2) !important;
}

/* ----- Misc helpers used in dashboard inline ----- */

body.rt-admin .bg-light,
body.rt-admin .bg-white {
 background-color: var(--rt-bg-1) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin hr {
 border-color: var(--rt-bg-3) !important;
 border-top-color: var(--rt-bg-3) !important;
}

body.rt-admin code,
body.rt-admin pre {
 background-color: var(--rt-bg-0) !important;
 color: var(--rt-accent-green) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px !important;
 padding: 2px 6px !important;
 font-family: var(--rt-font-mono);
 font-size: 12px;
}

body.rt-admin pre {
 padding: 12px !important;
 overflow-x: auto;
}

body.rt-admin pre code {
 border: none !important;
 padding: 0 !important;
 background: transparent !important;
}

/* =============================================================================
 * Real UX/UI quality
 * Stripped the overdone industrial cosplay (overlapping status strips, ticks
 * on every card). Focus: clear hierarchy, generous breathing room, restrained
 * accents, polish. Inspired by Linear/Stripe/Vercel dark dashboards.
 * ============================================================================= */

/* ----- Reset content padding so we control rhythm ----- */

body.rt-admin .content-wrapper {
 padding: 0 0 80px 0 !important;
 background: var(--rt-bg-0) !important;
}

/* ----- Top action bar (the row containing "GRV: 0" + action buttons) -----
 * The first row in home.blade.php holds the page title and right-aligned
 * action buttons. We give it generous padding, a typographic page title,
 * and clean action buttons that don't overlap the hamburger nav. */

body.rt-admin .content-wrapper > .row:first-child,
body.rt-admin .content-wrapper > div > .row:first-child {
 padding: 32px 32px 24px !important;
 margin: 0 !important;
 background: transparent !important;
 border-bottom: 1px solid var(--rt-bg-3);
 align-items: center;
}

/* Page title — extracts from the existing "GRV: X" markup and treats it as a
 * proper h1. Mono-uppercase tracked label, generous size. */
body.rt-admin .content-wrapper > .row:first-child h1,
body.rt-admin .content-wrapper > .row:first-child h2,
body.rt-admin .content-wrapper > .row:first-child h3 {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-body) !important;
 font-size: 24px !important;
 font-weight: 700 !important;
 line-height: 1.2 !important;
 letter-spacing: -0.01em !important;
 margin: 0 !important;
 text-transform: none;
 display: flex;
 align-items: baseline;
 gap: 16px;
 flex-wrap: wrap;
}

/* The colon-and-number portion of "GRV: 0" — make it tabular and subtler */
body.rt-admin .content-wrapper > .row:first-child h1 {
 font-variant-numeric: tabular-nums;
}

/* ----- Cards: drop the corner-tick decoration ----- */
/* (The .card::before and .card::after rules in still exist; we
 * neutralize them here so they don't clutter every card.) */

body.rt-admin .card::before,
body.rt-admin .card::after {
 content: none !important;
 display: none !important;
}

/* ----- Stat cards — clean, hierarchical, dense ----- */

body.rt-admin .card-header-hm {
 background: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 6px !important;
 padding: 22px 22px 18px !important;
 position: relative;
 overflow: hidden;
 transition:
 border-color 160ms ease,
 transform 160ms ease;
 height: 100%;
 display: flex !important;
 flex-direction: column !important;
}

/* Subtle gradient texture on hover gives life without being noisy */
body.rt-admin .card-header-hm:hover {
 border-color: var(--rt-fg-2) !important;
 transform: translateY(-1px);
}

/* Top-left accent line — subtle, single line of color */
body.rt-admin .card-header-hm::before {
 content: "";
 position: absolute;
 top: 0;
 left: 22px;
 width: 28px;
 height: 2px;
 background: var(--rt-accent-blue);
 border-radius: 0 0 2px 2px;
 transition: width 200ms ease;
}

body.rt-admin .card-header-hm:hover::before {
 width: calc(100% - 44px);
}

/* Drop the previous corner tick ::after */
body.rt-admin .card-header-hm::after {
 content: none !important;
}

/* Label above the number — small mono tracked, no dot */
body.rt-admin
 .card-header-hm
 > div:first-child
 > div:first-child
 > div:first-child {
 color: var(--rt-fg-1) !important;
 font-family: var(--rt-font-mono) !important;
 font-size: 10px !important;
 font-weight: 700 !important;
 letter-spacing: 0.2em !important;
 text-transform: uppercase !important;
 line-height: 1 !important;
 margin-bottom: 4px;
}

/* The big number — large, tabular, tight letter-spacing */
body.rt-admin .card-header-hm .card-data-count {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-body) !important;
 font-size: 38px !important;
 font-weight: 700 !important;
 line-height: 1.05 !important;
 letter-spacing: -0.02em !important;
 font-variant-numeric: tabular-nums;
 margin: 8px 0 0 !important;
}

/* Icon: small, monochrome, top-right corner */
body.rt-admin .card-header-hm [data-show-linear-bg="true"] {
 background: transparent !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 6px !important;
 width: 36px !important;
 height: 36px !important;
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 flex-shrink: 0;
}

body.rt-admin .card-header-hm [data-show-linear-bg="true"] svg {
 width: 18px !important;
 height: 18px !important;
}

body.rt-admin
 .card-header-hm
 [data-show-linear-bg="true"]
 svg
 > path:first-child[fill-opacity] {
 fill: transparent !important;
}
body.rt-admin
 .card-header-hm
 [data-show-linear-bg="true"]
 svg
 path[fill="#1036CE"] {
 fill: var(--rt-fg-1) !important;
 transition: fill 160ms ease;
}
body.rt-admin .card-header-hm:hover [data-show-linear-bg="true"] {
 border-color: var(--rt-accent-blue) !important;
}
body.rt-admin
 .card-header-hm:hover
 [data-show-linear-bg="true"]
 svg
 path[fill="#1036CE"] {
 fill: var(--rt-accent-blue) !important;
}

/* Bottom row — delta indicator */
body.rt-admin .card-header-hm > div:last-child {
 margin-top: auto !important;
 padding-top: 14px !important;
 border-top: 1px solid var(--rt-bg-3) !important;
 display: flex !important;
 align-items: center !important;
 justify-content: flex-start !important;
 gap: 8px;
}

body.rt-admin .card-header-hm > div:last-child > div > div:first-child {
 color: var(--rt-fg-2) !important;
 font-family: var(--rt-font-mono) !important;
 font-size: 10px !important;
 font-weight: 600 !important;
 letter-spacing: 0.16em !important;
 text-transform: uppercase !important;
 margin-right: 6px;
}

body.rt-admin .card-header-hm > div:last-child > div > div:nth-child(2) {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-body) !important;
 font-size: 12px !important;
 font-weight: 600 !important;
 font-variant-numeric: tabular-nums;
}

body.rt-admin .card-header-hm > div:last-child svg path[stroke="#00A74E"] {
 stroke: var(--rt-accent-green) !important;
}
body.rt-admin .card-header-hm > div:last-child svg path[stroke="#FB3748"] {
 stroke: var(--rt-accent-red) !important;
}

/* ----- Chart cards — substantive, clean, no corner-bracket clutter ----- */

body.rt-admin .card {
 background: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 6px !important;
 box-shadow: none !important;
 position: relative;
 overflow: hidden;
}

body.rt-admin .card-header {
 background: transparent !important;
 border-bottom: 1px solid var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
 padding: 18px 22px !important;
 font-family: var(--rt-font-body);
 font-size: 14px !important;
 font-weight: 700 !important;
 letter-spacing: 0 !important;
 text-transform: none !important;
 display: flex;
 align-items: center;
 gap: 10px;
}

/* Remove the green-dot LIVE indicator — too gimmicky */
body.rt-admin .card-header::before {
 content: none !important;
}

body.rt-admin .card-body {
 padding: 22px !important;
 background: transparent !important;
}

/* Chart titles inside cards (h4/h5 + p subtitle) */
body.rt-admin .card .card-body h4,
body.rt-admin .card .card-body h5 {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-body) !important;
 font-size: 14px !important;
 font-weight: 700 !important;
 letter-spacing: 0 !important;
 text-transform: none !important;
 margin: 0 0 4px !important;
 display: block !important;
}

body.rt-admin .card .card-body h4::before,
body.rt-admin .card .card-body h5::before {
 content: none !important;
 display: none !important;
}

body.rt-admin .card .card-body p {
 color: var(--rt-fg-1) !important;
 font-size: 12px !important;
 font-weight: 400 !important;
 letter-spacing: 0 !important;
 text-transform: none !important;
 margin: 0 0 18px !important;
 line-height: 1.4;
}

/* ----- Rhythm: row spacing ----- */

body.rt-admin .content-wrapper > .row:not(:first-child),
body.rt-admin .content-wrapper > div > .row:not(:first-child) {
 padding: 0 32px !important;
 margin: 0 0 20px !important;
}

body.rt-admin .content-wrapper > .row:nth-child(2),
body.rt-admin .content-wrapper > div > .row:nth-child(2) {
 margin-top: 24px !important;
}

body.rt-admin .content-wrapper [class*="col-"] {
 padding-left: 10px !important;
 padding-right: 10px !important;
}
body.rt-admin .content-wrapper .row:not(:first-child) {
 margin-left: -10px !important;
 margin-right: -10px !important;
}

/* ----- Action buttons in the page header (Export Report etc) -----
 * v1 made these invisible. Now: clear secondary-button treatment
 * with visible borders, readable labels, never overlap the right edge. */

body.rt-admin .content-wrapper > .row:first-child .btn,
body.rt-admin .content-wrapper > .row:first-child button.btn,
body.rt-admin .content-wrapper > .row:first-child a.btn {
 background: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
 border-radius: 6px !important;
 padding: 9px 16px !important;
 font-family: var(--rt-font-body) !important;
 font-size: 13px !important;
 font-weight: 600 !important;
 letter-spacing: 0 !important;
 text-transform: none !important;
 display: inline-flex !important;
 align-items: center !important;
 gap: 8px !important;
 margin: 0 0 0 8px !important;
 transition:
 background 120ms ease,
 border-color 120ms ease,
 color 120ms ease;
 text-decoration: none !important;
 line-height: 1.2 !important;
}

body.rt-admin .content-wrapper > .row:first-child .btn:hover {
 background: var(--rt-bg-2) !important;
 border-color: var(--rt-fg-2) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .content-wrapper > .row:first-child .btn svg {
 width: 14px !important;
 height: 14px !important;
 flex-shrink: 0;
}

/* Pile the action button column to the right cleanly */
body.rt-admin .content-wrapper > .row:first-child > [class*="col-"]:last-child {
 text-align: right;
 display: flex;
 justify-content: flex-end;
 align-items: center;
 flex-wrap: wrap;
 gap: 8px;
}

body.rt-admin
 .content-wrapper
 > .row:first-child
 > [class*="col-"]:last-child
 .btn {
 margin-left: 0 !important;
}

/* ----- Top navbar hamburger icon ----- */

body.rt-admin .topbar-nav .navbar #icon_sidebar.menu-icon,
body.rt-admin .topbar-nav .navbar .menu-icon,
body.rt-admin .topbar-nav .navbar .icon-menu {
 color: var(--rt-fg-1) !important;
 font-size: 18px !important;
 line-height: 1 !important;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 38px;
 height: 38px;
 background: var(--rt-bg-2);
 border: 1px solid var(--rt-bg-3);
 border-radius: 6px;
 transition:
 background 120ms ease,
 color 120ms ease,
 border-color 120ms ease;
}

body.rt-admin .topbar-nav .navbar a.toggle-menu:hover .menu-icon,
body.rt-admin .topbar-nav .navbar a.toggle-menu:hover .icon-menu {
 color: var(--rt-fg-0) !important;
 background: var(--rt-bg-3) !important;
 border-color: var(--rt-fg-2) !important;
}

body.rt-admin .topbar-nav .navbar a.toggle-menu {
 padding: 6px !important;
}

/* ----- Sidebar logo sizing ----- */

body.rt-admin #sidebar-wrapper .brand-logo svg {
 max-width: 130px !important;
 height: auto !important;
}

body.rt-admin #sidebar-wrapper .brand-logo {
 padding: 22px 22px !important;
 text-align: left;
}

/* ----- Empty chart state — when data is all 0s, soften the flat line ----- */
/* Apex line at y=0 across a flat dataset reads as "broken". Add a subtle
 * "NO DATA" overlay in the chart body when the canvas exists. */

body.rt-admin .card-body .apexcharts-canvas[width][height] {
 opacity: 0.95;
}

/* Style legend marker chips to match accent palette */
body.rt-admin .apexcharts-legend-series {
 margin: 0 12px 6px 0 !important;
}

body.rt-admin .apexcharts-legend-marker {
 border-radius: 2px !important;
 margin-right: 8px !important;
}

body.rt-admin .apexcharts-legend-text {
 color: var(--rt-fg-1) !important;
 font-family: var(--rt-font-mono) !important;
 font-size: 10px !important;
 font-weight: 600 !important;
 letter-spacing: 0.14em !important;
 text-transform: uppercase !important;
}

/* ----- Footer telemetry strip — keep but ensure no overlap ----- */

body.rt-admin .footer {
 position: relative;
 margin-top: 24px;
}

body.rt-admin .footer::before {
 content: none !important;
}

body.rt-admin .footer .container {
 text-align: center !important;
 padding: 0 32px;
}

body.rt-admin .footer .text-center {
 text-align: center !important;
}

body.rt-admin .footer strong {
 color: var(--rt-fg-2) !important;
 font-weight: 500 !important;
 font-family: var(--rt-font-mono);
 letter-spacing: 0.08em;
 font-size: 10px !important;
}

/* =============================================================================
 * polish — visual hierarchy via subtle background lift
 * Make the page header band (first row) feel like a distinct zone without
 * an overlapping status strip.
 * ============================================================================= */

/* A barely-there divider line under the page header */
body.rt-admin .content-wrapper > .row:first-child {
 background-image: linear-gradient(
 180deg,
 var(--rt-bg-1) 0%,
 transparent 100%
 ) !important;
 background-color: transparent !important;
}

/* Reduce the visual weight of card backgrounds slightly so cards "lift" from
 * the page background rather than melt into it */
body.rt-admin .card,
body.rt-admin .card-header-hm {
 box-shadow: inset 0 0 0 0 transparent;
 transition:
 border-color 160ms ease,
 box-shadow 160ms ease,
 transform 160ms ease;
}

/* On a hovered card, faint inner glow on the border */
body.rt-admin .card:hover {
 border-color: var(--rt-fg-2) !important;
}

/* ----- Apex chart axis text — slightly smaller, mono ----- */

body.rt-admin .apexcharts-xaxis-label,
body.rt-admin .apexcharts-yaxis-label {
 font-family: var(--rt-font-mono) !important;
 font-size: 10px !important;
 letter-spacing: 0.06em !important;
}

/* ----- The "ACTIVE / PAID / REFUND / CANCELED" legend (lowercase chip row) -
 * appears under the BOOKINGS chart in the screenshot. Make it monospace mini-chips */

body.rt-admin .card-body .legend-item {
 color: var(--rt-fg-1) !important;
 font-family: var(--rt-font-mono) !important;
 font-size: 10px !important;
 font-weight: 700 !important;
 letter-spacing: 0.18em !important;
 text-transform: uppercase !important;
 gap: 6px !important;
}

body.rt-admin .card-body .legend-color-box {
 width: 10px !important;
 height: 10px !important;
 border-radius: 2px !important;
}

/* =============================================================================
 * Bug kills + real polish for home dashboard
 * - Kill margin-top:-53px that crops the page header
 * - Restyle the inline-styled "button divs" (not actual .btn) used for
 * Export Report / Compare / Date Filter
 * - Make the GRV: 0 line read like a proper hero metric
 * - Tighten the whole vertical rhythm
 * ============================================================================= */

/* ----- Kill the inline margin-top:-53px that pulls chart rows UP over the header */
body.rt-admin .content-wrapper .row.row-margin[style*="-53px"],
body.rt-admin .content-wrapper .row.row-margin {
 margin-top: 0 !important;
}

/* ----- The "GRV: X" page header row ----- */
/* It's a .row with inline col-md-2 holding "GRV: 0" then col-md-2 each
 * for the three action buttons. We rebuild the layout via CSS. */

body.rt-admin .content-wrapper > .row:first-child {
 background: var(--rt-bg-1) !important;
 background-image: none !important;
 border-bottom: 1px solid var(--rt-bg-3) !important;
 padding: 28px 32px !important;
 margin: 0 !important;
 border-radius: 0 !important;
 display: flex !important;
 align-items: center !important;
 flex-wrap: wrap !important;
 gap: 12px;
 min-height: 96px;
}

/* The GRV: X col — promote it to the page-title slot, free of col-md-2 */
body.rt-admin .content-wrapper > .row:first-child > .col-md-2:first-child,
body.rt-admin
 .content-wrapper
 > .row:first-child
 > div:first-child[class*="col-"] {
 flex: 1 1 auto !important;
 max-width: none !important;
 min-width: 240px !important;
 font-family: var(--rt-font-body) !important;
 font-size: 11px !important;
 line-height: 1 !important;
 letter-spacing: 0.2em !important;
 text-transform: uppercase !important;
 color: var(--rt-fg-2) !important;
 display: flex !important;
 flex-direction: column !important;
 align-items: flex-start !important;
 justify-content: center !important;
 gap: 6px !important;
 padding: 0 !important;
}

/* The GRV: number itself — we wrap the original "GRV: X" in a ::before/::after
 * pattern so the user sees "STATISTICS OVERVIEW" tiny label above and the
 * number large below. The original text reads "GRV: 0" — we override its font. */
body.rt-admin
 .content-wrapper
 > .row:first-child
 > div:first-child[class*="col-"] {
 font-size: 0 !important; /* hide raw text */
 position: relative;
}

body.rt-admin
 .content-wrapper
 > .row:first-child
 > div:first-child[class*="col-"]::before {
 content: "STATISTICS OVERVIEW";
 display: block;
 font-family: var(--rt-font-mono);
 font-size: 10px;
 font-weight: 700;
 letter-spacing: 0.24em;
 color: var(--rt-fg-2);
 margin-bottom: 8px;
}

body.rt-admin
 .content-wrapper
 > .row:first-child
 > div:first-child[class*="col-"]::after {
 content: "Dashboard \00a0 \00b7 \00a0 Renter Mode";
 display: block;
 font-family: var(--rt-font-body);
 font-size: 22px;
 font-weight: 700;
 letter-spacing: -0.01em;
 color: var(--rt-fg-0);
 text-transform: none;
 line-height: 1.2;
}

/* ----- Action buttons (inline-styled divs with the blue outline border) -----
 * They use:
 * outline: 1px rgba(16, 54, 206, 0.75) solid;
 * color: #1036CE;
 * We catch them via the outline color in the attribute selector. */

body.rt-admin .content-wrapper > .row:first-child [style*="rgba(16, 54, 206"],
body.rt-admin .content-wrapper > .row:first-child #downloadPdfBtn,
body.rt-admin .content-wrapper > .row:first-child div[data-toggle="modal"] {
 background: var(--rt-bg-2) !important;
 outline: none !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 6px !important;
 padding: 10px 16px !important;
 color: var(--rt-fg-0) !important;
 transition:
 background 120ms ease,
 border-color 120ms ease,
 color 120ms ease;
 cursor: pointer;
 height: auto !important;
 min-height: 40px !important;
 display: inline-flex !important;
 align-items: center !important;
 justify-content: center !important;
 gap: 8px !important;
}

body.rt-admin
 .content-wrapper
 > .row:first-child
 [style*="rgba(16, 54, 206"]:hover,
body.rt-admin .content-wrapper > .row:first-child #downloadPdfBtn:hover,
body.rt-admin
 .content-wrapper
 > .row:first-child
 div[data-toggle="modal"]:hover {
 background: var(--rt-bg-3) !important;
 border-color: var(--rt-accent-blue) !important;
}

/* The text inside the button divs */
body.rt-admin
 .content-wrapper
 > .row:first-child
 [style*="rgba(16, 54, 206"]
 > div:last-child,
body.rt-admin
 .content-wrapper
 > .row:first-child
 #downloadPdfBtn
 > div:last-child,
body.rt-admin
 .content-wrapper
 > .row:first-child
 div[data-toggle="modal"]
 > div:last-child {
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-body) !important;
 font-size: 13px !important;
 font-weight: 600 !important;
 letter-spacing: 0 !important;
 line-height: 1 !important;
 text-transform: none !important;
}

/* SVG icons inside buttons → recolor from #1036CE to current fg */
body.rt-admin
 .content-wrapper
 > .row:first-child
 [style*="rgba(16, 54, 206"]
 svg
 path[fill="#1036CE"],
body.rt-admin
 .content-wrapper
 > .row:first-child
 #downloadPdfBtn
 svg
 path[fill="#1036CE"],
body.rt-admin
 .content-wrapper
 > .row:first-child
 div[data-toggle="modal"]
 svg
 path[fill="#1036CE"] {
 fill: var(--rt-accent-blue) !important;
}

/* Action button columns — let them size to content, right-align cluster */
body.rt-admin
 .content-wrapper
 > .row:first-child
 > div:not(:first-child)[class*="col-"] {
 flex: 0 0 auto !important;
 max-width: none !important;
 width: auto !important;
 margin: 0 !important;
 padding: 0 !important;
}

/* offset-md-3 / offset-md-4 from the original markup — neutralize */
body.rt-admin .content-wrapper > .row:first-child > [class*="offset-md"] {
 margin-left: auto !important;
}

/* Pile the rest of the buttons in a horizontal cluster */
body.rt-admin
 .content-wrapper
 > .row:first-child
 > div:nth-child(n + 3)[class*="col-"] {
 margin-left: 0 !important;
}

/* ----- Stat card row — give it room above ----- */
body.rt-admin .content-wrapper .container-fluid.py-2 {
 padding: 24px 32px !important;
}

body.rt-admin .container-fluid.py-2 .row {
 margin-left: -10px !important;
 margin-right: -10px !important;
}

body.rt-admin .container-fluid.py-2 .row > [class*="col-"] {
 padding-left: 10px !important;
 padding-right: 10px !important;
}

/* ----- Chart row + downstream content — proper spacing ----- */

body.rt-admin .content-wrapper .row.row-margin {
 padding: 0 32px !important;
 margin: 0 0 20px !important;
 margin-top: 0 !important;
}

body.rt-admin .content-wrapper .row.row-margin > [class*="col-"] {
 padding-left: 10px !important;
 padding-right: 10px !important;
}

/* Chart card body backgrounds — kill the inline #333333 */
body.rt-admin .content-wrapper .card-body[style*="333333"],
body.rt-admin .content-wrapper [style*="background-color: #333333"] {
 background-color: var(--rt-bg-1) !important;
}

/* ----- Misc inline horror cleanup ----- */

/* Inline-styled "Total GRV" labels in card-header divs that use Cairo+700 inline */
body.rt-admin .content-wrapper .card-header > div[style*="font-family: Cairo"] {
 font-family: var(--rt-font-body) !important;
}

body.rt-admin
 .content-wrapper
 .card-header
 > div[style*="color: var(--Color-Neutral-1000"] {
 color: var(--rt-fg-0) !important;
}

body.rt-admin
 .content-wrapper
 .card-header
 > div[style*="color: var(--Color-Neutral-700"],
body.rt-admin .content-wrapper .card-header > div[style*="#BBBBBB"] {
 color: var(--rt-fg-1) !important;
 font-family: var(--rt-font-mono) !important;
 font-size: 13px !important;
 font-variant-numeric: tabular-nums;
}

/* Section title rows often have inline color: white on margin labels */
body.rt-admin .content-wrapper div[style*="color: white"],
body.rt-admin .content-wrapper div[style*="color: #fff"] {
 color: var(--rt-fg-0) !important;
}

body.rt-admin .content-wrapper div[style*="color: red"] {
 color: var(--rt-accent-red) !important;
}

/* ----- Hide the "GRV", "Bookings", "Active", "Paid", "Refund", "Canceled"
 * colored squares strip at the bottom of charts — restyle inline-styled
 * legend boxes from the chart partials */
body.rt-admin .content-wrapper div[style*="background: #1036CE"],
body.rt-admin .content-wrapper div[style*="background:#1036CE"] {
 background: var(--rt-accent-blue) !important;
}
body.rt-admin .content-wrapper div[style*="background: #4CAF50"],
body.rt-admin .content-wrapper div[style*="background:#4CAF50"] {
 background: var(--rt-accent-green) !important;
}
body.rt-admin .content-wrapper div[style*="background: #FF9800"],
body.rt-admin .content-wrapper div[style*="background:#FF9800"] {
 background: var(--rt-accent-amber) !important;
}
body.rt-admin .content-wrapper div[style*="background: #F44336"],
body.rt-admin .content-wrapper div[style*="background:#F44336"] {
 background: var(--rt-accent-red) !important;
}

/* ----- Empty chart placeholder — when chart is rendering 0s ----- */
/* Apex renders flat-at-zero lines when all data is 0. Add a faint "no
 * activity yet" overlay via pseudo-element on the card-body. Only shows on
 * cards whose chart canvas has rendered the empty state. */

body.rt-admin .card-body {
 position: relative;
}

/* ----- Better Apex chart sizing ----- */

body.rt-admin .apexcharts-canvas {
 margin: 0 auto !important;
}

body.rt-admin .apexcharts-canvas svg {
 background: transparent !important;
}

/* Single-series flat-line indicators are barely visible. Bump line width. */
body.rt-admin .apexcharts-line,
body.rt-admin .apexcharts-line-series .apexcharts-series path {
 stroke-width: 2px !important;
}

/* ----- Footer — pad bottom so it doesn't collide with last content row ----- */

body.rt-admin .footer {
 padding: 18px 32px !important;
}

/* =============================================================================
 * Polish detail: increase line-height in cards, decrease default text-leading
 * everywhere else so the "industrial" look feels tight, not airy.
 * ============================================================================= */

body.rt-admin {
 line-height: 1.4;
}

/* ----- Bigger numbers across the dashboard — the boss said "number-based stats" */

body.rt-admin .content-wrapper [class*="value"]:not(.btn) {
 font-family: var(--rt-font-body);
 font-variant-numeric: tabular-nums;
 font-weight: 700;
 color: var(--rt-fg-0);
}

/* ----- One micro-detail: the 3px left accent on sidebar active link should
 * animate in instead of appearing instantly. Tiny touch, big polish. */
body.rt-admin .sidebar-menu li a {
 position: relative;
}

body.rt-admin .sidebar-menu li a.active,
body.rt-admin .sidebar-menu li.active > a {
 box-shadow: inset 3px 0 0 var(--rt-accent-blue);
 border-left-color: transparent !important;
}

/* Sidebar item counter (Booking Incomes 0 / Cancel Bookings 0 etc) */
body.rt-admin .sidebar-menu li a span,
body.rt-admin .sidebar-menu li a .badge {
 background: var(--rt-bg-3) !important;
 color: var(--rt-fg-1) !important;
 font-family: var(--rt-font-mono);
 font-size: 10px !important;
 font-weight: 600 !important;
 padding: 2px 6px !important;
 border-radius: 4px !important;
 margin-left: auto;
}

/* ----- One critical fix: the navbar must sit BELOW any phantom header strip
 * to ensure the GRV row has clear vertical space. */
body.rt-admin .topbar-nav .navbar {
 z-index: 100;
}

body.rt-admin .content-wrapper {
 padding-top: 0 !important;
}

/* =============================================================================
 * Clean dashboard markup styles
 * Goes with the Blade rewrite of home.blade.php lines 199-315.
 * Real page header, hero metric, action cluster, section labels, stat grid.
 * ============================================================================= */

/* ----- Page header (top of every dashboard page) ----- */

body.rt-admin .rt-page-header {
 display: flex;
 justify-content: space-between;
 align-items: flex-end;
 gap: 32px;
 padding: 36px 32px 24px;
 background: linear-gradient(180deg, var(--rt-bg-1) 0%, transparent 100%);
 border-bottom: 1px solid var(--rt-bg-3);
 flex-wrap: wrap;
}

body.rt-admin .rt-page-header-info {
 flex: 1 1 auto;
 min-width: 280px;
 display: flex;
 flex-direction: column;
 gap: 10px;
}

body.rt-admin .rt-page-header-meta {
 flex: 0 0 auto;
}

/* The tiny "Statistics Overview · Live" eyebrow with pulsing green dot */
body.rt-admin .rt-eyebrow {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 color: var(--rt-fg-2);
 font-family: var(--rt-font-mono);
 font-size: 10px;
 font-weight: 700;
 letter-spacing: 0.22em;
 text-transform: uppercase;
 line-height: 1;
}

body.rt-admin .rt-status-dot {
 width: 7px;
 height: 7px;
 border-radius: 50%;
 background: var(--rt-accent-green);
 box-shadow:
 0 0 10px var(--rt-accent-green),
 0 0 0 3px rgba(45, 212, 164, 0.12);
 animation: rt-pulse 2s ease-in-out infinite;
 flex-shrink: 0;
}

@keyframes rt-pulse {
 0%,
 100% {
 opacity: 1;
 transform: scale(1);
 }
 50% {
 opacity: 0.55;
 transform: scale(0.85);
 }
}

body.rt-admin .rt-page-title {
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 font-size: 32px;
 font-weight: 700;
 letter-spacing: -0.02em;
 line-height: 1.1;
 margin: 0;
}

body.rt-admin .rt-page-subtitle {
 color: var(--rt-fg-1);
 font-size: 14px;
 font-weight: 400;
 line-height: 1.4;
 margin: 0;
}

/* Hero metric card on the right side of the header */
body.rt-admin .rt-hero-metric {
 background: var(--rt-bg-2);
 border: 1px solid var(--rt-bg-3);
 border-radius: 8px;
 padding: 18px 24px;
 min-width: 240px;
 display: flex;
 flex-direction: column;
 gap: 4px;
 position: relative;
 overflow: hidden;
}

body.rt-admin .rt-hero-metric::before {
 content: "";
 position: absolute;
 top: 0;
 left: 0;
 width: 40px;
 height: 2px;
 background: var(--rt-accent-blue);
}

body.rt-admin .rt-hero-metric-label {
 color: var(--rt-fg-2);
 font-family: var(--rt-font-mono);
 font-size: 9px;
 font-weight: 700;
 letter-spacing: 0.22em;
 text-transform: uppercase;
 margin-bottom: 4px;
}

body.rt-admin .rt-hero-metric-value {
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 font-size: 30px;
 font-weight: 700;
 letter-spacing: -0.02em;
 line-height: 1;
 font-variant-numeric: tabular-nums;
}

body.rt-admin .rt-hero-metric-delta {
 color: var(--rt-fg-1);
 font-family: var(--rt-font-mono);
 font-size: 11px;
 font-weight: 600;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 display: flex;
 align-items: center;
 gap: 8px;
 margin-top: 4px;
}

body.rt-admin .rt-hero-metric-delta .trend-icon {
 display: inline-block;
 width: 0;
 height: 0;
 border-left: 5px solid transparent;
 border-right: 5px solid transparent;
 border-bottom: 6px solid var(--rt-accent-green);
}

body.rt-admin .rt-hero-metric.up .trend-icon {
 border-bottom-color: var(--rt-accent-green);
 border-top: 0;
}

body.rt-admin .rt-hero-metric.down .trend-icon {
 border-top: 6px solid var(--rt-accent-red);
 border-bottom: 0;
}

/* ----- Action button cluster (below header) ----- */

body.rt-admin .rt-page-actions {
 display: flex;
 gap: 8px;
 flex-wrap: wrap;
 padding: 16px 32px 0;
 margin: 0 0 8px;
}

body.rt-admin .rt-action-btn {
 background: var(--rt-bg-1);
 border: 1px solid var(--rt-bg-3);
 color: var(--rt-fg-0);
 border-radius: 6px;
 padding: 10px 16px;
 font-family: var(--rt-font-body);
 font-size: 13px;
 font-weight: 600;
 letter-spacing: 0;
 text-transform: none;
 cursor: pointer;
 display: inline-flex;
 align-items: center;
 gap: 8px;
 text-decoration: none;
 line-height: 1;
 transition:
 background 120ms ease,
 border-color 120ms ease,
 color 120ms ease;
}

body.rt-admin .rt-action-btn:hover {
 background: var(--rt-bg-2);
 border-color: var(--rt-accent-blue);
 color: var(--rt-fg-0);
 text-decoration: none;
}

body.rt-admin .rt-action-btn svg {
 color: var(--rt-accent-blue);
 flex-shrink: 0;
}

body.rt-admin .rt-action-btn-clear {
 border-color: rgba(255, 77, 90, 0.4);
 color: var(--rt-accent-red);
}

body.rt-admin .rt-action-btn-clear:hover {
 background: rgba(255, 77, 90, 0.08);
 border-color: var(--rt-accent-red);
 color: var(--rt-accent-red);
}

/* ----- Section label between content blocks ----- */

body.rt-admin .rt-section-label {
 color: var(--rt-fg-2);
 font-family: var(--rt-font-mono);
 font-size: 10px;
 font-weight: 700;
 letter-spacing: 0.22em;
 text-transform: uppercase;
 padding: 28px 32px 12px;
 display: flex;
 align-items: center;
 gap: 12px;
 line-height: 1;
}

body.rt-admin .rt-section-label::before,
body.rt-admin .rt-section-label::after {
 content: "";
 height: 1px;
 background: var(--rt-bg-3);
 flex: 0 0 24px;
}

body.rt-admin .rt-section-label::after {
 flex: 1;
}

/* ----- Stat grid (5 stat cards in a row) ----- */

body.rt-admin .rt-stat-grid {
 display: grid;
 grid-template-columns: repeat(5, 1fr);
 gap: 16px;
 padding: 0 32px 8px;
}

@media (max-width: 1280px) {
 body.rt-admin .rt-stat-grid {
 grid-template-columns: repeat(3, 1fr);
 }
}

@media (max-width: 768px) {
 body.rt-admin .rt-stat-grid {
 grid-template-columns: repeat(2, 1fr);
 }
}

body.rt-admin .rt-stat-cell {
 display: flex;
 flex-direction: column;
}

body.rt-admin .rt-stat-cell > .card-header-hm {
 flex: 1;
}

/* ----- Old container-fluid leftover cleanup ----- */
/* The 1081-line home.blade still has .container-fluid wrappers around the
 * chart rows. Make sure they don't add their own padding that fights ours. */
body.rt-admin .content-wrapper .container-fluid {
 padding-left: 0 !important;
 padding-right: 0 !important;
 max-width: none !important;
}

body.rt-admin .content-wrapper .container-fluid.center {
 background: transparent;
}

/* Re-flow the chart rows to match the new horizontal padding */
body.rt-admin .content-wrapper .row.row-margin {
 padding: 0 32px !important;
 margin: 0 0 16px !important;
}

body.rt-admin .content-wrapper .row.row-margin > [class*="col-"] {
 padding-left: 10px !important;
 padding-right: 10px !important;
}

/* The chart cards inside .row.row-margin */
body.rt-admin .content-wrapper .row.row-margin .card {
 margin: 0 !important;
}

body.rt-admin .content-wrapper .row.row-margin .col-lg-6,
body.rt-admin .content-wrapper .row.row-margin .col-md-6,
body.rt-admin .content-wrapper .row.row-margin .col-md-4,
body.rt-admin .content-wrapper .row.row-margin .col-lg-3,
body.rt-admin .content-wrapper .row.row-margin .col-md-3 {
 margin-top: 0 !important;
 margin-bottom: 16px !important;
}

/* ----- The .row immediately after the rt-stat-grid (chart row 1) -----
 * Make sure spacing is correct since the hacks for the old GRV header
 * structure no longer apply. */

body.rt-admin .content-wrapper .row.row-margin:not(:last-child) {
 margin-bottom: 0 !important;
}

/* ----- Suppress the now-unused first-row pseudo-elements ----- */
/* The old `.content-wrapper > .row:first-child::before` and ::after rules
 * were targeting the original markup. With the new Blade those targets
 * don't apply, but just in case any stale pseudo-elements show up — kill. */
body.rt-admin .content-wrapper > .row:first-child::before,
body.rt-admin .content-wrapper > .row:first-child::after {
 content: none !important;
 display: none !important;
}

body.rt-admin
 .content-wrapper
 > .row:first-child
 > div:first-child[class*="col-"]::before,
body.rt-admin
 .content-wrapper
 > .row:first-child
 > div:first-child[class*="col-"]::after {
 content: none !important;
 display: none !important;
}

/* Reset the .content-wrapper > .row:first-child stylingsince the
 * rt-page-header is no longer a .row */
body.rt-admin .content-wrapper > .row:first-child {
 padding: 0 32px !important;
 margin: 0 !important;
 background: transparent !important;
 background-image: none !important;
 border-bottom: none !important;
 min-height: auto !important;
}

/* ----- The last row in home.blade still has the "Event Reports" table card.
 * Make sure it gets normal padding. */
body.rt-admin .content-wrapper > .row:last-child {
 padding: 0 32px !important;
 margin: 16px 0 !important;
}

/* =============================================================================
 * Navbar clearance fix + sidebar redesign
 * Restores the top padding the original .content-wrapper had (70px) so the
 * fixed navbar doesn't crop the hero metric. Adds a user profile card +
 * search input to the sidebar, polishes menu items, sections, hover states.
 * ============================================================================= */

/* ----- Restore navbar clearance ----- */
body.rt-admin .content-wrapper {
 padding-top: 60px !important;
 padding-left: 0 !important;
 padding-right: 0 !important;
 padding-bottom: 60px !important;
}

/* ----- Sidebar wrapper polish ----- */

body.rt-admin #sidebar-wrapper,
body.rt-admin #sidebar-wrapper.dark-mode {
 background: var(--rt-bg-1) !important;
 border-left: 1px solid var(--rt-bg-3) !important;
 border-right: none !important;
 padding-top: 0;
}

body.rt-admin #sidebar-wrapper .simplebar-scroll-content,
body.rt-admin #sidebar-wrapper .simplebar-content {
 padding: 0 !important;
}

/* Logo: less padding, cleaner alignment */
body.rt-admin #sidebar-wrapper .brand-logo {
 padding: 20px 22px !important;
 border-bottom: 1px solid var(--rt-bg-3);
 background: var(--rt-bg-1);
 text-align: left;
}

body.rt-admin #sidebar-wrapper .brand-logo svg {
 max-width: 110px !important;
 height: auto !important;
}

/* ----- User profile card (new) ----- */

body.rt-admin .rt-sidebar-profile {
 display: flex;
 align-items: center;
 gap: 12px;
 padding: 16px 22px;
 border-bottom: 1px solid var(--rt-bg-3);
 background: var(--rt-bg-1);
}

body.rt-admin .rt-sidebar-profile-avatar {
 width: 38px;
 height: 38px;
 border-radius: 8px;
 background: linear-gradient(135deg, var(--rt-accent-blue) 0%, #1a5eb8 100%);
 color: #fff;
 display: flex;
 align-items: center;
 justify-content: center;
 font-family: var(--rt-font-body);
 font-size: 14px;
 font-weight: 700;
 letter-spacing: 0.04em;
 flex-shrink: 0;
 position: relative;
}

body.rt-admin .rt-sidebar-profile-avatar::after {
 content: "";
 position: absolute;
 bottom: -2px;
 right: -2px;
 width: 10px;
 height: 10px;
 background: var(--rt-accent-green);
 border: 2px solid var(--rt-bg-1);
 border-radius: 50%;
}

body.rt-admin .rt-sidebar-profile-info {
 flex: 1;
 min-width: 0;
}

body.rt-admin .rt-sidebar-profile-name {
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 font-size: 13px;
 font-weight: 700;
 line-height: 1.2;
 margin-bottom: 4px;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}

body.rt-admin .rt-sidebar-profile-role {
 color: var(--rt-fg-1);
 font-family: var(--rt-font-mono);
 font-size: 10px;
 font-weight: 600;
 letter-spacing: 0.14em;
 text-transform: uppercase;
 display: flex;
 align-items: center;
 gap: 6px;
}

body.rt-admin .rt-sidebar-profile-role-dot {
 width: 5px;
 height: 5px;
 border-radius: 50%;
 background: var(--rt-accent-green);
 box-shadow: 0 0 6px var(--rt-accent-green);
 flex-shrink: 0;
}

/* ----- Sidebar search input (new) ----- */

body.rt-admin .rt-sidebar-search {
 position: relative;
 display: flex;
 align-items: center;
 margin: 14px 18px;
 background: var(--rt-bg-2);
 border: 1px solid var(--rt-bg-3);
 border-radius: 6px;
 padding: 0 10px;
 transition:
 border-color 120ms ease,
 background 120ms ease;
}

body.rt-admin .rt-sidebar-search:focus-within {
 border-color: var(--rt-accent-blue);
 background: var(--rt-bg-1);
}

body.rt-admin .rt-sidebar-search svg {
 width: 14px;
 height: 14px;
 color: var(--rt-fg-2);
 flex-shrink: 0;
}

body.rt-admin .rt-sidebar-search input {
 flex: 1;
 background: transparent !important;
 border: none !important;
 outline: none !important;
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-body);
 font-size: 13px;
 padding: 9px 8px !important;
 line-height: 1;
}

body.rt-admin .rt-sidebar-search input::placeholder {
 color: var(--rt-fg-2);
}

body.rt-admin .rt-sidebar-search-kbd {
 color: var(--rt-fg-2);
 font-family: var(--rt-font-mono);
 font-size: 11px;
 font-weight: 700;
 background: var(--rt-bg-3);
 border-radius: 4px;
 padding: 2px 6px;
 line-height: 1;
}

/* ----- Sidebar menu polish ----- */

body.rt-admin .sidebar-menu {
 padding: 4px 0 24px !important;
 margin: 0 !important;
}

body.rt-admin .sidebar-menu > li {
 padding: 0 !important;
 margin: 0 !important;
 list-style: none;
}

/* Section header — small hairline above + tracked uppercase */
body.rt-admin .sidebar-menu-header {
 color: var(--rt-fg-2) !important;
 font-family: var(--rt-font-mono) !important;
 font-size: 9px !important;
 font-weight: 700 !important;
 letter-spacing: 0.24em !important;
 text-transform: uppercase !important;
 padding: 22px 22px 8px !important;
 margin: 0 !important;
 position: relative;
}

body.rt-admin .sidebar-menu > li:first-child .sidebar-menu-header {
 padding-top: 14px !important;
}

body.rt-admin .sidebar-menu li a {
 color: var(--rt-fg-1) !important;
 padding: 9px 22px !important;
 display: flex !important;
 align-items: center;
 gap: 12px;
 text-decoration: none !important;
 font-size: 13.5px !important;
 font-weight: 500 !important;
 letter-spacing: 0 !important;
 line-height: 1.3;
 position: relative;
 border-left: none !important;
 transition:
 background 120ms ease,
 color 120ms ease;
}

body.rt-admin .sidebar-menu li a > .icon-text {
 display: flex !important;
 align-items: center !important;
 gap: 12px !important;
 flex: 1;
}

body.rt-admin .sidebar-menu li a svg {
 width: 18px !important;
 height: 18px !important;
 flex-shrink: 0;
}

body.rt-admin .sidebar-menu li a svg path,
body.rt-admin .sidebar-menu li a svg g path {
 stroke: var(--rt-fg-1) !important;
 transition: stroke 120ms ease;
}

body.rt-admin .sidebar-menu li a:hover {
 background: var(--rt-bg-2) !important;
 color: var(--rt-fg-0) !important;
}

body.rt-admin .sidebar-menu li a:hover svg path,
body.rt-admin .sidebar-menu li a:hover svg g path {
 stroke: var(--rt-fg-0) !important;
}

body.rt-admin .sidebar-menu-name {
 color: inherit !important;
 font-family: var(--rt-font-body);
 font-size: inherit !important;
 font-weight: 500 !important;
 line-height: 1.3;
 flex: 1;
}

/* Active item — solid fill + accent bar + brighter text */
body.rt-admin .sidebar-menu li a.active,
body.rt-admin .sidebar-menu li.active > a,
body.rt-admin .sidebar-menu li > a[aria-current="page"] {
 background: var(--rt-bg-2) !important;
 color: var(--rt-fg-0) !important;
 box-shadow: inset 3px 0 0 var(--rt-accent-blue) !important;
}

body.rt-admin .sidebar-menu li a.active svg path,
body.rt-admin .sidebar-menu li a.active svg g path,
body.rt-admin .sidebar-menu li.active > a svg path,
body.rt-admin .sidebar-menu li.active > a svg g path {
 stroke: var(--rt-accent-blue) !important;
}

/* Right-side counter badge (e.g. Booking Incomes [0]) */
body.rt-admin .sidebar-menu li a .badge,
body.rt-admin .sidebar-menu li a > span:last-child:not(.sidebar-menu-name) {
 margin-left: auto !important;
 background: var(--rt-bg-3) !important;
 color: var(--rt-fg-1) !important;
 font-family: var(--rt-font-mono) !important;
 font-size: 10px !important;
 font-weight: 700 !important;
 padding: 2px 7px !important;
 border-radius: 4px !important;
 min-width: 22px;
 text-align: center;
 line-height: 1.4;
}

body.rt-admin .sidebar-menu li a:hover .badge {
 background: var(--rt-fg-2) !important;
 color: var(--rt-fg-0) !important;
}

/* ----- Submenu items (nested ul) ----- */

body.rt-admin .sidebar-menu li ul {
 padding: 0 !important;
 margin: 0 !important;
 background: transparent;
}

body.rt-admin .sidebar-menu li ul li a {
 padding-left: 50px !important;
 font-size: 13px !important;
 font-weight: 500 !important;
}

/* ----- Scrollbar in sidebar ----- */

body.rt-admin #sidebar-wrapper .simplebar-scroll-content::-webkit-scrollbar {
 width: 5px;
}
body.rt-admin
 #sidebar-wrapper
 .simplebar-scroll-content::-webkit-scrollbar-track {
 background: transparent;
}
body.rt-admin
 #sidebar-wrapper
 .simplebar-scroll-content::-webkit-scrollbar-thumb {
 background: var(--rt-bg-3);
 border-radius: 2px;
}

/* ----- Sidebar menu search filtering script ----- */
/* The actual filter logic is added by a tiny inline JS in admin.blade.php
 * elsewhere; here we just style the "hidden by filter" state. */

body.rt-admin .sidebar-menu li.rt-hidden,
body.rt-admin .sidebar-menu li.rt-hidden > a {
 display: none !important;
}

/* =============================================================================
 * Hero metric value too big → wrap into hero card breathing room
 * ============================================================================= */

body.rt-admin .rt-hero-metric {
 margin-top: 0;
}

/* When viewport is narrow, stack the hero metric below the title */
@media (max-width: 1100px) {
 body.rt-admin .rt-page-header {
 flex-direction: column;
 align-items: stretch;
 }
 body.rt-admin .rt-hero-metric {
 align-self: stretch;
 }
}

/* =============================================================================
 * Listing page components (rt-card, rt-table, action icons)
 * Used by /users/admins and reusable across every dashboard list page.
 * ============================================================================= */

/* ----- Primary action button variant ----- */

body.rt-admin .rt-action-btn-primary {
 background: var(--rt-accent-blue);
 border-color: var(--rt-accent-blue);
 color: #fff;
}

body.rt-admin .rt-action-btn-primary:hover {
 background: #1a78e8;
 border-color: #1a78e8;
 color: #fff;
}

body.rt-admin .rt-action-btn-primary svg {
 color: #fff;
}

/* ----- Listing card ----- */

body.rt-admin .rt-card {
 background: var(--rt-bg-1);
 border: 1px solid var(--rt-bg-3);
 border-radius: 8px;
 margin: 0 32px 24px;
 overflow: hidden;
}

body.rt-admin .rt-card-toolbar {
 display: flex;
 align-items: center;
 gap: 16px;
 padding: 14px 18px;
 border-bottom: 1px solid var(--rt-bg-3);
 background: var(--rt-bg-1);
 flex-wrap: wrap;
}

body.rt-admin .rt-card-toolbar-search {
 flex: 1 1 280px;
 display: flex;
 align-items: center;
 gap: 8px;
 background: var(--rt-bg-2);
 border: 1px solid var(--rt-bg-3);
 border-radius: 6px;
 padding: 0 12px;
 min-width: 240px;
 max-width: 420px;
 transition: border-color 120ms ease, background 120ms ease;
}

body.rt-admin .rt-card-toolbar-search:focus-within {
 border-color: var(--rt-accent-blue);
 background: var(--rt-bg-1);
}

body.rt-admin .rt-card-toolbar-search svg {
 width: 14px;
 height: 14px;
 color: var(--rt-fg-2);
 flex-shrink: 0;
}

body.rt-admin .rt-card-toolbar-search input {
 flex: 1;
 background: transparent !important;
 border: none !important;
 outline: none !important;
 box-shadow: none !important;
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-body);
 font-size: 13px;
 padding: 9px 0 !important;
}

body.rt-admin .rt-card-toolbar-search input::placeholder {
 color: var(--rt-fg-2);
}

body.rt-admin .rt-card-toolbar-meta {
 color: var(--rt-fg-1);
 font-family: var(--rt-font-mono);
 font-size: 11px;
 font-weight: 600;
 letter-spacing: 0.10em;
 text-transform: uppercase;
 display: flex;
 align-items: center;
 gap: 8px;
 margin-left: auto;
}

body.rt-admin .rt-card-toolbar-pill {
 background: var(--rt-bg-3);
 color: var(--rt-fg-0);
 padding: 3px 8px;
 border-radius: 4px;
 font-family: var(--rt-font-mono);
 font-weight: 700;
}

/* ----- Table ----- */

body.rt-admin .rt-table-wrap {
 overflow-x: auto;
}

body.rt-admin .rt-table {
 width: 100%;
 border-collapse: separate;
 border-spacing: 0;
 margin: 0;
 background: var(--rt-bg-1);
}

body.rt-admin .rt-table thead th {
 background: var(--rt-bg-1);
 color: var(--rt-fg-2);
 font-family: var(--rt-font-mono);
 font-size: 10px;
 font-weight: 700;
 letter-spacing: 0.20em;
 text-transform: uppercase;
 padding: 14px 18px;
 border-bottom: 1px solid var(--rt-bg-3);
 text-align: left;
 white-space: nowrap;
}

body.rt-admin .rt-table thead th.rt-th-id {
 width: 100px;
}

body.rt-admin .rt-table thead th.rt-th-actions {
 width: 1%;
 text-align: right;
 padding-right: 22px;
}

body.rt-admin .rt-table tbody tr {
 transition: background 120ms ease;
}

body.rt-admin .rt-table tbody tr:hover {
 background: var(--rt-bg-2);
}

body.rt-admin .rt-table tbody td {
 color: var(--rt-fg-0);
 padding: 14px 18px;
 border-bottom: 1px solid var(--rt-bg-3);
 font-size: 13.5px;
 vertical-align: middle;
}

body.rt-admin .rt-table tbody tr:last-child td {
 border-bottom: none;
}

body.rt-admin .rt-table tbody tr.rt-row-suspended {
 background: rgba(255, 77, 90, 0.04);
}

body.rt-admin .rt-table tbody tr.rt-row-suspended:hover {
 background: rgba(255, 77, 90, 0.08);
}

body.rt-admin .rt-table tbody tr.rt-row-suspended td:not(:last-child) {
 opacity: 0.7;
}

/* ID cell — monospace, dimmer */
body.rt-admin .rt-table .rt-cell-id code {
 background: transparent !important;
 border: none !important;
 color: var(--rt-fg-2) !important;
 font-family: var(--rt-font-mono);
 font-size: 12px;
 font-weight: 600;
 padding: 0 !important;
 letter-spacing: 0.04em;
}

/* User cell — avatar + name + optional badge */
body.rt-admin .rt-cell-user {
 display: flex;
 align-items: center;
 gap: 12px;
}

body.rt-admin .rt-cell-avatar {
 width: 36px;
 height: 36px;
 border-radius: 8px;
 background: linear-gradient(135deg, var(--rt-bg-3) 0%, var(--rt-bg-2) 100%);
 border: 1px solid var(--rt-bg-3);
 color: var(--rt-fg-0);
 display: flex;
 align-items: center;
 justify-content: center;
 font-family: var(--rt-font-body);
 font-size: 13px;
 font-weight: 700;
 flex-shrink: 0;
 letter-spacing: 0.02em;
}

body.rt-admin .rt-cell-user-info {
 display: flex;
 flex-direction: column;
 gap: 2px;
 min-width: 0;
}

body.rt-admin .rt-cell-user-name {
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 font-size: 14px;
 font-weight: 600;
 line-height: 1.2;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 max-width: 280px;
}

body.rt-admin .rt-cell-user-badge {
 display: inline-block;
 font-family: var(--rt-font-mono);
 font-size: 9px;
 font-weight: 700;
 letter-spacing: 0.18em;
 padding: 1px 6px;
 border-radius: 3px;
 line-height: 1.4;
 width: max-content;
}

body.rt-admin .rt-cell-user-badge-root {
 background: rgba(42, 139, 255, 0.14);
 color: var(--rt-accent-blue);
 border: 1px solid rgba(42, 139, 255, 0.30);
}

body.rt-admin .rt-cell-user-badge-you {
 background: rgba(45, 212, 164, 0.12);
 color: var(--rt-accent-green);
 border: 1px solid rgba(45, 212, 164, 0.28);
}

/* Monospace cell helper */
body.rt-admin .rt-table .rt-cell-mono,
body.rt-admin code.rt-cell-mono {
 background: transparent !important;
 border: none !important;
 color: var(--rt-fg-1) !important;
 font-family: var(--rt-font-mono);
 font-size: 13px;
 font-weight: 500;
 padding: 0 !important;
 letter-spacing: 0.04em;
}

/* ----- Actions column ----- */

body.rt-admin .rt-cell-actions {
 text-align: right;
 white-space: nowrap;
 padding-right: 22px !important;
}

body.rt-admin .rt-cell-actions > * {
 display: inline-block;
 vertical-align: middle;
}

body.rt-admin .rt-icon-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 32px;
 height: 32px;
 background: transparent;
 border: 1px solid var(--rt-bg-3);
 border-radius: 6px;
 color: var(--rt-fg-1);
 cursor: pointer;
 transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
 padding: 0;
 margin-left: 4px;
 text-decoration: none;
}

body.rt-admin .rt-icon-btn svg {
 width: 14px;
 height: 14px;
 display: block;
}

body.rt-admin .rt-icon-btn:hover {
 background: var(--rt-bg-3);
 color: var(--rt-fg-0);
 border-color: var(--rt-fg-2);
 text-decoration: none;
}

body.rt-admin .rt-icon-btn-form {
 display: inline-block !important;
 margin: 0;
}

body.rt-admin .rt-icon-btn-danger {
 color: var(--rt-accent-red);
 border-color: rgba(255, 77, 90, 0.30);
}

body.rt-admin .rt-icon-btn-danger:hover {
 background: rgba(255, 77, 90, 0.12);
 color: var(--rt-accent-red);
 border-color: var(--rt-accent-red);
}

body.rt-admin .rt-icon-btn-restore {
 color: var(--rt-accent-green);
 border-color: rgba(45, 212, 164, 0.30);
}

body.rt-admin .rt-icon-btn-restore:hover {
 background: rgba(45, 212, 164, 0.12);
 color: var(--rt-accent-green);
 border-color: var(--rt-accent-green);
}

/* ----- Empty state ----- */

body.rt-admin .rt-empty-state-cell {
 padding: 48px 18px !important;
 background: transparent !important;
 border-bottom: none !important;
 text-align: center;
}

body.rt-admin .rt-empty-state {
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 gap: 8px;
 color: var(--rt-fg-1);
}

body.rt-admin .rt-empty-icon {
 width: 56px;
 height: 56px;
 border-radius: 12px;
 background: var(--rt-bg-2);
 border: 1px solid var(--rt-bg-3);
 display: flex;
 align-items: center;
 justify-content: center;
 color: var(--rt-fg-2);
 margin-bottom: 6px;
}

body.rt-admin .rt-empty-icon svg {
 width: 24px;
 height: 24px;
}

body.rt-admin .rt-empty-title {
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 font-size: 16px;
 font-weight: 700;
 margin-bottom: 2px;
}

body.rt-admin .rt-empty-subtitle {
 color: var(--rt-fg-1);
 font-size: 13px;
 font-weight: 400;
}

/* ----- Card footer (pagination) ----- */

body.rt-admin .rt-card-footer {
 padding: 14px 18px;
 border-top: 1px solid var(--rt-bg-3);
 background: var(--rt-bg-1);
 display: flex;
 justify-content: flex-end;
 align-items: center;
}

body.rt-admin .rt-card-footer nav,
body.rt-admin .rt-card-footer ul.pagination {
 margin: 0;
}

/* ----- Mobile: stack toolbar ----- */
@media (max-width: 640px) {
 body.rt-admin .rt-card-toolbar {
 flex-direction: column;
 align-items: stretch;
 }
 body.rt-admin .rt-card-toolbar-meta {
 margin-left: 0;
 }
 body.rt-admin .rt-card-toolbar-search {
 max-width: none;
 }
}

/* =============================================================================
 * Fixes + create form styles + white navbar logo
 * 1. Primary action button text was invisible because the generic content
 * link rule overrode the white color. Higher-specificity fix.
 * 2. Form section styles (rt-form-*).
 * 3. Force navbar logo + dropdown avatar to render white like login.
 * ============================================================================= */

/* ----- Fix: rt-action-btn-primary text must stay white over blue ----- */

body.rt-admin .content-wrapper a.rt-action-btn,
body.rt-admin .content-wrapper a.rt-action-btn:hover,
body.rt-admin .content-wrapper a.rt-action-btn:focus,
body.rt-admin .content-wrapper a.rt-action-btn:visited {
 color: var(--rt-fg-0);
 text-decoration: none;
}

body.rt-admin .content-wrapper a.rt-action-btn-primary,
body.rt-admin .content-wrapper a.rt-action-btn-primary:hover,
body.rt-admin .content-wrapper a.rt-action-btn-primary:focus,
body.rt-admin .content-wrapper a.rt-action-btn-primary:visited,
body.rt-admin .rt-action-btn-primary,
body.rt-admin .rt-action-btn-primary:hover,
body.rt-admin .rt-action-btn-primary:focus {
 color: #fff !important;
 text-decoration: none !important;
}

body.rt-admin .rt-action-btn-primary svg,
body.rt-admin a.rt-action-btn-primary svg {
 color: #fff !important;
}

/* Icon-button anchors should never get the link blue / underline either */
body.rt-admin .content-wrapper a.rt-icon-btn,
body.rt-admin .content-wrapper a.rt-icon-btn:hover {
 color: inherit;
 text-decoration: none;
}

/* ----- Form section styles ----- */

body.rt-admin .rt-form {
 margin: 0 32px 32px;
}

body.rt-admin .rt-form-section {
 background: var(--rt-bg-1);
 border: 1px solid var(--rt-bg-3);
 border-radius: 8px;
 margin-bottom: 18px;
 display: grid;
 grid-template-columns: 280px 1fr;
 gap: 0;
 overflow: hidden;
}

body.rt-admin .rt-form-section-head {
 padding: 24px 24px;
 background: var(--rt-bg-1);
 border-right: 1px solid var(--rt-bg-3);
 display: flex;
 flex-direction: column;
 gap: 6px;
}

body.rt-admin .rt-form-section-title {
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 font-size: 15px;
 font-weight: 700;
 letter-spacing: -0.01em;
 line-height: 1.2;
}

body.rt-admin .rt-form-section-subtitle {
 color: var(--rt-fg-1);
 font-family: var(--rt-font-body);
 font-size: 12.5px;
 font-weight: 400;
 line-height: 1.5;
}

body.rt-admin .rt-form-section-body {
 padding: 24px 28px;
 display: flex;
 flex-direction: column;
 gap: 20px;
}

body.rt-admin .rt-form-row {
 display: flex;
 flex-direction: column;
 gap: 16px;
}

body.rt-admin .rt-form-row-2 {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 18px;
}

body.rt-admin .rt-form-field {
 display: flex;
 flex-direction: column;
 gap: 6px;
 min-width: 0;
}

body.rt-admin .rt-form-label {
 color: var(--rt-fg-1) !important;
 font-family: var(--rt-font-mono);
 font-size: 10px;
 font-weight: 700;
 letter-spacing: 0.18em;
 text-transform: uppercase;
 margin-bottom: 4px;
 display: block;
}

body.rt-admin .rt-form-required {
 color: var(--rt-accent-red);
 font-weight: 700;
}

body.rt-admin .rt-form-help {
 color: var(--rt-fg-2);
 font-family: var(--rt-font-body);
 font-size: 12px;
 margin-top: 4px;
}

body.rt-admin .rt-form-error {
 color: var(--rt-accent-red);
 font-family: var(--rt-font-body);
 font-size: 12.5px;
 font-weight: 500;
 margin-top: 6px;
}

/* Avatar preview block */
body.rt-admin .rt-form-row-avatar {
 display: grid;
 grid-template-columns: 96px 1fr;
 gap: 18px;
 align-items: flex-start;
}

body.rt-admin .rt-form-avatar-preview {
 width: 96px;
 height: 96px;
 border-radius: 12px;
 background: var(--rt-bg-2);
 border: 1px solid var(--rt-bg-3);
 overflow: hidden;
 display: flex;
 align-items: center;
 justify-content: center;
}

body.rt-admin .rt-form-avatar-preview img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
}

body.rt-admin .rt-form-avatar-input {
 display: flex;
 flex-direction: column;
 gap: 6px;
 min-width: 0;
}

/* ----- Form footer (back + submit) ----- */

body.rt-admin .rt-form-footer {
 display: flex;
 justify-content: flex-end;
 align-items: center;
 gap: 10px;
 padding: 18px 24px;
 background: var(--rt-bg-1);
 border: 1px solid var(--rt-bg-3);
 border-radius: 8px;
 margin-top: 4px;
}

/* Stack form sections on narrow viewports */
@media (max-width: 900px) {
 body.rt-admin .rt-form-section {
 grid-template-columns: 1fr;
 }
 body.rt-admin .rt-form-section-head {
 border-right: none;
 border-bottom: 1px solid var(--rt-bg-3);
 }
 body.rt-admin .rt-form-row-2 {
 grid-template-columns: 1fr;
 }
}

/* ----- Force navbar PNG logo + dropdown avatar to render WHITE (match login) ----- */

body.rt-admin .topbar-nav .navbar .user-profile img,
body.rt-admin .topbar-nav .navbar .img-circle,
body.rt-admin .dropdown-menu .user-details .avatar img {
 filter: brightness(0) invert(1);
 background: transparent !important;
 border-color: var(--rt-bg-3) !important;
}

/* ----- Sidebar brand-logo path: ensure it renders white (login parity) ----- */
/* Already declared earlier but re-asserting with higher specificity. */
body.rt-admin #sidebar-wrapper .brand-logo svg path,
body.rt-admin #sidebar-wrapper .brand-logo-ext svg path {
 fill: #fff !important;
}

/* ----- Kill the double focus border on inline search inputs ----- */
/* The generic `input[type="text"]:focus` rule adds a box-shadow
 * that doubled up with the parent .rt-card-toolbar-search :focus-within
 * border. Below, ID-anchored selectors guarantee a specificity win over
 * the class-attr-pseudo cascade in earlier rules. */

body.rt-admin .rt-card .rt-card-toolbar .rt-card-toolbar-search > input,
body.rt-admin .rt-card .rt-card-toolbar .rt-card-toolbar-search > input:focus,
body.rt-admin .rt-card .rt-card-toolbar .rt-card-toolbar-search > input:focus-visible,
body.rt-admin .rt-card .rt-card-toolbar .rt-card-toolbar-search > input:active,
body.rt-admin .rt-card .rt-card-toolbar .rt-card-toolbar-search > input:hover,
body.rt-admin #sidebar-wrapper .rt-sidebar-search > input,
body.rt-admin #sidebar-wrapper .rt-sidebar-search > input:focus,
body.rt-admin #sidebar-wrapper .rt-sidebar-search > input:focus-visible,
body.rt-admin #sidebar-wrapper .rt-sidebar-search > input:active,
body.rt-admin #sidebar-wrapper .rt-sidebar-search > input:hover,
body.rt-admin .rt-field-wrap input,
body.rt-admin .rt-field-wrap input:focus,
body.rt-admin .rt-field-wrap input:focus-visible {
 background: transparent !important;
 background-color: transparent !important;
 border: 0 none transparent !important;
 border-color: transparent !important;
 border-width: 0 !important;
 outline: 0 none transparent !important;
 box-shadow: none !important;
 -webkit-box-shadow: none !important;
 -webkit-appearance: none !important;
 appearance: none !important;
}

/* =============================================================================
 * Profile detail view (show page) components
 * Used by /users/admins/{id} and reusable for any profile detail view.
 * ============================================================================= */

/* ----- Profile hero card ----- */

body.rt-admin .rt-profile-card {
 background: var(--rt-bg-1);
 border: 1px solid var(--rt-bg-3);
 border-radius: 12px;
 margin: 0 32px 28px;
 overflow: hidden;
 position: relative;
}

body.rt-admin .rt-profile-card-banner {
 height: 88px;
 background: linear-gradient(
 135deg,
 rgba(42, 139, 255, 0.18) 0%,
 rgba(45, 212, 164, 0.12) 50%,
 rgba(42, 139, 255, 0.06) 100%
 );
 border-bottom: 1px solid var(--rt-bg-3);
 position: relative;
}

body.rt-admin .rt-profile-card-banner::after {
 content: '';
 position: absolute;
 inset: 0;
 background-image:
 linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px),
 linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px);
 background-size: 16px 16px;
 pointer-events: none;
}

body.rt-admin .rt-profile-card-body {
 padding: 0 28px 24px;
 display: flex;
 align-items: flex-end;
 gap: 22px;
 margin-top: -40px;
 position: relative;
 z-index: 1;
 flex-wrap: wrap;
}

body.rt-admin .rt-profile-card-avatar {
 width: 84px;
 height: 84px;
 border-radius: 14px;
 background: linear-gradient(135deg, var(--rt-accent-blue) 0%, #1a5eb8 100%);
 border: 3px solid var(--rt-bg-1);
 display: flex;
 align-items: center;
 justify-content: center;
 color: #fff;
 font-family: var(--rt-font-body);
 font-size: 30px;
 font-weight: 700;
 letter-spacing: 0.02em;
 overflow: hidden;
 flex-shrink: 0;
}

body.rt-admin .rt-profile-card-avatar img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
}

body.rt-admin .rt-profile-card-identity {
 flex: 1;
 min-width: 0;
 padding-bottom: 6px;
}

body.rt-admin .rt-profile-card-name {
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 font-size: 26px;
 font-weight: 700;
 letter-spacing: -0.02em;
 line-height: 1.2;
 margin-bottom: 8px;
 overflow: hidden;
 text-overflow: ellipsis;
}

body.rt-admin .rt-profile-card-badges {
 display: flex;
 align-items: center;
 gap: 8px;
 flex-wrap: wrap;
}

body.rt-admin .rt-profile-card-id {
 color: var(--rt-fg-2);
 font-family: var(--rt-font-mono);
 font-size: 12px;
 font-weight: 600;
 letter-spacing: 0.04em;
}

body.rt-admin .rt-profile-card-id code {
 background: transparent !important;
 border: none !important;
 padding: 0 !important;
 color: inherit !important;
 font-family: var(--rt-font-mono) !important;
}

/* ----- Detail grid (account info cards) ----- */

body.rt-admin .rt-detail-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
 gap: 14px;
 margin: 0 32px 28px;
}

body.rt-admin .rt-detail-card {
 background: var(--rt-bg-1);
 border: 1px solid var(--rt-bg-3);
 border-radius: 8px;
 padding: 18px 20px;
 display: flex;
 flex-direction: column;
 gap: 8px;
 transition: border-color 120ms ease;
}

body.rt-admin .rt-detail-card:hover {
 border-color: var(--rt-fg-2);
}

body.rt-admin .rt-detail-label {
 color: var(--rt-fg-2);
 font-family: var(--rt-font-mono);
 font-size: 10px;
 font-weight: 700;
 letter-spacing: 0.20em;
 text-transform: uppercase;
 line-height: 1;
}

body.rt-admin .rt-detail-value {
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 font-size: 15px;
 font-weight: 600;
 line-height: 1.4;
 word-break: break-word;
}

body.rt-admin .rt-detail-mono {
 font-family: var(--rt-font-mono) !important;
 font-size: 14px !important;
 font-weight: 500 !important;
 letter-spacing: 0.02em;
 font-variant-numeric: tabular-nums;
}

body.rt-admin .rt-detail-empty {
 color: var(--rt-fg-2) !important;
 font-style: italic;
 font-weight: 400 !important;
}

/* Mobile: profile card name wraps cleaner */
@media (max-width: 640px) {
 body.rt-admin .rt-profile-card-body {
 flex-direction: column;
 align-items: flex-start;
 }
 body.rt-admin .rt-profile-card-name {
 font-size: 22px;
 }
}

/* =============================================================================
 * Lessors page extras: actions dropdown menu, search clear button
 * ============================================================================= */

/* ----- Kebab button wrap (for Bootstrap dropdown inside an icon-btn) ----- */

body.rt-admin .rt-icon-btn-wrap {
 position: relative;
 display: inline-block;
 margin-left: 4px;
 vertical-align: middle;
}

body.rt-admin .rt-icon-btn-wrap .rt-icon-btn {
 margin-left: 0;
}

/* Hide the default Bootstrap caret on dropdown-toggle inside the icon button */
body.rt-admin .rt-icon-btn-wrap .rt-icon-btn::after,
body.rt-admin .rt-icon-btn[data-toggle="dropdown"]::after {
 display: none !important;
}

/* Open state — keep icon-btn looking pressed */
body.rt-admin .rt-icon-btn[aria-expanded="true"] {
 background: var(--rt-bg-3) !important;
 color: var(--rt-fg-0) !important;
 border-color: var(--rt-fg-2) !important;
}

/* ----- Actions menu (Bootstrap dropdown styled for Renter Mode) ----- */

body.rt-admin .rt-actions-menu {
 background: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 8px !important;
 padding: 6px !important;
 min-width: 180px;
 box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45) !important;
 overflow: hidden;
}

body.rt-admin .rt-actions-menu .dropdown-item {
 display: flex !important;
 align-items: center;
 gap: 10px;
 padding: 9px 12px !important;
 color: var(--rt-fg-1) !important;
 font-family: var(--rt-font-body);
 font-size: 13px !important;
 font-weight: 500 !important;
 letter-spacing: 0;
 text-transform: none;
 border-radius: 6px;
 background: transparent !important;
 transition: background 120ms ease, color 120ms ease;
 line-height: 1.2;
}

body.rt-admin .rt-actions-menu .dropdown-item:hover {
 background: var(--rt-bg-2) !important;
 color: var(--rt-fg-0) !important;
 text-decoration: none;
}

body.rt-admin .rt-actions-menu .dropdown-item svg {
 width: 14px;
 height: 14px;
 color: var(--rt-fg-2);
 flex-shrink: 0;
 transition: color 120ms ease;
}

body.rt-admin .rt-actions-menu .dropdown-item:hover svg {
 color: var(--rt-accent-blue);
}

/* ----- Search clear "×" button inside toolbar search input ----- */

body.rt-admin .rt-search-clear {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 22px;
 height: 22px;
 border-radius: 50%;
 background: var(--rt-bg-3);
 color: var(--rt-fg-1);
 font-size: 14px;
 font-weight: 700;
 line-height: 1;
 text-decoration: none !important;
 transition: background 120ms ease, color 120ms ease;
 flex-shrink: 0;
}

body.rt-admin .rt-search-clear:hover {
 background: var(--rt-accent-red);
 color: #fff;
}

/* The form-based search container becomes a flex row */
body.rt-admin form.rt-card-toolbar-search {
 flex: 1 1 280px;
}

/* ----- Dropdowns rendered into <body> by Bootstrap (admin.blade.php detaches them) -----
 * The admin layout's JS moves dropdown-menus into <body> on open so they sit
 * on top of everything. They lose .rt-admin context, so target them directly
 * with the actions-menu class. */
body .dropdown-menu.rt-actions-menu {
 background: var(--rt-bg-1) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 8px !important;
 padding: 6px !important;
 min-width: 180px;
 box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45) !important;
}

body .dropdown-menu.rt-actions-menu .dropdown-item {
 display: flex !important;
 align-items: center;
 gap: 10px;
 padding: 9px 12px !important;
 color: #9AA3B2 !important;
 font-family: 'Cairo', system-ui, sans-serif;
 font-size: 13px !important;
 font-weight: 500 !important;
 text-transform: none;
 border-radius: 6px;
 background: transparent !important;
 line-height: 1.2;
}

body .dropdown-menu.rt-actions-menu .dropdown-item:hover {
 background: #1A1F28 !important;
 color: #E8EBF0 !important;
 text-decoration: none;
}

body .dropdown-menu.rt-actions-menu .dropdown-item svg {
 width: 14px;
 height: 14px;
 color: #5C6473;
 flex-shrink: 0;
}

body .dropdown-menu.rt-actions-menu .dropdown-item:hover svg {
 color: #2A8BFF;
}

/* =============================================================================
 * Components shared across posts/bookings/incomes/reviews pages
 * filter pill, breakdown box, star rating, nav tabs, custom checkbox, cell
 * stacks, month input, bulk count chip.
 * ============================================================================= */

/* ----- Filter context pill (shown when ?lessor_id= / ?user_id= etc set) ----- */

body.rt-admin .rt-filter-pill-wrap {
 padding: 0 32px 14px;
}

body.rt-admin .rt-filter-pill {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 background: var(--rt-bg-1);
 border: 1px solid var(--rt-bg-3);
 border-left: 3px solid var(--rt-accent-blue);
 border-radius: 6px;
 padding: 8px 14px;
 font-size: 13px;
 line-height: 1.2;
 max-width: 100%;
}

body.rt-admin .rt-filter-pill-label {
 color: var(--rt-fg-2);
 font-family: var(--rt-font-mono);
 font-size: 10px;
 font-weight: 700;
 letter-spacing: 0.18em;
 text-transform: uppercase;
}

body.rt-admin .rt-filter-pill-value {
 color: var(--rt-fg-0);
 font-weight: 600;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

body.rt-admin .rt-filter-pill-clear {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 22px;
 height: 22px;
 border-radius: 50%;
 background: var(--rt-bg-3);
 color: var(--rt-fg-1);
 font-size: 14px;
 font-weight: 700;
 line-height: 1;
 text-decoration: none !important;
 transition: background 120ms ease, color 120ms ease;
 flex-shrink: 0;
}

body.rt-admin .rt-filter-pill-clear:hover {
 background: var(--rt-accent-red);
 color: #fff;
}

/* ----- Cell stack (multi-line content inside a table cell) ----- */

body.rt-admin .rt-cell-stack {
 display: flex;
 flex-direction: column;
 gap: 2px;
 min-width: 0;
 text-decoration: none;
}

body.rt-admin .rt-cell-stack-primary {
 color: var(--rt-fg-0);
 font-family: var(--rt-font-body);
 font-size: 13.5px;
 font-weight: 600;
 line-height: 1.3;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

body.rt-admin .rt-cell-stack-secondary {
 color: var(--rt-fg-1);
 font-family: var(--rt-font-body);
 font-size: 12px;
 font-weight: 400;
 line-height: 1.3;
}

body.rt-admin a.rt-cell-stack:hover .rt-cell-stack-primary {
 color: var(--rt-accent-blue);
 text-decoration: none;
}

/* ----- Amount breakdown (price/discount/vat/deposit/total) ----- */

body.rt-admin .rt-breakdown {
 display: flex;
 flex-direction: column;
 gap: 2px;
 min-width: 180px;
 font-family: var(--rt-font-mono);
 font-size: 11.5px;
 font-variant-numeric: tabular-nums;
}

body.rt-admin .rt-breakdown-row {
 display: flex;
 justify-content: space-between;
 align-items: baseline;
 gap: 10px;
}

body.rt-admin .rt-breakdown-key {
 color: var(--rt-fg-2);
 font-size: 10px;
 font-weight: 600;
 letter-spacing: 0.10em;
 text-transform: uppercase;
}

body.rt-admin .rt-breakdown-val {
 color: var(--rt-fg-0);
 font-weight: 600;
}

body.rt-admin .rt-breakdown-pos {
 color: var(--rt-accent-green);
}

body.rt-admin .rt-breakdown-neg {
 color: var(--rt-accent-red);
}

body.rt-admin .rt-breakdown-total {
 border-top: 1px solid var(--rt-bg-3);
 padding-top: 4px;
 margin-top: 4px;
}

body.rt-admin .rt-breakdown-total .rt-breakdown-val {
 color: var(--rt-fg-0);
 font-size: 13px;
 font-weight: 700;
}

body.rt-admin .rt-breakdown-total .rt-breakdown-key {
 color: var(--rt-fg-1);
 font-weight: 700;
}

/* ----- Star rating ----- */

body.rt-admin .rt-stars {
 display: inline-flex;
 align-items: center;
 gap: 2px;
}

body.rt-admin .rt-star {
 width: 14px;
 height: 14px;
 color: var(--rt-bg-3);
 transition: color 120ms ease;
}

body.rt-admin .rt-star.rt-star-on {
 color: var(--rt-accent-amber);
}

body.rt-admin .rt-stars-number {
 margin-left: 6px;
 color: var(--rt-fg-1);
 font-family: var(--rt-font-mono);
 font-size: 12px;
 font-weight: 700;
 font-variant-numeric: tabular-nums;
}

/* ----- Nav tabs (rt-tabs) ----- */

body.rt-admin .rt-tabs.nav-tabs {
 border-bottom: 1px solid var(--rt-bg-3) !important;
 padding: 0 32px;
 margin: 0 0 0 0;
 display: flex;
 gap: 0;
}

body.rt-admin .rt-tabs.nav-tabs .nav-item {
 margin-bottom: -1px;
}

body.rt-admin .rt-tabs.nav-tabs .nav-link {
 background: transparent !important;
 border: none !important;
 border-bottom: 2px solid transparent !important;
 color: var(--rt-fg-1) !important;
 padding: 12px 18px !important;
 font-family: var(--rt-font-body);
 font-size: 13px;
 font-weight: 600;
 letter-spacing: 0;
 text-transform: none;
 transition: color 120ms ease, border-color 120ms ease;
 border-radius: 0;
}

body.rt-admin .rt-tabs.nav-tabs .nav-link:hover {
 color: var(--rt-fg-0) !important;
 border-bottom-color: var(--rt-bg-3) !important;
}

body.rt-admin .rt-tabs.nav-tabs .nav-link.active {
 color: var(--rt-fg-0) !important;
 border-bottom-color: var(--rt-accent-blue) !important;
}

/* ----- Custom checkbox for bulk selection ----- */

body.rt-admin .rt-checkbox,
body.rt-admin input[type="checkbox"].rt-checkbox {
 -webkit-appearance: none !important;
 appearance: none !important;
 width: 18px;
 height: 18px;
 background: var(--rt-bg-2) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 4px;
 cursor: pointer;
 margin: 0;
 padding: 0;
 position: relative;
 flex-shrink: 0;
 transition: background 120ms ease, border-color 120ms ease;
 display: inline-block;
 vertical-align: middle;
 box-shadow: none !important;
 transform: none !important;
}

body.rt-admin .rt-checkbox:hover {
 border-color: var(--rt-fg-2) !important;
}

body.rt-admin .rt-checkbox:checked {
 background: var(--rt-accent-blue) !important;
 border-color: var(--rt-accent-blue) !important;
}

body.rt-admin .rt-checkbox:checked::after {
 content: '';
 position: absolute;
 left: 5px;
 top: 1px;
 width: 5px;
 height: 10px;
 border: solid #fff;
 border-width: 0 2px 2px 0;
 transform: rotate(45deg);
}

/* ----- Month input in toolbar ----- */

body.rt-admin .rt-toolbar-month-input {
 background: var(--rt-bg-2) !important;
 color: var(--rt-fg-0) !important;
 border: 1px solid var(--rt-bg-3) !important;
 border-radius: 6px !important;
 padding: 7px 10px !important;
 font-family: var(--rt-font-mono);
 font-size: 12px !important;
 margin-left: 8px;
 flex-shrink: 0;
 min-width: 150px;
 box-shadow: none !important;
 outline: none !important;
}

body.rt-admin .rt-toolbar-month-input:focus {
 border-color: var(--rt-accent-blue) !important;
 box-shadow: none !important;
}

body.rt-admin .rt-toolbar-month-input::-webkit-calendar-picker-indicator {
 filter: invert(0.7);
 cursor: pointer;
}

/* ----- Bulk-action count chip (next to "Approve transfer") ----- */

body.rt-admin .rt-bulk-count {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-width: 22px;
 height: 18px;
 padding: 0 6px;
 background: rgba(255, 255, 255, 0.2);
 color: #fff;
 border-radius: 4px;
 font-family: var(--rt-font-mono);
 font-size: 11px;
 font-weight: 700;
 margin-left: 8px;
 font-variant-numeric: tabular-nums;
}

/* ----- Bulk-form actions cluster ----- */

body.rt-admin .rt-bulk-actions {
 display: flex;
 align-items: center;
 gap: 12px;
 flex-wrap: wrap;
}

/* ----- Dropdown menu inside a form (for the kebab actions on incomes page) ----- */

body.rt-admin .rt-actions-menu form,
body .dropdown-menu.rt-actions-menu form {
 margin: 0 !important;
}

body.rt-admin .rt-actions-menu form .dropdown-item,
body .dropdown-menu.rt-actions-menu form .dropdown-item {
 cursor: pointer;
}

/* ----- Cell-actions: allow inline-block forms not to break flow ----- */

body.rt-admin .rt-cell-actions form.rt-icon-btn-form {
 margin-left: 4px;
}

/* ----- Toolbar search wrapping ----- */

body.rt-admin .rt-card-toolbar-search {
 flex-wrap: wrap;
}

/* ----- Table search input cell-stack tweak for bookings page ----- */

body.rt-admin .rt-cancel-actions form {
 margin: 0;
}

/* =============================================================================
 * Themed dialogs (SweetAlert 2 + Bootstrap modals + Toastr)
 * Selectors are unscoped because SweetAlert renders into <body> directly,
 * outside the .rt-admin context.
 * ============================================================================= */

/* ----- SweetAlert 2 backdrop ----- */

body.swal2-shown,
.swal2-container {
 backdrop-filter: blur(6px);
 -webkit-backdrop-filter: blur(6px);
}

.swal2-container.swal2-backdrop-show {
 background: rgba(10, 12, 16, 0.72) !important;
}

/* ----- Popup panel ----- */

.swal2-popup.rt-swal-popup {
 background: #12161D !important;
 border: 1px solid #232932 !important;
 border-radius: 12px !important;
 padding: 30px 28px 24px !important;
 box-shadow:
 0 24px 64px rgba(0, 0, 0, 0.55),
 0 0 0 1px rgba(42, 139, 255, 0.06) inset !important;
 color: #E8EBF0 !important;
 font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
 width: 440px !important;
 max-width: calc(100vw - 32px) !important;
 position: relative;
 overflow: hidden;
}

/* Accent strip across the top of the dialog */
.swal2-popup.rt-swal-popup::before {
 content: '';
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 height: 2px;
 background: linear-gradient(90deg, #2A8BFF 0%, #2DD4A4 100%);
 border-top-left-radius: 12px;
 border-top-right-radius: 12px;
}

/* ----- Title ----- */

.swal2-popup .rt-swal-title,
.swal2-popup.rt-swal-popup .swal2-title {
 color: #E8EBF0 !important;
 font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
 font-size: 20px !important;
 font-weight: 700 !important;
 letter-spacing: -0.01em !important;
 line-height: 1.25 !important;
 padding: 16px 0 0 !important;
 margin: 0 !important;
}

/* ----- Body text (description) ----- */

.swal2-popup .rt-swal-html,
.swal2-popup.rt-swal-popup .swal2-html-container {
 color: #9AA3B2 !important;
 font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
 font-size: 14px !important;
 font-weight: 400 !important;
 line-height: 1.5 !important;
 margin: 10px 0 0 !important;
 padding: 0 !important;
}

/* ----- Icon container ----- */

.swal2-popup .rt-swal-icon,
.swal2-popup.rt-swal-popup .swal2-icon {
 margin: 4px auto 12px !important;
 border-width: 2px !important;
 width: 72px !important;
 height: 72px !important;
}

/* Warning icon — amber with subtle glow */
.swal2-popup.rt-swal-popup .swal2-icon.swal2-warning {
 border-color: rgba(255, 179, 71, 0.45) !important;
 color: #FFB347 !important;
 background: rgba(255, 179, 71, 0.08);
 box-shadow: 0 0 24px rgba(255, 179, 71, 0.18);
}
.swal2-popup.rt-swal-popup .swal2-icon.swal2-warning .swal2-icon-content {
 color: #FFB347 !important;
 font-weight: 700;
}

/* Error icon — red */
.swal2-popup.rt-swal-popup .swal2-icon.swal2-error {
 border-color: rgba(255, 77, 90, 0.45) !important;
 color: #FF4D5A !important;
 background: rgba(255, 77, 90, 0.08);
 box-shadow: 0 0 24px rgba(255, 77, 90, 0.18);
}
.swal2-popup.rt-swal-popup .swal2-icon.swal2-error .swal2-x-mark-line-left,
.swal2-popup.rt-swal-popup .swal2-icon.swal2-error .swal2-x-mark-line-right {
 background-color: #FF4D5A !important;
}

/* Success icon — green */
.swal2-popup.rt-swal-popup .swal2-icon.swal2-success {
 border-color: rgba(45, 212, 164, 0.45) !important;
 background: rgba(45, 212, 164, 0.08);
 box-shadow: 0 0 24px rgba(45, 212, 164, 0.18);
}
.swal2-popup.rt-swal-popup .swal2-icon.swal2-success .swal2-success-line-tip,
.swal2-popup.rt-swal-popup .swal2-icon.swal2-success .swal2-success-line-long {
 background-color: #2DD4A4 !important;
}
.swal2-popup.rt-swal-popup .swal2-icon.swal2-success .swal2-success-ring {
 border-color: rgba(45, 212, 164, 0.35) !important;
}

/* Info icon — blue */
.swal2-popup.rt-swal-popup .swal2-icon.swal2-info {
 border-color: rgba(42, 139, 255, 0.45) !important;
 color: #2A8BFF !important;
 background: rgba(42, 139, 255, 0.08);
 box-shadow: 0 0 24px rgba(42, 139, 255, 0.18);
}
.swal2-popup.rt-swal-popup .swal2-icon.swal2-info .swal2-icon-content {
 color: #2A8BFF !important;
 font-weight: 700;
}

/* Question icon — gray */
.swal2-popup.rt-swal-popup .swal2-icon.swal2-question {
 border-color: rgba(154, 163, 178, 0.45) !important;
 color: #9AA3B2 !important;
 background: rgba(154, 163, 178, 0.08);
}

/* ----- Actions row ----- */

.swal2-popup .rt-swal-actions,
.swal2-popup.rt-swal-popup .swal2-actions {
 margin: 20px 0 0 !important;
 gap: 8px !important;
 width: 100%;
 flex-direction: row !important;
 justify-content: flex-end !important;
}

/* ----- Buttons (rt-swal-btn applied via customClass) ----- */

.swal2-popup .rt-swal-btn {
 border-radius: 8px !important;
 padding: 10px 20px !important;
 font-family: 'Cairo', system-ui, -apple-system, sans-serif !important;
 font-size: 13px !important;
 font-weight: 700 !important;
 letter-spacing: 0.06em !important;
 text-transform: uppercase !important;
 border: 1px solid transparent !important;
 cursor: pointer !important;
 transition: background 120ms ease, border-color 120ms ease, color 120ms ease, transform 80ms ease !important;
 margin: 0 !important;
 line-height: 1.2 !important;
 box-shadow: none !important;
 min-width: 120px;
 display: inline-flex !important;
 align-items: center !important;
 justify-content: center !important;
}

.swal2-popup .rt-swal-btn:focus {
 outline: none !important;
 box-shadow: 0 0 0 3px rgba(42, 139, 255, 0.25) !important;
}

.swal2-popup .rt-swal-btn:active {
 transform: translateY(1px);
}

/* Confirm button — primary blue */
.swal2-popup .rt-swal-btn-confirm,
.swal2-popup .rt-swal-btn-confirm.swal2-confirm {
 background: #2A8BFF !important;
 color: #fff !important;
 border-color: #2A8BFF !important;
}
.swal2-popup .rt-swal-btn-confirm:hover {
 background: #1a78e8 !important;
 border-color: #1a78e8 !important;
}

/* Cancel button — secondary dark */
.swal2-popup .rt-swal-btn-cancel,
.swal2-popup .rt-swal-btn-cancel.swal2-cancel {
 background: transparent !important;
 color: #E8EBF0 !important;
 border-color: #232932 !important;
}
.swal2-popup .rt-swal-btn-cancel:hover {
 background: #1A1F28 !important;
 border-color: #5C6473 !important;
}

/* ----- Custom show/hide animations (slide-up + fade) ----- */

@keyframes rt-swal-show {
 0% { opacity: 0; transform: translateY(12px) scale(0.96); }
 100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes rt-swal-hide {
 0% { opacity: 1; transform: translateY(0) scale(1); }
 100% { opacity: 0; transform: translateY(8px) scale(0.97); }
}

.swal2-popup.rt-swal-show {
 animation: rt-swal-show 180ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.swal2-popup.rt-swal-hide {
 animation: rt-swal-hide 140ms ease-out !important;
}

/* Toast timer bar */
.swal2-popup.rt-swal-popup .swal2-timer-progress-bar-container {
 height: 3px;
 background: rgba(255, 255, 255, 0.06);
 border-radius: 0 0 12px 12px;
}

.swal2-popup.rt-swal-popup .swal2-timer-progress-bar {
 background: linear-gradient(90deg, #2A8BFF 0%, #2DD4A4 100%) !important;
}

/* When popup has no actions (info auto-dismiss), trim bottom padding */
.swal2-popup.rt-swal-popup:not(:has(.swal2-actions)) {
 padding-bottom: 28px !important;
}

/* ----- Bootstrap modal animation polish ----- */

/* Modal slide-up reveal */
body.rt-admin .modal.fade .modal-dialog {
 transform: translateY(12px) scale(0.98) !important;
 transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1),
 opacity 180ms ease !important;
 opacity: 0;
}

body.rt-admin .modal.show .modal-dialog {
 transform: translateY(0) scale(1) !important;
 opacity: 1;
}

body.rt-admin .modal-backdrop.fade {
 transition: opacity 180ms ease !important;
}

body.rt-admin .modal-backdrop.show {
 backdrop-filter: blur(4px);
 -webkit-backdrop-filter: blur(4px);
 background-color: rgba(10, 12, 16, 0.78) !important;
 opacity: 1 !important;
}

/* Modal content polish — refined corners, accent strip */
body.rt-admin .modal-content {
 border-radius: 12px !important;
 border: 1px solid var(--rt-bg-3) !important;
 box-shadow:
 0 24px 64px rgba(0, 0, 0, 0.55),
 0 0 0 1px rgba(42, 139, 255, 0.04) inset !important;
}

body.rt-admin .modal-content::before {
 content: '';
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 height: 2px;
 background: linear-gradient(90deg, var(--rt-accent-blue) 0%, var(--rt-accent-green) 100%);
 border-top-left-radius: 12px;
 border-top-right-radius: 12px;
 z-index: 2;
}

body.rt-admin .modal-header {
 padding: 22px 24px 14px !important;
 border-bottom: 1px solid var(--rt-bg-3) !important;
}

body.rt-admin .modal-title {
 font-size: 17px !important;
 font-weight: 700 !important;
 letter-spacing: -0.01em !important;
 text-transform: none !important;
}

body.rt-admin .modal-body {
 padding: 22px 24px !important;
}

body.rt-admin .modal-footer {
 padding: 16px 24px !important;
 border-top: 1px solid var(--rt-bg-3) !important;
 gap: 8px;
}

body.rt-admin .modal-header .close {
 width: 28px;
 height: 28px;
 border-radius: 6px;
 font-size: 18px;
 line-height: 1;
 background: transparent;
 border: 1px solid transparent;
 transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
 opacity: 1 !important;
 display: inline-flex;
 align-items: center;
 justify-content: center;
}

body.rt-admin .modal-header .close:hover {
 background: var(--rt-bg-2);
 border-color: var(--rt-bg-3);
}

/* ----- Toastr toasts polish ----- */

body.rt-admin #toast-container > div {
 border-radius: 8px !important;
 box-shadow:
 0 12px 32px rgba(0, 0, 0, 0.45),
 0 0 0 1px var(--rt-bg-3) inset !important;
 padding: 14px 18px 14px 50px !important;
 background-image: none !important;
 opacity: 1 !important;
 color: var(--rt-fg-0) !important;
 font-family: var(--rt-font-body) !important;
 font-size: 13px !important;
 min-width: 320px;
 position: relative;
 backdrop-filter: blur(6px);
 -webkit-backdrop-filter: blur(6px);
}

body.rt-admin #toast-container > .toast-success {
 background-color: rgba(18, 22, 29, 0.96) !important;
 border-left: 3px solid var(--rt-accent-green) !important;
}

body.rt-admin #toast-container > .toast-error {
 background-color: rgba(18, 22, 29, 0.96) !important;
 border-left: 3px solid var(--rt-accent-red) !important;
}

body.rt-admin #toast-container > .toast-warning {
 background-color: rgba(18, 22, 29, 0.96) !important;
 border-left: 3px solid var(--rt-accent-amber) !important;
}

body.rt-admin #toast-container > .toast-info {
 background-color: rgba(18, 22, 29, 0.96) !important;
 border-left: 3px solid var(--rt-accent-blue) !important;
}

/* Toast icon — custom dot left of content */
body.rt-admin #toast-container > div::before {
 content: '';
 position: absolute;
 left: 18px;
 top: 50%;
 transform: translateY(-50%);
 width: 18px;
 height: 18px;
 border-radius: 50%;
 background: currentColor;
 opacity: 0.18;
}

body.rt-admin #toast-container > div::after {
 content: '';
 position: absolute;
 left: 24px;
 top: 50%;
 transform: translateY(-50%);
 width: 6px;
 height: 6px;
 border-radius: 50%;
 background: currentColor;
 box-shadow: 0 0 8px currentColor;
}

body.rt-admin #toast-container > .toast-success { color: var(--rt-accent-green) !important; }
body.rt-admin #toast-container > .toast-error { color: var(--rt-accent-red) !important; }
body.rt-admin #toast-container > .toast-warning { color: var(--rt-accent-amber) !important; }
body.rt-admin #toast-container > .toast-info { color: var(--rt-accent-blue) !important; }

body.rt-admin #toast-container > div .toast-title {
 color: var(--rt-fg-0) !important;
 font-weight: 700 !important;
 margin-bottom: 2px !important;
}

body.rt-admin #toast-container > div .toast-message {
 color: var(--rt-fg-1) !important;
}

body.rt-admin #toast-container > div .toast-close-button {
 color: var(--rt-fg-1) !important;
 text-shadow: none !important;
 opacity: 1 !important;
 font-size: 16px !important;
 font-weight: 400 !important;
 line-height: 1 !important;
}

body.rt-admin #toast-container > div .toast-close-button:hover {
 color: var(--rt-fg-0) !important;
}

/* Toast progress bar */
body.rt-admin #toast-container > div > .toast-progress {
 background: currentColor !important;
 height: 2px !important;
 opacity: 0.7 !important;
 border-radius: 0 0 8px 8px;
}

/* =============================================================================
 * Navbar brand-logo (moved from sidebar)
 * Renter SVG wordmark sits inside the navbar's dropdown trigger.
 * The dropdown still opens on click (preserves user menu); the wordmark is
 * just a visual swap. Sidebar starts directly with the user profile card.
 * ============================================================================= */

/* Brand-logo link inside the navbar */
body.rt-admin .topbar-nav .navbar .rt-navbar-brand {
 display: inline-flex !important;
 align-items: center !important;
 padding: 12px 16px !important;
 height: 100%;
 transition: opacity 120ms ease;
}

body.rt-admin .topbar-nav .navbar .rt-navbar-brand:hover {
 opacity: 0.85;
}

/* Force the wordmark to render pure white, matching login page */
body.rt-admin .topbar-nav .navbar .rt-navbar-brand svg {
 display: block;
 width: 124px;
 height: 16px;
}

body.rt-admin .topbar-nav .navbar .rt-navbar-brand svg path {
 fill: #fff !important;
}

/* The old `.user-profile img` filter no longer applies (no img element).
 * Neutralize any stale styles aimed at it inside the trigger. */
body.rt-admin .topbar-nav .navbar .rt-navbar-brand .user-profile,
body.rt-admin .topbar-nav .navbar .rt-navbar-brand .img-circle {
 display: none !important;
}

/* Sidebar no longer has the brand-logo block. Clean up the spacing so the
 * sidebar starts cleanly with the user profile card. The old border-bottom
 * that used to separate the logo strip is moved onto the profile card. */
body.rt-admin #sidebar-wrapper .simplebar-content > :first-child {
 border-top: 1px solid var(--rt-bg-3);
}

/* In case any stale .brand-logo styles still cascade from app-extension.css */
body.rt-admin #sidebar-wrapper .brand-logo,
body.rt-admin #sidebar-wrapper .brand-logo-ext {
 display: none !important;
}

/* =============================================================================
 * Post form extras — lease term rows, image link list, checkbox-label,
 * 3/4-column form rows, info chip
 * ============================================================================= */

body.rt-admin .rt-form-row-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
body.rt-admin .rt-form-row-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
@media (max-width: 900px) {
    body.rt-admin .rt-form-row-3,
    body.rt-admin .rt-form-row-4 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
    body.rt-admin .rt-form-row-3,
    body.rt-admin .rt-form-row-4 { grid-template-columns: 1fr; }
}

body.rt-admin .rt-lease-row {
    background: var(--rt-bg-2);
    border: 1px solid var(--rt-bg-3);
    border-radius: 8px;
    padding: 18px 20px;
    margin-bottom: 14px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

body.rt-admin .rt-lease-row-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--rt-bg-3);
}

body.rt-admin .rt-lease-row-title {
    color: var(--rt-fg-1);
    font-family: var(--rt-font-mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

body.rt-admin .rt-checkbox-label {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding-top: 8px;
    color: var(--rt-fg-0) !important;
    font-family: var(--rt-font-body);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0 !important;
    text-transform: none !important;
    cursor: pointer;
}

body.rt-admin .rt-checkbox-label .rt-checkbox {
    margin: 0;
}

body.rt-admin .rt-image-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

body.rt-admin .rt-image-list-item {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: var(--rt-bg-2);
    border: 1px solid var(--rt-bg-3);
    border-radius: 6px;
    color: var(--rt-fg-0) !important;
    text-decoration: none !important;
    font-family: var(--rt-font-body);
    font-size: 13px;
    font-weight: 500;
    transition: border-color 120ms ease, background 120ms ease, color 120ms ease;
    width: fit-content;
    max-width: 100%;
}

body.rt-admin .rt-image-list-item:hover {
    border-color: var(--rt-accent-blue);
    background: var(--rt-bg-1);
    color: var(--rt-accent-blue) !important;
}

body.rt-admin .rt-image-list-item svg {
    color: var(--rt-fg-2);
    transition: color 120ms ease;
    flex-shrink: 0;
}

body.rt-admin .rt-image-list-item:hover svg {
    color: var(--rt-accent-blue);
}

body.rt-admin .rt-chip.rt-chip-info {
    background: rgba(42, 139, 255, 0.10);
    color: var(--rt-accent-blue);
    border: 1px solid rgba(42, 139, 255, 0.25);
}

/* =============================================================================
 * Lease Support extras — reply thread, attachment grid
 * ============================================================================= */

body.rt-admin .rt-reply-thread {
    display: flex;
    flex-direction: column;
}

body.rt-admin .rt-reply-row {
    display: flex;
    gap: 14px;
    padding: 18px 22px;
    border-bottom: 1px solid var(--rt-bg-3);
}

body.rt-admin .rt-reply-row:last-child {
    border-bottom: none;
}

body.rt-admin .rt-reply-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--rt-bg-2);
    border: 1px solid var(--rt-bg-3);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--rt-accent-blue);
    flex-shrink: 0;
}

body.rt-admin .rt-reply-avatar svg {
    width: 16px;
    height: 16px;
}

body.rt-admin .rt-reply-body {
    flex: 1;
    min-width: 0;
}

body.rt-admin .rt-reply-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}

body.rt-admin .rt-reply-author {
    color: var(--rt-fg-0);
    font-family: var(--rt-font-body);
    font-size: 13px;
    font-weight: 700;
}

body.rt-admin .rt-reply-time {
    color: var(--rt-fg-2);
    font-size: 11px;
    letter-spacing: 0.04em;
}

body.rt-admin .rt-reply-message {
    color: var(--rt-fg-0);
    font-family: var(--rt-font-body);
    font-size: 14px;
    line-height: 1.5;
    white-space: pre-wrap;
}

body.rt-admin .rt-attachment-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 12px;
}

body.rt-admin .rt-attachment-tile {
    display: block;
    border: 1px solid var(--rt-bg-3);
    border-radius: 8px;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    background: var(--rt-bg-2);
    transition: border-color 120ms ease, transform 160ms ease;
}

body.rt-admin .rt-attachment-tile:hover {
    border-color: var(--rt-accent-blue);
    transform: translateY(-1px);
}

body.rt-admin .rt-attachment-tile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ----- Table thumbnail (categories, subcategories, etc.) ----- */

body.rt-admin .rt-cell-thumb {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    background: var(--rt-bg-2);
    border: 1px solid var(--rt-bg-3);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--rt-fg-2);
}

body.rt-admin .rt-cell-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

body.rt-admin .rt-cell-thumb svg {
    width: 18px;
    height: 18px;
}

/* =============================================================================
 * Sidebar collapsible (Settings section)
 * ============================================================================= */

/* The Settings header — refined section label, no chunky chip */
body.rt-admin .sidebar-menu-header.rt-collapsible-header {
    position: relative;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    cursor: pointer;
    padding: 18px 22px 10px !important;
    margin: 10px 0 0 !important;
    border-radius: 0;
    background: transparent;
    user-select: none;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    transition: background 140ms ease;
    outline: none;
}

body.rt-admin .sidebar-menu-header.rt-collapsible-header:hover {
    background: rgba(255, 255, 255, 0.02);
}

body.rt-admin .sidebar-menu-header.rt-collapsible-header:focus-visible {
    background: rgba(255, 255, 255, 0.03);
}

body.rt-admin .rt-collapsible-label {
    flex: 1;
    color: var(--rt-fg-2);
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    line-height: 1;
    transition: color 140ms ease;
}

body.rt-admin .sidebar-menu-header.rt-collapsible-header:hover .rt-collapsible-label,
body.rt-admin .sidebar-menu-header.rt-collapsible-header.rt-open .rt-collapsible-label {
    color: var(--rt-fg-0);
}

/* The chevron — flat thin icon, no chip */
body.rt-admin .rt-collapsible-chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    border: 0;
    background: transparent;
    color: var(--rt-fg-2);
    transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), color 140ms ease;
    flex-shrink: 0;
}

body.rt-admin .rt-collapsible-chevron svg {
    width: 14px;
    height: 14px;
    display: block;
}

body.rt-admin .sidebar-menu-header.rt-collapsible-header:hover .rt-collapsible-chevron {
    color: var(--rt-fg-0);
}

body.rt-admin .sidebar-menu-header.rt-collapsible-header.rt-open .rt-collapsible-chevron {
    color: var(--rt-accent-blue);
    transform: rotate(-180deg);
}

/* When open, show a subtle left accent line spanning header + list */
body.rt-admin .sidebar-menu-header.rt-collapsible-header.rt-open {
    box-shadow: inset 2px 0 0 var(--rt-accent-blue);
}

/* The settings list itself */
body.rt-admin .rt-collapsible-list {
    list-style: none;
    padding: 2px 0 10px !important;
    margin: 0 !important;
    background: linear-gradient(180deg, rgba(42, 139, 255, 0.05), transparent 70%);
    box-shadow: inset 2px 0 0 var(--rt-accent-blue);
}

/* Tighter items, deeper left padding to feel nested */
body.rt-admin .rt-collapsible-list li a {
    padding: 9px 18px 9px 30px !important;
}

/* ====== Per-item icons (mask-image, inherits color) ====== */

/* Hide the generic gear SVG that was rendered for every item */
body.rt-admin .rt-collapsible-list .icon-text > svg {
    display: none !important;
}

body.rt-admin .rt-collapsible-list .icon-text {
    display: flex !important;
    align-items: center;
    gap: 12px;
}

body.rt-admin .rt-collapsible-list .icon-text::before {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    background-color: currentColor;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 18px 18px;
    mask-size: 18px 18px;
    opacity: 0.72;
    transition: opacity 140ms ease, transform 140ms ease;
}

body.rt-admin .rt-collapsible-list a:hover .icon-text::before {
    opacity: 1;
    transform: scale(1.05);
}

body.rt-admin .rt-collapsible-list a.active .icon-text::before {
    opacity: 1;
}

/* Default mask (folder) so an unmatched route still gets *some* icon */
body.rt-admin .rt-collapsible-list .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z'/></svg>");
}

/* Inquiry Categories — tag */
body.rt-admin .rt-collapsible-list a[href*="/settings/categories"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M20.59 13.41 13.42 20.58a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z'/><line x1='7' y1='7' x2='7.01' y2='7'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M20.59 13.41 13.42 20.58a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z'/><line x1='7' y1='7' x2='7.01' y2='7'/></svg>");
}

/* Subcategories — layers */
body.rt-admin .rt-collapsible-list a[href*="/settings/subcategories"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><polygon points='12 2 2 7 12 12 22 7 12 2'/><polyline points='2 17 12 22 22 17'/><polyline points='2 12 12 17 22 12'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><polygon points='12 2 2 7 12 12 22 7 12 2'/><polyline points='2 17 12 22 22 17'/><polyline points='2 12 12 17 22 12'/></svg>");
}

/* Route Permissions — key */
body.rt-admin .rt-collapsible-list a[href*="/settings/route-permissions"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4'/></svg>");
}

/* Swift Codes — bank/credit card */
body.rt-admin .rt-collapsible-list a[href*="/settings/swift-codes"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><rect x='1' y='4' width='22' height='16' rx='2' ry='2'/><line x1='1' y1='10' x2='23' y2='10'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><rect x='1' y='4' width='22' height='16' rx='2' ry='2'/><line x1='1' y1='10' x2='23' y2='10'/></svg>");
}

/* Questions — help circle */
body.rt-admin .rt-collapsible-list a[href*="/settings/questions"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><path d='M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3'/><line x1='12' y1='17' x2='12.01' y2='17'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><path d='M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3'/><line x1='12' y1='17' x2='12.01' y2='17'/></svg>");
}

/* About Us — info circle */
body.rt-admin .rt-collapsible-list a[href*="/settings/about-us"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><line x1='12' y1='16' x2='12' y2='12'/><line x1='12' y1='8' x2='12.01' y2='8'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><line x1='12' y1='16' x2='12' y2='12'/><line x1='12' y1='8' x2='12.01' y2='8'/></svg>");
}

/* Contact Us — phone */
body.rt-admin .rt-collapsible-list a[href*="/settings/contact-us"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/></svg>");
}

/* Terms & Conditions — file with text */
body.rt-admin .rt-collapsible-list a[href*="/settings/terms-and-conditions"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/><polyline points='14 2 14 8 20 8'/><line x1='16' y1='13' x2='8' y2='13'/><line x1='16' y1='17' x2='8' y2='17'/><polyline points='10 9 9 9 8 9'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/><polyline points='14 2 14 8 20 8'/><line x1='16' y1='13' x2='8' y2='13'/><line x1='16' y1='17' x2='8' y2='17'/><polyline points='10 9 9 9 8 9'/></svg>");
}

/* Cancellation Policy — x-octagon */
body.rt-admin .rt-collapsible-list a[href*="/settings/cancellation-policy"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><polygon points='7.86 2 16.14 2 22 7.86 22 16.14 16.14 22 7.86 22 2 16.14 2 7.86 7.86 2'/><line x1='15' y1='9' x2='9' y2='15'/><line x1='9' y1='9' x2='15' y2='15'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><polygon points='7.86 2 16.14 2 22 7.86 22 16.14 16.14 22 7.86 22 2 16.14 2 7.86 7.86 2'/><line x1='15' y1='9' x2='9' y2='15'/><line x1='9' y1='9' x2='15' y2='15'/></svg>");
}

/* Privacy Policy — shield */
body.rt-admin .rt-collapsible-list a[href*="/settings/privacy-policy"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/></svg>");
}

/* Cities — building (place cities before areas because /cities is shorter) */
body.rt-admin .rt-collapsible-list a[href*="/settings/cities"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M3 21h18'/><path d='M5 21V7l8-4v18'/><path d='M19 21V11l-6-4'/><path d='M9 9h0M9 12h0M9 15h0M9 18h0'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M3 21h18'/><path d='M5 21V7l8-4v18'/><path d='M19 21V11l-6-4'/><path d='M9 9h0M9 12h0M9 15h0M9 18h0'/></svg>");
}

/* Areas — map-pin */
body.rt-admin .rt-collapsible-list a[href*="/settings/areas"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/><circle cx='12' cy='10' r='3'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/><circle cx='12' cy='10' r='3'/></svg>");
}

/* General Setting — sliders */
body.rt-admin .rt-collapsible-list a[href*="/settings/general-setting"] .icon-text::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><line x1='4' y1='21' x2='4' y2='14'/><line x1='4' y1='10' x2='4' y2='3'/><line x1='12' y1='21' x2='12' y2='12'/><line x1='12' y1='8' x2='12' y2='3'/><line x1='20' y1='21' x2='20' y2='16'/><line x1='20' y1='12' x2='20' y2='3'/><line x1='1' y1='14' x2='7' y2='14'/><line x1='9' y1='8' x2='15' y2='8'/><line x1='17' y1='16' x2='23' y2='16'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><line x1='4' y1='21' x2='4' y2='14'/><line x1='4' y1='10' x2='4' y2='3'/><line x1='12' y1='21' x2='12' y2='12'/><line x1='12' y1='8' x2='12' y2='3'/><line x1='20' y1='21' x2='20' y2='16'/><line x1='20' y1='12' x2='20' y2='3'/><line x1='1' y1='14' x2='7' y2='14'/><line x1='9' y1='8' x2='15' y2='8'/><line x1='17' y1='16' x2='23' y2='16'/></svg>");
}

/* =============================================================================
 * 419 Session Expired page (terminal aesthetic)
 * ============================================================================= */

body.rt-auth .rt-419-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    position: relative;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
}

body.rt-auth .rt-419-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 50% 0%, rgba(42, 139, 255, 0.09), transparent 55%),
        radial-gradient(ellipse at 50% 100%, rgba(42, 139, 255, 0.05), transparent 50%);
    pointer-events: none;
    z-index: 0;
}

body.rt-auth .rt-419-shell::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px);
    background-size: 44px 44px;
    pointer-events: none;
    z-index: 0;
    -webkit-mask-image: radial-gradient(ellipse at center, black 40%, transparent 90%);
    mask-image: radial-gradient(ellipse at center, black 40%, transparent 90%);
}

body.rt-auth .rt-419-brand {
    margin-bottom: 32px;
    color: var(--rt-fg-1);
    opacity: 0.85;
    position: relative;
    z-index: 1;
}

body.rt-auth .rt-419-terminal {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 640px;
    background: #06080b;
    border: 1px solid var(--rt-bg-3);
    border-radius: 14px;
    overflow: hidden;
    box-shadow:
        0 30px 60px -24px rgba(0, 0, 0, 0.75),
        0 0 0 1px rgba(42, 139, 255, 0.06) inset,
        0 0 60px -20px rgba(42, 139, 255, 0.25);
}

body.rt-auth .rt-419-terminal-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: linear-gradient(180deg, #12161d, #0d1116);
    border-bottom: 1px solid var(--rt-bg-3);
}

body.rt-auth .rt-419-tdot {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

body.rt-auth .rt-419-tdot-r { background: #ff5f57; }
body.rt-auth .rt-419-tdot-y { background: #febc2e; }
body.rt-auth .rt-419-tdot-g { background: #28c840; }

body.rt-auth .rt-419-terminal-title {
    margin-left: 14px;
    flex: 1;
    text-align: center;
    color: var(--rt-fg-2);
    font-family: var(--rt-font-mono);
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: lowercase;
}

body.rt-auth .rt-419-code-tag {
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.18em;
    color: var(--rt-accent-blue);
    padding: 4px 8px;
    border-radius: 4px;
    background: rgba(42, 139, 255, 0.12);
    border: 1px solid rgba(42, 139, 255, 0.25);
    flex-shrink: 0;
}

body.rt-auth .rt-419-terminal-body {
    padding: 26px 24px 22px;
    font-family: var(--rt-font-mono);
    font-size: 13px;
    line-height: 1.7;
    color: var(--rt-fg-0);
}

body.rt-auth .rt-419-line {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-top: 14px;
}

body.rt-auth .rt-419-line:first-child { margin-top: 0; }

body.rt-auth .rt-419-prompt {
    color: var(--rt-accent-green);
    font-weight: 700;
    flex-shrink: 0;
}

body.rt-auth .rt-419-cmd {
    color: var(--rt-fg-1);
}

body.rt-auth .rt-419-output {
    margin-left: 22px;
    margin-top: 4px;
}

body.rt-auth .rt-419-output-fail {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--rt-accent-red);
    font-weight: 700;
    letter-spacing: 0.04em;
}

body.rt-auth .rt-419-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--rt-accent-red);
    box-shadow: 0 0 10px rgba(232, 87, 87, 0.7);
    animation: rt-419-pulse 1.4s ease-in-out infinite;
}

@keyframes rt-419-pulse {
    0%, 100% { opacity: 0.55; }
    50%      { opacity: 1;    }
}

body.rt-auth .rt-419-output-code {
    color: var(--rt-accent-amber);
    font-weight: 700;
    letter-spacing: 0.06em;
}

body.rt-auth .rt-419-output-note {
    display: block;
    margin-top: 8px;
    color: var(--rt-fg-2);
    font-family: var(--rt-font-body, system-ui, sans-serif);
    font-size: 14px;
    line-height: 1.6;
    font-weight: 400;
    letter-spacing: 0;
}

body.rt-auth .rt-419-actions {
    margin-left: 22px;
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

body.rt-auth .rt-419-key {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: var(--rt-bg-1);
    border: 1px solid var(--rt-bg-3);
    border-radius: 10px;
    color: var(--rt-fg-0);
    font-family: var(--rt-font-body, system-ui, sans-serif);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
    cursor: pointer;
    transition: background 140ms ease, border-color 140ms ease, transform 140ms ease;
    text-align: left;
    width: 100%;
    box-sizing: border-box;
}

body.rt-auth .rt-419-key:hover,
body.rt-auth .rt-419-key:focus-visible {
    background: var(--rt-bg-2);
    border-color: var(--rt-accent-blue);
    color: var(--rt-fg-0);
    text-decoration: none !important;
    outline: none;
    transform: translateX(2px);
}

body.rt-auth .rt-419-key-label {
    flex: 1;
}

body.rt-auth .rt-419-kbd {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 26px;
    height: 26px;
    padding: 0 6px;
    border-radius: 6px;
    background: linear-gradient(180deg, var(--rt-bg-3), var(--rt-bg-2));
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-bottom-width: 2px;
    color: var(--rt-accent-blue);
    font-family: var(--rt-font-mono);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    flex-shrink: 0;
}

body.rt-auth .rt-419-key-arrow {
    color: var(--rt-fg-2);
    transition: color 140ms ease, transform 140ms ease;
    flex-shrink: 0;
}

body.rt-auth .rt-419-key:hover .rt-419-key-arrow {
    color: var(--rt-accent-blue);
    transform: translateX(2px);
}

body.rt-auth .rt-419-cursor {
    margin-top: 20px;
}

body.rt-auth .rt-419-cursor-caret {
    display: inline-block;
    width: 8px;
    height: 15px;
    background: var(--rt-accent-blue);
    vertical-align: middle;
    margin-left: 2px;
    animation: rt-419-blink 1s steps(2, end) infinite;
}

@keyframes rt-419-blink {
    0%, 50%   { opacity: 1; }
    51%, 100% { opacity: 0; }
}

body.rt-auth .rt-419-terminal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    background: #0a0d12;
    border-top: 1px solid var(--rt-bg-3);
    font-family: var(--rt-font-mono);
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--rt-fg-2);
}

body.rt-auth .rt-419-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

body.rt-auth .rt-419-status-badge::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--rt-accent-blue);
    box-shadow: 0 0 6px var(--rt-accent-blue);
}

@media (max-width: 560px) {
    body.rt-auth .rt-419-terminal-body { padding: 20px 18px; font-size: 12px; }
    body.rt-auth .rt-419-key { font-size: 13px; padding: 10px 12px; }
    body.rt-auth .rt-419-terminal-title { display: none; }
}

/* =============================================================================
 * 429 Too Many Requests page (amber warning aesthetic)
 * ============================================================================= */

body.rt-auth .rt-429-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    position: relative;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
}

body.rt-auth .rt-429-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 20% 20%, rgba(255, 179, 71, 0.06), transparent 40%),
        radial-gradient(circle at 80% 70%, rgba(42, 139, 255, 0.05), transparent 40%),
        repeating-linear-gradient(0deg, transparent 0, transparent 30px, rgba(255, 255, 255, 0.015) 30px, rgba(255, 255, 255, 0.015) 31px);
    pointer-events: none;
    z-index: 0;
}

body.rt-auth .rt-429-brand {
    margin-bottom: 44px;
    color: var(--rt-fg-1);
    opacity: 0.85;
    position: relative;
    z-index: 1;
}

body.rt-auth .rt-429-card {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 640px;
    background: var(--rt-bg-1);
    border: 1px solid var(--rt-bg-3);
    border-radius: 20px;
    padding: 44px 44px 40px;
    box-shadow:
        0 24px 48px -20px rgba(0, 0, 0, 0.6),
        0 0 0 1px rgba(255, 179, 71, 0.06) inset;
    box-sizing: border-box;
}

body.rt-auth .rt-429-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 24px;
    right: 24px;
    height: 3px;
    border-radius: 0 0 4px 4px;
    background: linear-gradient(90deg, transparent, var(--rt-accent-amber), transparent);
    opacity: 0.9;
}

body.rt-auth .rt-429-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--rt-accent-amber);
    margin-bottom: 22px;
}

body.rt-auth .rt-429-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--rt-accent-amber);
    box-shadow: 0 0 10px rgba(255, 179, 71, 0.7);
    animation: rt-429-pulse 1.4s ease-in-out infinite;
}

@keyframes rt-429-pulse {
    0%, 100% { opacity: 0.5; transform: scale(0.9); }
    50%      { opacity: 1;   transform: scale(1.1); }
}

body.rt-auth .rt-429-number {
    font-family: var(--rt-font-mono);
    font-size: 128px;
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1;
    color: var(--rt-fg-0);
    margin: 0 0 12px;
    display: flex;
    align-items: baseline;
    gap: 14px;
}

body.rt-auth .rt-429-number-suffix {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.24em;
    color: var(--rt-accent-amber);
    text-transform: uppercase;
    font-family: var(--rt-font-mono);
    opacity: 0.85;
}

body.rt-auth .rt-429-title {
    font-family: var(--rt-font-body, inherit);
    font-size: 30px;
    font-weight: 700;
    color: var(--rt-fg-0);
    margin: 0 0 12px;
    line-height: 1.15;
}

body.rt-auth .rt-429-subtitle {
    color: var(--rt-fg-1);
    font-size: 15px;
    line-height: 1.6;
    margin: 0 0 32px;
    max-width: 480px;
}

body.rt-auth .rt-429-countdown {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: center;
    padding: 16px 20px;
    border-radius: 12px;
    background: var(--rt-bg-2);
    border: 1px solid var(--rt-bg-3);
    margin: 0 0 32px;
}

body.rt-auth .rt-429-countdown-label {
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--rt-fg-2);
    line-height: 1.1;
}

body.rt-auth .rt-429-countdown-value {
    font-family: var(--rt-font-mono);
    font-size: 22px;
    font-weight: 700;
    color: var(--rt-fg-0);
    letter-spacing: 0.08em;
    line-height: 1;
    justify-self: end;
}

body.rt-auth .rt-429-countdown.rt-429-ready .rt-429-countdown-value {
    color: var(--rt-accent-green);
}

body.rt-auth .rt-429-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

body.rt-auth .rt-429-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 22px;
    border-radius: 10px;
    font-family: var(--rt-font-body, inherit);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-decoration: none !important;
    border: 1px solid var(--rt-bg-3);
    background: var(--rt-bg-2);
    color: var(--rt-fg-0);
    cursor: pointer;
    transition: background 140ms ease, border-color 140ms ease, transform 140ms ease, opacity 140ms ease;
}

body.rt-auth .rt-429-btn:hover {
    background: var(--rt-bg-3);
    border-color: var(--rt-fg-2);
    color: var(--rt-fg-0);
    text-decoration: none !important;
}

body.rt-auth .rt-429-btn-primary {
    background: var(--rt-accent-amber);
    border-color: var(--rt-accent-amber);
    color: #1a1206;
}

body.rt-auth .rt-429-btn-primary:hover {
    background: #ffc172;
    border-color: #ffc172;
    color: #1a1206;
    transform: translateY(-1px);
}

body.rt-auth .rt-429-btn-primary.rt-disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
    transform: none;
}

body.rt-auth .rt-429-btn svg {
    width: 14px;
    height: 14px;
}

body.rt-auth .rt-429-footnote {
    margin-top: 28px;
    font-family: var(--rt-font-mono);
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--rt-fg-2);
    opacity: 0.7;
}

@media (max-width: 560px) {
    body.rt-auth .rt-429-card { padding: 32px 24px; border-radius: 16px; }
    body.rt-auth .rt-429-number { font-size: 96px; }
    body.rt-auth .rt-429-title { font-size: 24px; }
}

/* =============================================================================
 * 404 Not Found page (split hero with glitched numeral)
 * ============================================================================= */

body.rt-auth .rt-404-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    position: relative;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
}

body.rt-auth .rt-404-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 30% 20%, rgba(42, 139, 255, 0.08), transparent 45%),
        radial-gradient(ellipse at 70% 80%, rgba(232, 87, 87, 0.05), transparent 45%);
    pointer-events: none;
    z-index: 0;
}

body.rt-auth .rt-404-brand {
    margin-bottom: 32px;
    color: var(--rt-fg-1);
    opacity: 0.85;
    position: relative;
    z-index: 1;
}

body.rt-auth .rt-404-card {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 820px;
    display: grid;
    grid-template-columns: minmax(0, 320px) 1fr;
    background: var(--rt-bg-1);
    border: 1px solid var(--rt-bg-3);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 30px 60px -24px rgba(0, 0, 0, 0.7);
    box-sizing: border-box;
}

/* Left hero panel */
body.rt-auth .rt-404-hero {
    position: relative;
    padding: 40px 32px;
    background:
        linear-gradient(160deg, #0e1116 0%, #06080b 100%);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-right: 1px solid var(--rt-bg-3);
    min-height: 320px;
    overflow: hidden;
}

body.rt-auth .rt-404-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
    background-size: 22px 22px;
    -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%);
    mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%);
    pointer-events: none;
}

body.rt-auth .rt-404-hero-badge {
    align-self: flex-start;
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.24em;
    color: var(--rt-accent-blue);
    padding: 5px 10px;
    border-radius: 4px;
    background: rgba(42, 139, 255, 0.12);
    border: 1px solid rgba(42, 139, 255, 0.25);
    position: relative;
    z-index: 1;
}

body.rt-auth .rt-404-number {
    font-family: var(--rt-font-mono);
    font-size: 108px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.04em;
    color: var(--rt-fg-0);
    text-align: left;
    margin: 20px 0;
    position: relative;
    z-index: 1;
}

/* Chromatic-aberration glitch effect */
body.rt-auth .rt-404-glitch {
    position: relative;
    display: inline-block;
}

body.rt-auth .rt-404-glitch::before,
body.rt-auth .rt-404-glitch::after {
    content: attr(data-text);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

body.rt-auth .rt-404-glitch::before {
    color: var(--rt-accent-red);
    transform: translate(-3px, 0);
    opacity: 0.55;
    mix-blend-mode: screen;
    animation: rt-404-glitch-a 3.6s infinite steps(1, end);
}

body.rt-auth .rt-404-glitch::after {
    color: var(--rt-accent-blue);
    transform: translate(3px, 0);
    opacity: 0.55;
    mix-blend-mode: screen;
    animation: rt-404-glitch-b 3.6s infinite steps(1, end);
}

@keyframes rt-404-glitch-a {
    0%, 92%   { transform: translate(-3px, 0); }
    93%       { transform: translate(-6px, -2px); }
    94%       { transform: translate(-2px, 1px); }
    95%       { transform: translate(-5px, 0); }
    96%, 100% { transform: translate(-3px, 0); }
}

@keyframes rt-404-glitch-b {
    0%, 92%   { transform: translate(3px, 0); }
    93%       { transform: translate(6px, 2px); }
    94%       { transform: translate(2px, -1px); }
    95%       { transform: translate(5px, 0); }
    96%, 100% { transform: translate(3px, 0); }
}

body.rt-auth .rt-404-hero-line {
    height: 2px;
    width: 40px;
    background: var(--rt-accent-blue);
    box-shadow: 0 0 12px rgba(42, 139, 255, 0.6);
    margin-bottom: 14px;
    position: relative;
    z-index: 1;
}

body.rt-auth .rt-404-hero-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: var(--rt-font-mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--rt-fg-2);
    position: relative;
    z-index: 1;
}

body.rt-auth .rt-404-status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--rt-accent-red);
    box-shadow: 0 0 8px rgba(232, 87, 87, 0.7);
    animation: rt-404-blip 2s ease-in-out infinite;
}

@keyframes rt-404-blip {
    0%, 100% { opacity: 0.45; }
    50%      { opacity: 1;    }
}

/* Right info panel */
body.rt-auth .rt-404-info {
    padding: 40px 36px;
}

body.rt-auth .rt-404-eyebrow {
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--rt-accent-blue);
    margin-bottom: 14px;
}

body.rt-auth .rt-404-title {
    font-size: 26px;
    font-weight: 700;
    color: var(--rt-fg-0);
    margin: 0 0 12px;
    line-height: 1.2;
}

body.rt-auth .rt-404-subtitle {
    color: var(--rt-fg-1);
    font-size: 14px;
    line-height: 1.65;
    margin: 0 0 26px;
}

body.rt-auth .rt-404-path-label {
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--rt-fg-2);
    margin-bottom: 8px;
}

body.rt-auth .rt-404-path {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 10px;
    background: var(--rt-bg-2);
    border: 1px solid var(--rt-bg-3);
    margin-bottom: 28px;
    overflow-x: auto;
}

body.rt-auth .rt-404-path svg {
    width: 14px;
    height: 14px;
    color: var(--rt-fg-2);
    flex-shrink: 0;
}

body.rt-auth .rt-404-path code {
    font-family: var(--rt-font-mono);
    font-size: 13px;
    color: var(--rt-accent-blue);
    background: transparent;
    padding: 0;
    white-space: nowrap;
    letter-spacing: 0.02em;
}

body.rt-auth .rt-404-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

body.rt-auth .rt-404-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 18px;
    border-radius: 10px;
    font-family: var(--rt-font-body, inherit);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-decoration: none !important;
    border: 1px solid var(--rt-bg-3);
    background: var(--rt-bg-2);
    color: var(--rt-fg-0);
    cursor: pointer;
    transition: background 140ms ease, border-color 140ms ease, transform 140ms ease;
}

body.rt-auth .rt-404-btn:hover {
    background: var(--rt-bg-3);
    border-color: var(--rt-fg-2);
    color: var(--rt-fg-0);
    text-decoration: none !important;
    transform: translateY(-1px);
}

body.rt-auth .rt-404-btn-primary {
    background: var(--rt-accent-blue);
    border-color: var(--rt-accent-blue);
    color: #ffffff;
}

body.rt-auth .rt-404-btn-primary:hover {
    background: #4d9dff;
    border-color: #4d9dff;
    color: #ffffff;
}

body.rt-auth .rt-404-btn svg {
    width: 14px;
    height: 14px;
}

body.rt-auth .rt-404-footnote {
    margin-top: 24px;
    font-family: var(--rt-font-mono);
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--rt-fg-2);
    opacity: 0.65;
    position: relative;
    z-index: 1;
}

@media (max-width: 720px) {
    body.rt-auth .rt-404-card { grid-template-columns: 1fr; }
    body.rt-auth .rt-404-hero { border-right: 0; border-bottom: 1px solid var(--rt-bg-3); min-height: 240px; }
    body.rt-auth .rt-404-number { font-size: 84px; }
    body.rt-auth .rt-404-info { padding: 32px 24px; }
    body.rt-auth .rt-404-title { font-size: 22px; }
}

/* =============================================================================
 * Date Filter Modal (dashboard)
 * Renter Mode redesign — preserves all df-* class hooks and IDs used by
 * public/js/modal-filter.js.
 * ============================================================================= */

body.rt-admin .rt-date-filter-modal .modal-dialog.df-modal-dialog {
    max-width: 860px;
    margin: 5vh auto;
}

body.rt-admin .rt-date-filter-modal .modal-content.df-modal-content {
    background: var(--rt-bg-1) !important;
    border: 1px solid var(--rt-bg-3) !important;
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow:
        0 30px 60px -24px rgba(0, 0, 0, 0.7),
        0 0 0 1px rgba(42, 139, 255, 0.06) inset !important;
    max-width: none !important;
    margin: 0 !important;
}

/* Custom header replaces the old blank space */
body.rt-admin .rt-date-filter-modal .rt-date-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 22px;
    background: linear-gradient(180deg, var(--rt-bg-2), var(--rt-bg-1));
    border-bottom: 1px solid var(--rt-bg-3);
    position: relative;
}

body.rt-admin .rt-date-filter-modal .rt-date-filter-header::after {
    content: "";
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: -1px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--rt-accent-blue), transparent);
    opacity: 0.4;
}

body.rt-admin .rt-date-filter-modal .rt-date-filter-title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--rt-fg-0);
    font-family: var(--rt-font-mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.28em;
    text-transform: uppercase;
}

body.rt-admin .rt-date-filter-modal .rt-date-filter-title-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--rt-accent-blue);
    box-shadow: 0 0 8px rgba(42, 139, 255, 0.6);
}

body.rt-admin .rt-date-filter-modal .rt-date-filter-close {
    background: transparent;
    border: 1px solid var(--rt-bg-3);
    color: var(--rt-fg-1);
    font-size: 20px;
    line-height: 1;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    transition: background 140ms ease, color 140ms ease, border-color 140ms ease;
}

body.rt-admin .rt-date-filter-modal .rt-date-filter-close:hover {
    background: var(--rt-bg-2);
    color: var(--rt-fg-0);
    border-color: var(--rt-fg-2);
}

body.rt-admin .rt-date-filter-modal .modal-body {
    padding: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.rt-admin .rt-date-filter-modal .df-overlay-container {
    display: grid;
    grid-template-columns: 200px 1fr;
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    gap: 0;
}

/* ==== Left panel — quick shortcuts ==== */
body.rt-admin .rt-date-filter-modal .df-shortcuts-panel {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 20px 14px;
    background: var(--rt-bg-2);
    border-right: 1px solid var(--rt-bg-3);
}

body.rt-admin .rt-date-filter-modal .df-shortcut-item {
    display: flex;
    align-items: center;
    padding: 10px 14px;
    border-radius: 8px;
    cursor: pointer;
    background: transparent;
    border: 1px solid transparent;
    transition: background 140ms ease, border-color 140ms ease, color 140ms ease, transform 140ms ease;
    color: var(--rt-fg-1);
}

body.rt-admin .rt-date-filter-modal .df-shortcut-item:hover {
    background: var(--rt-bg-3);
    color: var(--rt-fg-0);
    transform: translateX(2px);
}

body.rt-admin .rt-date-filter-modal .df-shortcut-item.df-selected {
    background: rgba(42, 139, 255, 0.12);
    border-color: rgba(42, 139, 255, 0.35);
    color: var(--rt-accent-blue);
    box-shadow: inset 3px 0 0 var(--rt-accent-blue);
    transform: none;
}

body.rt-admin .rt-date-filter-modal .df-shortcut-label {
    font-family: var(--rt-font-body, system-ui, sans-serif);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.2;
}

body.rt-admin .rt-date-filter-modal .df-shortcut-item.df-selected .df-shortcut-label {
    color: var(--rt-accent-blue);
    font-weight: 700;
}

/* ==== Right panel — calendar section ==== */
body.rt-admin .rt-date-filter-modal .df-calendar-section {
    padding: 22px 22px 18px;
    background: var(--rt-bg-1);
    display: flex;
    flex-direction: column;
    gap: 18px;
}

body.rt-admin .rt-date-filter-modal .df-range-picker {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

body.rt-admin .rt-date-filter-modal .df-picker-container {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

body.rt-admin .rt-date-filter-modal .df-input-field {
    background: transparent;
    padding: 0;
}

body.rt-admin .rt-date-filter-modal .df-date-input {
    width: 100%;
    background: var(--rt-bg-2);
    border: 1px solid var(--rt-bg-3);
    border-radius: 10px;
    padding: 10px 14px;
    color: var(--rt-fg-0);
    font-family: var(--rt-font-mono);
    font-size: 13px;
    letter-spacing: 0.06em;
    outline: none;
    transition: border-color 140ms ease, background 140ms ease;
}

body.rt-admin .rt-date-filter-modal .df-date-input::placeholder {
    color: var(--rt-fg-2);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-size: 11px;
}

body.rt-admin .rt-date-filter-modal .df-date-input:focus {
    border-color: var(--rt-accent-blue);
    background: var(--rt-bg-1);
    box-shadow: 0 0 0 3px rgba(42, 139, 255, 0.12);
}

/* Calendar widget */
body.rt-admin .rt-date-filter-modal .df-calendar-widget {
    background: var(--rt-bg-2);
    border: 1px solid var(--rt-bg-3);
    border-radius: 12px;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

body.rt-admin .rt-date-filter-modal .df-calendar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 4px;
}

body.rt-admin .rt-date-filter-modal .df-month-year-selector {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

body.rt-admin .rt-date-filter-modal .df-month-year-text {
    color: var(--rt-fg-0);
    font-family: var(--rt-font-mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

body.rt-admin .rt-date-filter-modal .df-month-navigation {
    display: inline-flex;
    gap: 4px;
}

body.rt-admin .rt-date-filter-modal .df-nav-arrow {
    width: 26px;
    height: 26px;
    border-radius: 6px;
    background: var(--rt-bg-3);
    border: 1px solid var(--rt-bg-3);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 140ms ease, border-color 140ms ease;
    position: relative;
}

body.rt-admin .rt-date-filter-modal .df-nav-arrow:hover {
    background: var(--rt-bg-1);
    border-color: var(--rt-accent-blue);
}

/* Chevron via CSS (works regardless of what df-arrow-icon renders) */
body.rt-admin .rt-date-filter-modal .df-nav-arrow.df-arrow-left::before,
body.rt-admin .rt-date-filter-modal .df-nav-arrow.df-arrow-right::before {
    content: "";
    width: 6px;
    height: 6px;
    border-top: 1.5px solid var(--rt-fg-1);
    border-right: 1.5px solid var(--rt-fg-1);
    display: inline-block;
}

body.rt-admin .rt-date-filter-modal .df-nav-arrow.df-arrow-left::before {
    transform: rotate(-135deg);
    margin-right: -2px;
}

body.rt-admin .rt-date-filter-modal .df-nav-arrow.df-arrow-right::before {
    transform: rotate(45deg);
    margin-left: -2px;
}

body.rt-admin .rt-date-filter-modal .df-nav-arrow:hover.df-arrow-left::before,
body.rt-admin .rt-date-filter-modal .df-nav-arrow:hover.df-arrow-right::before {
    border-color: var(--rt-accent-blue);
}

/* Hide the empty df-arrow-icon divs inside month/year selector + arrows so we don't render junk */
body.rt-admin .rt-date-filter-modal .df-arrow-icon {
    display: none;
}

/* Calendar grid */
body.rt-admin .rt-date-filter-modal .df-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}

body.rt-admin .rt-date-filter-modal .df-weekday-header {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px 0;
}

body.rt-admin .rt-date-filter-modal .df-weekday-label {
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--rt-fg-2);
}

/* Date cells — target any cell that isn't a weekday header inside the grid */
body.rt-admin .rt-date-filter-modal .df-calendar-grid > div:not(.df-weekday-header) {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    border-radius: 8px;
    font-family: var(--rt-font-body, system-ui, sans-serif);
    font-size: 13px;
    font-weight: 500;
    color: var(--rt-fg-1);
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease, transform 120ms ease;
    user-select: none;
}

body.rt-admin .rt-date-filter-modal .df-calendar-grid > div:not(.df-weekday-header):hover {
    background: var(--rt-bg-3);
    color: var(--rt-fg-0);
}

/* Common state-class hooks the JS likely toggles */
body.rt-admin .rt-date-filter-modal .df-calendar-grid > div.df-other-month,
body.rt-admin .rt-date-filter-modal .df-calendar-grid > div.df-outside {
    color: var(--rt-fg-2);
    opacity: 0.35;
}

body.rt-admin .rt-date-filter-modal .df-calendar-grid > div.df-today {
    color: var(--rt-accent-blue);
    font-weight: 700;
    box-shadow: inset 0 0 0 1px var(--rt-accent-blue);
}

body.rt-admin .rt-date-filter-modal .df-calendar-grid > div.df-selected,
body.rt-admin .rt-date-filter-modal .df-calendar-grid > div.df-active,
body.rt-admin .rt-date-filter-modal .df-calendar-grid > div.df-start,
body.rt-admin .rt-date-filter-modal .df-calendar-grid > div.df-end {
    background: var(--rt-accent-blue);
    color: #ffffff;
    font-weight: 700;
    box-shadow: 0 4px 10px -2px rgba(42, 139, 255, 0.5);
}

body.rt-admin .rt-date-filter-modal .df-calendar-grid > div.df-in-range,
body.rt-admin .rt-date-filter-modal .df-calendar-grid > div.df-range {
    background: rgba(42, 139, 255, 0.12);
    color: var(--rt-accent-blue);
    border-radius: 0;
}

body.rt-admin .rt-date-filter-modal .df-calendar-grid > div.df-disabled {
    opacity: 0.25;
    pointer-events: none;
}

/* ==== Bottom actions ==== */
body.rt-admin .rt-date-filter-modal .df-actions-panel {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 12px 0 0;
    border-top: 1px solid var(--rt-bg-3);
    margin-top: 2px;
}

body.rt-admin .rt-date-filter-modal .df-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 22px;
    border-radius: 10px;
    font-family: var(--rt-font-body, system-ui, sans-serif);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    cursor: pointer;
    border: 1px solid var(--rt-bg-3);
    background: var(--rt-bg-2);
    color: var(--rt-fg-0);
    transition: background 140ms ease, border-color 140ms ease, transform 140ms ease;
    min-width: 100px;
}

body.rt-admin .rt-date-filter-modal .df-action-btn.df-secondary {
    background: transparent;
    color: var(--rt-fg-1);
}

body.rt-admin .rt-date-filter-modal .df-action-btn.df-secondary:hover {
    background: var(--rt-bg-3);
    color: var(--rt-fg-0);
    border-color: var(--rt-fg-2);
}

body.rt-admin .rt-date-filter-modal .df-action-btn.df-primary {
    background: var(--rt-accent-blue);
    border-color: var(--rt-accent-blue);
    color: #ffffff;
}

body.rt-admin .rt-date-filter-modal .df-action-btn.df-primary:hover {
    background: #4d9dff;
    border-color: #4d9dff;
    transform: translateY(-1px);
}

body.rt-admin .rt-date-filter-modal .df-action-btn-text {
    font-family: inherit;
    color: inherit;
    letter-spacing: inherit;
}

/* Responsive — stack shortcut list on top */
@media (max-width: 720px) {
    body.rt-admin .rt-date-filter-modal .modal-dialog.df-modal-dialog {
        max-width: 96vw;
        margin: 2vh auto;
    }
    body.rt-admin .rt-date-filter-modal .df-overlay-container {
        grid-template-columns: 1fr;
    }
    body.rt-admin .rt-date-filter-modal .df-shortcuts-panel {
        flex-direction: row;
        flex-wrap: wrap;
        border-right: 0;
        border-bottom: 1px solid var(--rt-bg-3);
        padding: 12px 14px;
    }
    body.rt-admin .rt-date-filter-modal .df-shortcut-item.df-selected {
        box-shadow: inset 0 -3px 0 var(--rt-accent-blue);
    }
    body.rt-admin .rt-date-filter-modal .df-range-picker {
        grid-template-columns: 1fr;
    }
}

/* =============================================================================
 * Inline image gallery (post show page)
 * ============================================================================= */

body.rt-admin .rt-image-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 12px;
}

body.rt-admin .rt-image-gallery-item {
    position: relative;
    display: block;
    aspect-ratio: 1 / 1;
    border-radius: 10px;
    overflow: hidden;
    background: var(--rt-bg-2);
    border: 1px solid var(--rt-bg-3);
    cursor: zoom-in;
    text-decoration: none !important;
    padding: 0;
    margin: 0;
    width: 100%;
    font: inherit;
    color: inherit;
    outline: none;
    transition: border-color 140ms ease, transform 140ms ease, box-shadow 140ms ease;
}

body.rt-admin .rt-image-gallery-item:focus-visible {
    border-color: var(--rt-accent-blue);
    box-shadow: 0 0 0 3px rgba(42, 139, 255, 0.25);
}

body.rt-admin .rt-image-gallery-item:hover {
    border-color: var(--rt-accent-blue);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px -12px rgba(42, 139, 255, 0.5);
}

body.rt-admin .rt-image-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 240ms cubic-bezier(0.16, 1, 0.3, 1);
}

body.rt-admin .rt-image-gallery-item:hover img {
    transform: scale(1.04);
}

body.rt-admin .rt-image-gallery-index {
    position: absolute;
    top: 8px;
    left: 8px;
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    color: var(--rt-fg-0);
    padding: 3px 7px;
    border-radius: 5px;
    background: rgba(6, 8, 11, 0.75);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

@media (max-width: 560px) {
    body.rt-admin .rt-image-gallery {
        grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
        gap: 8px;
    }
}

/* =============================================================================
 * Themed image lightbox
 * ============================================================================= */

body.rt-admin .rt-lightbox {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
    opacity: 0;
    transition: opacity 180ms ease;
}

body.rt-admin .rt-lightbox.rt-lightbox-open {
    display: flex;
    opacity: 1;
}

body.rt-admin .rt-lightbox-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(6, 8, 11, 0.86);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    cursor: zoom-out;
}

body.rt-admin .rt-lightbox-frame {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1200px;
    max-height: calc(100vh - 80px);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

body.rt-admin .rt-lightbox-topbar {
    position: absolute;
    top: -32px;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 4px;
    z-index: 2;
}

body.rt-admin .rt-lightbox-counter {
    font-family: var(--rt-font-mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    color: var(--rt-fg-1);
    padding: 6px 10px;
    background: rgba(20, 24, 30, 0.75);
    border: 1px solid var(--rt-bg-3);
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

body.rt-admin .rt-lightbox-actions {
    display: inline-flex;
    gap: 6px;
}

body.rt-admin .rt-lightbox-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid var(--rt-bg-3);
    background: rgba(20, 24, 30, 0.75);
    color: var(--rt-fg-1);
    cursor: pointer;
    padding: 0;
    text-decoration: none !important;
    transition: background 140ms ease, color 140ms ease, border-color 140ms ease;
}

body.rt-admin .rt-lightbox-btn:hover {
    background: var(--rt-bg-2);
    color: var(--rt-fg-0);
    border-color: var(--rt-accent-blue);
}

body.rt-admin .rt-lightbox-btn svg {
    width: 15px;
    height: 15px;
}

body.rt-admin .rt-lightbox-stage {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    max-height: calc(100vh - 80px);
    min-width: 0;
}

body.rt-admin .rt-lightbox-stage img {
    max-width: 100%;
    max-height: calc(100vh - 100px);
    display: block;
    border-radius: 8px;
    box-shadow:
        0 30px 60px -20px rgba(0, 0, 0, 0.8),
        0 0 0 1px rgba(255, 255, 255, 0.06);
    animation: rt-lightbox-in 220ms cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes rt-lightbox-in {
    from { opacity: 0; transform: scale(0.96); }
    to   { opacity: 1; transform: scale(1); }
}

body.rt-admin .rt-lightbox-nav {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid var(--rt-bg-3);
    background: rgba(20, 24, 30, 0.85);
    color: var(--rt-fg-0);
    cursor: pointer;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 140ms ease, border-color 140ms ease, transform 140ms ease;
}

body.rt-admin .rt-lightbox-nav:hover {
    background: var(--rt-bg-2);
    border-color: var(--rt-accent-blue);
    color: var(--rt-accent-blue);
    transform: scale(1.06);
}

body.rt-admin .rt-lightbox-nav svg {
    width: 18px;
    height: 18px;
}

@media (max-width: 640px) {
    body.rt-admin .rt-lightbox {
        padding: 20px 12px;
    }
    body.rt-admin .rt-lightbox-topbar {
        top: -28px;
    }
    body.rt-admin .rt-lightbox-nav {
        width: 36px;
        height: 36px;
    }
    body.rt-admin .rt-lightbox-frame {
        gap: 6px;
    }
}

/* =============================================================================
 * Sidebar list-style safety net (some prod stylesheets don't zero it)
 * ============================================================================= */

body.rt-admin #sidebar-wrapper ul,
body.rt-admin .sidebar-menu,
body.rt-admin .rt-collapsible-list,
body.rt-admin #settings_list {
    list-style: none !important;
    list-style-image: none !important;
    list-style-position: outside !important;
    padding-left: 0 !important;
}

body.rt-admin #sidebar-wrapper ul li,
body.rt-admin .sidebar-menu li,
body.rt-admin .rt-collapsible-list li,
body.rt-admin #settings_list li {
    list-style: none !important;
    list-style-image: none !important;
}

body.rt-admin #sidebar-wrapper ul li::marker,
body.rt-admin .sidebar-menu li::marker,
body.rt-admin .rt-collapsible-list li::marker,
body.rt-admin #settings_list li::marker {
    content: "" !important;
    color: transparent !important;
    font-size: 0 !important;
}

/* =============================================================================
 * Route Permissions page
 * ============================================================================= */

body.rt-admin .rt-permission-matrix {
    border-collapse: separate;
    border-spacing: 0;
}

body.rt-admin .rt-permission-matrix thead th {
    background: var(--rt-bg-2);
    border-bottom: 1px solid var(--rt-bg-3);
    padding: 14px 16px;
    text-align: center;
    vertical-align: middle;
}

body.rt-admin .rt-permission-matrix thead th.rt-perm-page-col {
    text-align: left;
    min-width: 260px;
}

body.rt-admin .rt-permission-matrix thead th.rt-perm-role-col {
    min-width: 130px;
}

body.rt-admin .rt-perm-role-name {
    font-family: var(--rt-font-mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--rt-fg-0);
    line-height: 1.2;
    margin-bottom: 4px;
}

body.rt-admin .rt-perm-select-all {
    display: inline-block;
    font-family: var(--rt-font-body, system-ui, sans-serif);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--rt-accent-blue);
    text-decoration: none !important;
    padding: 2px 6px;
    border-radius: 4px;
    transition: background 120ms ease;
}

body.rt-admin .rt-perm-select-all:hover {
    background: rgba(42, 139, 255, 0.12);
    color: var(--rt-accent-blue);
    text-decoration: none !important;
}

body.rt-admin .rt-perm-select-locked {
    font-family: var(--rt-font-body, system-ui, sans-serif);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--rt-accent-green);
    padding: 2px 6px;
    background: rgba(52, 199, 89, 0.1);
    border-radius: 4px;
}

body.rt-admin .rt-perm-group-row td {
    background: var(--rt-bg-2);
    padding: 12px 16px;
    border-top: 1px solid var(--rt-bg-3);
    border-bottom: 1px solid var(--rt-bg-3);
}

body.rt-admin .rt-perm-group-label {
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--rt-accent-blue);
}

body.rt-admin .rt-perm-group-count {
    display: inline-block;
    margin-left: 10px;
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    color: var(--rt-fg-2);
    padding: 2px 8px;
    background: var(--rt-bg-3);
    border-radius: 10px;
}

body.rt-admin .rt-perm-route-name {
    padding: 12px 16px !important;
    text-align: left !important;
}

body.rt-admin .rt-perm-route-label {
    display: block;
    color: var(--rt-fg-0);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
    margin-bottom: 2px;
}

body.rt-admin .rt-perm-route-prefix {
    display: inline-block;
    font-family: var(--rt-font-mono);
    font-size: 10px;
    color: var(--rt-fg-2);
    background: transparent;
    padding: 0;
    letter-spacing: 0.04em;
}

body.rt-admin .rt-perm-checkbox-cell {
    text-align: center !important;
    vertical-align: middle !important;
    padding: 10px !important;
}

/* Themed checkbox */
body.rt-admin .rt-perm-checkbox {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    line-height: 0;
    margin: 0;
}

body.rt-admin .rt-perm-checkbox input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

body.rt-admin .rt-perm-checkbox-box {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 6px;
    background: var(--rt-bg-2);
    border: 1.5px solid var(--rt-bg-3);
    position: relative;
    transition: background 120ms ease, border-color 120ms ease, transform 120ms ease;
}

body.rt-admin .rt-perm-checkbox:hover .rt-perm-checkbox-box {
    border-color: var(--rt-accent-blue);
    transform: scale(1.06);
}

body.rt-admin .rt-perm-checkbox input:checked + .rt-perm-checkbox-box {
    background: var(--rt-accent-blue);
    border-color: var(--rt-accent-blue);
}

body.rt-admin .rt-perm-checkbox input:checked + .rt-perm-checkbox-box::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

body.rt-admin .rt-perm-checkbox-locked .rt-perm-checkbox-box {
    background: rgba(52, 199, 89, 0.16);
    border-color: rgba(52, 199, 89, 0.5);
    cursor: not-allowed;
}

body.rt-admin .rt-perm-checkbox-locked .rt-perm-checkbox-box::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid var(--rt-accent-green);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* =============================================================================
 * Compare Modal (dashboard) — themed to match date filter
 * ============================================================================= */

body.rt-admin .rt-compare-modal .modal-dialog {
    max-width: 460px;
    margin: 8vh auto;
}

body.rt-admin .rt-compare-modal .modal-content {
    background: var(--rt-bg-1) !important;
    border: 1px solid var(--rt-bg-3) !important;
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow:
        0 30px 60px -24px rgba(0, 0, 0, 0.7),
        0 0 0 1px rgba(42, 139, 255, 0.06) inset !important;
}

body.rt-admin .rt-compare-modal .modal-body {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 22px !important;
}

body.rt-admin .rt-compare-modal .cp-header {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--rt-bg-3);
    margin-bottom: 20px;
    position: relative;
}

body.rt-admin .rt-compare-modal .cp-header::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--rt-accent-blue), transparent);
    opacity: 0.5;
}

body.rt-admin .rt-compare-modal .cp-title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: var(--rt-fg-0) !important;
    font-family: var(--rt-font-mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.24em;
    text-transform: uppercase;
}

body.rt-admin .rt-compare-modal .rt-compare-title-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--rt-accent-blue);
    box-shadow: 0 0 8px rgba(42, 139, 255, 0.6);
}

body.rt-admin .rt-compare-modal .cp-close-btn {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid var(--rt-bg-3);
    background: transparent !important;
    color: var(--rt-fg-1);
    padding: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}

body.rt-admin .rt-compare-modal .cp-close-btn:hover {
    background: var(--rt-bg-2);
    border-color: var(--rt-fg-2);
    color: var(--rt-fg-0);
}

body.rt-admin .rt-compare-modal .cp-close-icon {
    position: relative;
    width: 14px;
    height: 14px;
}

body.rt-admin .rt-compare-modal .cp-close-icon::before,
body.rt-admin .rt-compare-modal .cp-close-icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 1.6px;
    background: currentColor;
    border-radius: 2px;
}

body.rt-admin .rt-compare-modal .cp-close-icon::before { transform: translate(-50%, -50%) rotate(45deg); }
body.rt-admin .rt-compare-modal .cp-close-icon::after  { transform: translate(-50%, -50%) rotate(-45deg); }

body.rt-admin .rt-compare-modal .cp-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 22px;
}

body.rt-admin .rt-compare-modal .cp-input-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

body.rt-admin .rt-compare-modal .cp-input-label {
    color: var(--rt-fg-2) !important;
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    margin: 0;
}

body.rt-admin .rt-compare-modal .cp-input-container {
    position: relative;
}

body.rt-admin .rt-compare-modal .cp-month-input {
    width: 100%;
    background: var(--rt-bg-2) !important;
    border: 1px solid var(--rt-bg-3) !important;
    border-radius: 10px;
    padding: 12px 44px 12px 14px;
    color: var(--rt-fg-0) !important;
    font-family: var(--rt-font-body, system-ui, sans-serif);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.02em;
    outline: none;
    cursor: pointer;
    transition: border-color 140ms ease, background 140ms ease;
}

body.rt-admin .rt-compare-modal .cp-month-input::placeholder {
    color: var(--rt-fg-2);
    letter-spacing: 0.06em;
    text-transform: none;
}

body.rt-admin .rt-compare-modal .cp-month-input:focus,
body.rt-admin .rt-compare-modal .cp-month-input:hover {
    border-color: var(--rt-accent-blue) !important;
    background: var(--rt-bg-1) !important;
    box-shadow: 0 0 0 3px rgba(42, 139, 255, 0.12);
}

body.rt-admin .rt-compare-modal .cp-calendar-icon {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    color: var(--rt-fg-2);
    pointer-events: none;
}

body.rt-admin .rt-compare-modal .cp-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 16px;
    border-top: 1px solid var(--rt-bg-3);
}

body.rt-admin .rt-compare-modal .cp-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 22px;
    border-radius: 10px;
    font-family: var(--rt-font-body, system-ui, sans-serif);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    cursor: pointer;
    border: 1px solid var(--rt-bg-3);
    background: var(--rt-bg-2);
    color: var(--rt-fg-0);
    transition: background 140ms ease, border-color 140ms ease, transform 140ms ease, opacity 140ms ease;
    min-width: 100px;
}

body.rt-admin .rt-compare-modal .cp-action-btn.secondary {
    background: transparent;
    color: var(--rt-fg-1);
}

body.rt-admin .rt-compare-modal .cp-action-btn.secondary:hover {
    background: var(--rt-bg-3);
    color: var(--rt-fg-0);
    border-color: var(--rt-fg-2);
}

body.rt-admin .rt-compare-modal .cp-action-btn.primary {
    background: var(--rt-accent-blue);
    border-color: var(--rt-accent-blue);
    color: #ffffff;
}

body.rt-admin .rt-compare-modal .cp-action-btn.primary:hover:not(:disabled) {
    background: #4d9dff;
    border-color: #4d9dff;
    transform: translateY(-1px);
}

body.rt-admin .rt-compare-modal .cp-action-btn:disabled,
body.rt-admin .rt-compare-modal .cp-action-btn.primary:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
    transform: none;
}

/* =============================================================================
 * 500 Internal Server Error page (incident-report aesthetic)
 * ============================================================================= */

body.rt-auth .rt-500-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    position: relative;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
}

body.rt-auth .rt-500-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 50% 0%, rgba(232, 87, 87, 0.08), transparent 45%),
        radial-gradient(ellipse at 20% 80%, rgba(232, 87, 87, 0.05), transparent 50%);
    pointer-events: none;
    z-index: 0;
}

body.rt-auth .rt-500-shell::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.015) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.015) 1px, transparent 1px);
    background-size: 36px 36px;
    pointer-events: none;
    z-index: 0;
    -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 85%);
    mask-image: radial-gradient(ellipse at center, black 30%, transparent 85%);
}

body.rt-auth .rt-500-brand {
    margin-bottom: 28px;
    color: var(--rt-fg-1);
    opacity: 0.85;
    position: relative;
    z-index: 1;
}

body.rt-auth .rt-500-card {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 620px;
    background: var(--rt-bg-1);
    border: 1px solid var(--rt-bg-3);
    border-radius: 16px;
    overflow: hidden;
    box-shadow:
        0 30px 60px -24px rgba(0, 0, 0, 0.75),
        0 0 0 1px rgba(232, 87, 87, 0.08) inset,
        0 0 60px -20px rgba(232, 87, 87, 0.25);
}

/* Red incident bar at the top of the card */
body.rt-auth .rt-500-incident-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    background: linear-gradient(90deg,
        rgba(232, 87, 87, 0.22),
        rgba(232, 87, 87, 0.12) 50%,
        rgba(232, 87, 87, 0.05));
    border-bottom: 1px solid rgba(232, 87, 87, 0.35);
    position: relative;
}

body.rt-auth .rt-500-incident-bar::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--rt-accent-red), transparent);
    opacity: 0.9;
}

body.rt-auth .rt-500-incident-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--rt-accent-red);
    box-shadow: 0 0 12px rgba(232, 87, 87, 0.8);
    animation: rt-500-pulse 1.2s ease-in-out infinite;
    flex-shrink: 0;
}

@keyframes rt-500-pulse {
    0%, 100% { opacity: 0.55; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1.15); }
}

body.rt-auth .rt-500-incident-label {
    flex: 1;
    color: var(--rt-accent-red);
    font-family: var(--rt-font-mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.28em;
    text-transform: uppercase;
}

body.rt-auth .rt-500-incident-code {
    color: var(--rt-fg-1);
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    padding: 3px 8px;
    background: rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 4px;
}

/* Card body */
body.rt-auth .rt-500-body {
    padding: 32px 32px 28px;
}

body.rt-auth .rt-500-number {
    font-family: var(--rt-font-mono);
    font-size: 84px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.04em;
    color: var(--rt-fg-0);
    margin: 0;
}

body.rt-auth .rt-500-underline {
    height: 2px;
    width: 42px;
    background: var(--rt-accent-red);
    box-shadow: 0 0 12px rgba(232, 87, 87, 0.6);
    margin: 12px 0 14px;
}

body.rt-auth .rt-500-tag {
    font-family: var(--rt-font-mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--rt-accent-red);
    margin-bottom: 18px;
}

body.rt-auth .rt-500-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--rt-fg-0);
    margin: 0 0 10px;
    line-height: 1.2;
}

body.rt-auth .rt-500-subtitle {
    color: var(--rt-fg-1);
    font-size: 14px;
    line-height: 1.65;
    margin: 0 0 24px;
}

/* Incident report table */
body.rt-auth .rt-500-report {
    background: var(--rt-bg-2);
    border: 1px solid var(--rt-bg-3);
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 26px;
}

body.rt-auth .rt-500-report-head {
    padding: 8px 14px;
    background: rgba(0, 0, 0, 0.25);
    border-bottom: 1px solid var(--rt-bg-3);
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--rt-fg-2);
}

body.rt-auth .rt-500-report-body {
    padding: 6px 4px;
}

body.rt-auth .rt-500-report-row {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    gap: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
}

body.rt-auth .rt-500-report-row:last-child {
    border-bottom: 0;
}

body.rt-auth .rt-500-report-key {
    flex: 0 0 100px;
    color: var(--rt-fg-2);
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

body.rt-auth .rt-500-report-val {
    flex: 1;
    color: var(--rt-fg-0);
    font-size: 13px;
    font-family: var(--rt-font-body, system-ui, sans-serif);
    text-align: right;
    word-break: break-all;
}

body.rt-auth .rt-500-report-val-mono {
    font-family: var(--rt-font-mono);
    color: var(--rt-accent-red);
    letter-spacing: 0.08em;
    font-weight: 700;
}

body.rt-auth .rt-500-status-badge {
    display: inline-block;
    font-family: var(--rt-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--rt-accent-green);
    background: rgba(52, 199, 89, 0.12);
    border: 1px solid rgba(52, 199, 89, 0.3);
    padding: 3px 8px;
    border-radius: 4px;
}

/* Actions */
body.rt-auth .rt-500-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

body.rt-auth .rt-500-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 20px;
    border-radius: 10px;
    font-family: var(--rt-font-body, system-ui, sans-serif);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-decoration: none !important;
    border: 1px solid var(--rt-bg-3);
    background: var(--rt-bg-2);
    color: var(--rt-fg-0);
    cursor: pointer;
    transition: background 140ms ease, border-color 140ms ease, transform 140ms ease;
}

body.rt-auth .rt-500-btn:hover {
    background: var(--rt-bg-3);
    border-color: var(--rt-fg-2);
    color: var(--rt-fg-0);
    text-decoration: none !important;
    transform: translateY(-1px);
}

body.rt-auth .rt-500-btn-primary {
    background: var(--rt-accent-red);
    border-color: var(--rt-accent-red);
    color: #ffffff;
}

body.rt-auth .rt-500-btn-primary:hover {
    background: #ee6b6b;
    border-color: #ee6b6b;
    color: #ffffff;
}

body.rt-auth .rt-500-btn svg {
    width: 14px;
    height: 14px;
}

body.rt-auth .rt-500-footnote {
    margin-top: 24px;
    font-family: var(--rt-font-mono);
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--rt-fg-2);
    opacity: 0.65;
    position: relative;
    z-index: 1;
}

@media (max-width: 560px) {
    body.rt-auth .rt-500-body { padding: 24px 20px 22px; }
    body.rt-auth .rt-500-number { font-size: 68px; }
    body.rt-auth .rt-500-title { font-size: 20px; }
    body.rt-auth .rt-500-incident-bar { padding: 10px 14px; }
    body.rt-auth .rt-500-report-key { flex-basis: 82px; }
}