/* RoarX base styles. Colours are driven by CSS variables injected per-theme. */

:root { --rx-sidebar-bg: #1f2937; }

body { background-color: #f5f6f8; }
[data-bs-theme="dark"] body { background-color: #11151c; }

/* ---- Auth screens ---- */
.rx-auth-body {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--rx-primary, #0d6efd);
    background-size: cover;
    background-position: center;
    padding: 1rem;
}
.rx-auth-wrap { width: 100%; max-width: 420px; }
.rx-auth-card { border-radius: 1rem; }
.rx-auth-logo { max-height: 64px; max-width: 100%; }

/* ---- Admin layout ---- */
.rx-layout { display: flex; min-height: 100vh; }
.rx-sidebar {
    width: 260px;
    flex-shrink: 0;
    background-color: var(--rx-sidebar-bg);
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}
.rx-content { flex: 1; min-width: 0; background-color: #f5f6f8; }
[data-bs-theme="dark"] .rx-content { background-color: #11151c; }
.rx-topbar { background: #fff; }
[data-bs-theme="dark"] .rx-topbar { background: #1a1f29; }

.rx-sidebar .nav-link { border-radius: .5rem; padding: .5rem .75rem; font-size: .925rem; }
.rx-sidebar .nav-link:hover { background: rgba(255,255,255,.08); color: #fff !important; }
.rx-sidebar .nav-link.rx-nav-active { background: var(--rx-primary); color: #fff !important; }

@media (max-width: 991.98px) {
    .rx-sidebar { position: fixed; left: -260px; z-index: 1040; transition: left .2s; }
    .rx-sidebar.open { left: 0; }
}

/* ---- Stat cards ---- */
.rx-stat-icon {
    width: 48px; height: 48px;
    border-radius: .75rem;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.4rem;
}

/* ---- Dashboard widgets ---- */
.rx-widget.rx-editing .card { outline: 2px dashed var(--rx-primary); cursor: move; }
.rx-widget-controls .btn { padding: 0 .25rem; }