/* Glass Premium Theme - Light + Pastel Accents
   Applied across admin and public layouts. Only UI elements changed.
*/
:root {
    --bg-100: #f3f6f9; /* soft page background */
    --panel: #fbfbfd; /* slightly off-white panels */
    --muted-panel: #f0f5f9; /* subtle tinted panels */
    --glass-border: rgba(16,24,40,0.04);
    --text-dark: #04070a; /* primary text color */
    --muted: #64748b;
    --primary: #1565c0; /* indigo */
    --primary-contrast: #ffffff;
    --secondary: #ff7043; /* warm accent */
    --accent: #26a69a; /* teal */
    --radius: 12px;
    --shadow-soft: 0 8px 28px rgba(16,24,40,0.06);
    --shadow-strong: 0 18px 50px rgba(16,24,40,0.08);
}

*{box-sizing:border-box}
html,body{height:100%;margin:0;background:var(--bg-100);color:var(--text-dark);font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial}

/* Subtle background pastel shapes for premium look */
body::before{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(420px 260px at 12% 12%, rgba(37,99,235,0.06) 0%, transparent 18%), radial-gradient(360px 220px at 88% 86%, rgba(255,112,67,0.04) 0%, transparent 16%);z-index:-1}

/* Header */
.app-header{background:var(--panel);border-bottom:1px solid var(--glass-border);box-shadow:var(--shadow-soft);padding:.6rem 0}
.app-header .navbar-nav .nav-link{color:var(--text-dark)!important;font-weight:600;padding:.5rem .9rem;border-radius:10px}
.app-header .navbar-nav .nav-link:hover{background:rgba(21,101,192,0.08);color:var(--primary-contrast)}

/* Buttons */
.btn{border-radius:12px;padding:.5rem .9rem;font-weight:600;border:1px solid transparent}
.btn-primary{background:linear-gradient(90deg,var(--accent-1),var(--accent-3));color:var(--text);box-shadow:0 8px 26px rgba(125,211,252,0.08);border-color:rgba(16,24,40,0.02)}
.btn-warning{background:var(--panel);color:var(--text);border:1px solid var(--glass-border)}
.btn-light{background:transparent;border:1px solid rgba(16,24,40,0.03);color:var(--text)}

/* Sidebar */
.app-sidebar{width:260px;background:linear-gradient(180deg,var(--panel),rgba(255,255,255,0.80));backdrop-filter:blur(calc(var(--blur) - 2px));-webkit-backdrop-filter:blur(calc(var(--blur) - 2px));border-right:1px solid var(--glass-border);box-shadow:var(--shadow-soft)}
.sidebar-brand{padding:1rem;border-bottom:1px solid rgba(16,24,40,0.02);display:flex;align-items:center;gap:.75rem}
.brand-image{width:42px;height:42px;border-radius:8px;object-fit:contain;display:inline-flex;align-items:center;justify-content:center;padding:6px;background:linear-gradient(90deg,var(--primary),#2b6fb3);box-shadow:0 6px 18px rgba(21,101,192,0.08)}
.brand-text{font-weight:800;color:var(--text-dark);font-size:1.05rem}

.sidebar-menu .nav-link{color:var(--muted);padding:.75rem 1rem;margin:.35rem;border-radius:10px}
.sidebar-menu .nav-link:hover{background:rgba(21,101,192,0.06);color:var(--text-dark);transform:translateX(6px)}
.sidebar-menu .nav-link.active{background:linear-gradient(90deg,var(--primary),var(--accent));color:var(--primary-contrast);box-shadow:var(--shadow-strong)}

/* strong overrides for focus/active states to prevent white highlights */
.sidebar-menu .nav-link:focus,.sidebar-menu .nav-link:active,.sidebar-menu .nav-link.show{background:linear-gradient(90deg,var(--primary),var(--secondary)) !important;color:var(--primary-contrast) !important}
.navbar-nav .nav-link:focus,.navbar-nav .nav-link:active{background:linear-gradient(90deg,var(--primary),var(--accent));color:var(--primary-contrast) !important}

/* Main content and cards */
.app-main{padding:1.5rem;background:transparent}
.app-content{padding:2rem}

.card{background:linear-gradient(180deg,var(--panel-strong),var(--panel));border:1px solid var(--glass-border);border-radius:var(--radius);box-shadow:var(--shadow-soft);transition:transform .22s ease,box-shadow .22s ease}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-strong)}
.card-header{background:transparent;border-bottom:0;color:var(--text);font-weight:700;padding:1rem 1.25rem}

/* Forms */
.form-control,.form-select{background:var(--muted-panel);border:1px solid rgba(16,24,40,0.04);color:var(--text-dark);border-radius:10px;padding:.6rem .9rem}
.form-control::placeholder{color:var(--muted)}
.form-control:focus{outline:none;box-shadow:0 10px 30px rgba(21,101,192,0.06);border-color:var(--primary)}

/* Tables */
.table{background:transparent;border-radius:10px;overflow:hidden}
.table thead th{background:transparent;color:var(--muted);border-bottom:1px solid rgba(16,24,40,0.04);text-transform:uppercase;font-weight:700}
.table tbody tr{background:transparent}
.table tbody tr:hover{background:rgba(125,211,252,0.03)}

/* Alerts */
.alert{background:linear-gradient(180deg,var(--panel-strong),var(--panel));border:1px solid rgba(16,24,40,0.04);color:var(--text);border-radius:10px}

/* Footer */
.app-footer{background:transparent;border-top:1px solid rgba(16,24,40,0.02);padding:1rem 1.5rem;color:var(--muted);font-weight:500}

/* Modals */
.modal-content{background:var(--panel);border:1px solid rgba(16,24,40,0.04);box-shadow:0 16px 40px rgba(16,24,40,0.06)}

/* Badges */
.badge{border-radius:8px;padding:.35rem .6rem;font-weight:700}
.badge-primary{background:linear-gradient(90deg,var(--accent-1),var(--accent-2));color:var(--text)}

/* Small utilities */
.glass-soft{background:var(--panel);border-radius:12px;border:1px solid rgba(16,24,40,0.03);box-shadow:var(--shadow-soft)}

/* Scrollbar */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:rgba(16,24,40,0.06);border-radius:6px}

/* Ensure high contrast for text inside UI elements */
.app-sidebar, .app-header, .card, .modal-content, .app-footer { color: var(--text); }

/* Force sidebar and navbar text to black for maximum readability */
.app-sidebar,
.app-sidebar .nav-link,
.sidebar-brand .brand-text,
.navbar-nav .nav-link,
.navbar-nav {
  color: #000000 !important;
}

/* Ensure hover/active/focus states keep readable black text (override white contrasts) */
.sidebar-menu .nav-link:focus,
.sidebar-menu .nav-link:active,
.sidebar-menu .nav-link.show,
.sidebar-menu .nav-item .nav-link[aria-current],
.sidebar-menu .nav-item .nav-link[aria-expanded="true"],
.sidebar-menu .nav-link.active,
.navbar-nav .nav-link:focus,
.navbar-nav .nav-link:active,
.navbar-nav .nav-link.show {
  color: #000000 !important;
}

@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}