/* frontend/public/admin/assets/css/base.css */
@import './modal.css';
@import './layout.css';
@import './components.css';
@import './auth.css';
@import './skeleton.css';

@import './modules/games.css';
@import './modules/support.css';


:root{
  --admin-bg: #0b1020;
  --admin-surface: #121a2f;
  --admin-surface-2: #18233f;
  --admin-surface-3: #202d4d;
  --admin-border: rgba(255,255,255,.08);
  --admin-border-strong: rgba(255,255,255,.14);
  --admin-text: #eaf1ff;
  --admin-text-soft: #9fb0d1;
  --admin-text-dim: #7485aa;
  --admin-accent: #4f8cff;
  --admin-accent-2: #6da3ff;
  --admin-success: #23c483;
  --admin-warning: #ffb648;
  --admin-danger: #ff6b81;
  --admin-shadow: 0 18px 50px rgba(0,0,0,.35);
  --admin-radius-xl: 24px;
  --admin-radius-lg: 18px;
  --admin-radius-md: 14px;
  --admin-sidebar-w: 290px;
  --admin-topbar-h: 78px;
  --admin-trans-fast: .2s ease;
  --admin-trans: .32s ease;
  --admin-font: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}


*{
  box-sizing: border-box;
}

html, body{
  margin: 0;
  padding: 0;
  min-height: 100%;
  background:
    radial-gradient(circle at top left, rgba(79,140,255,.12), transparent 28%),
    radial-gradient(circle at bottom right, rgba(35,196,131,.09), transparent 24%),
    linear-gradient(180deg, #07101f 0%, #0b1020 100%);
  color: var(--admin-text);
  font-family: var(--admin-font);
}

body{
  overflow: hidden;
}

button,
input,
select,
textarea{
  font: inherit;
}

a{
  color: inherit;
  text-decoration: none;
}

img{
  max-width: 100%;
  display: block;
}

.hidden{
  display: none !important;
}

.fade-in{
  animation: fadeIn .28s ease both;
}

.slide-up{
  animation: slideUp .34s ease both;
}

/* ===== Force dark theme for native selects ===== */
select.admin-input,
select.form-control.admin-input {
  background-color: rgba(255,255,255,.05) !important;
  color: var(--admin-text) !important;
  color-scheme: dark;
}

select.admin-input option,
select.form-control.admin-input option,
select.admin-input optgroup,
select.form-control.admin-input optgroup {
  background-color: #121a2f !important;
  color: var(--admin-text) !important;
}

/* ===== Force dark theme for browser autofill ===== */
input.admin-input:-webkit-autofill,
input.admin-input:-webkit-autofill:hover,
input.admin-input:-webkit-autofill:focus,
textarea.admin-input:-webkit-autofill,
textarea.admin-input:-webkit-autofill:hover,
textarea.admin-input:-webkit-autofill:focus,
select.admin-input:-webkit-autofill,
select.admin-input:-webkit-autofill:hover,
select.admin-input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--admin-text) !important;
  -webkit-box-shadow: 0 0 0px 1000px rgba(255,255,255,.05) inset !important;
  box-shadow: 0 0 0px 1000px rgba(255,255,255,.05) inset !important;
  transition: background-color 9999s ease-in-out 0s;
  border: 1px solid var(--admin-border) !important;
}

@keyframes fadeIn{
  from{ opacity: 0; }
  to{ opacity: 1; }
}

@keyframes slideUp{
  from{
    opacity: 0;
    transform: translateY(12px);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}

.app-blur{
  filter: blur(10px);
  transform: scale(.995);
  pointer-events: none;
  user-select: none;
}

.soft-pill{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--admin-border);
  background: rgba(255,255,255,.04);
  color: var(--admin-text-soft);
  font-size: .92rem;
}

.admin-btn{
  border: 0;
  outline: 0;
  border-radius: 14px;
  min-height: 46px;
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  cursor: pointer;
  transition: transform var(--admin-trans-fast), opacity var(--admin-trans-fast), background var(--admin-trans-fast);
}

.admin-btn:disabled{
  opacity: .6;
  cursor: not-allowed;
}

.admin-btn:hover:not(:disabled){
  transform: translateY(-1px);
}

.admin-btn-primary{
  color: #fff;
  background: linear-gradient(135deg, var(--admin-accent), var(--admin-accent-2));
  box-shadow: 0 10px 24px rgba(79,140,255,.28);
}

.admin-btn-ghost{
  color: var(--admin-text);
  background: rgba(255,255,255,.05);
  border: 1px solid var(--admin-border);
}

.admin-card{
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.025));
  border: 1px solid var(--admin-border);
  border-radius: var(--admin-radius-lg);
  box-shadow: var(--admin-shadow);
}

.status-dot{
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--admin-success);
  box-shadow: 0 0 14px rgba(35,196,131,.6);
}

.form-control.admin-input{
  background: rgba(255,255,255,.05);
  border: 1px solid var(--admin-border);
  color: var(--admin-text);
  min-height: 50px;
  border-radius: 14px;
}

.form-control.admin-input:focus{
  background: rgba(255,255,255,.06);
  color: var(--admin-text);
  border-color: rgba(79,140,255,.55);
  box-shadow: 0 0 0 .2rem rgba(79,140,255,.14);
}

.form-control.admin-input::placeholder{
  color: #8fa2c9;
}

.admin-muted{
  color: var(--admin-text-soft);
}

.admin-dim{
  color: var(--admin-text-dim);
}