/* unicorn-components.css (Enterprise Components) */

/* Glass panel */
.glass-panel{
  background: var(--glass);
  border: 1px solid rgba(255,255,255,.55);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: var(--radius);
  box-shadow: 0 18px 50px rgba(15,23,42,.10);
}

/* Card */
.card{
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: var(--radius);
  box-shadow: 0 10px 28px rgba(15,23,42,.08);
  transition: transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 44px rgba(15,23,42,.12);
}

/* Buttons */
.btn-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 16px;
  border-radius: 14px;
  border: 1px solid rgba(99,102,241,.35);
  color:#fff;
  background: linear-gradient(135deg, var(--primary), var(--secondary));
  box-shadow: 0 14px 34px rgba(99,102,241,.28);
  cursor:pointer;
  text-decoration:none;
  transition: transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.btn-primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 44px rgba(99,102,241,.34);
}

.btn-ghost{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.7);
  color: var(--text);
  cursor:pointer;
  text-decoration:none;
  transition: transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.btn-ghost:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 34px rgba(15,23,42,.10);
  border-color: rgba(99,102,241,.22);
}

/* Badge */
.badge{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius: 999px;
  font-size:.78rem;
  font-weight:700;
  border:1px solid rgba(15,23,42,.10);
  background: rgba(15,23,42,.04);
}
.badge-success{ background: rgba(16,185,129,.12); border-color: rgba(16,185,129,.28); color:#047857; }
.badge-danger{ background: rgba(239,68,68,.12); border-color: rgba(239,68,68,.28); color:#b91c1c; }
.badge-warning{ background: rgba(234,179,8,.14); border-color: rgba(234,179,8,.30); color:#92400e; }
.badge-unicorn{ background: rgba(99,102,241,.14); border-color: rgba(99,102,241,.30); color:#3730a3; }

/* Floating label input group */
.input-group{
  position:relative;
  margin-top:6px;
}
.input-group input,
.input-group textarea{
  padding-top:18px;
}
.input-group label{
  position:absolute;
  left:14px;
  top:12px;
  font-size:.85rem;
  color: var(--muted);
  pointer-events:none;
  transition: transform var(--t-fast) var(--ease), opacity var(--t-fast) var(--ease), top var(--t-fast) var(--ease);
  opacity:.9;
}
.input-group input:focus + label,
.input-group textarea:focus + label,
.input-group input:not(:placeholder-shown) + label,
.input-group textarea:not(:placeholder-shown) + label{
  top:6px;
  transform: scale(.92);
  opacity:.85;
}

/* Progress bar */
.progress{
  width:100%;
  height:10px;
  border-radius:999px;
  overflow:hidden;
  background: rgba(15,23,42,.06);
  border:1px solid rgba(15,23,42,.08);
}
.progress-bar{
  height:100%;
  width:0%;
  background: linear-gradient(135deg, var(--primary), var(--secondary));
  transition: width 220ms var(--ease);
}

/* Toast (works with app-core.js) */
#toast-container{
  position: fixed;
  top: 14px;
  right: 14px;
  z-index: 99999;
  display:flex;
  flex-direction:column;
  gap:12px;
  pointer-events:none;
}
.toast{
  pointer-events:auto;
  min-width: 260px;
  max-width: 360px;
  border-radius: 16px;
  padding: 12px 14px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(255,255,255,.55);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 16px 44px rgba(15,23,42,.14);
  display:flex;
  gap:10px;
  align-items:flex-start;
  color: var(--text);
}
.toast.success{ border-color: rgba(16,185,129,.35); }
.toast.error{ border-color: rgba(239,68,68,.35); }
.toast.warning{ border-color: rgba(234,179,8,.35); }

/* Small helpers */
.max-w-lg{ max-width: 540px; }
.max-w-2xl{ max-width: 720px; }