/* Premium theme utilities and variables */
:root{
  --gradient: linear-gradient(135deg,#6a11cb 0%,#2575fc 100%);
  --glass-bg: rgba(255,255,255,0.55);
  --glass-brd: rgba(255,255,255,0.6);
  --bg: #f7f8fc;
  --text: #1b1f3b;
  --card: #ffffff;
  --muted: #6c757d;
  --ring: #80b3ff;
  --ring-dark: #2b6cb0;
}

html[data-bs-theme="dark"]{
  --glass-bg: rgba(255,255,255,0.06);
  --glass-brd: rgba(255,255,255,0.15);
  --bg: #0f1226;
  --text: #e8eaf6;
  --card: #141735;
  --muted: #9aa0b4;
  --ring: #6aa7ff;
  --ring-dark: #5a8bd6;
}

body{
  background:
    radial-gradient(1200px 600px at 10% 10%, rgba(255,255,255,.06), transparent 40%),
    radial-gradient(1200px 600px at 90% 20%, rgba(255,255,255,.06), transparent 40%),
    var(--bg);
  color: var(--text);
}

/* Header gradient and hero glass */
.bg-gradient{background: var(--gradient);} 
.hero-glass{background: var(--glass-bg); border: 1px solid var(--glass-brd); backdrop-filter: blur(10px);} 

/* Cards */
.card{background: var(--card);} 
.card.rounded-xl{border-radius: 1rem;} 
.rounded-xl{border-radius: 1rem !important;}
.shadow-soft{box-shadow: 0 10px 30px rgba(0,0,0,.15) !important;}

/* Smooth hover transitions */
button, .btn, .card, .form-control, .list-group-item { transition: all .15s ease-in-out; }

/* Glassy navbar */
.glassy{background: var(--glass-bg); backdrop-filter: blur(10px); border: 1px solid var(--glass-brd);} 

/* Buttons */
.btn-primary{background-image: var(--gradient); border: none; color: #fff;}
.btn-primary:hover{filter: brightness(1.06);} 
.btn-outline-light{border-color: rgba(255,255,255,.35); color: inherit;}
.btn-outline-light:hover{background: rgba(255,255,255,.08);} 
.btn:focus, .form-control:focus, .form-select:focus {
  outline: 2px solid transparent;
  box-shadow: 0 0 0 .15rem var(--ring) !important;
}
.btn:focus-visible { box-shadow: 0 0 0 .2rem var(--ring-dark) !important; }

/* Elevated on hover */
.card:hover{transform: translateY(-1px); box-shadow: 0 12px 34px rgba(0,0,0,.18) !important;}

/* Utility spacing tweaks */
.section{padding-top: 2rem; padding-bottom: 2rem;}

/* Skeleton loaders */
.skeleton{position: relative; overflow: hidden; background: linear-gradient(90deg, rgba(0,0,0,.06), rgba(0,0,0,.12), rgba(0,0,0,.06)); background-size: 200% 100%; animation: shimmer 1.2s infinite; border-radius: .5rem;}
.skeleton-text{height: 12px; margin: 6px 0;}
.skeleton-avatar{width: 40px; height: 40px; border-radius: 50%;}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
/* Visibility control */
.skeleton-only{display:none}
body.loading .skeleton-only{display:block}
body.loading .content-after-skeleton{opacity:0.001}

/* Empty state */
.empty-state{padding: 2rem; text-align: center; color: var(--muted);} 
.empty-state .illustration{opacity:.8; margin-bottom: .75rem;}
.empty-state svg{max-width: 140px; height: auto;}

/* Navbar adjustments */
.navbar-brand{letter-spacing: .5px;}

/* Toast position on small screens */
@media (max-width: 576px){
  .toast-container{left: .5rem; right: .5rem;}
}