/* FlaroCity ClubOS Phase 11.8 - Premium UI Polish
   Goal: make the current site look more like a finished SaaS product without changing database logic. */

:root{
  --fc-hot:#ff38d1;
  --fc-cyan:#00c2ff;
  --fc-gold:#ffb800;
  --fc-green:#20e37a;
  --fc-purple:#a855f7;
  --fc-bg:#050610;
  --fc-card:#0c1220;
  --fc-card2:#160b24;
  --fc-muted:#aeb8d6;
}

/* Overall polish */
body{
  background:
    radial-gradient(circle at 87% 8%, rgba(255,56,209,.20), transparent 30%),
    radial-gradient(circle at 12% 88%, rgba(0,194,255,.08), transparent 26%),
    linear-gradient(130deg,#050610 0%,#080b18 52%,#16051d 100%) !important;
}
.fc-main{
  padding-bottom:34px !important;
}
.fc-topbar{
  border-radius:0 0 22px 22px !important;
  background:
    radial-gradient(circle at 94% 0%, rgba(255,56,209,.28), transparent 36%),
    linear-gradient(90deg, rgba(8,10,18,.90), rgba(43,16,64,.78)) !important;
  box-shadow:0 15px 45px rgba(0,0,0,.18) !important;
}
.fc-sidebar{
  background:
    radial-gradient(circle at 30% 4%, rgba(255,56,209,.10), transparent 24%),
    linear-gradient(180deg,#070912,#050610) !important;
}
.fc-brand-title,
.fc-top-title{
  text-shadow:0 0 15px rgba(255,255,255,.30),0 0 20px rgba(255,56,209,.18) !important;
}
.fc-nav a{
  transition:.16s ease !important;
}
.fc-nav a:hover{
  transform:translateX(3px);
  background:rgba(255,56,209,.12) !important;
}
.fc-nav a.active{
  box-shadow: inset 0 0 0 1px rgba(255,56,209,.38), 0 0 28px rgba(255,56,209,.12) !important;
}

/* Premium page heroes */
.fc-visual-hero,
.fc-hero-polish{
  position:relative !important;
  overflow:hidden !important;
  border-radius:28px !important;
  min-height:190px !important;
  padding:32px !important;
  border:1px solid rgba(255,56,209,.42) !important;
  background:
    radial-gradient(circle at 78% 18%, rgba(255,56,209,.22), transparent 35%),
    radial-gradient(circle at 12% 80%, rgba(0,194,255,.12), transparent 35%),
    linear-gradient(135deg, rgba(8,12,24,.97), rgba(44,14,62,.78) 54%, rgba(9,11,19,.97)) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),0 18px 55px rgba(0,0,0,.20) !important;
}
.fc-visual-hero::before,
.fc-hero-polish::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.35;
  pointer-events:none;
  background:
    linear-gradient(90deg, transparent 0 2%, rgba(0,194,255,.55) 2.1% 2.25%, transparent 2.4% 8%,
      rgba(255,56,209,.40) 8.1% 8.24%, transparent 8.5% 92%,
      rgba(0,194,255,.48) 92.1% 92.28%, transparent 92.6% 98%,
      rgba(255,56,209,.55) 98.1% 98.3%, transparent 98.5%),
    radial-gradient(circle at 50% 120%, rgba(255,255,255,.10), transparent 42%);
}
.fc-visual-hero::after,
.fc-hero-polish::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 18%,transparent 72%,rgba(0,0,0,.16));
}
.fc-visual-hero img{display:none !important;}
.fc-visual-hero-overlay,
.fc-hero-content{
  position:relative !important;
  z-index:1 !important;
  inset:auto !important;
  min-height:0 !important;
  padding:0 !important;
  background:transparent !important;
}
.fc-visual-hero-overlay h2,
.fc-hero-content h1,
.fc-hero-content h2{
  font-size:clamp(34px,3.7vw,58px) !important;
  line-height:1.02 !important;
  margin:0 0 10px !important;
  color:white !important;
  letter-spacing:-.04em !important;
  text-shadow:0 0 24px rgba(255,56,209,.34),0 2px 0 rgba(0,0,0,.35) !important;
}
.fc-visual-hero-overlay p,
.fc-hero-content p{
  color:#dbe7ff !important;
  max-width:760px !important;
  line-height:1.5 !important;
  font-size:16px !important;
}
.fc-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px;}

/* Dashboard */
.fc-dash-hero{
  display:grid;
  grid-template-columns:minmax(400px,1fr) minmax(280px,420px);
  gap:20px;
  align-items:center;
}
.fc-dash-logo-card{
  border-radius:24px;
  padding:22px;
  background:linear-gradient(135deg,rgba(255,56,209,.14),rgba(0,194,255,.08));
  border:1px solid rgba(255,56,209,.24);
}
.fc-dash-logo-card img{
  width:100%;
  max-height:210px;
  object-fit:contain;
  filter:drop-shadow(0 0 24px rgba(255,56,209,.40));
}
.fc-stat-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(160px,1fr));
  gap:16px;
  margin:18px 0;
}
.fc-stat-card{
  position:relative;
  overflow:hidden;
  padding:20px;
  border-radius:18px;
  border:1px solid rgba(168,85,247,.32);
  background:radial-gradient(circle at 100% 0%,rgba(255,56,209,.11),transparent 42%),linear-gradient(180deg,rgba(18,24,39,.92),rgba(7,9,18,.96));
  box-shadow:0 16px 44px rgba(0,0,0,.18);
}
.fc-stat-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(255,255,255,.06),transparent 30%);
  opacity:.35;
  pointer-events:none;
}
.fc-stat-card .fc-stat-inner{position:relative;z-index:1;display:flex;align-items:center;gap:14px;}
.fc-stat-icon{
  width:48px;height:48px;border-radius:14px;display:grid;place-items:center;
  background:#05060d;border:1px solid rgba(255,56,209,.22);
  box-shadow:0 0 20px rgba(255,56,209,.10);
}
.fc-stat-icon img{width:27px;height:27px;object-fit:contain;}
.fc-stat-label{text-transform:uppercase;letter-spacing:.12em;color:#b9c4e4;font-size:12px;}
.fc-stat-number{font-size:32px;font-weight:900;color:#fff;line-height:1;margin-top:5px;}
.fc-stat-good{color:#20e37a;font-size:13px;margin-top:8px;font-weight:800;}
.fc-dashboard-grid{
  display:grid;
  grid-template-columns:1.35fr .9fr;
  gap:18px;
}
.fc-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.fc-feature-card{
  overflow:hidden;
  border-radius:22px;
  border:1px solid rgba(168,85,247,.30);
  background:linear-gradient(180deg,rgba(18,24,39,.92),rgba(7,9,18,.96));
}
.fc-feature-card .fc-card-art{
  height:98px;
  background-size:cover;
  background-position:center;
  border-bottom:1px solid rgba(255,56,209,.18);
  opacity:.92;
}
.fc-feature-card-body{padding:18px;}
.fc-feature-card-body h3{margin:0 0 5px;font-size:20px;color:#fff;}
.fc-feature-card-body p{margin:0;color:#cbd5ef;}
.fc-feature-meta{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px;
}
.fc-mini-box{
  padding:12px;border-radius:12px;background:#05060d;border:1px solid rgba(168,85,247,.22);
  font-size:12px;color:#dbe7ff;
}
.fc-mini-box b{display:block;color:#fff;}

/* Cards and tables */
.fc-card,
.fc-section,
.fc-choice-card,
.fc-preview-device,
.fc-list-card{
  border-color:rgba(168,85,247,.34) !important;
  box-shadow:0 18px 45px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.018) !important;
}
.fc-card:hover,
.fc-choice-card:hover,
.fc-list-card:hover{
  border-color:rgba(255,56,209,.50) !important;
  box-shadow:0 18px 48px rgba(0,0,0,.22),0 0 28px rgba(255,56,209,.08) !important;
}
.fc-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
}
.fc-table th{
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:.11em;
  color:#c9b8ff;
}
.fc-table td,.fc-table th{
  padding:14px 12px;
  border-bottom:1px solid rgba(168,85,247,.18);
}
.fc-table tr:hover td{background:rgba(255,56,209,.035);}

/* Board/device cards */
.fc-board-card-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(360px,1fr));
  gap:18px;
}
.fc-board-card{
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(168,85,247,.35);
  background:radial-gradient(circle at 100% 0%,rgba(255,56,209,.12),transparent 35%),linear-gradient(180deg,rgba(18,24,39,.92),rgba(7,9,18,.96));
}
.fc-board-card-head{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:14px;
}
.fc-board-card-head img{
  width:58px;height:58px;padding:13px;border-radius:17px;background:#05060d;border:1px solid rgba(255,56,209,.24);
}
.fc-board-card h3{margin:0;color:#fff;}
.fc-board-code{color:#aeb8d6;font-size:13px;margin-top:3px;}
.fc-board-meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0;}
.fc-board-actions{display:flex;gap:8px;flex-wrap:wrap;}

/* Empty state */
.fc-empty-pro{
  padding:30px 18px !important;
  text-align:center;
}
.fc-empty-pro img{
  max-width:260px !important;
  width:70% !important;
  opacity:.95 !important;
  filter:drop-shadow(0 0 22px rgba(255,56,209,.18));
}
.fc-empty-pro h3{font-size:24px;margin:12px 0 6px;color:#fff;}
.fc-empty-pro p{max-width:680px;margin:0 auto 14px;color:#cbd5ef;}

/* Config / copy blocks */
.fc-copyable{position:relative;}
.fc-copy-button,
.copy-button{
  position:absolute;top:12px;right:12px;z-index:2;
}
.fc-config-box,
pre.fc-config-box{
  padding:18px !important;
  padding-top:50px !important;
  white-space:pre-wrap !important;
  word-break:break-word !important;
  background:#05050d !important;
  border:1px solid rgba(255,56,209,.34) !important;
  border-radius:18px !important;
}

/* Keep footer consistent */
.fc-footer{
  margin-top:30px !important;
  padding-top:18px !important;
  border-top:1px solid rgba(168,85,247,.25) !important;
  color:#aeb8d6 !important;
}
.fc-side-copyright{
  margin-top:18px;
  padding:12px;
  color:#7d88a8;
  font-size:11px;
  line-height:1.35;
}

/* Responsive */
@media(max-width:1250px){
  .fc-stat-grid{grid-template-columns:repeat(2,1fr);}
  .fc-dashboard-grid{grid-template-columns:1fr;}
  .fc-feature-grid{grid-template-columns:1fr;}
  .fc-dash-hero{grid-template-columns:1fr;}
}
@media(max-width:780px){
  .fc-stat-grid{grid-template-columns:1fr;}
  .fc-hero-polish,.fc-visual-hero{padding:22px !important;}
}