/* === TakasaTakas — Light & Vivid Theme === */
:root{
  --bg:#f5f3ff;
  --bg2:#ede9fe;
  --text:#1e1b4b;
  --muted:#64748b;
  --primary:#8b5cf6;
  --primary2:#ec4899;
  --accent:#06b6d4;
  --card:rgba(255,255,255,.72);
  --border:rgba(139,92,246,.18);
  --shadow:0 20px 60px -25px rgba(139,92,246,.35);
}
html,body{font-family:'Space Grotesk',system-ui,sans-serif;background:var(--bg);color:var(--text);}
*{ -webkit-tap-highlight-color: transparent; }
a{transition:.18s;color:inherit;}

/* === Soft pastel aurora background === */
.bg-aurora{position:fixed;inset:0;z-index:-2;
  background:
    radial-gradient(60% 60% at 10% 10%, #fce7f3 0%, transparent 60%),
    radial-gradient(60% 60% at 90% 20%, #cffafe 0%, transparent 60%),
    radial-gradient(70% 70% at 50% 100%, #ede9fe 0%, transparent 60%),
    linear-gradient(180deg,#faf5ff 0%, #eef2ff 100%);
  overflow:hidden;
}
.bg-aurora::before,.bg-aurora::after{
  content:'';position:absolute;width:55vmax;height:55vmax;border-radius:50%;
  filter:blur(120px);opacity:.55;animation:float 24s ease-in-out infinite;
}
.bg-aurora::before{background:radial-gradient(circle,#f0abfc 0%,transparent 60%);top:-20vmax;left:-15vmax;}
.bg-aurora::after{background:radial-gradient(circle,#67e8f9 0%,transparent 60%);bottom:-25vmax;right:-15vmax;animation-delay:-12s;}
.bg-aurora .blob3{position:absolute;width:50vmax;height:50vmax;border-radius:50%;
  background:radial-gradient(circle,#a5b4fc 0%,transparent 60%);
  filter:blur(120px);opacity:.5;top:25%;left:35%;animation:float 30s ease-in-out infinite -8s;}
@keyframes float{
  0%,100%{transform:translate(0,0) scale(1);}
  33%{transform:translate(8vmax,-6vmax) scale(1.08);}
  66%{transform:translate(-6vmax,8vmax) scale(.95);}
}

/* subtle dot grid overlay */
body::before{
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:radial-gradient(rgba(139,92,246,.15) 1px,transparent 1px);
  background-size:22px 22px;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000 30%,transparent 100%);
}

/* === Header === */
header{background:rgba(255,255,255,.7) !important;border-bottom:1px solid var(--border) !important;}
header a{color:var(--text);}
header .pill-nav a{color:#475569;}
header input{background:rgba(255,255,255,.85);border-color:var(--border);color:var(--text);}
header input::placeholder{color:#94a3b8;}

/* === Cards (light glass) === */
.glass{
  background:var(--card);
  backdrop-filter:blur(22px) saturate(160%);
  border:1px solid var(--border);
  border-radius:1.5rem;
  position:relative;
  transition:all .4s cubic-bezier(.2,.8,.2,1);
  box-shadow:0 4px 24px -8px rgba(139,92,246,.12);
}
.glass::before{
  content:'';position:absolute;inset:0;border-radius:inherit;padding:1.5px;
  background:linear-gradient(135deg,#ec4899,#a78bfa 40%,#06b6d4);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:.35s;
  pointer-events:none;
}
.glass:hover::before{opacity:1;}
.glass:hover{transform:translateY(-4px);box-shadow:var(--shadow);}

/* === Chips & buttons === */
.chip{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .85rem;border-radius:9999px;
  font-size:.74rem;font-weight:500;background:rgba(255,255,255,.7);border:1px solid var(--border);
  color:#4c1d95;transition:.2s;}
.chip:hover{background:#fff;border-color:var(--primary);color:var(--primary);}

.btn-primary{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.75rem 1.5rem;border-radius:9999px;font-weight:600;
  background:linear-gradient(90deg,#ec4899,#8b5cf6,#06b6d4);
  background-size:200% 100%;color:#fff;
  box-shadow:0 12px 30px -10px rgba(139,92,246,.55);
  transition:.4s;cursor:pointer;border:none;
}
.btn-primary:hover{background-position:100% 0;transform:translateY(-2px);box-shadow:0 18px 40px -10px rgba(236,72,153,.55);}
.btn-primary:active{transform:translateY(0);}
.btn-ghost{padding:.7rem 1.3rem;border-radius:9999px;border:1.5px solid var(--border);
  color:var(--text);background:rgba(255,255,255,.5);transition:.25s;font-weight:500;}
.btn-ghost:hover{border-color:var(--primary);background:#fff;color:var(--primary);}

/* === Form === */
.input{width:100%;padding:.85rem 1.1rem;background:#fff;
  border:1.5px solid var(--border);border-radius:1rem;color:var(--text);font-size:.95rem;
  transition:.2s;}
.input:focus{outline:none;border-color:var(--primary);
  box-shadow:0 0 0 4px rgba(139,92,246,.15);}
.label{font-size:.72rem;color:var(--muted);margin-bottom:.4rem;display:block;
  text-transform:uppercase;letter-spacing:.08em;font-weight:600;}
textarea.input{font-family:inherit;}

/* === Listing card === */
.card-img{aspect-ratio:4/3;object-fit:cover;width:100%;border-radius:1.1rem;transition:.6s;}
.glass:hover .card-img{transform:scale(1.05);}
.placeholder{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;
  font-size:3.5rem;border-radius:1.1rem;
  background:linear-gradient(135deg,#fae8ff 0%,#dbeafe 50%,#cffafe 100%);}

/* === Hero swiper === */
.hero-slide{
  position:relative;border-radius:2rem;overflow:hidden;min-height:440px;
  display:flex;align-items:center;padding:3.5rem;color:#fff;
}
.hero-slide::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(110deg,rgba(76,29,149,.85) 0%,rgba(124,58,237,.5) 50%,transparent 100%);
  z-index:1;
}
.hero-slide > *{position:relative;z-index:2;}
.swiper-pagination-bullet{background:#fff;opacity:.5;}
.swiper-pagination-bullet-active{background:linear-gradient(90deg,#ec4899,#06b6d4);opacity:1;width:28px;border-radius:5px;}

/* === Marquee categories === */
.marquee{display:flex;gap:1rem;animation:scroll 40s linear infinite;}
@keyframes scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.marquee:hover{animation-play-state:paused;}

/* === Misc === */
.gradient-text{background:linear-gradient(90deg,#ec4899,#8b5cf6 50%,#06b6d4);
  -webkit-background-clip:text;background-clip:text;color:transparent;}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.line-clamp-1{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.dragging{opacity:.5;transform:scale(.95);}
.sortable-ghost{opacity:.3;}

/* Avatar conic ring */
.avatar-ring{
  background:conic-gradient(from 0deg,#ec4899,#06b6d4,#8b5cf6,#ec4899);
  padding:2.5px;border-radius:9999px;animation:spin 8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}

/* Pill nav */
.pill-nav a{padding:.55rem 1.1rem;border-radius:9999px;font-size:.88rem;color:#475569;transition:.2s;font-weight:500;}
.pill-nav a:hover{color:var(--primary);background:rgba(139,92,246,.08);}
.pill-nav a.active{background:linear-gradient(90deg,rgba(236,72,153,.15),rgba(6,182,212,.15));color:var(--primary);}

/* Mesajlasma balonlari */
.bubble{max-width:75%;padding:.8rem 1.1rem;border-radius:1.2rem;font-size:.92rem;line-height:1.45;}
.bubble.me{background:linear-gradient(135deg,#ec4899,#8b5cf6);color:#fff;border-bottom-right-radius:.35rem;margin-left:auto;box-shadow:0 8px 20px -10px rgba(139,92,246,.5);}
.bubble.you{background:#fff;border:1px solid var(--border);color:var(--text);border-bottom-left-radius:.35rem;}

/* Notification banner */
.banner{padding:.8rem 1.1rem;border-radius:1rem;font-size:.88rem;font-weight:500;}
.banner-warn{background:#fef3c7;border:1px solid #fcd34d;color:#92400e;}
.banner-ok{background:#d1fae5;border:1px solid #6ee7b7;color:#065f46;}
.banner-err{background:#fee2e2;border:1px solid #fca5a5;color:#991b1b;}

/* Scrollbar */
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:#f3e8ff;}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#ec4899,#06b6d4);border-radius:5px;}

/* Section heading */
.h-section{font-size:1.5rem;font-weight:700;color:var(--text);position:relative;padding-left:1rem;}
.h-section::before{content:'';position:absolute;left:0;top:.3rem;bottom:.3rem;width:4px;border-radius:4px;
  background:linear-gradient(180deg,#ec4899,#06b6d4);}

/* Category mini cards on home */
.cat-card{position:relative;overflow:hidden;border-radius:1.25rem;aspect-ratio:1;
  background:linear-gradient(135deg,#fae8ff,#cffafe);transition:.35s;cursor:pointer;
  border:1px solid var(--border);display:flex;flex-direction:column;justify-content:flex-end;padding:1rem;}
.cat-card:hover{transform:translateY(-4px) scale(1.02);box-shadow:var(--shadow);}
.cat-card .ic{position:absolute;top:.8rem;right:.8rem;font-size:2.5rem;opacity:.85;}

/* Floating shapes (decorative) */
.float-shape{position:absolute;border-radius:30%;filter:blur(2px);opacity:.6;animation:bob 6s ease-in-out infinite;}
@keyframes bob{0%,100%{transform:translateY(0) rotate(0);}50%{transform:translateY(-15px) rotate(6deg);}}
