/* === assets/home.extra.css – barevnější homepage (střed + pravý panel) === */

/* Paleta */
:root{
  --bg:#f5f7fb; --ink:#0f172a; --muted:#6b7280; --line:#e6e9f0;
  --primary:#2563eb; --rose:#e11d48; --sky:#0ea5e9; --amber:#f59e0b;
  --violet:#7c3aed; --green:#10b981; --slate:#475569;
  --card:#ffffff; --card-tint:#ffffffcc;
}

/* Pozadí stránky */
body{
  background:
    radial-gradient(1200px 800px at -10% -10%, #e0f2fe 0%, transparent 50%),
    radial-gradient(900px 600px at 110% 10%, #ffe4e6 0%, transparent 50%),
    radial-gradient(1000px 800px at 50% 120%, #f3e8ff 0%, transparent 55%),
    var(--bg);
  color:var(--ink);
}

/* Topbar */
.topbar{
  position:sticky; top:8px; z-index:50;
  background:linear-gradient(180deg,#ffffffee,#f6f9ffdd);
  border:1px solid #dfe6ff; border-radius:14px;
  box-shadow:0 8px 24px rgba(16,24,40,.08);
  backdrop-filter: blur(6px); overflow:hidden;
}
.topbar::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;
  background:linear-gradient(90deg,#93c5fd,#a7f3d0,#fda4af,#c4b5fd);opacity:.85}
.topbar .avatar{width:38px;height:38px;border-radius:10px;
  background:linear-gradient(135deg,var(--primary),#60a5fa);color:#fff;font-weight:800}

/* Tlačítka */
.btn{background:#f8fafc;border-color:#cfd8ea;transition:transform .06s,box-shadow .15s,background .15s}
.btn:hover{background:#eef4ff;border-color:#b7c7f1;box-shadow:0 3px 10px rgba(37,99,235,.12)}
.btn:active{transform:translateY(1px)}
.btn.primary{background:linear-gradient(135deg,var(--primary),#3b82f6);border-color:#2962ff;color:#fff}

/* Card */
.card{background:var(--card-tint);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 6px 18px rgba(16,24,40,.06);backdrop-filter: blur(2px);overflow:hidden}
.card:hover{box-shadow:0 12px 24px rgba(16,24,40,.08)}

/* KPI karta */
.card:has(.kpi-pills){background:linear-gradient(180deg,#ffffffee,#f7fbffcc);border-color:#dfe6ff}
.kpi-pills .pill{background:#eff3ff;border-color:#dfe6ff;color:#223a8b;box-shadow:0 1px 3px rgba(37,99,235,.08) inset}
.kpi-pills .pill b{color:#0b3dd6}

/* ===================== STŘED – KATEGORIE ===================== */
.card:has(.catgrid){background:linear-gradient(180deg,#ffffff,#fbfdff);border-color:#dfe6ff}
.card:has(.catgrid)::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;
  background:linear-gradient(90deg,#93c5fd,#a7f3d0,#fda4af,#c4b5fd);opacity:.9}

/* mřížka */
.catgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (max-width:900px){.catgrid{grid-template-columns:1fr}}

/* box kategorie */
.catcard{position:relative;overflow:hidden;border:1px solid #e6ebf5;border-radius:14px;
  transition:transform .12s,box-shadow .12s,border-color .12s;box-shadow:0 6px 14px rgba(16,24,40,.05)}
.catcard::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;
  background:linear-gradient(90deg,#93c5fd,#a7f3d0,#fda4af,#c4b5fd);opacity:.85}

/* sytější pastely (Oblíbené + 5 kategorií) */
.catgrid > .catcard:nth-child(1){background:linear-gradient(180deg,#e8f0ff 0%,#ffffff 38%) !important;border-color:#cfe0ff}
.catgrid > .catcard:nth-child(2){background:linear-gradient(180deg,#ffe4ec 0%,#ffffff 38%) !important;border-color:#ffd1dc}
.catgrid > .catcard:nth-child(3){background:linear-gradient(180deg,#e6f6ff 0%,#ffffff 38%) !important;border-color:#cdeaff}
.catgrid > .catcard:nth-child(4){background:linear-gradient(180deg,#fff0da 0%,#ffffff 38%) !important;border-color:#ffdeb1}
.catgrid > .catcard:nth-child(5){background:linear-gradient(180deg,#efe6ff 0%,#ffffff 38%) !important;border-color:#e0d2ff}
.catgrid > .catcard:nth-child(6){background:linear-gradient(180deg,#e6fff4 0%,#ffffff 38%) !important;border-color:#c8f6e8}

/* fallback, kdyby uvnitř nebyla .catcard */
.cats .cat .cat-body .card{
  background:linear-gradient(180deg,#f6f9ff 0%,#ffffff 45%) !important;
  border-color:#dfe6ff !important;
}

.catcard .head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.catcard .title{font-weight:900;letter-spacing:.2px}
.catcard .badge{margin-left:auto;background:#eef2ff;border:1px solid #dfe6ff;border-radius:999px;padding:2px 8px;font-size:.82em;color:#1e2a78}
.catcard .meta{color:#5b6478}
.catcard .preview .chip{display:inline-block;margin:2px 6px 0 0;padding:3px 10px;border:1px solid #e7ebf3;border-radius:999px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.04);transition:transform .08s}
.catcard .preview .chip:hover{transform:translateY(-1px)}
.catcard:hover{transform:translateY(-2px);box-shadow:0 12px 22px rgba(16,24,40,.1);border-color:#cfd8ff}

.catgrid > .catcard:nth-child(1) .title{color:var(--primary)}
.catgrid > .catcard:nth-child(2) .title{color:var(--rose)}
.catgrid > .catcard:nth-child(3) .title{color:var(--sky)}
.catgrid > .catcard:nth-child(4) .title{color:var(--amber)}
.catgrid > .catcard:nth-child(5) .title{color:var(--violet)}
.catgrid > .catcard:nth-child(6) .title{color:var(--green)}

/* ===== Levý sloupec – ostatní karty (ať nejsou čistě bílé) ===== */
.grid > div:first-child > .card:not(:has(.kpi-pills)):not(:has(.catgrid)){
  background:linear-gradient(180deg,#fbfdff 0%,#ffffff 55%);
  border-color:#dfe6ff;
}

/* ===================== PRAVÝ PANEL – BAREVY! ===================== */
.grid > div:last-child > .card{
  position:relative;
  background:linear-gradient(180deg,#ffffff,#fbfbff);
  border-color:#e3e9fb;
}
.grid > div:last-child > .card::before{
  content:""; position:absolute; inset:0 0 auto 0; height:3px;
  background:linear-gradient(90deg,#93c5fd,#a7f3d0,#fda4af,#c4b5fd);
  opacity:.8;
}

/* jemné odlišení jednotlivých boxů podle pořadí */
.grid > div:last-child > .card:nth-child(1){ /* Kredity / profil */
  background:radial-gradient(800px 300px at -10% -40%, #ecf2ff 0%, transparent 60%), #ffffff;
  border-color:#d6e2ff;
}
.grid > div:last-child > .card:nth-child(2){ /* Moji kamarádi on-line */
  background:radial-gradient(800px 300px at -10% -40%, #eafaf6 0%, transparent 60%), #ffffff;
  border-color:#cfeee3;
}
.grid > div:last-child > .card:nth-child(3){ /* TOP závisláci */
  background:radial-gradient(800px 300px at -10% -40%, #fff3e6 0%, transparent 60%), #ffffff;
  border-color:#ffe1bd;
}
.grid > div:last-child > .card:nth-child(4){ /* Nejnovější uživatelé */
  background:radial-gradient(800px 300px at -10% -40%, #f3e8ff 0%, transparent 60%), #ffffff;
  border-color:#e2d5ff;
}

/* řádky v seznamech */
.user-line{padding:6px 8px;border-radius:8px}
.user-line:hover{background:#f6f9ff}

/* ikonky */
.ico{display:inline-flex;align-items:center;justify-content:center;vertical-align:-1px}
.ico.star{width:14px;height:14px;flex:0 0 14px;margin-right:4px}
.ico.star.empty{opacity:.28}
.ico.gender{width:12px;height:12px;flex:0 0 12px;margin-right:6px;opacity:.95}

/* chips */
.chip{border:1px solid #e3e8f2;background:#fff;border-radius:999px;padding:2px 8px;font-size:.9em}
.chip.ghost{background:#f5f7ff;color:#64748b}

/* Badge s počty lidí */
.badge.room{color:#0a7a32;font-weight:800;background:#e9fff0;border:1px solid #c9f1d8;border-radius:999px;padding:2px 8px}

/* Spodní odkazy */
.footer-links .btn.linklike{color:#3b4b86}
.footer-links .btn.linklike:hover{background:#eff3ff;border-color:#dfe6ff}

/* Nadpisy */
.head h1,.head h2,.head b{font-weight:800;letter-spacing:.1px}