/*
 * LCG TrendyAdmin UI Reference Layer
 * Safe visual overlay inspired by the uploaded TrendyAdmin-pro template.
 * This file does not change business logic, routes, or database behavior.
 */
:root {
    --lcg-trendy-bg: #f5f3fa;
    --lcg-trendy-surface: #ffffff;
    --lcg-trendy-heading: #191233;
    --lcg-trendy-text: #3f3a52;
    --lcg-trendy-muted: #776f8f;
    --lcg-trendy-border: #e7e2f2;
    --lcg-trendy-border-light: #f1edf9;
    --lcg-trendy-accent: #7c3aed;
    --lcg-trendy-accent-dark: #6d28d9;
    --lcg-trendy-accent-soft: rgba(124, 58, 237, 0.12);
    --lcg-trendy-sidebar: #171032;
    --lcg-trendy-sidebar-border: #2a2050;
    --lcg-trendy-sidebar-text: #cfc7e8;
    --lcg-trendy-sidebar-muted: #8c81b3;
    --lcg-trendy-success: #0d9f6e;
    --lcg-trendy-warning: #f59e0b;
    --lcg-trendy-danger: #f43f5e;
    --lcg-trendy-info: #0ea5e9;
    --lcg-trendy-shadow-sm: 0 1px 2px 0 rgba(30, 18, 66, 0.06);
    --lcg-trendy-shadow-md: 0 4px 10px -2px rgba(30, 18, 66, 0.08), 0 2px 4px -2px rgba(30, 18, 66, 0.06);
    --lcg-trendy-shadow-lg: 0 12px 28px -6px rgba(30, 18, 66, 0.12), 0 4px 8px -4px rgba(30, 18, 66, 0.06);
    --lcg-blue: var(--lcg-trendy-accent);
    --lcg-blue-dark: var(--lcg-trendy-accent-dark);
    --lcg-bg: var(--lcg-trendy-bg);
    --lcg-heading: var(--lcg-trendy-heading);
    --lcg-text: var(--lcg-trendy-text);
    --lcg-muted: var(--lcg-trendy-muted);
    --lcg-border: var(--lcg-trendy-border);
    --lcg-success: var(--lcg-trendy-success);
    --lcg-warning: var(--lcg-trendy-warning);
    --lcg-danger: var(--lcg-trendy-danger);
}

html,
body,
.header,
.sidebar,
.main,
.dropdown-menu,
.form-control,
.form-select,
.btn,
.table {
    font-family: "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body {
    background:
        radial-gradient(circle at top left, rgba(124, 58, 237, 0.10), transparent 32rem),
        linear-gradient(180deg, #faf9fd 0%, var(--lcg-trendy-bg) 44%, #f8f7fc 100%) !important;
    color: var(--lcg-trendy-text);
}

h1, h2, h3, h4, h5, h6,
.lcg-page-title,
.card-title,
.sidebar-logo-name,
.header-logo span:last-child {
    font-family: "Outfit", "Plus Jakarta Sans", system-ui, sans-serif !important;
    letter-spacing: -0.035em;
}

/* Header */
.header {
    min-height: 74px;
    background: rgba(255, 255, 255, 0.88) !important;
    backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--lcg-trendy-border) !important;
    box-shadow: none !important;
}

.header-left,
.header-right {
    min-height: 74px;
}

.header-logo,
.sidebar-logo {
    text-decoration: none !important;
}

.header-logo-mark,
.sidebar-logo-mark {
    background: linear-gradient(135deg, #7c3aed 0%, #4f46e5 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 10px 24px rgba(124, 58, 237, 0.22);
}

.header-logo-mark img,
.sidebar-logo-mark img {
    filter: drop-shadow(0 2px 4px rgba(25, 18, 51, 0.22));
}

.header-context span,
.sidebar-logo-label,
.nav-heading span {
    letter-spacing: 0.12em;
}

.search-form {
    background: #ffffff !important;
    border: 1px solid var(--lcg-trendy-border) !important;
    border-radius: 999px !important;
    box-shadow: var(--lcg-trendy-shadow-sm);
}

.search-form:focus-within {
    border-color: rgba(124, 58, 237, 0.55) !important;
    box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.12) !important;
}

.header-action,
.header-action > button,
button.header-action,
a.header-action {
    border-color: var(--lcg-trendy-border) !important;
    background: #ffffff !important;
    color: var(--lcg-trendy-heading) !important;
    box-shadow: var(--lcg-trendy-shadow-sm);
}

.header-action:hover,
.header-action > button:hover,
button.header-action:hover,
a.header-action:hover {
    border-color: rgba(124, 58, 237, 0.38) !important;
    color: var(--lcg-trendy-accent) !important;
    transform: translateY(-1px);
}

.user-dropdown .dropdown-toggle,
.header-action.dropdown .dropdown-toggle {
    border-radius: 999px !important;
}

/* Sidebar */
.sidebar {
    background: linear-gradient(180deg, #171032 0%, #120d27 100%) !important;
    border-right: 1px solid var(--lcg-trendy-sidebar-border) !important;
    box-shadow: 10px 0 30px rgba(30, 18, 66, 0.15);
}

.sidebar-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.sidebar-logo-name {
    color: #ffffff !important;
    font-weight: 800 !important;
}

.sidebar-logo-label,
.sidebar .nav-heading span {
    color: var(--lcg-trendy-sidebar-muted) !important;
}

.sidebar .nav-heading::after {
    background: rgba(255, 255, 255, 0.10) !important;
}

.sidebar .nav-link {
    color: var(--lcg-trendy-sidebar-text) !important;
    border-radius: 14px !important;
    margin: 0.12rem 0.85rem;
    transition: all 180ms ease;
}

.sidebar .nav-link i {
    color: inherit !important;
}

.sidebar .nav-link:hover {
    background: rgba(255, 255, 255, 0.07) !important;
    color: #ffffff !important;
    transform: translateX(2px);
}

.sidebar .nav-link.active {
    background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 28px rgba(124, 58, 237, 0.32);
}

.sidebar .nav-link.active::before,
.sidebar .nav-link.active::after {
    background: rgba(255, 255, 255, 0.45) !important;
}

.sidebar-close {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

/* Main content */
.main-content.lcg-page {
    padding-top: 28px;
}

.lcg-page-header {
    align-items: center;
}

.lcg-kicker {
    color: var(--lcg-trendy-accent) !important;
    font-weight: 800 !important;
}

.lcg-page-title {
    color: var(--lcg-trendy-heading) !important;
    font-weight: 700 !important;
}

.lcg-page-subtitle {
    color: var(--lcg-trendy-muted) !important;
}

/* Cards */
.lcg-card,
.card,
.dashboard-card,
.stat-card,
.payment-card,
.booking-card,
.member-card,
.report-card {
    background: rgba(255, 255, 255, 0.96) !important;
    border: 1px solid var(--lcg-trendy-border) !important;
    border-radius: 24px !important;
    box-shadow: var(--lcg-trendy-shadow-md) !important;
}

.lcg-card:hover,
.card:hover,
.dashboard-card:hover,
.stat-card:hover {
    box-shadow: var(--lcg-trendy-shadow-lg) !important;
}

.lcg-card .card-header,
.card-header {
    background: rgba(255, 255, 255, 0.78) !important;
    border-bottom: 1px solid var(--lcg-trendy-border-light) !important;
    border-radius: 24px 24px 0 0 !important;
}

.lcg-stat-card {
    min-height: 140px;
}

.lcg-stat-card::before {
    content: "";
    position: absolute;
    inset: -42px -42px auto auto;
    width: 118px;
    height: 118px;
    border-radius: 999px;
    background: rgba(124, 58, 237, 0.10);
}

.lcg-stat-card .stat-icon {
    background: var(--lcg-trendy-accent-soft) !important;
    color: var(--lcg-trendy-accent) !important;
    border-radius: 16px !important;
}

.lcg-stat-card strong {
    color: var(--lcg-trendy-heading) !important;
    font-family: "Outfit", "Plus Jakarta Sans", sans-serif !important;
    letter-spacing: -0.04em;
}

/* Forms and buttons */
.form-control,
.form-select,
.input-group-text {
    border-color: var(--lcg-trendy-border) !important;
    border-radius: 14px !important;
    background-color: #ffffff !important;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--lcg-trendy-accent) !important;
    box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.14) !important;
}

.btn {
    border-radius: 14px !important;
    font-weight: 700 !important;
}

.btn-primary {
    background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%) !important;
    border-color: #7c3aed !important;
    box-shadow: 0 12px 24px rgba(124, 58, 237, 0.20) !important;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #6d28d9 0%, #5b21b6 100%) !important;
    border-color: #6d28d9 !important;
    transform: translateY(-1px);
}

.btn-outline-primary {
    color: var(--lcg-trendy-accent) !important;
    border-color: rgba(124, 58, 237, 0.45) !important;
}

.btn-outline-primary:hover {
    color: #ffffff !important;
    background: var(--lcg-trendy-accent) !important;
    border-color: var(--lcg-trendy-accent) !important;
}

/* Tables */
.table {
    --bs-table-bg: transparent;
    color: var(--lcg-trendy-text) !important;
}

.table thead th {
    background: #f7f5fc !important;
    color: var(--lcg-trendy-muted) !important;
    border-bottom: 1px solid var(--lcg-trendy-border) !important;
}

.table tbody tr:hover > * {
    background: rgba(124, 58, 237, 0.045) !important;
}

.table td,
.table th {
    border-color: var(--lcg-trendy-border-light) !important;
}

/* Status badges */
.status-badge,
.badge {
    border-radius: 999px !important;
    font-weight: 800 !important;
}

.status-active,
.status-approved,
.status-paid,
.status-posted,
.status-verified,
.status-unused,
.status-fully_paid,
.badge.bg-success {
    color: #047857 !important;
    background: #dff8ee !important;
    border-color: #b9efd9 !important;
}

.status-pending,
.status-pending_approval,
.status-unpaid,
.status-partial,
.status-reserved,
.status-overdue,
.badge.bg-warning {
    color: #b45309 !important;
    background: #fff3d6 !important;
    border-color: #f7d996 !important;
}

.status-rejected,
.status-cancelled,
.status-canceled,
.status-refunded,
.status-void,
.status-voided,
.badge.bg-danger {
    color: #be123c !important;
    background: #ffe4e9 !important;
    border-color: #fecdd7 !important;
}

/* Alerts */
.alert {
    border-radius: 18px !important;
    border-width: 1px !important;
    box-shadow: var(--lcg-trendy-shadow-sm);
}

.alert-success {
    color: #047857 !important;
    background: #e6f8f0 !important;
    border-color: #b9efd9 !important;
}

.alert-danger {
    color: #be123c !important;
    background: #ffe8ec !important;
    border-color: #fecdd7 !important;
}

/* Auth/login */
.lcg-auth-body {
    background:
        radial-gradient(circle at 15% 15%, rgba(124, 58, 237, 0.22), transparent 26rem),
        radial-gradient(circle at 85% 15%, rgba(14, 165, 233, 0.18), transparent 24rem),
        linear-gradient(135deg, #171032 0%, #291b54 48%, #f5f3fa 48%, #ffffff 100%) !important;
}

.lcg-login-card,
.auth-card,
.login-card {
    border-radius: 28px !important;
    box-shadow: 0 34px 70px rgba(30, 18, 66, 0.22) !important;
}

/* Member portal shares same polish but keeps lighter sidebar label */
.member-page .lcg-card,
.member-page .card {
    border-radius: 24px !important;
}

/* Dark mode */
[data-theme="dark"] {
    --lcg-trendy-bg: #0e0a1f;
    --lcg-trendy-surface: #191330;
    --lcg-trendy-heading: #f4f1ff;
    --lcg-trendy-text: #e4e0f5;
    --lcg-trendy-muted: #9d94bd;
    --lcg-trendy-border: #2c2350;
    --lcg-trendy-border-light: #241d43;
}

[data-theme="dark"] body,
[data-theme="dark"] .main {
    background: #0e0a1f !important;
    color: var(--lcg-trendy-text) !important;
}

[data-theme="dark"] .header,
[data-theme="dark"] .card,
[data-theme="dark"] .lcg-card,
[data-theme="dark"] .dropdown-menu,
[data-theme="dark"] .search-form,
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select {
    background: #191330 !important;
    border-color: #2c2350 !important;
    color: #e4e0f5 !important;
}

[data-theme="dark"] .table thead th {
    background: #241d43 !important;
}

@media (max-width: 1199px) {
    .header {
        min-height: 68px;
    }

    .main-content.lcg-page {
        padding-top: 18px;
    }
}
