/* ============================================================
   KUAFÖRÜM — Dark Luxury Design System v5.0
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Outfit:wght@700;800;900&display=swap');

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-font-smoothing:antialiased; }
ul { list-style:none; }
a { text-decoration:none; color:inherit; }
img { max-width:100%; height:auto; display:block; }
button { font-family:inherit; cursor:pointer; }

:root {
  /* Brand */
  --gold:#c9a85c; --gold-light:#e4c97e; --gold-dim:rgba(201,168,92,.12);
  --gold-border:rgba(201,168,92,.22);
  /* Legacy aliases */
  --primary:#c9a85c; --primary-dark:#b8943f; --primary-light:rgba(201,168,92,.15);
  --secondary:#e4c97e; --dark:#f4f4f5; --white:#f4f4f5;
  --cyan:#67d0f5; --rose:#ef4444; --green:#10b981;
  /* Surfaces */
  --black:#09090b; --bg:#09090b; --surface:#111114; --surface-2:#17171b; --surface-3:#1e1e24;
  /* Borders */
  --border:rgba(255,255,255,.07); --border-strong:rgba(255,255,255,.12);
  /* Text */
  --text:#f4f4f5; --text-secondary:rgba(244,244,245,.6); --text-muted:rgba(244,244,245,.35);
  /* Legacy gray scale (dark) */
  --gray-50:#1e1e24; --gray-100:#27272a; --gray-200:#3f3f46; --gray-300:#52525b;
  --gray-400:#71717a; --gray-500:#a1a1aa; --gray-600:#d4d4d8; --gray-700:#e4e4e7;
  --gray-800:#f4f4f5; --gray-900:#fafafa; --gray-950:#ffffff;
  /* Gradients */
  --grad-primary:linear-gradient(135deg,#c9a85c,#e4c97e);
  --grad-gold:linear-gradient(135deg,#c9a85c,#e4c97e);
  --grad-hero:linear-gradient(135deg,#09090b 0%,#111114 100%);
  --grad-green:linear-gradient(135deg,#10b981,#34d399);
  --grad-rose:linear-gradient(135deg,#ef4444,#f97316);
  --grad-card:linear-gradient(145deg,rgba(255,255,255,.04) 0%,rgba(255,255,255,.01) 100%);
  /* Shadows */
  --shadow-xs:0 1px 2px rgba(0,0,0,.3); --shadow-sm:0 2px 8px rgba(0,0,0,.4);
  --shadow:0 4px 16px rgba(0,0,0,.5); --shadow-md:0 8px 30px rgba(0,0,0,.5);
  --shadow-lg:0 16px 50px rgba(0,0,0,.6); --shadow-xl:0 24px 80px rgba(0,0,0,.7);
  --shadow-glow:0 0 40px rgba(201,168,92,.25); --shadow-gold:0 0 40px rgba(201,168,92,.2);
  /* Radii */
  --r-xs:4px; --r-sm:8px; --r:12px; --r-md:16px; --r-lg:20px; --r-xl:28px; --r-full:9999px;
  /* Easing */
  --ease:cubic-bezier(.4,0,.2,1); --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --dur:200ms; --dur-md:300ms; --dur-lg:500ms;
}

body { font-family:'Inter',system-ui,sans-serif; background:var(--black); color:var(--text); line-height:1.6; overflow-x:hidden; }
.container { max-width:1200px; margin:0 auto; padding:0 clamp(1rem,3vw,2rem); }
.container-wide { max-width:1400px; margin:0 auto; padding:0 clamp(1rem,3vw,2rem); }

::-webkit-scrollbar { width:5px; }
::-webkit-scrollbar-track { background:var(--black); }
::-webkit-scrollbar-thumb { background:var(--gold); border-radius:4px; }

/* TYPOGRAPHY */
.gradient-text { background:var(--grad-primary); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.gradient-text-gold { background:var(--grad-gold); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
h1,h2,h3,h4,h5,h6 { font-family:'Outfit','Inter',sans-serif; }

/* SECTION */
.section-header { text-align:center; margin-bottom:3.5rem; }
.section-badge { display:inline-flex; align-items:center; gap:.4rem; padding:.35rem 1rem; background:rgba(201,168,92,.12); color:var(--gold); border-radius:var(--r-full); font-size:.75rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; border:1px solid rgba(201,168,92,.22); margin-bottom:1rem; }
.section-header h2 { font-size:clamp(1.8rem,3.5vw,2.75rem); font-weight:800; color:var(--text); line-height:1.2; margin-bottom:.75rem; }
.section-header p { font-size:1.05rem; color:var(--text-secondary); max-width:560px; margin:0 auto; }

/* BUTTONS */
.btn { display:inline-flex; align-items:center; gap:.5rem; padding:.7rem 1.6rem; border-radius:var(--r-full); font-weight:600; font-size:.875rem; border:1px solid transparent; transition:all .2s ease; white-space:nowrap; cursor:pointer; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { background:var(--gold); color:#09090b; border-color:var(--gold); box-shadow:0 4px 20px rgba(201,168,92,.25); }
.btn-primary:hover { background:var(--gold-light); box-shadow:0 8px 30px rgba(201,168,92,.4); }
.btn-secondary { background:var(--gold-dim); color:var(--gold); border-color:var(--gold-border); }
.btn-secondary:hover { background:rgba(201,168,92,.2); }
.btn-outline { border-color:var(--border-strong); color:var(--text-secondary); background:transparent; }
.btn-outline:hover { border-color:var(--gold); color:var(--gold); }
.btn-ghost { padding:.4rem .9rem; border:1px solid var(--border); border-radius:7px; font-size:.68rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--text-secondary); background:transparent; transition:all .2s; white-space:nowrap; }
.btn-ghost:hover { border-color:var(--gold); color:var(--gold); background:transparent; transform:none; }
.btn-gold { padding:.4rem 1rem; background:var(--gold); border:1px solid var(--gold); border-radius:7px; font-size:.68rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#09090b; transition:all .2s; display:inline-flex; align-items:center; gap:.4rem; white-space:nowrap; }
.btn-gold:hover { background:var(--gold-light); transform:none; }
.btn-danger { background:rgba(239,68,68,.15); color:#ef4444; border-color:rgba(239,68,68,.2); }
.btn-danger:hover { background:rgba(239,68,68,.25); }
.btn-block { width:100%; justify-content:center; border-radius:var(--r); }
.btn-sm { padding:.45rem 1rem; font-size:.78rem; }
.btn-lg { padding:.9rem 2rem; font-size:.95rem; }
.btn-xl { padding:1.1rem 2.5rem; font-size:1rem; }

/* NAVBAR */
.navbar { position:fixed; top:0; left:0; right:0; z-index:1000; padding:.85rem 0; transition:all .3s ease; }
.navbar.scrolled { background:rgba(9,9,11,.92); backdrop-filter:blur(20px); border-bottom:1px solid var(--border); padding:.65rem 0; }
.navbar.transparent { background:transparent; }
.nav-container { display:flex; align-items:center; justify-content:space-between; }
.logo { display:flex; align-items:center; gap:.4rem; font-family:'Outfit',sans-serif; font-weight:800; font-size:1.05rem; letter-spacing:.02em; color:var(--text); white-space:nowrap; }
.logo i { color:var(--gold); font-size:.85rem; }
.nav-links { display:flex; align-items:center; gap:1.5rem; list-style:none; }
.nav-links a { font-size:.68rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--text-secondary); transition:color .2s; white-space:nowrap; }
.nav-links a:hover, .nav-links a.active { color:var(--text); }
.nav-buttons { display:flex; align-items:center; gap:.5rem; }
.nav-cta { padding:.4rem 1rem; background:var(--gold); border:1px solid var(--gold); border-radius:7px; font-size:.68rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#09090b; transition:all .2s; }
.nav-cta:hover { background:var(--gold-light); }
.hamburger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }
.hamburger span { display:block; width:22px; height:2px; background:var(--text); border-radius:2px; transition:all .3s; }

/* MOBILE MENU */
.mobile-menu { display:none; flex-direction:column; gap:.25rem; position:fixed; top:0; left:0; right:0; bottom:0; background:var(--black); z-index:999; padding:5rem 2rem 2rem; overflow-y:auto; }
.mobile-menu.open { display:flex; }
.mobile-close { position:absolute; top:1.5rem; right:1.5rem; background:none; border:1px solid var(--border); color:var(--text); width:40px; height:40px; border-radius:8px; font-size:1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.mobile-menu a { padding:1rem 1.25rem; border-bottom:1px solid var(--border); font-size:.875rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--text-secondary); display:flex; align-items:center; gap:.75rem; transition:color .2s; }
.mobile-menu a:hover { color:var(--gold); }
.mobile-menu a i { width:18px; color:var(--gold); }
.mobile-menu .btn-primary, .mobile-menu .btn-gold { margin-top:1.5rem; text-align:center; border-radius:10px; padding:1rem; width:100%; justify-content:center; }

/* PAGE HERO (inner pages) */
.page-hero { padding:9rem 0 5rem; background:var(--black); position:relative; text-align:center; }
.page-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 60% 50% at 50% 0%, rgba(201,168,92,.06) 0%, transparent 70%); pointer-events:none; }
.page-hero-badge { display:inline-flex; align-items:center; gap:.5rem; font-size:.68rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin-bottom:1rem; }
.page-hero h1 { font-family:'Outfit',sans-serif; font-size:clamp(2.2rem,5vw,4rem); font-weight:800; line-height:1.1; margin-bottom:1rem; }
.page-hero h1 em { font-style:normal; background:var(--grad-gold); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.page-hero p { font-size:1.05rem; color:var(--text-secondary); max-width:600px; margin:0 auto; line-height:1.75; }
.sec-divider { height:1px; background:var(--border); }

/* SECTION CONTENT (static pages) */
.content-section { padding:5rem 0; background:var(--black); }
.content-section + .content-section { background:var(--surface); }
.content-card { background:var(--surface-2); border:1px solid var(--border); border-radius:20px; padding:2.5rem; margin-bottom:1.5rem; }
.content-card h3 { font-size:1.2rem; font-weight:700; color:var(--text); margin-bottom:1rem; padding-bottom:.75rem; border-bottom:1px solid var(--border); }
.content-card p, .content-card li { font-size:.9rem; color:var(--text-secondary); line-height:1.85; margin-bottom:.75rem; }
.content-card ul { padding-left:1.25rem; list-style:disc; }
.content-card ul li::marker { color:var(--gold); }
.content-card strong { color:var(--text); font-weight:600; }

/* FORMS */
.form-group { margin-bottom:1.25rem; }
.form-label { display:block; font-size:.82rem; font-weight:600; color:var(--text-secondary); margin-bottom:.5rem; letter-spacing:.04em; }
.form-control { width:100%; padding:.8rem 1rem; background:var(--surface-2); border:1px solid var(--border); border-radius:10px; font-size:.9rem; color:var(--text); font-family:inherit; transition:border-color .2s, box-shadow .2s; outline:none; }
.form-control::placeholder { color:var(--text-muted); }
.form-control:focus { border-color:var(--gold-border); box-shadow:0 0 0 3px rgba(201,168,92,.1); }
.form-select { width:100%; padding:.8rem 1rem; background:var(--surface-2); border:1px solid var(--border); border-radius:10px; font-size:.9rem; color:var(--text); font-family:inherit; outline:none; cursor:pointer; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c9a85c' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .875rem center; padding-right:2.5rem; }
.form-select:focus { border-color:var(--gold-border); outline:none; }
.form-select option { background:#1e1e24; color:var(--text); }
.input-group { position:relative; }
.input-group .form-control { padding-left:2.8rem; }
.input-icon { position:absolute; left:.9rem; top:50%; transform:translateY(-50%); color:var(--text-muted); font-size:.85rem; pointer-events:none; }
.checkbox-group { display:flex; align-items:center; gap:.5rem; }
.checkbox-group input[type=checkbox] { accent-color:var(--gold); width:16px; height:16px; }
.checkbox-group label { font-size:.82rem; color:var(--text-secondary); cursor:pointer; }

/* ALERTS */
.alert { display:flex; align-items:center; gap:.6rem; padding:.75rem 1rem; border-radius:10px; font-size:.85rem; font-weight:500; margin-bottom:1rem; }
.alert-success { background:rgba(16,185,129,.1); border:1px solid rgba(16,185,129,.2); color:#34d399; }
.alert-danger { background:rgba(239,68,68,.1); border:1px solid rgba(239,68,68,.2); color:#f87171; }
.alert-warning { background:rgba(201,168,92,.1); border:1px solid rgba(201,168,92,.2); color:var(--gold); }
.alert-info { background:rgba(103,208,245,.1); border:1px solid rgba(103,208,245,.2); color:var(--cyan); }

/* AUTH PAGES */
.auth-page { display:flex; min-height:100vh; }
.auth-visual { width:420px; flex-shrink:0; background:linear-gradient(160deg, #0d0d10 0%, #141018 50%, #110d1a 100%); border-right:1px solid var(--border); padding:3rem 2.5rem; display:flex; flex-direction:column; justify-content:center; position:relative; overflow:hidden; }
.auth-visual::before { content:''; position:absolute; top:-100px; left:-100px; width:400px; height:400px; background:radial-gradient(circle, rgba(201,168,92,.07) 0%, transparent 70%); pointer-events:none; }
.auth-visual-content { position:relative; z-index:1; }
.auth-visual h2 { font-family:'Outfit',sans-serif; font-size:1.8rem; font-weight:800; color:var(--text); margin-bottom:.75rem; line-height:1.2; }
.auth-visual p { font-size:.9rem; color:var(--text-secondary); line-height:1.75; margin-bottom:1.5rem; }
.auth-visual-stats { display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; margin:1.5rem 0; }
.av-stat { background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:12px; padding:.875rem; text-align:center; }
.av-stat .n { display:block; font-family:'Outfit',sans-serif; font-size:1.5rem; font-weight:800; color:var(--gold); line-height:1; }
.av-stat .l { display:block; font-size:.68rem; color:var(--text-muted); margin-top:.3rem; letter-spacing:.05em; text-transform:uppercase; }
.auth-form-section { flex:1; overflow-y:auto; max-height:100vh; padding:3rem 2.5rem; display:flex; flex-direction:column; justify-content:center; background:var(--black); }
.auth-form-wrap { max-width:440px; width:100%; margin:0 auto; }
.auth-logo { display:inline-flex; align-items:center; gap:.5rem; font-family:'Outfit',sans-serif; font-weight:800; font-size:1.1rem; color:var(--text); margin-bottom:1.75rem; }
.auth-logo i { color:var(--gold); }
.auth-title { font-family:'Outfit',sans-serif; font-size:1.75rem; font-weight:800; color:var(--text); margin-bottom:.35rem; }
.auth-subtitle { font-size:.875rem; color:var(--text-muted); margin-bottom:1.75rem; }
.auth-footer { text-align:center; margin-top:1.5rem; font-size:.85rem; color:var(--text-muted); }
.auth-footer a { color:var(--gold); font-weight:600; }

/* FORM STEPS (kayit) */
.form-steps { display:flex; gap:.5rem; margin-bottom:2rem; }
.form-step-indicator { flex:1; padding:.6rem; background:var(--surface-2); border:1px solid var(--border); border-radius:10px; text-align:center; transition:all .2s; cursor:default; }
.form-step-indicator.active { background:var(--gold-dim); border-color:var(--gold-border); }
.form-step-indicator.completed { background:rgba(16,185,129,.1); border-color:rgba(16,185,129,.2); }
.step-num { display:block; font-family:'Outfit',sans-serif; font-size:1.1rem; font-weight:800; color:var(--text-muted); }
.form-step-indicator.active .step-num { color:var(--gold); }
.form-step-indicator.completed .step-num { color:#10b981; }
.step-text { font-size:.65rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:.06em; }
.form-step-indicator.active .step-text { color:var(--gold); }

/* STEP CONTENT */
.step-content { display:none; }
.step-content.active { display:block; }

/* VERIFICATION */
.verify-section { text-align:center; padding:1rem 0; }
.verify-icon { width:80px; height:80px; background:var(--gold-dim); border:1px solid var(--gold-border); border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 1.5rem; font-size:2rem; color:var(--gold); }
.verify-code-inputs { display:flex; gap:.5rem; justify-content:center; margin:1.5rem 0; }
.verify-code-inputs input { width:48px; height:58px; text-align:center; font-size:1.5rem; font-weight:800; background:var(--surface-2); border:1px solid var(--border); border-radius:10px; color:var(--text); font-family:'Outfit',sans-serif; outline:none; transition:border-color .2s; }
.verify-code-inputs input:focus { border-color:var(--gold-border); box-shadow:0 0 0 3px rgba(201,168,92,.1); }

/* TAGS / CATEGORY FILTER */
.filter-tags { display:flex; flex-wrap:wrap; gap:.5rem; margin:1rem 0; }
.filter-tag { padding:.35rem .875rem; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-full); font-size:.75rem; font-weight:600; color:var(--text-secondary); cursor:pointer; transition:all .2s; }
.filter-tag:hover, .filter-tag.active { background:var(--gold-dim); border-color:var(--gold-border); color:var(--gold); }

/* CARDS */
.card { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; transition:all .25s; }
.card:hover { border-color:rgba(255,255,255,.12); transform:translateY(-3px); box-shadow:var(--shadow-md); }
.card-body { padding:1.5rem; }
.card-header { padding:1.25rem 1.5rem; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.card-title { font-size:1rem; font-weight:700; color:var(--text); }

/* SALON CARDS (kesfet/salonlar) */
.salon-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; transition:all .25s; display:flex; flex-direction:column; }
.salon-card:hover { border-color:var(--gold-border); transform:translateY(-3px); box-shadow:0 8px 30px rgba(0,0,0,.4); }
.salon-card-img { height:160px; background:var(--surface-2); display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.salon-card-img img { width:100%; height:100%; object-fit:cover; }
.salon-card-img-placeholder { color:var(--text-muted); font-size:2.5rem; }
.salon-card-body { padding:1.25rem; flex:1; }
.salon-card-footer { padding:.875rem 1.25rem; border-top:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.salon-badge { display:inline-flex; align-items:center; gap:.3rem; padding:.25rem .65rem; border-radius:var(--r-full); font-size:.68rem; font-weight:700; }
.salon-badge-verified { background:rgba(16,185,129,.1); color:#34d399; border:1px solid rgba(16,185,129,.15); }
.salon-badge-category { background:var(--gold-dim); color:var(--gold); border:1px solid var(--gold-border); }
.salon-name { font-size:.95rem; font-weight:700; color:var(--text); margin-bottom:.3rem; line-height:1.3; }
.salon-address { font-size:.78rem; color:var(--text-muted); display:flex; align-items:center; gap:.35rem; }
.salon-address i { color:var(--gold); }
.salon-rating { display:flex; align-items:center; gap:.3rem; font-size:.8rem; }
.salon-rating i { color:var(--gold); font-size:.7rem; }
.salon-phone { display:flex; align-items:center; gap:.35rem; font-size:.78rem; color:var(--text-secondary); }
.salon-phone i { color:var(--gold); }

/* PRODUCT CARDS (marketplace) */
.product-card { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; transition:all .25s; }
.product-card:hover { border-color:var(--gold-border); transform:translateY(-3px); box-shadow:var(--shadow-md); }
.product-card-img { height:180px; background:var(--surface); display:flex; align-items:center; justify-content:center; border-bottom:1px solid var(--border); font-size:3rem; color:var(--gold); }
.product-card-body { padding:1.25rem; }
.product-card-title { font-size:.9rem; font-weight:700; color:var(--text); margin-bottom:.5rem; line-height:1.4; }
.product-card-brand { font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted); margin-bottom:.75rem; }
.product-card-price { display:flex; align-items:baseline; gap:.5rem; }
.product-price-old { font-size:.8rem; color:var(--text-muted); text-decoration:line-through; }
.product-price-new { font-size:1.15rem; font-weight:800; color:var(--gold); }
.product-badge-discount { display:inline-flex; padding:.2rem .6rem; background:var(--gold); color:#09090b; border-radius:var(--r-full); font-size:.65rem; font-weight:800; }
.product-badge-hot { background:#ef4444; color:#fff; }
.product-badge-new { background:#10b981; color:#fff; }

/* DASHBOARD */
.dashboard-page { padding-top:64px; }
.dashboard-layout { display:flex; height:calc(100vh - 64px); overflow:hidden; }
.dashboard-sidebar { width:260px; flex-shrink:0; background:linear-gradient(180deg,#09090b 0%,#0d0b14 60%,#100b18 100%); border-right:1px solid var(--border); height:calc(100vh - 64px); position:sticky; top:64px; overflow-y:auto; display:flex; flex-direction:column; }
.dashboard-main { flex:1; overflow-y:auto; padding:2rem; background:var(--black); }
.sidebar-brand { padding:1.25rem 1.5rem; border-bottom:1px solid var(--border); }
.sidebar-panel-badge { padding:.875rem 1.25rem; border-bottom:1px solid var(--border); }
.sidebar-panel-badge span { display:inline-flex; align-items:center; gap:.4rem; padding:.3rem 1rem; background:var(--gold-dim); color:var(--gold); border:1px solid var(--gold-border); border-radius:var(--r-full); font-size:.65rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.dashboard-user { padding:1.5rem 1.25rem; text-align:center; border-bottom:1px solid var(--border); }
.user-avatar-lg { width:72px; height:72px; border-radius:50%; background:var(--gold-dim); border:2px solid var(--gold-border); display:flex; align-items:center; justify-content:center; margin:0 auto .875rem; font-size:1.75rem; color:var(--gold); box-shadow:0 0 0 4px rgba(201,168,92,.15); }
.dashboard-user h3 { font-size:.95rem; font-weight:700; color:var(--text); margin-bottom:.3rem; }
.user-level { display:inline-flex; align-items:center; gap:.35rem; font-size:.72rem; color:var(--gold); }
.user-level i { font-size:.65rem; }
.points-card { margin:1rem 1.25rem; background:rgba(255,255,255,.03); border:1px solid var(--border); border-radius:12px; padding:1rem; }
.points-card-row { display:flex; align-items:center; justify-content:space-between; margin-bottom:.5rem; }
.points-card-label { font-size:.7rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:.1em; }
.points-card-value { font-family:'Outfit',sans-serif; font-size:1.3rem; font-weight:800; color:var(--gold); }
.points-bar-track { height:4px; background:rgba(255,255,255,.06); border-radius:4px; overflow:hidden; margin-bottom:.4rem; }
.points-bar-fill { height:100%; background:var(--grad-gold); transition:width .6s ease; }
.points-next-label { font-size:.68rem; color:var(--text-muted); }
.dashboard-nav { padding:.75rem; flex:1; }
.dashboard-nav a { display:flex; align-items:center; gap:.75rem; padding:.75rem 1rem; border-radius:10px; font-size:.82rem; font-weight:600; color:var(--text-secondary); transition:all .2s; margin-bottom:2px; }
.dashboard-nav a:hover { background:rgba(255,255,255,.04); color:var(--text); }
.dashboard-nav a.active { background:linear-gradient(135deg,rgba(201,168,92,.2),rgba(201,168,92,.1)); color:var(--gold); border:1px solid var(--gold-border); }
.dashboard-nav a i { width:16px; font-size:.85rem; color:var(--text-muted); }
.dashboard-nav a.active i, .dashboard-nav a:hover i { color:var(--gold); }
.nav-divider { height:1px; background:var(--border); margin:.5rem 0; }
.nav-logout { color:rgba(239,68,68,.5) !important; }
.nav-logout:hover { color:#ef4444 !important; background:rgba(239,68,68,.08) !important; }
.nav-logout i { color:rgba(239,68,68,.4) !important; }
.dashboard-card { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg); padding:1.5rem; position:relative; overflow:hidden; transition:all .25s; }
.dashboard-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--grad-gold); border-radius:0; opacity:0; transition:opacity .25s; }
.dashboard-card:hover { box-shadow:0 8px 28px rgba(0,0,0,.4); transform:translateY(-2px); }
.dashboard-card:hover::before { opacity:1; }
.dash-stat-card { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg); padding:1.5rem; }
.dash-stat-num { font-family:'Outfit',sans-serif; font-size:2rem; font-weight:800; color:var(--gold); line-height:1; }
.dash-stat-label { font-size:.78rem; color:var(--text-muted); margin-top:.35rem; }
.dash-stat-icon { width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1rem; }

/* SALON DETAIL PAGE */
.salon-hero { padding:8rem 0 4rem; background:var(--black); position:relative; }
.salon-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 50% 60% at 80% 50%, rgba(201,168,92,.06) 0%, transparent 70%); pointer-events:none; }
.salon-header { display:flex; align-items:flex-start; gap:2rem; }
.salon-avatar { width:100px; height:100px; border-radius:20px; background:var(--surface-2); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:2.5rem; color:var(--gold); flex-shrink:0; }
.salon-info h1 { font-family:'Outfit',sans-serif; font-size:2rem; font-weight:800; color:var(--text); }
.salon-meta { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:.75rem; color:var(--text-secondary); font-size:.85rem; }
.salon-meta i { color:var(--gold); }
.salon-actions { display:flex; gap:.75rem; flex-wrap:wrap; margin-top:1.25rem; }
.tab-nav { display:flex; border-bottom:1px solid var(--border); }
.tab-btn { padding:.875rem 1.5rem; font-size:.85rem; font-weight:600; color:var(--text-muted); background:none; border:none; border-bottom:2px solid transparent; cursor:pointer; transition:all .2s; }
.tab-btn.active { color:var(--gold); border-bottom-color:var(--gold); }
.tab-btn:hover { color:var(--text); }
.tab-content { display:none; }
.tab-content.active { display:block; }
.widget { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg); padding:1.5rem; margin-bottom:1.25rem; }
.widget-title { font-size:.9rem; font-weight:700; color:var(--text); margin-bottom:1rem; padding-bottom:.75rem; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:.5rem; }
.widget-title i { color:var(--gold); font-size:.85rem; }

/* MAP */
.leaflet-container { background:#1a1a1f !important; }
.leaflet-tile { filter:grayscale(80%) invert(90%) brightness(0.35) !important; }

/* KESFET / SEARCH */
.search-hero { padding:7rem 0 4rem; background:var(--black); position:relative; text-align:center; }
.search-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 70% 60% at 50% 0%, rgba(201,168,92,.06) 0%, transparent 70%); pointer-events:none; }
.search-bar-wrap { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-full); display:flex; align-items:center; padding:.4rem .4rem .4rem 1.25rem; gap:.5rem; max-width:700px; margin:2rem auto 0; }
.search-bar-wrap input { flex:1; background:none; border:none; outline:none; font-size:.95rem; color:var(--text); font-family:inherit; }
.search-bar-wrap input::placeholder { color:var(--text-muted); }
.search-bar-wrap select { background:none; border:none; outline:none; font-size:.875rem; color:var(--text-secondary); font-family:inherit; padding:.4rem .75rem; cursor:pointer; }
.search-bar-wrap select option { background:var(--surface-2); }
.search-divider { width:1px; height:20px; background:var(--border); flex-shrink:0; }
.results-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding:1.25rem 0; border-bottom:1px solid var(--border); margin-bottom:1.5rem; }
.results-count { font-size:.875rem; color:var(--text-muted); }
.results-count strong { color:var(--gold); }
.grid-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }

/* MAP SIDEBAR LAYOUT */
.map-layout { display:grid; grid-template-columns:320px 1fr; gap:1.5rem; }
.map-sidebar { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; }
.map-container { height:500px; background:var(--surface-2); border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--border); }
#map { height:100%; width:100%; }

/* STATISTICS BADGES */
.stat-badge { display:inline-flex; align-items:center; gap:.5rem; padding:.6rem 1rem; background:var(--surface-2); border:1px solid var(--border); border-radius:12px; font-size:.85rem; }
.stat-badge strong { color:var(--gold); font-family:'Outfit',sans-serif; font-size:1.1rem; }

/* PAGINATION */
.pagination { display:flex; justify-content:center; gap:.4rem; flex-wrap:wrap; margin-top:2rem; }
.page-btn { padding:.5rem .875rem; background:var(--surface-2); border:1px solid var(--border); border-radius:8px; font-size:.8rem; color:var(--text-secondary); cursor:pointer; transition:all .2s; font-family:inherit; }
.page-btn:hover, .page-btn.active { background:var(--gold-dim); border-color:var(--gold-border); color:var(--gold); }
.page-btn:disabled { opacity:.4; cursor:default; }

/* BREADCRUMB */
.breadcrumb { display:flex; align-items:center; gap:.5rem; font-size:.78rem; color:var(--text-muted); margin-bottom:2rem; flex-wrap:wrap; }
.breadcrumb a { color:var(--text-muted); transition:color .2s; }
.breadcrumb a:hover { color:var(--gold); }
.breadcrumb .sep { opacity:.4; }

/* BACK TO TOP */
.back-to-top { position:fixed; bottom:1.5rem; right:1.5rem; z-index:999; width:44px; height:44px; border-radius:10px; background:var(--gold); color:#09090b; border:none; font-size:.9rem; cursor:pointer; display:none; align-items:center; justify-content:center; box-shadow:0 4px 16px rgba(201,168,92,.3); transition:all .2s; }
.back-to-top.show { display:flex; }
.back-to-top:hover { background:var(--gold-light); transform:translateY(-2px); }

/* FOOTER */
.footer { background:var(--surface); border-top:1px solid var(--border); padding:5rem 0 2.5rem; }
.footer-grid { display:grid; grid-template-columns:1.8fr 1fr 1fr 1fr; gap:3rem; margin-bottom:3rem; }
.footer-logo { display:flex; align-items:center; gap:.5rem; font-family:'Outfit',sans-serif; font-weight:800; font-size:1.1rem; margin-bottom:1rem; }
.footer-logo i { color:var(--gold); }
.footer-about p { font-size:.85rem; color:var(--text-secondary); line-height:1.75; margin-bottom:1.5rem; }
.social-links { display:flex; gap:.6rem; }
.social-links a { width:36px; height:36px; border-radius:8px; border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:.85rem; color:var(--text-secondary); transition:all .2s; }
.social-links a:hover { border-color:var(--gold); color:var(--gold); background:var(--gold-dim); }
.footer-col h4 { font-size:.65rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--text-muted); margin-bottom:1.25rem; }
.footer-col ul li + li { margin-top:.65rem; }
.footer-col ul li a { font-size:.85rem; color:var(--text-secondary); transition:color .2s; }
.footer-col ul li a:hover { color:var(--gold); }
.footer-bottom { padding-top:2rem; border-top:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; }
.footer-bottom p { font-size:.78rem; color:var(--text-muted); }
.payment-icons { display:flex; gap:.75rem; color:var(--text-muted); font-size:1.4rem; }

/* ANIMATIONS */
@keyframes anim-spin { to{transform:rotate(360deg)} }
.anim-spin { animation:anim-spin 1s linear infinite; }
@keyframes fadeIn { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }
.fade-in { animation:fadeIn .3s ease both; }

/* MODAL */
.modal-overlay { display:none; position:fixed; inset:0; z-index:10000; background:rgba(0,0,0,.7); backdrop-filter:blur(8px); align-items:center; justify-content:center; }
.modal-overlay.open { display:flex; }
.modal-box { background:var(--surface-2); border:1px solid var(--border); border-radius:20px; padding:2.5rem; max-width:460px; width:90%; box-shadow:var(--shadow-xl); }
.modal-box h3 { font-family:'Outfit',sans-serif; font-size:1.2rem; font-weight:800; color:var(--text); margin-bottom:.5rem; }
.modal-box p { font-size:.875rem; color:var(--text-secondary); line-height:1.7; margin-bottom:1.25rem; }

/* TABLES */
.table-wrap { overflow-x:auto; border:1px solid var(--border); border-radius:var(--r-lg); }
table { width:100%; border-collapse:collapse; }
th { padding:.875rem 1rem; background:var(--surface-2); font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted); text-align:left; border-bottom:1px solid var(--border); }
td { padding:.875rem 1rem; font-size:.875rem; color:var(--text-secondary); border-bottom:1px solid var(--border); }
tr:last-child td { border-bottom:none; }
tr:hover td { background:rgba(255,255,255,.02); }

/* BADGES */
.badge { display:inline-flex; align-items:center; gap:.3rem; padding:.2rem .6rem; border-radius:var(--r-full); font-size:.68rem; font-weight:700; }
.badge-gold { background:var(--gold-dim); color:var(--gold); border:1px solid var(--gold-border); }
.badge-green { background:rgba(16,185,129,.1); color:#34d399; border:1px solid rgba(16,185,129,.15); }
.badge-red { background:rgba(239,68,68,.1); color:#f87171; border:1px solid rgba(239,68,68,.15); }
.badge-gray { background:rgba(255,255,255,.05); color:var(--text-muted); border:1px solid var(--border); }

/* RESPONSIVE */
@media (max-width:1024px) {
  .footer-grid { grid-template-columns:1fr 1fr; }
  .map-layout { grid-template-columns:1fr; }
  .dashboard-sidebar { width:220px; }
}
@media (max-width:768px) {
  
@media(max-width:1100px) { .nav-links { gap:1rem; } .nav-links a { font-size:.62rem; letter-spacing:.06em; } .btn-ghost, .btn-gold, .nav-cta { font-size:.62rem; padding:.35rem .7rem; } .logo { font-size:.95rem; } }
@media(max-width:960px) { .nav-links { gap:.7rem; } .nav-buttons .btn-ghost { display:none; } }

@media(max-width:1100px) { .nav-links { gap:1rem; } .nav-links a { font-size:.62rem; letter-spacing:.06em; } .btn-ghost, .btn-gold, .nav-cta { font-size:.62rem; padding:.35rem .7rem; } .logo { font-size:.95rem; } }
@media(max-width:960px) { .nav-links { gap:.7rem; } .nav-buttons .btn-ghost { display:none; } }
.nav-links, .nav-buttons { display:none; }
  .hamburger { display:flex; }
  .auth-visual { display:none; }
  .auth-form-section { padding:2rem 1.5rem; }
  .dashboard-layout { flex-direction:column; height:auto; overflow:auto; }
  .dashboard-sidebar { width:100%; height:auto; position:static; }
  .grid-3, .grid-4 { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:1fr; }
}
@media (max-width:480px) {
  .grid-2, .grid-3, .grid-4 { grid-template-columns:1fr; }
  .auth-form-section { max-height:none; }
  .form-steps { flex-direction:row; overflow-x:auto; }
}