/* ==========================================================================
   Salon Keşfet — Premium UI (Bootstrap 5.3 üzerine token tabanlı katman)
   KSP MÜHÜR §8: tek CSS dosyası, :root token'ları, açık/koyu tema, mobile-first.
   Renkler docs/TASARIM.md §2: tasarım görüntüsünden piksel ölçümü (Tailwind v4 rose/stone).
   ========================================================================== */

:root {
  --ksp-primary: #ec003f;          /* rose-600 */
  --ksp-primary-600: #c70036;      /* rose-700 (hover) */
  --ksp-primary-rgb: 236, 0, 63;
  --ksp-primary-50: #fff1f2;       /* rose-50 */
  --ksp-primary-100: #ffe4e6;      /* rose-100 */
  --ksp-accent: #ff2056;           /* rose-500 */
  --ksp-ink: #1c1917;              /* stone-900 */
  --ksp-ink-800: #292524;          /* stone-800 */
  --ksp-ink-950: #0c0a09;          /* stone-950 */
  --ksp-success: #009966;          /* emerald-600 */
  --ksp-success-dot: #00bc7d;      /* emerald-500 */
  --ksp-success-50: #ecfdf5;
  --ksp-warning: #f59e0b;          /* amber-500 (yıldız) */
  --ksp-amber-50: #fffbeb;
  --ksp-danger: #ec003f;
  --ksp-info: #2b7fff;             /* blue-500 */

  --ksp-bg: #fafaf9;               /* stone-50 */
  --ksp-surface: #ffffff;
  --ksp-surface-2: #f5f5f4;        /* stone-100 */
  --ksp-border: #e7e5e4;           /* stone-200 */
  --ksp-text: #1c1917;
  --ksp-muted: #78716c;            /* stone-500 */
  --ksp-glass: rgba(255, 255, 255, .86);

  --ksp-radius-sm: 10px;
  --ksp-radius: 16px;
  --ksp-radius-lg: 24px;
  --ksp-shadow-sm: 0 1px 2px rgba(28, 25, 23, .06);
  --ksp-shadow: 0 10px 30px -14px rgba(28, 25, 23, .18);
  --ksp-shadow-lg: 0 24px 50px -20px rgba(28, 25, 23, .28);
  --ksp-gradient: linear-gradient(135deg, #ff2056 0%, #ec003f 100%);

  --ksp-strip-h: 36px;
  --ksp-topbar-h: 72px;
  --ksp-bottom-h: 68px;
  --ksp-sidebar-w: 272px;

  --bs-body-font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --bs-body-bg: var(--ksp-bg);
  --bs-body-color: var(--ksp-text);
  --bs-primary: var(--ksp-primary);
  --bs-primary-rgb: var(--ksp-primary-rgb);
  --bs-link-color: var(--ksp-primary);
  --bs-border-color: var(--ksp-border);
}

[data-bs-theme="dark"] {
  --ksp-primary: #ff2056;
  --ksp-primary-600: #ec003f;
  --ksp-primary-rgb: 255, 32, 86;
  --ksp-primary-50: rgba(255, 32, 86, .12);
  --ksp-primary-100: rgba(255, 32, 86, .2);
  --ksp-success-50: rgba(0, 188, 125, .12);
  --ksp-amber-50: rgba(245, 158, 11, .12);
  --ksp-bg: #0c0a09;
  --ksp-surface: #1c1917;
  --ksp-surface-2: #292524;
  --ksp-border: rgba(255, 255, 255, .08);
  --ksp-text: #fafaf9;
  --ksp-muted: #a8a29e;
  --ksp-glass: rgba(28, 25, 23, .86);
  --ksp-shadow: 0 10px 30px -12px rgba(0, 0, 0, .6);
  --ksp-shadow-lg: 0 30px 60px -20px rgba(0, 0, 0, .7);
  --bs-body-bg: var(--ksp-bg);
  --bs-body-color: var(--ksp-text);
  --bs-secondary-color: var(--ksp-muted);
}

/* ---------- Temel ---------- */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { background: var(--ksp-bg); color: var(--ksp-text); letter-spacing: -.005em; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5 { font-weight: 700; letter-spacing: -.02em; }
a { text-decoration: none; }
img { max-width: 100%; height: auto; }
:focus-visible { outline: 3px solid rgba(var(--ksp-primary-rgb), .45); outline-offset: 2px; }

.material-symbols-rounded {
  font-size: 1.25em; line-height: 1; vertical-align: -.2em;
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}
.material-symbols-rounded.fill { font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24; }

.ksp-skip { position: absolute; inset-inline-start: 1rem; top: .5rem; z-index: 2000; background: var(--ksp-surface); padding: .5rem 1rem; border-radius: 999px; }
.ksp-narrow { max-width: 760px; }
.ksp-gradient-text { background: var(--ksp-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ksp-glass { background: var(--ksp-glass); backdrop-filter: saturate(180%) blur(18px); -webkit-backdrop-filter: saturate(180%) blur(18px); border: 1px solid var(--ksp-border); }
.ksp-link { color: var(--ksp-primary); font-weight: 600; display: inline-flex; align-items: center; gap: .25rem; }

/* ---------- Butonlar ---------- */
.btn { border-radius: var(--ksp-radius-sm); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; }
.ksp-btn-primary { background: var(--ksp-primary); color: #fff; border: 0; box-shadow: 0 8px 20px -8px rgba(var(--ksp-primary-rgb), .7); padding: .6rem 1.2rem; }
.ksp-btn-primary:hover, .ksp-btn-primary:focus { background: var(--ksp-primary-600); color: #fff; transform: translateY(-1px); }
.ksp-btn-soft { background: rgba(var(--ksp-primary-rgb), .1); color: var(--ksp-primary); border: 0; padding: .6rem 1.1rem; }
.ksp-btn-soft:hover { background: rgba(var(--ksp-primary-rgb), .18); color: var(--ksp-primary); }
.ksp-btn-ghost { color: var(--ksp-text); border: 0; padding: .6rem 1rem; }
.ksp-btn-ghost:hover { background: var(--ksp-surface-2); }
.ksp-icon-btn { width: 42px; height: 42px; padding: 0; color: var(--ksp-text); border: 0; }
.ksp-icon-btn:hover { background: var(--ksp-surface-2); }
[data-bs-theme="light"] .theme-icon-light, [data-bs-theme="dark"] .theme-icon-dark { display: none; }
html:not([data-bs-theme]) .theme-icon-light { display: none; }

/* ---------- Chip & ikon karo ---------- */
.ksp-chip { display: inline-flex; align-items: center; gap: .35rem; padding: .35rem .8rem; border-radius: 999px; font-size: .8rem; font-weight: 600; background: var(--ksp-surface-2); color: var(--ksp-text); border: 1px solid var(--ksp-border); white-space: nowrap; }
.ksp-chip.is-active { background: var(--ksp-primary); color: #fff; border-color: transparent; }
.ksp-chip--glass { background: rgba(255, 255, 255, .6); backdrop-filter: blur(10px); }
[data-bs-theme="dark"] .ksp-chip--glass { background: rgba(255, 255, 255, .08); }
.ksp-chip--confirmed, .ksp-chip--completed { background: rgba(18, 184, 134, .12); color: var(--ksp-success); }
.ksp-chip--pending { background: rgba(245, 159, 0, .14); color: var(--ksp-warning); }
.ksp-chip--canceled, .ksp-chip--no_show { background: rgba(240, 62, 94, .12); color: var(--ksp-danger); }
.ksp-chips { display: flex; gap: .5rem; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.ksp-chips::-webkit-scrollbar { display: none; }
.ksp-icon-tile { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 16px; background: rgba(var(--ksp-primary-rgb), .1); color: var(--ksp-primary); flex-shrink: 0; }
.ksp-icon-tile .material-symbols-rounded { font-size: 26px; vertical-align: 0; }
.ksp-icon-tile--lg { width: 72px; height: 72px; border-radius: 24px; }
.ksp-icon-tile--lg .material-symbols-rounded { font-size: 36px; }

/* ---------- Marka & üst bar ---------- */
.ksp-brand { display: inline-flex; align-items: center; gap: .55rem; color: var(--ksp-text); font-size: 1.15rem; letter-spacing: -.02em; }
.ksp-brand__mark { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 10px; background: var(--ksp-ink-800); color: var(--ksp-accent); box-shadow: 0 6px 14px -8px rgba(28, 25, 23, .6); flex-shrink: 0; }
.ksp-brand__mark .material-symbols-rounded { font-size: 20px; vertical-align: 0; }
.ksp-brand__text strong { font-weight: 800; }
.ksp-topbar { position: sticky; top: 0; z-index: 1030; height: var(--ksp-topbar-h); display: flex; align-items: center; background: var(--ksp-glass); backdrop-filter: saturate(180%) blur(18px); -webkit-backdrop-filter: saturate(180%) blur(18px); border-bottom: 1px solid transparent; transition: border-color .2s; }
.ksp-topbar.is-scrolled { border-bottom-color: var(--ksp-border); }
.ksp-nav { list-style: none; margin: 0; margin-inline-start: 1.5rem; padding: 0; gap: .25rem; }
.ksp-nav a { color: var(--ksp-muted); font-weight: 600; padding: .5rem .9rem; border-radius: 999px; }
.ksp-nav a:hover, .ksp-nav a.active { color: var(--ksp-text); background: var(--ksp-surface-2); }

/* ---------- Mesh arka plan ---------- */
.ksp-mesh { position: absolute; inset: 0; overflow: hidden; pointer-events: none;
  background:
    radial-gradient(40% 50% at 15% 20%, rgba(236, 0, 63, .26), transparent 70%),
    radial-gradient(35% 45% at 85% 15%, rgba(255, 32, 86, .18), transparent 70%),
    radial-gradient(45% 50% at 60% 90%, rgba(136, 19, 55, .22), transparent 70%); }

/* ---------- Hero ---------- */
.ksp-hero { position: relative; padding: 3rem 0 3.5rem; overflow: hidden; }
.ksp-hero--compact { padding: 3.5rem 0; }
.ksp-hero__title { font-size: clamp(2.1rem, 6vw, 3.6rem); font-weight: 800; line-height: 1.05; letter-spacing: -.035em; margin-bottom: 1rem; }
.ksp-hero__lead { font-size: clamp(1rem, 2.2vw, 1.15rem); color: var(--ksp-muted); max-width: 560px; margin-bottom: 1.75rem; }
.ksp-hero__stats { display: flex; gap: 1.75rem; margin-top: 1.75rem; }
.ksp-hero__stats strong { display: block; font-size: 1.35rem; font-weight: 800; }
.ksp-hero__stats span { font-size: .8rem; color: var(--ksp-muted); }
.ksp-hero__card { border-radius: var(--ksp-radius-lg); padding: 1.5rem; box-shadow: var(--ksp-shadow-lg); transform: rotate(-2deg); }
.ksp-hero__slots { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.ksp-hero__slots span { text-align: center; padding: .6rem; border-radius: var(--ksp-radius-sm); background: var(--ksp-surface-2); font-weight: 600; font-size: .9rem; }
.ksp-hero__slots .is-selected { background: var(--ksp-primary); color: #fff; }

/* ---------- Arama ---------- */
.ksp-search { display: flex; align-items: center; gap: .4rem; padding: .45rem; background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 999px; box-shadow: var(--ksp-shadow); max-width: 640px; }
.ksp-search__field { flex: 1; display: flex; align-items: center; gap: .5rem; padding-inline-start: .8rem; margin: 0; color: var(--ksp-muted); min-width: 0; }
.ksp-search__field input { border: 0; outline: 0; background: transparent; width: 100%; color: var(--ksp-text); font-size: 1rem; padding: .45rem 0; }
.ksp-search__geo { padding: .6rem .8rem; }
.ksp-search__submit { padding: .6rem 1.3rem; }
.ksp-search--compact { box-shadow: var(--ksp-shadow-sm); }

/* ---------- Bölümler ---------- */
.ksp-section { padding: 2.5rem 0; }
.ksp-section__head { display: flex; align-items: end; justify-content: space-between; margin-bottom: 1.25rem; }
.ksp-section__head h2 { font-size: clamp(1.3rem, 3vw, 1.75rem); margin: 0; }
.ksp-page-head { padding: 2rem 0 1.5rem; }
.ksp-page-head h1 { font-size: clamp(1.6rem, 4vw, 2.25rem); margin-bottom: .25rem; }

.ksp-category-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .75rem; }
.ksp-category { display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; padding: 1rem; border-radius: var(--ksp-radius); background: var(--ksp-surface); border: 1px solid var(--ksp-border); color: var(--ksp-text); font-weight: 600; transition: transform .2s, box-shadow .2s; }
.ksp-category:hover { transform: translateY(-3px); box-shadow: var(--ksp-shadow); color: var(--ksp-text); }

.ksp-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.ksp-tenant-card { display: block; border-radius: var(--ksp-radius); background: var(--ksp-surface); border: 1px solid var(--ksp-border); overflow: hidden; color: var(--ksp-text); transition: transform .2s, box-shadow .2s; }
.ksp-tenant-card:hover { transform: translateY(-4px); box-shadow: var(--ksp-shadow-lg); color: var(--ksp-text); }
.ksp-tenant-card__media { position: relative; aspect-ratio: 16 / 10; background: var(--ksp-surface-2); }
.ksp-tenant-card__media img { width: 100%; height: 100%; object-fit: cover; }
.ksp-tenant-card__placeholder { position: absolute; inset: 0; display: grid; place-items: center; background: var(--ksp-gradient); color: rgba(255, 255, 255, .9); }
.ksp-tenant-card__placeholder .material-symbols-rounded { font-size: 56px; }
.ksp-tenant-card__type { position: absolute; top: .75rem; inset-inline-start: .75rem; }
.ksp-tenant-card__body { padding: 1rem 1.1rem 1.1rem; }
.ksp-tenant-card__body h3 { font-size: 1.05rem; margin-bottom: .25rem; }
.ksp-tenant-card__body p { color: var(--ksp-muted); font-size: .88rem; margin-bottom: .6rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ksp-tenant-card__meta { display: flex; flex-wrap: wrap; gap: .9rem; font-size: .85rem; color: var(--ksp-muted); }
.ksp-tenant-card__meta span { display: inline-flex; align-items: center; gap: .2rem; }
.ksp-rating { color: var(--ksp-text) !important; font-weight: 700; }
.ksp-rating .material-symbols-rounded { color: #ffb400; }

.ksp-step { position: relative; padding: 1.5rem; border-radius: var(--ksp-radius); background: var(--ksp-surface); border: 1px solid var(--ksp-border); }
.ksp-step h3 { font-size: 1.1rem; margin: 1rem 0 .4rem; }
.ksp-step p { color: var(--ksp-muted); margin: 0; }
.ksp-step__no { position: absolute; top: 1.2rem; inset-inline-end: 1.4rem; font-size: 2.5rem; font-weight: 800; color: rgba(var(--ksp-primary-rgb), .12); }

.ksp-cta { position: relative; overflow: hidden; border-radius: var(--ksp-radius-lg); padding: clamp(2rem, 6vw, 3.5rem); background: var(--ksp-ink-950); color: #fff; }
.ksp-cta .ksp-mesh { opacity: 1; filter: saturate(1.4); }
.ksp-cta h2 { font-size: clamp(1.5rem, 4vw, 2.3rem); }
.ksp-cta p { color: rgba(255, 255, 255, .75); max-width: 520px; margin-bottom: 1.5rem; }

.ksp-accordion .accordion-item { border: 1px solid var(--ksp-border); border-radius: var(--ksp-radius) !important; margin-bottom: .6rem; overflow: hidden; background: var(--ksp-surface); }
.ksp-accordion .accordion-button { font-weight: 600; background: var(--ksp-surface); box-shadow: none; }
.ksp-accordion .accordion-button:not(.collapsed) { color: var(--ksp-primary); }

.ksp-empty { text-align: center; padding: 3rem 1.5rem; border-radius: var(--ksp-radius-lg); background: var(--ksp-surface); border: 1px dashed var(--ksp-border); }
.ksp-empty h2, .ksp-empty h3 { margin: 1rem 0 .4rem; font-size: 1.2rem; }
.ksp-empty p { color: var(--ksp-muted); }
.ksp-empty--sm { padding: 1.5rem; border: 0; background: var(--ksp-surface-2); display: flex; flex-direction: column; align-items: center; gap: .4rem; color: var(--ksp-muted); }
.ksp-empty--page { max-width: 520px; margin: 2rem auto; }
.ksp-error-code { font-size: 3rem; font-weight: 800; margin: .75rem 0 0; background: var(--ksp-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ksp-pagination .page-link { border-radius: 999px !important; margin: 0 .15rem; border: 0; background: var(--ksp-surface); color: var(--ksp-text); }
.ksp-pagination .active .page-link { background: var(--ksp-primary); color: #fff; }

/* ---------- Salon detay ---------- */
.ksp-salon__cover { position: relative; height: clamp(180px, 32vw, 340px); background: var(--ksp-surface-2); overflow: hidden; }
.ksp-salon__cover img { width: 100%; height: 100%; object-fit: cover; }
.ksp-salon__head { position: relative; margin-top: -3.5rem; border-radius: var(--ksp-radius-lg); padding: 1.5rem; display: flex; justify-content: space-between; align-items: end; gap: 1rem; box-shadow: var(--ksp-shadow); }
.ksp-salon__head h1 { font-size: clamp(1.5rem, 4vw, 2.2rem); margin: .5rem 0 .25rem; }
.ksp-service-list { list-style: none; margin: 0; padding: 0; }
.ksp-service-list li { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .9rem 0; border-bottom: 1px solid var(--ksp-border); }
.ksp-service-list li:last-child { border-bottom: 0; }
.ksp-service-list li > div:first-child { display: flex; flex-direction: column; }
.ksp-hours { list-style: none; margin: 0; padding: 0; }
.ksp-hours li { display: flex; justify-content: space-between; padding: .45rem 0; color: var(--ksp-muted); }
.ksp-hours li.is-today { color: var(--ksp-primary); font-weight: 700; }
.ksp-sticky-cta { position: fixed; left: 0; right: 0; bottom: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom)); padding: .6rem 1rem; background: var(--ksp-glass); backdrop-filter: blur(16px); border-top: 1px solid var(--ksp-border); z-index: 1020; }

/* ---------- Footer ---------- */
.ksp-footer { margin-top: 3rem; padding: 3rem 0 1.5rem; border-top: 1px solid var(--ksp-border); background: var(--ksp-surface); }
.ksp-footer__title { font-size: .85rem; text-transform: uppercase; letter-spacing: .08em; color: var(--ksp-muted); margin-bottom: 1rem; }
.ksp-footer__links li { margin-bottom: .5rem; }
.ksp-footer__links a { color: var(--ksp-text); }
.ksp-footer__bottom { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem; margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--ksp-border); color: var(--ksp-muted); font-size: .85rem; }
.ksp-footer__bottom a { color: var(--ksp-muted); }

/* ---------- Mobil bottom nav ---------- */
.ksp-bottom-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1040; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; height: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); background: var(--ksp-glass); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); border-top: 1px solid var(--ksp-border); }
.ksp-bottom-nav__item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: var(--ksp-muted); font-size: .68rem; font-weight: 600; -webkit-tap-highlight-color: transparent; }
.ksp-bottom-nav__icon { display: grid; place-items: center; width: 56px; height: 30px; border-radius: 999px; transition: background .2s; }
.ksp-bottom-nav__icon .material-symbols-rounded { font-size: 24px; vertical-align: 0; }
.ksp-bottom-nav__item.is-active { color: var(--ksp-primary); }
.ksp-bottom-nav__item.is-active .ksp-bottom-nav__icon { background: rgba(var(--ksp-primary-rgb), .14); }
.ksp-bottom-nav__item.is-active .material-symbols-rounded { font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24; }
.ksp-bottom-nav__item.is-fab .ksp-bottom-nav__icon { width: 52px; height: 52px; margin-top: -26px; background: var(--ksp-primary); color: #fff; box-shadow: 0 10px 24px -8px rgba(var(--ksp-primary-rgb), .9); }
@media (max-width: 991.98px) {
  body.ksp-site, body.ksp-panel { padding-bottom: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom)); }
  body:has(.ksp-sticky-cta) { padding-bottom: calc(var(--ksp-bottom-h) + 72px + env(safe-area-inset-bottom)); }
}

/* ---------- Bildirim (toast) ---------- */
.ksp-toast-stack { position: fixed; top: calc(var(--ksp-topbar-h) + .5rem); right: 1rem; left: 1rem; z-index: 1080; display: flex; flex-direction: column; align-items: flex-end; gap: .5rem; pointer-events: none; }
.ksp-toast { pointer-events: auto; display: flex; align-items: center; gap: .6rem; min-width: min(360px, 100%); padding: .8rem 1rem; border-radius: var(--ksp-radius); background: var(--ksp-surface); border: 1px solid var(--ksp-border); box-shadow: var(--ksp-shadow-lg); animation: ksp-in .3s ease-out; }
.ksp-toast--success .material-symbols-rounded { color: var(--ksp-success); }
.ksp-toast--danger .material-symbols-rounded { color: var(--ksp-danger); }
.ksp-toast--info .material-symbols-rounded { color: var(--ksp-info); }
@keyframes ksp-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }

/* ---------- Kimlik doğrulama ---------- */
.ksp-auth__grid { min-height: 100dvh; display: grid; grid-template-columns: 1fr; }
@media (min-width: 992px) { .ksp-auth__grid { grid-template-columns: 1.1fr 1fr; } }
.ksp-auth__art { position: relative; overflow: hidden; background: var(--ksp-ink-950); color: #fff; align-items: flex-end; padding: 3.5rem; }
.ksp-auth__art .ksp-mesh { filter: saturate(1.5); }
.ksp-auth__quote { position: relative; max-width: 460px; }
.ksp-auth__quote h2 { font-size: 2.6rem; font-weight: 800; margin: 1rem 0 .75rem; }
.ksp-auth__quote p { color: rgba(255, 255, 255, .75); font-size: 1.05rem; }
.ksp-auth__panel { display: flex; flex-direction: column; padding: 1.25rem; }
.ksp-auth__top { display: flex; justify-content: space-between; align-items: center; }
.ksp-auth__card { width: 100%; max-width: 440px; margin: auto; padding: 2rem 0; }
.form-floating > .form-control { border-radius: var(--ksp-radius-sm); border-color: var(--ksp-border); background: var(--ksp-surface); }
.form-floating > .form-control:focus { border-color: var(--ksp-primary); box-shadow: 0 0 0 4px rgba(var(--ksp-primary-rgb), .15); }
.form-check-input:checked { background-color: var(--ksp-primary); border-color: var(--ksp-primary); }
.ksp-consent { padding: .75rem .85rem; border: 1px solid var(--ksp-border); border-radius: var(--ksp-radius-sm); background: color-mix(in srgb, var(--ksp-primary) 4%, var(--ksp-surface)); }
.ksp-consent:has(.form-check-input:checked) { border-color: color-mix(in srgb, var(--ksp-primary) 45%, var(--ksp-border)); background: color-mix(in srgb, var(--ksp-primary) 8%, var(--ksp-surface)); }
.ksp-consent .form-check-label { cursor: pointer; }
.ksp-consent .form-check-label b { display: block; font-size: .92rem; font-weight: 700; line-height: 1.3; }
.ksp-consent .form-check-label small { display: block; margin-top: .2rem; color: var(--ksp-muted); font-size: .78rem; line-height: 1.5; }
.ksp-consent .form-check-label small b { display: inline; font-size: inherit; font-weight: 600; color: var(--ksp-text, inherit); }
.ksp-password { position: relative; }
.ksp-password__toggle { position: absolute; inset-inline-end: .6rem; top: 1rem; border: 0; background: transparent; color: var(--ksp-muted); }

/* ---------- Panel kabuğu ---------- */
.ksp-panel__shell { display: flex; min-height: 100dvh; }
.ksp-sidebar { width: var(--ksp-sidebar-w); background: var(--ksp-surface); border-inline-end: 1px solid var(--ksp-border); display: flex; flex-direction: column; }
@media (min-width: 992px) { .ksp-sidebar { position: sticky; top: 0; height: 100dvh; flex-shrink: 0; } }
.ksp-sidebar__head { display: flex; justify-content: space-between; align-items: center; padding: 1.25rem 1.25rem .75rem; }
.ksp-sidebar__context { padding: 0 1.25rem 1rem; }
.ksp-sidebar__tenant { margin-top: .5rem; font-weight: 700; }
.ksp-sidebar__nav { flex: 1; overflow-y: auto; padding: .25rem .75rem; display: flex; flex-direction: column; gap: 2px; }
.ksp-sidebar__nav a, .ksp-sidebar__foot a, .ksp-sidebar__foot button { display: flex; align-items: center; gap: .75rem; padding: .7rem .9rem; border-radius: 14px; color: var(--ksp-muted); font-weight: 600; width: 100%; border: 0; background: transparent; text-align: start; }
.ksp-sidebar__nav a:hover, .ksp-sidebar__foot a:hover, .ksp-sidebar__foot button:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-sidebar__nav a.active { background: rgba(var(--ksp-primary-rgb), .12); color: var(--ksp-primary); }
.ksp-sidebar__nav a.active .material-symbols-rounded { font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24; }
.ksp-sidebar__foot { padding: .75rem; border-top: 1px solid var(--ksp-border); }
.ksp-panel__body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ksp-panel__content { padding: 1.25rem 1rem 2rem; max-width: 1280px; width: 100%; margin: 0 auto; }
@media (min-width: 992px) { .ksp-panel__content { padding: 2rem; } }

/* Panel üst barı (partials/panel-topbar.php): işletme kimliği solda, kullanıcı (ad + rol) sağda */
.ksp-ptop { position: sticky; top: 0; z-index: 1030; background: var(--ksp-glass); backdrop-filter: saturate(180%) blur(18px); border-bottom: 1px solid var(--ksp-border); }
.ksp-ptop__inner { max-width: 1280px; height: 68px; margin: 0 auto; padding: 0 1rem; display: flex; align-items: center; gap: .85rem; }
.ksp-ptop__divider { width: 1px; height: 30px; background: var(--ksp-border); flex-shrink: 0; }
.ksp-ptop__shop { display: flex; align-items: center; gap: .7rem; min-width: 0; flex: 1 1 auto; }
.ksp-ptop__logo { width: 42px; height: 42px; flex-shrink: 0; border-radius: 12px; display: grid; place-items: center; color: #fff; font-size: .85rem; font-weight: 800; letter-spacing: .02em; background: linear-gradient(135deg, #ec003f 0%, #f97316 100%); background-size: cover; background-position: center; box-shadow: 0 8px 16px -8px rgba(236, 0, 63, .55); }
.ksp-ptop__logo--panel { background: #1c1917; box-shadow: none; }
.ksp-ptop__logo .material-symbols-rounded { font-size: 22px; }
.ksp-ptop__shoptext { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.ksp-ptop__shopname { display: flex; align-items: center; gap: .3rem; min-width: 0; font-size: 1rem; font-weight: 800; letter-spacing: -.02em; color: var(--ksp-text); }
.ksp-ptop__clip { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-ptop__verified { display: inline-flex; flex-shrink: 0; color: #00bc7d; }
.ksp-ptop__verified .material-symbols-rounded { font-size: 18px; font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24; }
.ksp-ptop__shoptext small { margin-top: .1rem; font-size: .76rem; color: var(--ksp-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-ptop__pending { color: #b45309; font-weight: 700; }
.ksp-ptop__actions { margin-inline-start: auto; display: flex; align-items: center; gap: .3rem; flex-shrink: 0; }
.ksp-ptop__view { align-items: center; gap: .4rem; height: 38px; padding: 0 .9rem; margin-inline-end: .35rem; border-radius: 10px; border: 1px solid var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); font-size: .8rem; font-weight: 700; }
.ksp-ptop__view:hover { background: var(--ksp-surface-2); border-color: #d6d3d1; color: var(--ksp-text); }
.ksp-ptop__view .material-symbols-rounded { font-size: 17px; color: var(--ksp-primary); }
.ksp-ptop__user { display: flex; align-items: center; gap: .55rem; margin-inline-start: .3rem; padding: .25rem .55rem .25rem .25rem; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-text); transition: border-color .15s, box-shadow .15s; }
.ksp-ptop__user:hover, .ksp-ptop__user[aria-expanded="true"] { border-color: #d6d3d1; box-shadow: 0 6px 16px -8px rgba(28, 25, 23, .3); }
.ksp-ptop__ava { width: 34px; height: 34px; flex-shrink: 0; border-radius: 50%; display: grid; place-items: center; background: #1c1917; background-size: cover; background-position: center; color: #fff; font-size: .74rem; font-weight: 800; }
.ksp-ptop__who { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.15; text-align: start; }
.ksp-ptop__who strong { max-width: 170px; font-size: .84rem; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-ptop__who small { font-size: .7rem; font-weight: 700; color: var(--ksp-primary); }
.ksp-ptop__caret { font-size: 18px; color: var(--ksp-muted); }
.ksp-ptop__menu { min-width: 260px; padding: .45rem; border-radius: 16px; border: 1px solid var(--ksp-border); box-shadow: 0 24px 48px -18px rgba(28, 25, 23, .32); }
.ksp-ptop__menuhead { display: flex; flex-direction: column; padding: .55rem .7rem .75rem; margin-bottom: .35rem; border-bottom: 1px solid var(--ksp-border); }
.ksp-ptop__menuhead strong { font-size: .92rem; font-weight: 800; }
.ksp-ptop__menuhead small { font-size: .76rem; color: var(--ksp-muted); }
.ksp-ptop__role { align-self: flex-start; margin-top: .45rem; padding: .15rem .55rem; border-radius: 999px; background: rgba(var(--ksp-primary-rgb), .08); color: var(--ksp-primary); font-size: .68rem; font-weight: 800; }
.ksp-ptop__menu .dropdown-item { display: flex; align-items: center; gap: .6rem; padding: .55rem .7rem; border-radius: 10px; font-size: .85rem; font-weight: 600; }
.ksp-ptop__menu .dropdown-item .material-symbols-rounded { font-size: 19px; color: var(--ksp-muted); }
.ksp-ptop__logout, .ksp-ptop__logout .material-symbols-rounded { color: var(--ksp-primary) !important; }
@media (min-width: 992px) {
  .ksp-ptop__inner { padding: 0 2rem; }
  /* Sol menülü panellerde logo zaten kenar çubuğunda: üst barda tekrar etmesin */
  .ksp-panel:not(.ksp-panel--tabs) .ksp-ptop__brand, .ksp-panel:not(.ksp-panel--tabs) .ksp-ptop__divider { display: none; }
}
@media (max-width: 1199.98px) { .ksp-ptop__brand .ksp-brand__body { display: none; } }
@media (max-width: 767.98px) {
  .ksp-ptop__inner { gap: .55rem; height: 62px; }
  .ksp-ptop__divider, .ksp-ptop__theme, .ksp-ptop__who, .ksp-ptop__caret { display: none; }
  .ksp-ptop__brand { display: none; }
  .ksp-ptop__logo { width: 38px; height: 38px; border-radius: 11px; }
  .ksp-ptop__shopname { font-size: .92rem; }
  .ksp-ptop__user { padding: .2rem; margin-inline-start: 0; }
}

/* Modül sekmeleri (partials/panel-tabs.php) — görseldeki üst sekme satırı */
.ksp-ptabs { position: sticky; top: 68px; z-index: 1025; background: rgba(250, 250, 249, .92); backdrop-filter: saturate(180%) blur(14px); border-bottom: 1px solid var(--ksp-border); }
[data-bs-theme="dark"] .ksp-ptabs { background: rgba(12, 10, 9, .9); }
.ksp-ptabs__inner { max-width: 1280px; margin: 0 auto; padding: .6rem 1rem; display: flex; align-items: center; gap: .75rem; }
.ksp-ptabs__nav { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 0; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
.ksp-ptabs__nav::-webkit-scrollbar { display: none; }
.ksp-ptabs__nav.is-more-end { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); }
.ksp-ptabs__nav.is-more-start { -webkit-mask-image: linear-gradient(90deg, transparent, #000 48px); mask-image: linear-gradient(90deg, transparent, #000 48px); }
.ksp-ptabs__nav.is-more-start.is-more-end { -webkit-mask-image: linear-gradient(90deg, transparent, #000 48px, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(90deg, transparent, #000 48px, #000 calc(100% - 48px), transparent); }
.ksp-ptabs__tab { display: inline-flex; align-items: center; gap: .35rem; flex-shrink: 0; padding: .48rem .62rem; border-radius: 10px; color: #57534e; font-size: .78rem; font-weight: 600; white-space: nowrap; scroll-snap-align: start; transition: background .15s, color .15s; }
.ksp-ptabs__tab .material-symbols-rounded { font-size: 17px; color: #a8a29e; }
.ksp-ptabs__tab:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-ptabs__tab.is-active { background: #1c1917; color: #fff; font-weight: 700; box-shadow: 0 8px 18px -10px rgba(28, 25, 23, .7); }
.ksp-ptabs__tab.is-active .material-symbols-rounded { color: #fff; }
[data-bs-theme="dark"] .ksp-ptabs__tab { color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-ptabs__tab.is-active { background: #fafaf9; color: #1c1917; }
[data-bs-theme="dark"] .ksp-ptabs__tab.is-active .material-symbols-rounded { color: #1c1917; }
.ksp-ptabs__seg { display: inline-flex; flex-shrink: 0; gap: 2px; padding: 3px; border-radius: 10px; background: var(--ksp-surface-2); border: 1px solid var(--ksp-border); }
.ksp-ptabs__seg a { position: relative; padding: .3rem .55rem; border-radius: 8px; color: var(--ksp-muted); font-size: .74rem; font-weight: 700; white-space: nowrap; }
.ksp-ptabs__seg a:hover { color: var(--ksp-text); }
.ksp-ptabs__seg a.is-active { background: var(--ksp-surface); color: var(--ksp-text); font-weight: 800; box-shadow: 0 1px 3px rgba(28, 25, 23, .1); }
/* Mobilde parmakla seçim: hap 27px görünümünü KORUR, görünmez ::after ile dokunma alanı 44px'e çıkar
   (yükseklik/padding büyütülseydi etkin hapın zemini de büyüyüp tasarımı bozardı) */
@media (max-width: 767.98px) {
  .ksp-ptabs__seg a::after { content: ""; position: absolute; inset: -9px 0; }
}
@media (min-width: 992px) { .ksp-ptabs__inner { padding: .6rem 2rem; } }
/* Bölüm seçicisi gizli sayfa (panel-tabs.php $bare): satır seçici yüksekliğinde kalır (.74rem × 1.5 + .3rem × 2 + 3px × 2 + 1px × 2) */
@media (min-width: 768px) { .ksp-ptabs--bare .ksp-ptabs__nav { min-height: calc(1.11rem + .6rem + 8px); } }
@media (max-width: 767.98px) {
  .ksp-ptabs { top: 62px; }
  .ksp-ptabs__inner { flex-wrap: wrap; gap: .5rem; padding: .5rem 1rem; }
  .ksp-ptabs__nav { flex-basis: 100%; margin-inline: -1rem; padding-inline: 1rem; scroll-padding-inline: 1rem; }
}
/* Sekmeli düzende kenar çubuğu yalnızca mobil "Menü" çekmecesi (masaüstünde yer kaplamaz) */
.ksp-panel--tabs .ksp-sidebar { position: fixed; height: 100dvh; }
/* ---------- Salon Kokpiti özeti (views/panels/tenant/cockpit.php) — referans tasarım birebir ---------- */
.ksp-ck-hero { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 2.1rem 2.25rem; margin-bottom: 1.5rem; border-radius: 24px; color: #fff;
  background: radial-gradient(55% 140% at 100% 60%, rgba(136, 19, 55, .5), transparent 62%), radial-gradient(45% 120% at 0% 100%, rgba(120, 53, 15, .28), transparent 70%), #1c1917;
  box-shadow: 0 20px 40px -24px rgba(28, 25, 23, .6); }
.ksp-ck-hero__badge { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .8rem; border-radius: 999px; background: rgba(236, 0, 63, .16); border: 1px solid rgba(255, 32, 86, .45); color: #ff8fa3; font-size: .78rem; font-weight: 700; }
.ksp-ck-hero__badge .material-symbols-rounded { font-size: 16px; }
.ksp-ck-hero__title { margin: .85rem 0 .6rem; font-size: clamp(1.45rem, 2.4vw, 1.95rem); font-weight: 800; letter-spacing: -.03em; color: #fff; }
.ksp-ck-hero__lead { margin: 0; max-width: 780px; color: #d6d3d1; font-size: .95rem; line-height: 1.65; }
.ksp-ck-hero__actions { display: flex; gap: .75rem; flex-shrink: 0; }
.ksp-ck-btn { display: inline-flex; align-items: center; gap: .45rem; height: 46px; padding: 0 1.35rem; border-radius: 12px; font-size: .92rem; font-weight: 700; white-space: nowrap; }
.ksp-ck-btn .material-symbols-rounded { font-size: 20px; }
.ksp-ck-btn--rose { background: #ff2056; color: #fff; border: 0; box-shadow: 0 12px 22px -12px rgba(255, 32, 86, .8); }
.ksp-ck-btn--rose:hover { background: #ec003f; color: #fff; }
.ksp-ck-btn--glass { background: rgba(255, 255, 255, .1); color: #fff; border: 1px solid rgba(255, 255, 255, .22); }
.ksp-ck-btn--glass:hover { background: rgba(255, 255, 255, .18); color: #fff; }

.ksp-ck-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.1rem; margin-bottom: 2rem; }
.ksp-ck-kpi { background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 18px; padding: 1.35rem 1.35rem 1.2rem; box-shadow: 0 1px 2px rgba(28, 25, 23, .03); }
.ksp-ck-kpi header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.ksp-ck-kpi header > span { font-size: .78rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #57534e; }
.ksp-ck-kpi__ico { width: 40px; height: 40px; flex-shrink: 0; border-radius: 10px; display: grid; place-items: center; font-style: normal; }
.ksp-ck-kpi__ico .material-symbols-rounded { font-size: 20px; }
.ksp-ck-kpi__ico--rose { background: #fff1f2; color: #e11d48; }
.ksp-ck-kpi__ico--green, .ksp-ck-kpi__ico--mint { background: #ecfdf5; color: #059669; }
.ksp-ck-kpi__ico--blue { background: #eff6ff; color: #2563eb; }
.ksp-ck-kpi__value { display: flex; align-items: baseline; gap: .55rem; margin: 1.1rem 0 .55rem; }
.ksp-ck-kpi__value strong { font-size: 1.75rem; font-weight: 800; letter-spacing: -.02em; color: var(--ksp-text); line-height: 1; }
.ksp-ck-kpi__value small { font-size: .84rem; color: #57534e; }
.ksp-ck-kpi__foot { display: flex; align-items: center; gap: .4rem; margin: 0; font-size: .8rem; font-weight: 600; color: #57534e; }
.ksp-ck-kpi__foot .material-symbols-rounded { font-size: 17px; }
.ksp-ck-kpi__foot b { color: var(--ksp-text); }
.ksp-ck-kpi__foot .is-green, .ksp-ck-kpi__foot.is-green, .ksp-ck-kpi__foot.is-green a { color: #059669; }
.ksp-ck-kpi__foot .is-amber { color: #d97706; }
.ksp-ck-dot { width: 4px; height: 4px; border-radius: 50%; background: #d6d3d1; margin: 0 .3rem; }

.ksp-ck-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; padding-bottom: .9rem; margin-bottom: 1.15rem; border-bottom: 1px solid var(--ksp-border); }
.ksp-ck-head h2 { display: flex; align-items: center; gap: .6rem; margin: 0; font-size: 1.15rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-ck-head h2 .material-symbols-rounded { color: #ec003f; font-size: 22px; }
.ksp-ck-head p { margin: .2rem 0 0; font-size: .8rem; color: #78716c; }
.ksp-ck-head__note { font-size: .8rem; font-weight: 700; color: #44403c; white-space: nowrap; }
.ksp-ck-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.1rem; }
.ksp-ck-mod { display: flex; flex-direction: column; padding: 1.25rem; border-radius: 18px; background: var(--ksp-surface); border: 1px solid var(--ksp-border); color: var(--ksp-text); transition: border-color .2s, box-shadow .2s; }
.ksp-ck-mod:hover { color: var(--ksp-text); border-color: #fda4af; box-shadow: 0 16px 32px -20px rgba(236, 0, 63, .4); }
.ksp-ck-mod__top { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.ksp-ck-mod__no { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: #1c1917; color: #fff; font-size: .7rem; font-weight: 800; }
.ksp-ck-mod__tag { padding: .2rem .6rem; border-radius: 999px; background: #fff1f2; border: 1px solid #fecdd3; color: #e11d48; font-size: .66rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.ksp-ck-mod__title { display: flex; align-items: center; gap: .65rem; margin: .9rem 0 .6rem; }
.ksp-ck-mod__ico { width: 30px; height: 30px; flex-shrink: 0; display: grid; place-items: center; border-radius: 8px; background: #f5f5f4; color: #44403c; font-style: normal; transition: background .2s, color .2s; }
.ksp-ck-mod__ico .material-symbols-rounded { font-size: 18px; }
.ksp-ck-mod:hover .ksp-ck-mod__ico { background: #ffe4e6; color: #e11d48; }
.ksp-ck-mod__title h3 { margin: 0; font-size: .95rem; font-weight: 800; line-height: 1.35; letter-spacing: -.01em; transition: color .2s; }
.ksp-ck-mod:hover .ksp-ck-mod__title h3 { color: #881337; }
.ksp-ck-mod__text { margin: 0 0 .9rem; font-size: .8rem; line-height: 1.6; color: #78716c; }
.ksp-ck-sketch { display: flex; flex-direction: column; gap: .5rem; padding: .75rem; border-radius: 12px; border: 1px solid var(--ksp-border); background: #fafaf9; }
.ksp-ck-sketch__bar { width: 38%; height: 8px; border-radius: 4px; background: #e7e5e4; }
.ksp-ck-sketch__row { display: grid; grid-template-columns: repeat(3, 1fr); gap: .35rem; }
.ksp-ck-sketch__row i { height: 18px; border-radius: 4px; background: #e7e5e4; }
.ksp-ck-sketch__foot { display: flex; align-items: center; justify-content: space-between; height: 26px; padding: 0 .6rem; border-radius: 6px; background: #efedeb; }
.ksp-ck-sketch__foot i { width: 58%; height: 5px; border-radius: 3px; background: #d6d3d1; }
.ksp-ck-sketch__foot b { width: 20px; height: 10px; border-radius: 4px; background: #fda4af; }
.ksp-ck-mod__points { list-style: none; margin: .9rem 0 0; padding: 0; display: grid; gap: .35rem; }
.ksp-ck-mod__points li { position: relative; padding-inline-start: .85rem; font-size: .74rem; color: #57534e; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-ck-mod__points li::before { content: ""; position: absolute; inset-inline-start: 0; top: .45em; width: 5px; height: 5px; border-radius: 50%; background: #ec003f; }
.ksp-ck-mod__link { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: .9rem; border-top: 1px solid #f5f5f4; font-size: .8rem; font-weight: 700; color: #e11d48; }
.ksp-ck-mod__points + .ksp-ck-mod__link { margin-top: auto; }
.ksp-ck-mod__points { margin-bottom: .95rem; }
.ksp-ck-mod__link .material-symbols-rounded { font-size: 18px; }

.ksp-ck-bottom { display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(0, 1fr); gap: 1.35rem; margin-top: 2rem; align-items: start; }
.ksp-ck-card { background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 20px; padding: 1.35rem; }
.ksp-ck-today { min-height: 100%; align-self: stretch; }
.ksp-ck-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding-bottom: .85rem; border-bottom: 1px solid #f5f5f4; }
.ksp-ck-card__head h3 { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: 1rem; font-weight: 800; }
.ksp-ck-card__head h3 .material-symbols-rounded { font-size: 20px; color: #ec003f; }
.ksp-ck-card__head p { margin: .2rem 0 0; font-size: .78rem; color: #78716c; }
.ksp-ck-link { display: inline-flex; align-items: center; gap: .15rem; font-size: .8rem; font-weight: 700; color: #e11d48; white-space: nowrap; }
.ksp-ck-link .material-symbols-rounded { font-size: 18px; }
.ksp-ck-empty { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 3.5rem 1rem 2.5rem; }
.ksp-ck-empty > .material-symbols-rounded { font-size: 38px; color: #d6d3d1; }
.ksp-ck-empty p { margin: .5rem 0 .75rem; font-size: .82rem; font-weight: 600; color: #44403c; }
.ksp-ck-empty__btn { padding: .4rem .9rem; border-radius: 10px; background: #1c1917; color: #fff; font-size: .78rem; font-weight: 700; }
.ksp-ck-empty__btn:hover { background: #292524; color: #fff; }
.ksp-ck-side { display: flex; flex-direction: column; gap: 1.1rem; }
.ksp-ck-card__title { display: flex; align-items: center; gap: .5rem; margin: 0 0 .9rem; font-size: .95rem; font-weight: 800; }
.ksp-ck-card__title .material-symbols-rounded { font-size: 20px; color: #ec003f; }
.ksp-ck-sections { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.ksp-ck-section { padding: .9rem 1rem; border-radius: 14px; border: 1px solid; }
.ksp-ck-section span { display: block; font-size: .68rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.ksp-ck-section strong { display: block; margin: .4rem 0 .25rem; font-size: 1.45rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-ck-section small { display: block; font-size: .74rem; line-height: 1.45; }
.ksp-ck-section--women { background: #fdf2f8; border-color: #fbcfe8; }
.ksp-ck-section--women span { color: #be185d; } .ksp-ck-section--women strong { color: #831843; } .ksp-ck-section--women small { color: #be185d; opacity: .85; }
.ksp-ck-section--men { background: #f0f9ff; border-color: #bae6fd; }
.ksp-ck-section--men span { color: #0369a1; } .ksp-ck-section--men strong { color: #0c4a6e; } .ksp-ck-section--men small { color: #0369a1; opacity: .85; }
.ksp-ck-section.is-current { box-shadow: 0 0 0 2px #1c1917; }
.ksp-ck-shortcuts { display: flex; flex-direction: column; gap: .6rem; }
.ksp-ck-shortcut { display: flex; align-items: center; gap: .75rem; padding: .6rem .85rem; border-radius: 12px; background: #fafaf9; border: 1px solid var(--ksp-border); color: var(--ksp-text); font-size: .82rem; font-weight: 600; transition: background .15s, border-color .15s; }
.ksp-ck-shortcut:hover { background: var(--ksp-surface); border-color: #d6d3d1; color: var(--ksp-text); }
.ksp-ck-shortcut__label { flex: 1; min-width: 0; }
.ksp-ck-shortcut > .material-symbols-rounded { font-size: 18px; color: #a8a29e; }
.ksp-ck-shortcut__ico { width: 28px; height: 28px; flex-shrink: 0; display: grid; place-items: center; border-radius: 8px; color: #fff; font-style: normal; }
.ksp-ck-shortcut__ico .material-symbols-rounded { font-size: 17px; }
.ksp-ck-shortcut__ico--rose { background: #ff2056; } .ksp-ck-shortcut__ico--violet { background: #8b5cf6; }
.ksp-ck-shortcut__ico--green { background: #059669; } .ksp-ck-shortcut__ico--amber { background: #ea580c; }
.ksp-ck-timeline { list-style: none; margin: 0; padding: 0; }
.ksp-ck-timeline__item { display: grid; grid-template-columns: 52px 4px minmax(0, 1fr) auto auto; align-items: center; gap: .75rem; padding: .75rem 0; border-bottom: 1px solid #f5f5f4; }
.ksp-ck-timeline__time { display: flex; flex-direction: column; font-size: .85rem; font-weight: 800; line-height: 1.2; }
.ksp-ck-timeline__time small { font-size: .7rem; font-weight: 600; color: #a8a29e; }
.ksp-ck-timeline__bar { align-self: stretch; border-radius: 4px; background: var(--staff); }
.ksp-ck-timeline__body { display: flex; flex-direction: column; min-width: 0; }
.ksp-ck-timeline__body strong { font-size: .86rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-ck-timeline__body small { font-size: .74rem; color: #78716c; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-ck-timeline__status { padding: .15rem .55rem; border-radius: 999px; font-size: .68rem; font-weight: 800; background: #f5f5f4; color: #57534e; }
.is-confirmed .ksp-ck-timeline__status, .is-completed .ksp-ck-timeline__status { background: #ecfdf5; color: #047857; }
.is-pending .ksp-ck-timeline__status { background: #fffbeb; color: #b45309; }
.is-canceled .ksp-ck-timeline__status, .is-no_show .ksp-ck-timeline__status { background: #fff1f2; color: #be123c; }
.ksp-ck-timeline__amount { font-size: .85rem; font-weight: 800; }
[data-bs-theme="dark"] .ksp-ck-mod__ico, [data-bs-theme="dark"] .ksp-ck-sketch, [data-bs-theme="dark"] .ksp-ck-shortcut { background: var(--ksp-surface-2); }
@media (max-width: 1199.98px) {
  .ksp-ck-kpis, .ksp-ck-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-ck-bottom { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767.98px) {
  .ksp-ck-hero { flex-direction: column; align-items: flex-start; padding: 1.5rem 1.25rem; border-radius: 20px; }
  .ksp-ck-hero__actions { width: 100%; flex-direction: column; }
  .ksp-ck-btn { width: 100%; justify-content: center; }
  .ksp-ck-head { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 575.98px) {
  .ksp-ck-kpis, .ksp-ck-grid, .ksp-ck-sections { grid-template-columns: minmax(0, 1fr); }
  .ksp-ck-timeline__item { grid-template-columns: 46px 4px minmax(0, 1fr) auto; }
  .ksp-ck-timeline__amount { display: none; }
}

/* Sekmeli panel genişliği (kullanıcı isteği 2026-09-17): tam sayfa değil, ortada 1320px; 7 sekme + bölüm seçici 1366px ekranda tek satıra sığar */
.ksp-panel--tabs .ksp-ptop__inner, .ksp-panel--tabs .ksp-ptabs__inner, .ksp-panel--tabs .ksp-panel__content { max-width: 1320px; }
.ksp-avatar { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--ksp-primary); color: #fff; font-weight: 700; }
.ksp-page-title { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.ksp-page-title h1 { font-size: clamp(1.35rem, 3vw, 1.85rem); margin: 0; }
.ksp-page-title p { color: var(--ksp-muted); margin: .15rem 0 0; }
.ksp-panel-card { background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: var(--ksp-radius); padding: 1.25rem; box-shadow: var(--ksp-shadow-sm); }
.ksp-stat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; }
@media (min-width: 992px) { .ksp-stat-grid { grid-template-columns: repeat(4, 1fr); gap: 1rem; } }
.ksp-stat { display: flex; align-items: center; gap: .9rem; padding: 1rem; border-radius: var(--ksp-radius); background: var(--ksp-surface); border: 1px solid var(--ksp-border); }
.ksp-stat__icon { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; flex-shrink: 0; }
.ksp-stat__icon .material-symbols-rounded { vertical-align: 0; font-size: 24px; }
.ksp-stat__value { font-size: 1.5rem; font-weight: 800; line-height: 1.1; }
.ksp-stat__label { font-size: .8rem; color: var(--ksp-muted); }
.ksp-stat--primary .ksp-stat__icon { background: rgba(var(--ksp-primary-rgb), .12); color: var(--ksp-primary); }
.ksp-stat--success .ksp-stat__icon { background: rgba(18, 184, 134, .12); color: var(--ksp-success); }
.ksp-stat--warning .ksp-stat__icon { background: rgba(245, 159, 0, .14); color: var(--ksp-warning); }
.ksp-stat--info .ksp-stat__icon { background: rgba(51, 154, 240, .12); color: var(--ksp-info); }
.ksp-stat--danger .ksp-stat__icon { background: rgba(240, 62, 94, .12); color: var(--ksp-danger); }
.ksp-table { --bs-table-bg: transparent; }
.ksp-table th { font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: var(--ksp-muted); font-weight: 700; border-bottom-color: var(--ksp-border); }
.ksp-table td { border-bottom-color: var(--ksp-border); }
.ksp-timeline { list-style: none; margin: 0; padding: 0; }
.ksp-timeline li { display: flex; align-items: center; gap: 1rem; padding: .8rem 0; border-bottom: 1px solid var(--ksp-border); }
.ksp-timeline li:last-child { border-bottom: 0; }
.ksp-timeline__time { font-weight: 800; color: var(--ksp-primary); min-width: 56px; }
.ksp-timeline__body { flex: 1; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; min-width: 0; }
.ksp-alert { display: flex; gap: .75rem; align-items: flex-start; padding: 1rem 1.1rem; border-radius: var(--ksp-radius); }
.ksp-alert--warning { background: rgba(245, 159, 0, .12); color: var(--ksp-text); }
.ksp-alert--warning .material-symbols-rounded { color: var(--ksp-warning); }

/* ---------- Dil seçici (views/partials/lang-switcher.php; tek dilde hiç basılmaz) ---------- */
.ksp-lang__toggle { height: 42px; padding: 0 .8rem; gap: .3rem; color: var(--ksp-text); border: 0; }
.ksp-lang__toggle:hover, .ksp-lang__toggle[aria-expanded="true"] { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-lang__current { font-size: .75rem; font-weight: 700; letter-spacing: .06em; }
.ksp-lang__menu { --bs-dropdown-bg: var(--ksp-surface); --bs-dropdown-border-color: var(--ksp-border); --bs-dropdown-link-color: var(--ksp-text); --bs-dropdown-link-hover-color: var(--ksp-text); --bs-dropdown-link-hover-bg: var(--ksp-surface-2); --bs-dropdown-link-active-color: var(--ksp-primary); --bs-dropdown-link-active-bg: rgba(var(--ksp-primary-rgb), .12); --bs-dropdown-header-color: var(--ksp-muted); min-width: 13rem; padding: .4rem; border-radius: var(--ksp-radius); box-shadow: var(--ksp-shadow-lg); }
.ksp-lang__menu .dropdown-header { font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; padding: .4rem .75rem .3rem; }
.ksp-lang__item { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .55rem .75rem; border-radius: var(--ksp-radius-sm); font-weight: 600; }
.ksp-lang__code { font-size: .68rem; font-weight: 700; letter-spacing: .06em; padding: .15rem .5rem; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); }
.ksp-lang__item.active .ksp-lang__code { background: var(--ksp-primary); color: #fff; }
.ksp-auth__top > .ksp-lang { margin-inline: auto .5rem; }
.ksp-lang--form { display: flex; align-items: center; gap: .4rem; margin: 0; }
.ksp-lang__select { position: relative; display: flex; align-items: center; margin: 0; }
.ksp-lang__select > .material-symbols-rounded { position: absolute; direction: inherit; inset-inline-start: .75rem; color: var(--ksp-muted); font-size: 1.15rem; vertical-align: 0; pointer-events: none; }
.ksp-lang__select .form-select { height: 42px; padding-inline-start: 2.3rem; border-radius: 999px; border-color: var(--ksp-border); background-color: var(--ksp-surface); color: var(--ksp-text); font-size: .85rem; font-weight: 600; cursor: pointer; }
.ksp-lang__select option { color: var(--ksp-text); background: var(--ksp-surface); }
@media (max-width: 575.98px) {
  /* Mobil panel üst barı dar: yalnızca ikon görünür, yerel seçim listesi yine açılır */
  .ksp-lang__select .form-select { width: 42px; padding: 0; color: transparent; background-image: none; }
  .ksp-lang__select > .material-symbols-rounded { inset-inline: 0; text-align: center; color: var(--ksp-text); }
}

/* ---------- RTL (ar) ve Latin dışı alfabe — LTR görünümü değişmez (KARARLAR.md §4.6) ---------- */
:root[lang="ar"] { --bs-body-font-family: "IBM Plex Sans Arabic", "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
/* Arapça bitişik yazı: negatif/pozitif harf aralığı harfleri koparır */
:lang(ar) :is(body, h1, h2, h3, h4, h5, .ksp-brand, .ksp-hero__title, .ksp-footer__title, .ksp-table th, .ksp-lang__menu .dropdown-header) { letter-spacing: 0; }
/* IBM Plex Sans Arabic'te 800 ağırlığı yok: sahte kalın yerine 700 */
:lang(ar) :is(.ksp-brand__text strong, .ksp-hero__title, .ksp-hero__stats strong, .ksp-step__no,
  .ksp-error-code, .ksp-auth__quote h2, .ksp-stat__value, .ksp-timeline__time) { font-weight: 700; }
/* Yön bildiren ikonlar (arrow_forward, logout) aynalanır */
[dir="rtl"] .ksp-flip-rtl { display: inline-block; transform: scaleX(-1); }
[dir="rtl"] .ksp-hero__card { transform: rotate(2deg); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* ==========================================================================
   Salon Keşfet tasarım sistemi — üst bar, header, ana sayfa, footer (docs/TASARIM.md)
   ========================================================================== */
@media (min-width: 1200px) { .container { max-width: 1248px; } }
.text-rose { color: var(--ksp-accent) !important; }
.text-sky { color: #51a2ff !important; }

/* ---------- Butonlar (tasarım) ---------- */
.ksp-btn-rose { background: var(--ksp-primary); color: #fff; border: 0; padding: .55rem 1rem; }
.ksp-btn-rose:hover, .ksp-btn-rose:focus-visible { background: var(--ksp-primary-600); color: #fff; }
.ksp-btn-ink { background: var(--ksp-ink); color: #fff; border: 0; height: 40px; font-size: .84rem; }
.ksp-btn-ink:hover { background: var(--ksp-ink-800); color: #fff; }
.ksp-btn-stone { background: var(--ksp-surface-2); color: var(--ksp-text); border: 0; }
.ksp-btn-stone:hover { background: var(--ksp-border); color: var(--ksp-text); }
.ksp-btn-lg { height: 52px; padding: 0 1.6rem; font-size: .95rem; }
.ksp-btn-rose .material-symbols-rounded, .ksp-btn-ink .material-symbols-rounded, .ksp-btn-stone .material-symbols-rounded { font-size: 18px; vertical-align: 0; }

/* ---------- Marka ---------- */
.ksp-brand { gap: .7rem; }
.ksp-brand__body { display: flex; flex-direction: column; line-height: 1.1; }
.ksp-brand__line { display: inline-flex; align-items: center; gap: .5rem; }
.ksp-brand__text { font-size: 1.3rem; font-weight: 800; letter-spacing: -.04em; color: var(--ksp-text); }
.ksp-brand__text strong { color: var(--ksp-primary); font-weight: 800; }
.ksp-brand__badge { font-size: .64rem; font-weight: 700; color: var(--ksp-primary); background: var(--ksp-primary-50); border: 1px solid #ffccd3; border-radius: 6px; padding: .1rem .4rem; letter-spacing: 0; }
.ksp-brand__tagline { font-size: .7rem; font-weight: 500; color: var(--ksp-muted); margin-top: .2rem; letter-spacing: 0; }
.ksp-brand--compact .ksp-brand__text { font-size: 1.12rem; }
.ksp-brand--light .ksp-brand__text { color: #fff; }

/* ---------- Üst bar (koyu şerit) ---------- */
.ksp-strip { background: var(--ksp-ink); color: #d6d3d1; font-size: .78rem; font-weight: 500; }
.ksp-strip__inner { min-height: var(--ksp-strip-h); display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.ksp-strip__left, .ksp-strip__right { display: flex; align-items: center; gap: .75rem; min-width: 0; white-space: nowrap; }
.ksp-strip__left { overflow: hidden; }
.ksp-strip__live { display: inline-flex; align-items: center; gap: .4rem; color: var(--ksp-accent); font-weight: 700; }
.ksp-strip__live--green { color: var(--ksp-success-dot); }
.ksp-strip__dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; animation: ksp-pulse 1.8s infinite; }
.ksp-strip__text { color: #e7e5e4; overflow: hidden; text-overflow: ellipsis; }
.ksp-strip__sep { color: #57534e; }
.ksp-strip__right a { color: #e7e5e4; display: inline-flex; align-items: center; gap: .35rem; }
.ksp-strip__right a:hover { color: #fff; }
.ksp-strip__right .material-symbols-rounded { font-size: 16px; vertical-align: 0; }
@keyframes ksp-pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 32, 86, .5); } 70% { box-shadow: 0 0 0 6px rgba(255, 32, 86, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 32, 86, 0); } }

/* ---------- Header (beyaz, sticky) ---------- */
.ksp-header { position: sticky; top: 0; z-index: 1030; background: var(--ksp-surface); border-bottom: 1px solid var(--ksp-border); }
.ksp-header.is-scrolled { box-shadow: 0 6px 20px -16px rgba(28, 25, 23, .5); }
.ksp-header__inner { min-height: var(--ksp-topbar-h); display: flex; align-items: center; gap: 1.5rem; }
.ksp-header__actions { margin-inline-start: auto; display: flex; align-items: center; gap: .6rem; }
.ksp-hbtn { height: 40px; padding: 0 1rem; font-size: .9rem; font-weight: 600; white-space: nowrap; border-radius: var(--ksp-radius-sm); border: 1px solid transparent; }
/* Kullanıcı isteği 2026-09-17: başlık düğmeleri bir boy küçük (tablet kuralı aşağıda bunu ezer) */
.ksp-header .ksp-hbtn { height: 36px; padding: 0 .85rem; font-size: .84rem; gap: .4rem; }
/* Tablet (768–991): başlık butonları yalnız ikon; etiket ekran okuyucuda kalır */
@media (min-width: 768px) and (max-width: 991.98px) {
  .ksp-header .ksp-hbtn { padding: 0 .7rem; }
  .ksp-header .ksp-hbtn > span:not([class]) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
.ksp-hbtn .material-symbols-rounded { font-size: 19px; vertical-align: 0; }
.ksp-hbtn--gray { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-hbtn--gray:hover { background: var(--ksp-border); color: var(--ksp-text); }
.ksp-hbtn--rose { background: var(--ksp-primary-50); color: var(--ksp-primary); border-color: #ffccd3; }
.ksp-hbtn--rose:hover { background: var(--ksp-primary-100); color: var(--ksp-primary); border-color: #ffa1ad; }
.ksp-hbtn--dark { background: var(--ksp-ink); color: #fff; font-weight: 700; }
.ksp-hbtn--dark:hover { background: var(--ksp-ink-800); color: #fff; }
.ksp-hbtn--dark .material-symbols-rounded { color: var(--ksp-accent); }
.ksp-hbtn--icon { width: 40px; padding: 0; }
.ksp-header .ksp-hbtn--icon { width: 36px; padding: 0; }
.ksp-header .ksp-hbtn .material-symbols-rounded { font-size: 17px; }
/* "Bireysel Uzman Ol": çerçeveli, koyu başlıkta da belirgin */
.ksp-hbtn--outline { background: transparent; color: var(--ksp-text); border-color: #d6d3d1; }
.ksp-hbtn--outline:hover { background: var(--ksp-surface-2); color: var(--ksp-text); border-color: #a8a29e; }
[data-bs-theme="dark"] .ksp-hbtn--outline { border-color: rgba(255, 255, 255, .3); }
.ksp-hbtn__count { min-width: 19px; height: 19px; padding: 0 5px; border-radius: 999px; background: var(--ksp-primary); color: #fff; font-size: .68rem; font-weight: 800; display: inline-grid; place-items: center; }

/* ---------- Ortak parçalar ---------- */
.ksp-eyebrow { display: inline-flex; align-items: center; gap: .45rem; color: var(--ksp-primary); font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.ksp-eyebrow__dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.ksp-pill { display: inline-flex; align-items: center; gap: .25rem; padding: .28rem .6rem; border-radius: 999px; font-size: .68rem; font-weight: 700; line-height: 1.2; white-space: nowrap; }
.ksp-pill .material-symbols-rounded { font-size: 14px; vertical-align: 0; }
.ksp-pill--glass { background: rgba(255, 255, 255, .18); border: 1px solid rgba(255, 255, 255, .28); color: #fff; text-transform: uppercase; letter-spacing: .04em; backdrop-filter: blur(6px); }
.ksp-pill--dark { background: rgba(12, 10, 9, .68); color: #fff; backdrop-filter: blur(6px); }
.ksp-pill--rose { background: var(--ksp-primary); color: #fff; text-transform: uppercase; letter-spacing: .04em; }
.ksp-pill--rose-soft { background: var(--ksp-primary-50); color: var(--ksp-primary); border: 1px solid #ffccd3; text-transform: uppercase; letter-spacing: .04em; vertical-align: middle; }
.ksp-pill--rose-glass { background: rgba(255, 32, 86, .14); border: 1px solid rgba(255, 32, 86, .35); color: #ff637e; font-size: .74rem; }
.ksp-pill--green { background: var(--ksp-success); color: #fff; }
.ksp-rate { display: inline-flex; align-items: center; gap: .2rem; font-weight: 700; font-size: .82rem; color: var(--ksp-text); }
.ksp-rate .material-symbols-rounded { color: var(--ksp-warning); font-size: 17px; vertical-align: 0; }
.ksp-rate small { color: var(--ksp-muted); font-weight: 500; font-size: .74rem; }
.ksp-stars { display: inline-flex; gap: 1px; color: var(--ksp-warning); }
.ksp-stars .material-symbols-rounded { font-size: 16px; vertical-align: 0; }
.ksp-stars .is-empty { color: #d6d3d1; }
.ksp-ava { position: relative; display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--ksp-surface-2) center / cover no-repeat; color: var(--ksp-muted); font-size: .8rem; font-weight: 800; overflow: hidden; flex-shrink: 0; }
.ksp-ava--lg { width: 56px; height: 56px; border-radius: 12px; font-size: 1rem; }
.ksp-ava--sm { width: 32px; height: 32px; border-radius: 8px; font-size: .7rem; }
.ksp-online { position: absolute; inset-inline-end: -3px; bottom: -3px; width: 13px; height: 13px; border-radius: 50%; background: var(--ksp-success-dot); border: 2px solid var(--ksp-surface); }
/* Kart çip satırları: tek satır + aynı yükseklik (kartlar arası hiza), taşan metin "…", kalanlar "+N" */
.ksp-tags { display: flex; flex-wrap: nowrap; align-items: center; gap: .3rem; min-height: 22px; margin: .75rem 0 .9rem; }
.ksp-tags > span { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: var(--ksp-surface-2); color: #44403c; font-size: .66rem; font-weight: 600; line-height: 1.4; padding: .2rem .45rem; border-radius: 6px; }
[data-bs-theme="dark"] .ksp-tags > span { color: #d6d3d1; }
.ksp-clip { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-chip-more { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; min-width: 26px; padding: .2rem .4rem; border-radius: 6px; font-size: .66rem; font-weight: 800; line-height: 1.4; color: var(--ksp-primary); background: rgba(236, 0, 63, .08); text-decoration: none; transition: background .15s, color .15s; }
.ksp-chip-more:hover, .ksp-chip-more:focus-visible { background: var(--ksp-primary); color: #fff; }
.ksp-tags.is-measuring > *, .ksp-amenities.is-measuring > * { flex-shrink: 0; } /* app.js sığdırma ölçümü */
.ksp-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.ksp-checklist li { display: flex; gap: .45rem; align-items: flex-start; font-size: .8rem; color: #57534e; line-height: 1.35; }
.ksp-checklist .material-symbols-rounded { color: var(--ksp-primary); font-size: 17px; vertical-align: 0; flex-shrink: 0; }

/* ---------- Bölüm iskeleti ---------- */
.ksp-sec { padding: 4.5rem 0; }
.ksp-sec--white { background: var(--ksp-surface); border-block: 1px solid var(--ksp-border); }
/* Paketler bölümü: SİYAH blok (sahip, 2026-09-21: "paketlerin arka planını siyah yapalım" — 2026-09-17'deki
   "siyah olmasın" kararının yerine geçer). Alt kenar ana sayfa hero'sundaki gibi sayfa zeminine erir (sahip: "alt
   kısmı 3. resimdeki işaretli alan gibi yap"); marka parıltıları siyahın üzerinde hafif kalır. */
/* Sahip isteği 2026-09-24: bölümün arkasına salon fotoğrafı (public/assets/img/paketler-fon.webp).
   Katman sırası ÜSTTEN ALTA: marka parıltıları → yatay karartma (soldaki başlık okunsun, sağdaki
   portre görünsün) → dikey karartma (alt kenar sayfa zeminine erer, eski karar korunur) →
   fotoğraf → düz zemin (görsel yüklenmezse yedek).
   Karartma SAHİP KARARIYLA güçlü tutulur ("karartma kalsın"): fotoğraf bir doku olarak durur,
   başlık ve kart kontrastı düşmez. Hafifletme denemesi geri alındı. */
/* Color Lounge sahibi 2026-09-29 (KARARLAR §82.25): "arka plandaki resmi kaldır" — fotoğraf katmanı ÇIKTI (dosya diskte duruyor,
   bağlı değil). Kalan: koyu zemin + marka parıltıları + karartma + alt kenarın sayfa zeminine erimesi (eski karar korunur). */
.ksp-sec.ksp-sec--dark { color: #fff; padding: 6.5rem 0 5rem;
  background:
    radial-gradient(50% 38% at 88% 24%, rgba(136, 19, 55, .3), transparent 70%),
    radial-gradient(40% 32% at 8% 18%, rgba(120, 53, 15, .22), transparent 70%),
    linear-gradient(90deg, rgba(12, 10, 9, .94) 0, rgba(12, 10, 9, .74) 34%, rgba(12, 10, 9, .34) 58%, rgba(12, 10, 9, .2) 100%),
    linear-gradient(180deg, rgba(28, 25, 23, .72) 0, rgba(24, 20, 19, .62) 46%, rgba(16, 13, 12, .88) 74%, rgba(12, 10, 9, .96) 88%, var(--ksp-bg) 100%),
    var(--ksp-ink); }
@media (max-width: 991.98px) { .ksp-sec.ksp-sec--dark { padding: 5.5rem 0 4rem; } }
.ksp-sec__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.75rem; }
.ksp-sec__head--center { justify-content: center; text-align: center; }
.ksp-sec__head--center .ksp-sec__lead { margin-inline: auto; }
.ksp-sec__title { font-size: clamp(1.5rem, 3.2vw, 1.95rem); font-weight: 800; letter-spacing: -.035em; color: var(--ksp-text); margin: .45rem 0 .35rem; }
.ksp-sec__title--sm { font-size: clamp(1.25rem, 2.6vw, 1.5rem); display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-top: 0; }
.ksp-sec__lead { color: var(--ksp-muted); font-size: .9rem; max-width: 640px; margin: 0; }
.ksp-sec--dark .ksp-sec__title { color: #fff; }
.ksp-sec--dark .ksp-sec__lead { color: #d6d3d1; }
.ksp-sec__link { display: inline-flex; align-items: center; gap: .3rem; color: var(--ksp-primary); font-weight: 700; font-size: .85rem; white-space: nowrap; }
.ksp-sec__link .material-symbols-rounded { font-size: 18px; vertical-align: 0; }
.ksp-sec__note { color: var(--ksp-muted); font-size: .8rem; font-weight: 500; white-space: nowrap; }
.ksp-sec__note--green { color: var(--ksp-success); font-weight: 700; display: inline-flex; align-items: center; gap: .3rem; }
.ksp-sec__note .material-symbols-rounded { font-size: 18px; vertical-align: 0; }
.ksp-outline-pill { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid rgba(255, 255, 255, .2); color: #e7e5e4; border-radius: 999px; padding: .45rem .9rem; font-size: .78rem; font-weight: 600; white-space: nowrap; }
.ksp-outline-pill:hover { border-color: rgba(255, 255, 255, .45); color: #fff; }
.ksp-outline-pill .material-symbols-rounded { font-size: 16px; vertical-align: 0; color: var(--ksp-accent); }

/* ---------- 1. Hero ---------- */
.ksp-hero2 { position: relative; color: #fff; padding: 4.75rem 0 6rem; overflow: hidden; background: var(--ksp-ink); }
.ksp-hero2__bg { position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(12, 10, 9, .62) 0%, rgba(12, 10, 9, .82) 52%, rgba(12, 10, 9, .6) 80%, var(--ksp-bg) 100%),
    radial-gradient(55% 60% at 85% 75%, rgba(136, 19, 55, .45), transparent 70%),
    radial-gradient(40% 45% at 10% 30%, rgba(120, 53, 15, .35), transparent 70%),
    var(--ksp-hero-img, url("../img/demo/hero.webp")) center / cover no-repeat; } /* panelden yüklenen görsel / video varken none (§82.15) */
.ksp-hero2__inner { position: relative; text-align: center; }
.ksp-hero2__title { font-size: clamp(1.9rem, 4.6vw, 3.25rem); font-weight: 800; letter-spacing: -.04em; line-height: 1.12; margin: 0 auto 1.1rem; max-width: 1000px; }
.ksp-hero2__accent { background: linear-gradient(90deg, #ff2056 0%, #ff637e 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ksp-hero2__lead { color: #a8a29e; font-size: .97rem; max-width: 660px; margin: 0 auto 2rem; line-height: 1.6; }
.ksp-finder { display: flex; align-items: stretch; background: #fff; color: var(--ksp-ink); border-radius: 16px; padding: .5rem; max-width: 920px; margin: 0 auto; box-shadow: 0 30px 60px -24px rgba(0, 0, 0, .6); text-align: start; }
.ksp-finder__field { display: flex; flex-direction: column; justify-content: center; gap: .15rem; padding: .35rem 1rem; margin: 0; min-width: 0; flex: 0 0 23%; border-inline-end: 1px solid #e7e5e4; }
.ksp-finder__field--grow { flex: 1 1 auto; }
.ksp-finder__label { font-size: .64rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #a8a29e; }
.ksp-finder__control { display: flex; align-items: center; gap: .45rem; }
.ksp-finder__control .material-symbols-rounded { color: var(--ksp-primary); font-size: 19px; vertical-align: 0; }
.ksp-finder__control input, .ksp-finder__control select { border: 0; outline: 0; background: transparent; font-size: .9rem; font-weight: 600; color: #1c1917; width: 100%; min-width: 0; padding: .15rem 0; }
.ksp-finder__control input::placeholder { color: #a8a29e; font-weight: 500; }
.ksp-finder__submit { background: var(--ksp-primary); color: #fff; border: 0; border-radius: 12px; padding: 0 1.6rem; font-size: .95rem; margin-inline-start: .5rem; }
.ksp-finder__submit:hover { background: var(--ksp-primary-600); color: #fff; }
/* Tablet (768–991): arama alanı tam satır, şehir + tarih + buton alt satırda (alanlar kesilmesin) */
@media (min-width: 768px) and (max-width: 991.98px) {
  .ksp-finder { flex-wrap: wrap; row-gap: .25rem; }
  .ksp-finder__field--grow { flex: 1 1 100%; border-inline-end: 0; border-bottom: 1px solid #f5f5f4; padding-bottom: .6rem; }
  .ksp-finder__field:not(.ksp-finder__field--grow) { flex: 1 1 0; }
  .ksp-finder__submit { height: 48px; align-self: center; }
}
.ksp-hero2__popular { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .45rem; margin-top: 1.1rem; font-size: .76rem; }
.ksp-hero2__popular > span { color: #a8a29e; margin-inline-end: .2rem; }
.ksp-hero2__popular a { color: #e7e5e4; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .12); border-radius: 999px; padding: .3rem .7rem; font-weight: 600; }
.ksp-hero2__popular a:hover { background: rgba(255, 255, 255, .16); color: #fff; }
.ksp-hero2__stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; max-width: 920px; margin: 2.25rem auto 0; }
.ksp-hstat { display: flex; flex-direction: column; align-items: center; gap: .2rem; padding: .95rem .75rem; border-radius: 14px; background: rgba(28, 25, 23, .55); border: 1px solid; backdrop-filter: blur(8px); }
.ksp-hstat__value { font-size: 1.35rem; font-weight: 800; letter-spacing: -.02em; display: inline-flex; align-items: center; gap: .4rem; }
.ksp-hstat__label { font-size: .74rem; color: #a8a29e; font-weight: 500; }
.ksp-hstat--amber { border-color: rgba(245, 158, 11, .45); }
.ksp-hstat--amber .ksp-hstat__value { color: #fbbf24; }
.ksp-hstat--rose { border-color: rgba(255, 32, 86, .45); }
.ksp-hstat--rose .ksp-hstat__value { color: #ff637e; }
.ksp-hstat--green { border-color: rgba(0, 188, 125, .45); }
.ksp-hstat--green .ksp-hstat__value { color: #34d399; }
.ksp-hstat--violet { border-color: rgba(142, 81, 255, .5); }
.ksp-hstat--violet .ksp-hstat__value { color: #a78bfa; }

/* ---------- 2. Kategoriler ---------- */
.ksp-catgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.ksp-cat { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 220px; border-radius: 16px; overflow: hidden; color: #fff; isolation: isolate; transition: transform .25s, box-shadow .25s; }
.ksp-cat:hover { color: #fff; transform: translateY(-4px); box-shadow: var(--ksp-shadow-lg); }
.ksp-cat__img { position: absolute; inset: 0; z-index: -1; background: center / cover no-repeat; opacity: .4; mix-blend-mode: luminosity; transition: transform .5s; }
.ksp-cat:hover .ksp-cat__img { transform: scale(1.05); }
.ksp-cat::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, .45) 100%); }
.ksp-cat--women { background: linear-gradient(135deg, #f6339a 0%, #e60076 50%, #a3004c 100%); }
.ksp-cat--barber { background: linear-gradient(135deg, #314158 0%, #1d293d 50%, #0f172b 100%); }
.ksp-cat--color { background: linear-gradient(135deg, #a50036 0%, #8b0836 50%, #4d0218 100%); }
.ksp-cat--nails { background: linear-gradient(135deg, #e12afb 0%, #c800de 45%, #e60076 100%); }
.ksp-cat--spa { background: linear-gradient(135deg, #009689 0%, #00786f 50%, #005f5a 100%); }
.ksp-cat--bridal { background: linear-gradient(135deg, #e17100 0%, #bb4d00 50%, #7b3306 100%); }
.ksp-cat__top { display: flex; justify-content: space-between; gap: .5rem; padding: 1rem; }
.ksp-cat__body { display: flex; flex-direction: column; gap: .25rem; padding: 1.1rem 1.15rem 1.2rem; }
.ksp-cat__title { font-size: 1.18rem; font-weight: 800; letter-spacing: -.03em; }
.ksp-cat__desc { font-size: .76rem; color: rgba(255, 255, 255, .82); }
.ksp-cat__cta { display: inline-flex; align-items: center; gap: .25rem; font-size: .78rem; font-weight: 700; margin-top: .45rem; }
.ksp-cat__cta .material-symbols-rounded { font-size: 16px; vertical-align: 0; transition: transform .2s; }
.ksp-cat:hover .ksp-cat__cta .material-symbols-rounded { transform: translateX(3px); }

/* ---------- 3. Paketler ---------- */
.ksp-pkggrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.ksp-pkg { background: #fff; color: var(--ksp-ink); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.ksp-pkg__img { position: relative; height: 190px; background: linear-gradient(135deg, #44403c, #1c1917) center / cover no-repeat; padding: .9rem; }
.ksp-pkg__img[style] { background-size: cover; background-position: center; }
.ksp-pkg__body { padding: 1rem 1.15rem 1.15rem; display: flex; flex-direction: column; flex: 1; }
.ksp-pkg__meta { display: flex; justify-content: space-between; align-items: center; gap: .5rem; font-size: .75rem; color: #78716c; margin-bottom: .35rem; }
.ksp-pkg__meta a { color: #1c1917; font-weight: 700; display: inline-flex; align-items: center; gap: .3rem; }
.ksp-pkg__meta .material-symbols-rounded { font-size: 16px; vertical-align: 0; color: var(--ksp-primary); }
.ksp-pkg__meta .ksp-rate { color: #1c1917; }
.ksp-pkg__meta .ksp-rate .material-symbols-rounded { color: var(--ksp-warning); }
.ksp-pkg__title { font-size: 1.02rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.35; margin: .45rem 0 .75rem; color: #1c1917; }
.ksp-pkg .ksp-checklist { margin-bottom: 1rem; }
.ksp-pkg .ksp-checklist li { color: #57534e; }
.ksp-pkg__foot { margin-top: auto; padding-top: 1rem; border-top: 1px solid #f5f5f4; display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.ksp-pkg__price span { display: block; font-size: .64rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #a8a29e; }
.ksp-pkg__price strong { font-size: 1.4rem; font-weight: 800; letter-spacing: -.03em; color: #1c1917; }

/* ---------- 4. Ustalar ---------- */
.ksp-expertgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.1rem; }
.ksp-expert { background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; padding: 1rem; display: flex; flex-direction: column; transition: box-shadow .2s, transform .2s; }
.ksp-expert:hover { box-shadow: var(--ksp-shadow); transform: translateY(-2px); }
.ksp-expert__top { display: flex; gap: .75rem; align-items: flex-start; }
.ksp-expert__photo { position: relative; flex-shrink: 0; }
.ksp-expert__info { min-width: 0; flex: 1; }
.ksp-expert__info h3 { font-size: .95rem; font-weight: 800; letter-spacing: -.02em; margin: 0 0 .1rem; }
.ksp-expert__salon { display: block; color: var(--ksp-primary); font-size: .76rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-expert__place { display: flex; align-items: center; gap: .2rem; color: var(--ksp-muted); font-size: .72rem; margin-top: .1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-expert__place .material-symbols-rounded { font-size: 14px; vertical-align: 0; }
.ksp-expert__rating { display: flex; flex-direction: column; align-items: flex-end; text-align: end; }
.ksp-expert__rating small { color: #a8a29e; font-size: .66rem; white-space: nowrap; }
.ksp-expert__title { margin: .7rem 0 0; font-size: .74rem; color: var(--ksp-muted); font-weight: 600; }
.ksp-expert .btn { margin-top: auto; }

/* ---------- 5. Onaylı salonlar ---------- */
.ksp-salonbox { background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 20px; padding: 1.5rem; }
.ksp-salonbox__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; }
.ksp-salonbox__tools { display: flex; gap: .6rem; flex-wrap: wrap; }
.ksp-input { display: flex; align-items: center; gap: .4rem; height: 40px; padding: 0 .75rem; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-bg); margin: 0; color: var(--ksp-muted); font-size: .8rem; }
.ksp-input .material-symbols-rounded { font-size: 18px; vertical-align: 0; }
.ksp-input input, .ksp-input select { border: 0; outline: 0; background: transparent; font-size: .84rem; font-weight: 600; color: var(--ksp-text); min-width: 0; }
.ksp-input input { width: 170px; }
.ksp-districts { align-items: center; margin: 1.1rem 0 1.25rem; flex-wrap: wrap; }
.ksp-districts__label { font-size: .78rem; font-weight: 600; color: var(--ksp-muted); margin-inline-end: .2rem; }
.ksp-districts button { border: 1px solid var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); font-size: .78rem; font-weight: 600; border-radius: 999px; padding: .35rem .85rem; white-space: nowrap; }
.ksp-districts button:hover { border-color: #a8a29e; }
.ksp-districts button.is-active { background: var(--ksp-ink); border-color: var(--ksp-ink); color: #fff; }
.ksp-salongrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.ksp-salon2 { border: 1px solid var(--ksp-border); border-radius: 16px; overflow: hidden; background: var(--ksp-surface); display: flex; flex-direction: column; }
.ksp-salon2[hidden] { display: none; }
.ksp-salon2__img { position: relative; display: block; height: 200px; background: linear-gradient(135deg, #57534e, #1c1917) center / cover no-repeat; color: #fff; }
.ksp-salon2__img[style] { background-size: cover; background-position: center; }
.ksp-salon2__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .25) 0%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, .75) 100%); }
.ksp-salon2__badges { position: absolute; z-index: 1; top: .75rem; inset-inline-start: .75rem; display: flex; gap: .35rem; flex-wrap: wrap; }
.ksp-salon2__name { position: absolute; z-index: 1; inset-inline: 1rem; bottom: .85rem; display: flex; flex-direction: column; gap: .1rem; }
.ksp-salon2__name strong { font-size: 1.2rem; font-weight: 800; letter-spacing: -.03em; color: #fff; }
.ksp-salon2__name span { font-size: .76rem; color: rgba(255, 255, 255, .88); display: inline-flex; align-items: center; gap: .2rem; }
.ksp-salon2__name .material-symbols-rounded { font-size: 15px; vertical-align: 0; }
.ksp-salon2__body { padding: 1rem; display: flex; flex-direction: column; flex: 1; }
.ksp-salon2__row { display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.ksp-salon2__price { color: var(--ksp-primary); font-weight: 700; font-size: .8rem; white-space: nowrap; }
.ksp-salon2__desc { color: #57534e; font-size: .8rem; line-height: 1.5; min-height: 3em; margin: .6rem 0 .8rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
[data-bs-theme="dark"] .ksp-salon2__desc, [data-bs-theme="dark"] .ksp-checklist li { color: #d6d3d1; }
.ksp-amenities { display: flex; flex-wrap: nowrap; align-items: center; gap: .3rem; min-height: 22px; margin: .75rem 0 1rem; }
.ksp-amenities > span { flex: 0 1 auto; min-width: 0; display: inline-flex; align-items: center; gap: .15rem; background: var(--ksp-surface-2); color: #57534e; font-size: .66rem; font-weight: 600; line-height: 1.4; padding: .2rem .45rem; border-radius: 6px; }
[data-bs-theme="dark"] .ksp-amenities > span { color: #d6d3d1; }
.ksp-amenities .material-symbols-rounded { flex-shrink: 0; font-size: 13px; vertical-align: 0; color: var(--ksp-success); }
.ksp-salon2__actions { margin-top: auto; display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.ksp-salon2__actions .btn { height: 42px; font-size: .8rem; padding: 0 .5rem; }
.ksp-salonbox__empty { text-align: center; color: var(--ksp-muted); padding: 2rem 0 .5rem; margin: 0; }

/* ---------- 6. Neden biz ---------- */
.ksp-whygrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.1rem; }
.ksp-why { background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; padding: 1.35rem; }
.ksp-why h3 { font-size: .98rem; font-weight: 800; letter-spacing: -.02em; margin: 1rem 0 .4rem; }
.ksp-why p { font-size: .8rem; color: var(--ksp-muted); margin: 0; line-height: 1.55; }
.ksp-why__icon { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; }
.ksp-why__icon .material-symbols-rounded { font-size: 22px; vertical-align: 0; }
.ksp-why__icon--rose { background: #fff1f2; color: #ec003f; }
.ksp-why__icon--blue { background: #eff6ff; color: #2b7fff; }
.ksp-why__icon--green { background: #ecfdf5; color: #009966; }
.ksp-why__icon--amber { background: #fffbeb; color: #e17100; }

/* ---------- 7. Yorumlar ---------- */
.ksp-reviewgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.ksp-review { background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; padding: 1.25rem; display: flex; flex-direction: column; }
.ksp-review__head { display: flex; align-items: center; gap: .65rem; }
.ksp-review__head strong { display: block; font-size: .86rem; font-weight: 800; }
.ksp-review__head small { color: #a8a29e; font-size: .7rem; }
.ksp-review__head .ksp-stars { margin-inline-start: auto; }
.ksp-review__service { align-self: flex-start; display: inline-flex; align-items: center; gap: .25rem; background: var(--ksp-surface-2); font-size: .72rem; font-weight: 600; padding: .25rem .6rem; border-radius: 6px; margin: .9rem 0 .6rem; }
.ksp-review__service .material-symbols-rounded { font-size: 14px; vertical-align: 0; color: var(--ksp-primary); }
.ksp-review__text { font-size: .84rem; color: #57534e; line-height: 1.65; margin: .9rem 0 0; }
.ksp-review__service + .ksp-review__text { margin-top: 0; }
[data-bs-theme="dark"] .ksp-review__text { color: #d6d3d1; }
.ksp-review__foot { margin-top: auto; padding-top: .85rem; border-top: 1px solid var(--ksp-surface-2); display: flex; justify-content: space-between; gap: .5rem; font-size: .76rem; }
.ksp-review__text + .ksp-review__foot { margin-top: 1rem; }
.ksp-review__foot a { color: var(--ksp-text); font-weight: 800; }
.ksp-review__foot span { color: var(--ksp-primary); font-weight: 600; }

/* ---------- 8. İşletme CTA ---------- */
.ksp-ownercta { position: relative; overflow: hidden; border-radius: 28px; padding: 3.25rem 3.5rem; color: #fff;
  background: radial-gradient(55% 90% at 100% 100%, rgba(236, 0, 63, .32), transparent 65%), linear-gradient(115deg, #0c0a09 0%, #1c1917 42%, #4d0218 100%); }
.ksp-ownercta h2 { font-size: clamp(1.5rem, 3.4vw, 2.15rem); font-weight: 800; letter-spacing: -.035em; line-height: 1.2; max-width: 680px; margin: 1rem 0 .8rem; }
.ksp-ownercta p { color: #d6d3d1; font-size: .9rem; line-height: 1.65; max-width: 660px; margin: 0; }
.ksp-ownercta ul { list-style: none; padding: 0; margin: 1.3rem 0 1.6rem; display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; }
.ksp-ownercta li { display: inline-flex; align-items: center; gap: .35rem; font-size: .84rem; font-weight: 600; color: #e7e5e4; }
.ksp-ownercta li .material-symbols-rounded { color: var(--ksp-accent); font-size: 18px; vertical-align: 0; }

/* ---------- 9. SSS ---------- */
.ksp-faq { max-width: 820px; }
.ksp-faq__list .accordion-item { background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 12px !important; overflow: hidden; margin-bottom: .6rem; }
.ksp-faq__list .accordion-button { font-size: .92rem; font-weight: 700; color: var(--ksp-text); background: var(--ksp-surface); box-shadow: none; padding: 1rem 1.2rem; }
.ksp-faq__list .accordion-button:not(.collapsed) { color: var(--ksp-text); }
.ksp-faq__list .accordion-body { font-size: .86rem; color: var(--ksp-muted); padding: 0 1.2rem 1.1rem; line-height: 1.65; }

/* ---------- Footer ---------- */
.ksp-footer { margin-top: 0; padding: 3.5rem 0 1.5rem; background: var(--ksp-surface); border-top: 1px solid var(--ksp-border); }
/* g-lg-5 satırının negatif kenarı (−1,5rem) kapsayıcı dolgusunu (0,75rem) aşıyor: 1250–1270 px ekranda 4 px yatay kaydırma çubuğu açıyordu (2026-09-28) */
.ksp-footer { overflow-x: clip; }
.ksp-footer__about { font-size: .82rem; color: var(--ksp-muted); line-height: 1.65; margin: 1rem 0 .6rem; max-width: 340px; }
.ksp-footer__hours { display: inline-flex; align-items: center; gap: .3rem; font-size: .76rem; font-weight: 600; color: var(--ksp-primary); margin: 0; }
.ksp-footer__hours .material-symbols-rounded { font-size: 16px; vertical-align: 0; }
.ksp-footer__title { font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--ksp-text); margin-bottom: 1rem; }
.ksp-footer__links li { margin-bottom: .55rem; }
.ksp-footer__links a { color: #57534e; font-size: .82rem; }
.ksp-footer__links a:hover { color: var(--ksp-primary); }
[data-bs-theme="dark"] .ksp-footer__links a { color: #d6d3d1; }
.ksp-footer__bottom { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--ksp-border); display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem; font-size: .76rem; color: #a8a29e; }
.ksp-footer__legal { display: flex; gap: 1.1rem; flex-wrap: wrap; }
.ksp-footer__legal a { color: #a8a29e; }
.ksp-footer__legal a:hover { color: var(--ksp-text); }

/* ---------- Duyarlı ---------- */
@media (max-width: 1199.98px) {
  .ksp-expertgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ksp-header__inner { gap: 1rem; }
}
@media (max-width: 991.98px) {
  .ksp-sec { padding: 3.25rem 0; }
  .ksp-catgrid, .ksp-salongrid, .ksp-whygrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-scroller { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: .75rem; scrollbar-width: none; padding-bottom: .25rem; margin-inline: -.75rem; padding-inline: .75rem; }
  .ksp-scroller::-webkit-scrollbar { display: none; }
  .ksp-scroller > * { flex: 0 0 min(340px, 82%); min-width: 0; scroll-snap-align: start; }
  .ksp-reviewgrid { grid-template-columns: 1fr; }
  .ksp-sec__head { flex-direction: column; align-items: flex-start; }
  .ksp-sec__head--center { align-items: center; }
  .ksp-ownercta { padding: 2.25rem 1.75rem; border-radius: 22px; }
}
@media (max-width: 767.98px) {
  .ksp-hero2 { padding: 2.75rem 0 4rem; }
  .ksp-finder { flex-direction: column; padding: .6rem; gap: .25rem; }
  .ksp-finder__field { flex: 1 1 auto; border-inline-end: 0; border-bottom: 1px solid #f5f5f4; padding: .55rem .6rem; }
  .ksp-finder__submit { margin: .4rem 0 0; height: 48px; }
  .ksp-hero2__stats { grid-template-columns: repeat(2, 1fr); gap: .6rem; margin-top: 1.5rem; }
  .ksp-hstat__value { font-size: 1.1rem; }
  .ksp-catgrid, .ksp-salongrid, .ksp-whygrid { grid-template-columns: minmax(0, 1fr); }
  .ksp-cat { min-height: 190px; }
  .ksp-salonbox { padding: 1rem; border-radius: 16px; }
  .ksp-salonbox__tools, .ksp-salonbox__tools .ksp-input { width: 100%; }
  .ksp-input input { width: 100%; }
  .ksp-districts { flex-wrap: nowrap; }
  .ksp-brand__tagline { display: none; }
  .ksp-brand__text { font-size: 1.15rem; }
  .ksp-footer { padding-top: 2.5rem; }
}

/* Ana sayfa: header hero ile aynı koyu tonda başlar (tasarımda üst kısım koyu), kaydırınca beyaza döner */
.ksp-site--home .ksp-header { transition: background-color .25s, border-color .25s, box-shadow .25s; }
.ksp-site--home .ksp-header:not(.is-scrolled) { background: #141110; border-bottom-color: rgba(255, 255, 255, .06); }
.ksp-site--home .ksp-header:not(.is-scrolled) .ksp-brand__text { color: #fff; }
.ksp-site--home .ksp-header:not(.is-scrolled) .ksp-brand__text strong { color: var(--ksp-accent); }
.ksp-site--home .ksp-header:not(.is-scrolled) .ksp-brand__badge { background: rgba(255, 32, 86, .14); border-color: rgba(255, 32, 86, .35); color: #ff637e; }
.ksp-site--home .ksp-header:not(.is-scrolled) .ksp-brand__tagline { color: #a8a29e; }
.ksp-site--home .ksp-header:not(.is-scrolled) .ksp-hbtn--gray { background: rgba(255, 255, 255, .08); color: #fff; }
.ksp-site--home .ksp-header:not(.is-scrolled) .ksp-hbtn--rose { background: rgba(255, 32, 86, .14); border-color: rgba(255, 32, 86, .35); color: #ff637e; }
.ksp-site--home .ksp-header:not(.is-scrolled) .ksp-hbtn--dark { background: #fff; color: var(--ksp-ink); }
.ksp-site--home .ksp-header:not(.is-scrolled) .ksp-hbtn--dark .material-symbols-rounded { color: var(--ksp-primary); }
.ksp-site--home .ksp-header:not(.is-scrolled) .ksp-hbtn--outline { background: rgba(255, 255, 255, .07); border-color: rgba(255, 255, 255, .42); color: #fff; }
.ksp-site--home .ksp-header:not(.is-scrolled) .ksp-hbtn--outline:hover { background: rgba(255, 255, 255, .15); border-color: rgba(255, 255, 255, .65); color: #fff; }
.ksp-site--home .ksp-header:not(.is-scrolled) .ksp-lang__toggle { color: #fff; }

/* Üst bar — canlı randevu akışı (kullanıcı örneği 2026-09-17) */
.ksp-strip { background: #141110; border-top: 2px solid #0c0a09; border-bottom: 1px solid rgba(255, 255, 255, .05); font-size: .8rem; }
.ksp-strip__inner { min-height: 40px; }
.ksp-strip__live { color: #ff2056; font-weight: 800; }
.ksp-strip__dot { width: 8px; height: 8px; }
.ksp-strip__text { color: #e7e5e4; }
.ksp-strip__text strong { color: #fff; font-weight: 800; }
.ksp-strip__right { gap: .9rem; }
.ksp-strip__item { display: inline-flex; align-items: center; gap: .4rem; color: #a8a29e; }
.ksp-strip__item .material-symbols-rounded { font-size: 16px; vertical-align: 0; }
.ksp-strip__bullet { width: 4px; height: 4px; border-radius: 50%; background: #57534e; }
.ksp-strip__cta { display: inline-flex; align-items: center; gap: .3rem; color: #ff2056; font-weight: 800; }
.ksp-strip__cta:hover { color: #ff637e; }
.ksp-strip__cta .material-symbols-rounded { font-size: 16px; vertical-align: 0; transition: transform .2s; }
.ksp-strip__cta:hover .material-symbols-rounded { transform: translateX(2px); }
.ksp-strip [data-live-today].is-updated { animation: ksp-flash 1s ease-out; }
@keyframes ksp-flash { 0% { color: #ff637e; } 100% { color: #fff; } }
.text-amber { color: #fbbf24 !important; }
.text-violet { color: #a78bfa !important; }

/* Kategori kartları — kullanıcı örneği (2026-09-17): fotoğraf + tema renk katmanı, sarı fiyat, gri sayaç */
.ksp-eyebrow .material-symbols-rounded { font-size: 16px; vertical-align: 0; }
.ksp-catgrid { gap: 1.5rem; }
.ksp-cat { min-height: 240px; justify-content: flex-start; background-color: var(--c2); box-shadow: 0 1px 2px rgba(28, 25, 23, .08); }
.ksp-cat__img { opacity: 1; mix-blend-mode: normal; }
.ksp-cat::after { z-index: -1; background: linear-gradient(160deg, var(--c1) 0%, var(--c2) 78%); }
.ksp-cat--women  { --c1: rgba(236, 72, 153, .62); --c2: rgba(225, 29, 72, .94); background-image: linear-gradient(160deg, #f472b6, #e11d48); }
.ksp-cat--barber { --c1: rgba(30, 41, 59, .72);   --c2: rgba(2, 6, 23, .95);    background-image: linear-gradient(160deg, #1e293b, #020617); }
.ksp-cat--color  { --c1: rgba(87, 45, 18, .58);   --c2: rgba(217, 119, 6, .9);  background-image: linear-gradient(160deg, #78350f, #d97706); }
.ksp-cat--nails  { --c1: rgba(147, 51, 234, .7);  --c2: rgba(219, 39, 119, .92); background-image: linear-gradient(160deg, #9333ea, #db2777); }
.ksp-cat--spa    { --c1: rgba(17, 94, 89, .62);   --c2: rgba(5, 150, 105, .9);  background-image: linear-gradient(160deg, #115e59, #059669); }
.ksp-cat--bridal { --c1: rgba(41, 37, 36, .72);   --c2: rgba(217, 119, 6, .9);  background-image: linear-gradient(160deg, #292524, #d97706); }
.ksp-cat__top { padding: 1.25rem 1.25rem 0; align-items: center; }
.ksp-cat__count { background: rgba(255, 255, 255, .22); color: #fff; border-radius: 999px; padding: .3rem .75rem; font-size: .68rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; backdrop-filter: blur(6px); }
.ksp-cat__price { color: #ffd230; font-size: .74rem; font-weight: 800; }
.ksp-cat__body { margin-top: auto; padding: 1.25rem 1.25rem 1.35rem; gap: .2rem; }
.ksp-cat__title { font-size: 1.25rem; letter-spacing: -.035em; }
.ksp-cat__desc { font-size: .74rem; color: rgba(255, 255, 255, .9); }
.ksp-cat__cta { font-size: .76rem; font-weight: 800; margin-top: .75rem; }
.ksp-sec__link .material-symbols-rounded { font-size: 20px; }

/* Konuma göre yakındakiler (ana sayfa, hero altı) */
.ksp-nearby { padding-bottom: 1rem; }
.ksp-nearby[hidden] { display: none; }
.ksp-nearby__refresh { background: none; border: 0; padding: 0; gap: .35rem; }
.ksp-nearby__subtitle { display: flex; align-items: center; gap: .4rem; font-size: 1.05rem; font-weight: 800; letter-spacing: -.02em; margin: 2rem 0 1rem; }
.ksp-nearby__subtitle .material-symbols-rounded { color: var(--ksp-primary); font-size: 20px; vertical-align: 0; }
.ksp-nearby__more { display: flex; justify-content: center; margin-top: 1.5rem; }
.ksp-nearby__more .btn { height: 44px; padding: 0 1.2rem; }
.ksp-nearby__privacy { display: flex; align-items: center; justify-content: center; gap: .3rem; margin: 1.25rem 0 0; font-size: .74rem; color: var(--ksp-muted); }
.ksp-nearby__privacy .material-symbols-rounded { font-size: 15px; vertical-align: 0; }
.ksp-nearby__prompt { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.25rem; border: 1px dashed #ffa1ad; background: var(--ksp-primary-50); border-radius: 16px; }
.ksp-nearby__prompt[hidden] { display: none; }
.ksp-nearby__prompt strong { display: block; font-size: .95rem; }
.ksp-nearby__prompt p { margin: .15rem 0 0; font-size: .82rem; color: var(--ksp-muted); }
.ksp-nearby__prompt .btn { margin-inline-start: auto; white-space: nowrap; }
.ksp-salon2__distance { position: absolute; z-index: 1; top: .75rem; inset-inline-end: .75rem; display: inline-flex; align-items: center; gap: .2rem; padding: .28rem .6rem; border-radius: 999px; background: #fff; color: var(--ksp-ink); font-size: .72rem; font-weight: 800; box-shadow: 0 4px 12px -4px rgba(0, 0, 0, .35); }
.ksp-salon2__distance .material-symbols-rounded, .ksp-distance .material-symbols-rounded { font-size: 14px; vertical-align: 0; color: var(--ksp-primary); }
.ksp-distance { display: inline-flex; align-items: center; gap: .15rem; margin-inline-start: .4rem; color: var(--ksp-text); font-weight: 800; }
.ksp-skeleton { height: 360px; border-radius: 16px; background: linear-gradient(90deg, var(--ksp-surface-2) 0%, var(--ksp-bg) 50%, var(--ksp-surface-2) 100%); background-size: 200% 100%; animation: ksp-shimmer 1.2s infinite linear; border: 1px solid var(--ksp-border); }
@keyframes ksp-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (max-width: 767.98px) {
  .ksp-nearby__prompt { flex-direction: column; align-items: flex-start; }
  .ksp-nearby__prompt .btn { margin-inline-start: 0; width: 100%; }
  .ksp-skeleton { height: 300px; }
  .ksp-nearby .ksp-salongrid .ksp-skeleton:nth-child(n+2) { display: none; }
}

/* Salon kartı kadro özeti (kullanıcı örneği 2026-09-17): üst üste avatarlar + "N Uzman Usta" + durum rozeti */
.ksp-crew { display: flex; align-items: center; gap: .75rem; padding: .7rem .9rem; background: var(--ksp-bg); border: 1px solid var(--ksp-border); border-radius: 14px; color: var(--ksp-text); transition: border-color .2s; }
.ksp-crew:hover { color: var(--ksp-text); border-color: #d6d3d1; }
.ksp-crew__faces { display: flex; align-items: center; flex-shrink: 0; }
.ksp-crew__faces .ksp-ava { width: 36px; height: 36px; border: 2px solid var(--ksp-surface); font-size: .68rem; box-shadow: 0 1px 2px rgba(28, 25, 23, .12); }
.ksp-crew__faces .ksp-ava + .ksp-ava { margin-inline-start: -12px; }
.ksp-crew__count { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: .86rem; font-weight: 700; color: #44403c; white-space: nowrap; }
[data-bs-theme="dark"] .ksp-crew__count { color: #e7e5e4; }
.ksp-crew__status { flex-shrink: 0; margin-inline-start: auto; padding: .25rem .6rem; border-radius: 8px; font-size: .74rem; font-weight: 700; white-space: nowrap; background: var(--ksp-surface-2); color: #57534e; border: 1px solid var(--ksp-border); }
[data-bs-theme="dark"] .ksp-crew__status { color: #d6d3d1; }
.ksp-crew__status.is-open { background: #ecfdf5; color: #007a55; border-color: #a4f4cf; }
[data-bs-theme="dark"] .ksp-crew__status.is-open { background: rgba(0, 188, 125, .12); color: #5ee9b5; border-color: rgba(0, 188, 125, .35); }
/* Dar kart (992–1199px 3 sütun, 360–414px telefon): kutu tek satırda kalsın, rozet kesilmesin */
.ksp-salon2__body { container-type: inline-size; }
@container (max-width: 320px) {
  .ksp-crew { gap: .5rem; padding: .55rem .65rem; }
  .ksp-crew__faces .ksp-ava { width: 30px; height: 30px; font-size: .6rem; }
  .ksp-crew__faces .ksp-ava + .ksp-ava { margin-inline-start: -10px; }
  .ksp-crew__count { font-size: .76rem; }
  .ksp-crew__status { padding: .2rem .45rem; font-size: .68rem; }
}
.ksp-crew__short { display: none; }
@container (max-width: 270px) {
  .ksp-crew__long { display: none; }
  .ksp-crew__short { display: inline; }
}
/* Fotoğraflı avatarda baş harfler yüzün üstüne basılmasın (yalnız görsel yoksa görünür) */
.ksp-ava[style] > span { opacity: 0; }

/* ==========================================================================
   Konum seçici — il / ilçe (views/partials/location-picker.php + app.js "Konum seçici")
   Mobil (<768): alttan açılan sheet · masaüstü: ortada kart. Mantıksal özellikler → RTL uyumlu.
   ========================================================================== */
/* Tetikleyiciler (hero kartı, header, keşfet araması) */

/* Hero kartı: select ile aynı yükseklik; "Konumundan" ipucu etiket satırında (kart yüksekliği değişmez) */
 /* alanın tamamı tıklanır */

/* Keşfet araması: arama kutusu ile ara butonu arasında konum hapı */
/* Telefon: arama kutusu daralmasın → yalnız ikon (etiket ekran okuyucuda kalır, aktif konum çipte görünür) */

/* Liste sayfası çipleri: aktif konum (kaldır) + ilçe bağlantıları */
.ksp-chip--loc { background: var(--ksp-primary-50); color: var(--ksp-primary); border-color: #ffccd3; }
.ksp-chip--loc:hover, .ksp-chip--loc:focus-visible { background: var(--ksp-primary-100); color: var(--ksp-primary); }
.ksp-chip--loc .material-symbols-rounded { font-size: 16px; vertical-align: 0; }
.ksp-chip--loc .material-symbols-rounded:last-child { opacity: .75; }
[data-bs-theme="dark"] .ksp-chip--loc { border-color: rgba(255, 32, 86, .35); }

/* Diyalog */
 /* ilçe görünümü: geri butonu */

/* Seçenek satırları */

/* Durumlar: yükleniyor iskeleti, sonuç yok, hata */
 /* işletme kaydında (need-district) "konumun kaydedilmez" notu gizli */

/* @kokpit-takvim — Salon Kokpiti > Randevu Takvimi (views/panels/tenant/calendar.php) */
.ksp-cal { --cal-line: #efedeb; --cal-soft: #57534e; --cal-ink2: #44403c; --cal-head: #292524; --cal-stripe: rgba(0, 0, 0, .025); }
[data-bs-theme="dark"] .ksp-cal { --cal-line: rgba(255, 255, 255, .06); --cal-soft: #d6d3d1; --cal-ink2: #e7e5e4; --cal-head: #f5f5f4; --cal-stripe: rgba(255, 255, 255, .03); }
.ksp-cal [hidden] { display: none !important; }
.ksp-cal-wa { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; padding: .65rem .9rem; margin-bottom: 12px; border-radius: 14px; background: #ecfdf5; border: 1px solid #a7f3d0; color: #065f46; font-size: .84rem; font-weight: 600; }
.ksp-cal-wa > span:not(.material-symbols-rounded) { flex: 1 1 220px; }
.ksp-cal-wa .ksp-cal-btn { height: 34px; font-size: 13px; }

/* Araç çubuğu */
.ksp-cal-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 12px 14px; background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; box-shadow: 0 1px 2px rgba(28, 25, 23, .04); }
.ksp-cal-bar__day, .ksp-cal-bar__end { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; min-width: 0; }
.ksp-cal-bar__end { margin-inline-start: auto; }
.ksp-cal-arrows { display: inline-flex; gap: 2px; padding: 2px; border-radius: 10px; background: var(--ksp-surface-2); }
.ksp-cal-arrow { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; color: var(--cal-soft); }
.ksp-cal-arrow:hover { background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 1px 2px rgba(28, 25, 23, .1); }
.ksp-cal-arrow .material-symbols-rounded { font-size: 20px; }
.ksp-cal-pill { display: inline-flex; align-items: center; height: 34px; padding: 0 13px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-size: 13px; font-weight: 600; white-space: nowrap; }
.ksp-cal-pill:hover { border-color: #d6d3d1; color: var(--ksp-text); }
.ksp-cal-pill.is-active { background: #fff1f2; border-color: #fecdd3; color: #e11d48; }
.ksp-cal-datebox { display: inline-flex; align-items: center; gap: 6px; height: 34px; margin: 0; padding: 0 8px 0 10px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); position: relative; cursor: pointer; }
.ksp-cal-datebox .material-symbols-rounded { font-size: 17px; color: var(--ksp-muted); }
.ksp-cal-datebox input { width: 92px; padding: 0; border: 0; outline: 0; background: transparent; color: var(--ksp-text); font-family: inherit; font-size: 13px; font-weight: 600; letter-spacing: .01em; }
.ksp-cal-datebox input::-webkit-calendar-picker-indicator { position: absolute; inset: 0; width: auto; height: auto; margin: 0; opacity: 0; cursor: pointer; }
.ksp-cal-datebox:focus-within { border-color: #fda4af; box-shadow: 0 0 0 3px rgba(225, 29, 72, .12); }
.ksp-cal-bar__title { margin: 0 0 0 4px; font-size: 14px; font-weight: 800; letter-spacing: -.01em; color: var(--ksp-text); white-space: nowrap; }
.ksp-cal-bar__staff { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.ksp-cal-bar__staff > span { font-size: 13px; color: var(--ksp-muted); white-space: nowrap; }
.ksp-cal-bar__staff select { height: 34px; max-width: 250px; padding: 0 6px 0 10px; border: 1px solid var(--ksp-border); border-radius: 8px; background-color: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 13px; font-weight: 600; }
/* Select: tarayıcı varsayılan oku yerine Material expand_more (#78716c); tarih: calendar_today */
.ksp-cal-bar__staff select, select.ksp-cal-input { -webkit-appearance: none; appearance: none; padding-inline-end: 32px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2378716c'%3E%3Cpath d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 8px center; background-size: 20px; cursor: pointer; }
[dir="rtl"] .ksp-cal-bar__staff select, [dir="rtl"] select.ksp-cal-input { background-position: left 8px center; }
.ksp-cal-input[type="date"]::-webkit-calendar-picker-indicator { width: 18px; height: 18px; margin: 0; padding: 0; opacity: 1; cursor: pointer; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2378716c'%3E%3Cpath d='M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V10h16v11zm0-13H4V5h16v3z'/%3E%3C/svg%3E") center / 17px no-repeat; }
.ksp-cal-seg { display: inline-flex; gap: 2px; padding: 3px; border-radius: 10px; background: var(--ksp-surface-2); }
.ksp-cal-seg > a, .ksp-cal-seg > button { display: inline-flex; align-items: center; justify-content: center; height: 28px; padding: 0 12px; border: 0; border-radius: 8px; background: transparent; color: var(--cal-soft); font-size: 13px; font-weight: 600; white-space: nowrap; }
.ksp-cal-seg > :not(.is-active):hover { color: var(--ksp-text); }
.ksp-cal-seg > .is-active { background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 1px 3px rgba(28, 25, 23, .12); }
.ksp-cal-add { display: inline-flex; align-items: center; justify-content: center; gap: 4px; height: 34px; padding: 0 14px; border-radius: 10px; background: #e11d48; color: #fff; font-size: 13px; font-weight: 700; white-space: nowrap; box-shadow: 0 8px 16px -10px rgba(225, 29, 72, .8); }
.ksp-cal-add:hover { background: #be123c; color: #fff; }
.ksp-cal-add .material-symbols-rounded { font-size: 18px; }

/* Çizelge: 30 dk = 58px; saat kolonu sticky; kolon min 180px */
.ksp-cal-board, .ksp-cal-list { margin-top: 12px; background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; overflow: hidden; }
.ksp-cal-scroll { overflow-x: auto; overscroll-behavior-x: contain; }
.ksp-cal-grid { --cal-time: 80px; --cal-min: 180px; min-width: calc(var(--cal-time) + var(--cols) * var(--cal-min)); }
.ksp-cal-head, .ksp-cal-body { display: grid; grid-template-columns: var(--cal-time) repeat(var(--cols), minmax(var(--cal-min), 1fr)); }
.ksp-cal-head { height: 42px; background: var(--ksp-bg); border-bottom: 1px solid var(--ksp-border); }
.ksp-cal-head__time { position: sticky; left: 0; z-index: 6; display: grid; place-items: center; background: var(--ksp-bg); border-inline-end: 1px solid var(--ksp-border); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-cal-head__staff { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 0 10px; }
.ksp-cal-head__staff + .ksp-cal-head__staff { border-inline-start: 1px solid var(--cal-line); }
.ksp-cal-ava { width: 26px; height: 26px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: var(--staff, #ec003f) center / cover no-repeat; color: #fff; font-size: 10px; font-weight: 800; letter-spacing: .02em; }
.ksp-cal-head__who { flex: 1; display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.ksp-cal-head__who strong, .ksp-cal-head__who small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cal-head__who strong { font-size: 13px; font-weight: 700; color: var(--ksp-text); }
.ksp-cal-head__who small { font-size: 11px; color: var(--ksp-muted); }
.ksp-cal-head__count { min-width: 22px; height: 20px; padding: 0 6px; display: grid; place-items: center; border-radius: 999px; background: var(--ksp-surface-2); color: var(--cal-soft); font-size: 11px; font-weight: 800; }
.ksp-cal-body { position: relative; }
.ksp-cal-times { position: sticky; left: 0; z-index: 5; background: var(--ksp-surface); border-inline-end: 1px solid var(--ksp-border); }
.ksp-cal-time { height: 58px; display: grid; place-items: center; border-bottom: 1px solid var(--cal-line); font-size: 13px; font-weight: 500; color: var(--cal-soft); font-variant-numeric: tabular-nums; }
.ksp-cal-time.is-closed { color: #a8a29e; }
.ksp-cal-time.is-under-now { color: transparent; } /* şimdi hapı üstüne bindiğinde yarım rakam görünmesin */
.ksp-cal-col { position: relative; min-width: 0; transition: background .15s; }
.ksp-cal-col + .ksp-cal-col { border-inline-start: 1px solid var(--cal-line); }
.ksp-cal-col.is-over { background: rgba(225, 29, 72, .035); }
.ksp-cal-slot { display: grid; place-items: center; width: 100%; height: 58px; padding: 0; border: 0; border-bottom: 1px solid var(--cal-line); background: transparent; color: transparent; cursor: pointer; transition: background .12s, color .12s; }
.ksp-cal-slot .material-symbols-rounded { font-size: 20px; }
.ksp-cal-slot:hover, .ksp-cal-slot:focus-visible { background: #fff1f2; color: #e11d48; outline: 0; }
.ksp-cal-slot.is-off { cursor: default; background: repeating-linear-gradient(45deg, var(--cal-stripe) 0 6px, transparent 6px 12px) var(--ksp-bg); }
.ksp-cal-appt { --gap: 4px; --w: calc((100% - 12px - (var(--lanes) - 1) * var(--gap)) / var(--lanes)); position: absolute; z-index: 2; top: var(--top); height: var(--h); inset-inline-start: calc(6px + var(--lane) * (var(--w) + var(--gap))); width: var(--w); display: flex; flex-direction: column; gap: 1px; overflow: hidden; padding: 5px 8px; border-radius: 10px; border-inline-start: 4px solid var(--staff); background: #eff6ff; color: #1e40af; cursor: pointer; box-shadow: 0 1px 2px rgba(28, 25, 23, .06); transition: box-shadow .15s; }
.ksp-cal-appt:hover, .ksp-cal-appt:focus-visible { z-index: 3; outline: 0; box-shadow: 0 10px 20px -10px rgba(28, 25, 23, .45); }
.ksp-cal-appt[draggable="true"] { cursor: grab; }
.ksp-cal-appt.is-dragging { opacity: .45; }
.ksp-cal-appt { container-type: inline-size; }
.ksp-cal-appt__time { font-size: 11px; font-weight: 800; line-height: 1.25; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@container (max-width: 76px) { .ksp-cal-appt__to { display: none; } } /* dar şeritte (çakışan randevular) yalnız başlangıç saati */
.ksp-cal-appt__name, .ksp-cal-appt__svc { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cal-appt__name { font-size: 12.5px; font-weight: 800; line-height: 1.3; }
.ksp-cal-appt__svc { font-size: 11px; line-height: 1.3; opacity: .85; }
.ksp-cal-appt.is-pending { background: #fffbeb; color: #92400e; }
.ksp-cal-appt.is-completed { background: #ecfdf5; color: #065f46; }
.ksp-cal-appt.is-no_show { background: #f5f5f4; color: #57534e; }
.ksp-cal-appt.is-canceled { background: #fff1f2; color: #9f1239; opacity: .6; }
.ksp-cal-appt.is-canceled .ksp-cal-appt__time, .ksp-cal-appt.is-canceled .ksp-cal-appt__name, .ksp-cal-appt.is-canceled .ksp-cal-appt__svc { text-decoration: line-through; }
.ksp-cal-now { position: absolute; inset-inline: var(--cal-time) 0; z-index: 1; height: 2px; margin-top: -1px; background: #ef4444; pointer-events: none; }
.ksp-cal-now::before { content: ""; position: absolute; inset-inline-start: -4px; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: #ef4444; }
.ksp-cal-now__pill { position: absolute; left: 50%; z-index: 1; transform: translate(-50%, -50%); padding: 2px 8px; border-radius: 999px; background: #ef4444; color: #fff; font-size: 11px; font-weight: 700; line-height: 1.3; font-variant-numeric: tabular-nums; box-shadow: 0 4px 10px -4px rgba(239, 68, 68, .7); }
.ksp-cal-head__staff.is-orphan .ksp-cal-ava .material-symbols-rounded { font-size: 16px; }
.ksp-cal-head__staff.is-orphan .ksp-cal-head__who strong { color: var(--cal-soft); }
.ksp-cal-nostaff { display: flex; flex-direction: column; align-items: center; gap: .35rem; padding: 3rem 1rem; text-align: center; }
.ksp-cal-nostaff > .material-symbols-rounded { font-size: 36px; color: #d6d3d1; }
.ksp-cal-nostaff p { margin: 0 0 .4rem; font-size: .85rem; font-weight: 600; color: var(--cal-ink2); }
.ksp-cal-nostaff .ksp-cal-btn { height: 36px; font-size: 13px; }

/* Liste görünümü */
.ksp-cal-list__head, .ksp-cal-row { display: grid; grid-template-columns: 94px 4px minmax(0, 1.2fr) minmax(0, 1.5fr) minmax(0, 1fr) 84px 112px var(--cal-acts, 384px); align-items: center; column-gap: 12px; padding: 0 16px; }
.ksp-cal-list__head { height: 42px; background: var(--ksp-bg); border-bottom: 1px solid var(--ksp-border); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-cal-list__rows { list-style: none; margin: 0; padding: 0; }
.ksp-cal-row { min-height: 64px; padding-block: 10px; border-bottom: 1px solid var(--cal-line); transition: background .15s; }
.ksp-cal-row:last-child { border-bottom: 0; }
.ksp-cal-row:hover { background: var(--ksp-bg); }
.ksp-cal-row__time { display: flex; align-items: baseline; font-size: 14px; font-weight: 800; line-height: 1.2; color: var(--ksp-text); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ksp-cal-row__time small { font-size: 12.5px; font-weight: 600; color: #a8a29e; }
.ksp-cal-row__bar { align-self: stretch; min-height: 36px; border-radius: 4px; background: var(--staff); }
.ksp-cal-row__who { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 0; border: 0; background: none; text-align: start; }
.ksp-cal-row__who strong { max-width: 100%; font-size: 13.5px; font-weight: 700; color: var(--ksp-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color .15s; }
.ksp-cal-row__who small { font-size: 12px; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-cal-row__who:hover strong { color: #e11d48; }
.ksp-cal-row__svc, .ksp-cal-row__staff { min-width: 0; font-size: 13px; color: var(--cal-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cal-row__staff { color: var(--cal-soft); }
.ksp-cal-row__total { font-size: 14px; font-weight: 800; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-cal-row.is-canceled .ksp-cal-row__who strong, .ksp-cal-row.is-canceled .ksp-cal-row__total { color: #a8a29e; text-decoration: line-through; }
/* İşlem yuvaları sabit: Onayla | Tamamlandı | Gelmedi | İptal (izin yoksa boş yuva) → düğmeler satırlar arasında hizalı */
.ksp-cal-row__acts { display: grid; grid-template-columns: var(--cal-slots, 84px 112px 92px 72px); gap: 8px; justify-content: end; }
.ksp-cal-row__acts form { margin: 0; min-width: 0; }
.ksp-cal-row__acts .ksp-cal-act { width: 100%; }
.ksp-cal-row__slot { display: grid; place-items: center start; color: #a8a29e; }
.ksp-cal-status { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; background: #eff6ff; color: #1e40af; font-size: 12px; font-weight: 700; white-space: nowrap; }
.ksp-cal-status.is-pending { background: #fffbeb; color: #92400e; }
.ksp-cal-status.is-completed { background: #ecfdf5; color: #065f46; }
.ksp-cal-status.is-no_show { background: #f5f5f4; color: #57534e; }
.ksp-cal-status.is-canceled { background: #fff1f2; color: #be123c; }
.ksp-cal-act { display: inline-flex; align-items: center; justify-content: center; gap: 4px; height: 30px; padding: 0 10px; border: 1px solid var(--ksp-border); border-radius: 8px; background: var(--ksp-surface); color: var(--cal-ink2); font-size: 12px; font-weight: 700; white-space: nowrap; transition: filter .15s; }
.ksp-cal-act:hover { filter: brightness(.96); }
.ksp-cal-act:disabled { opacity: .55; }
.ksp-cal-act .material-symbols-rounded { font-size: 16px; }
.ksp-cal-act--confirmed { background: #eff6ff; border-color: #bfdbfe; color: #1d4ed8; }
.ksp-cal-act--completed { background: #ecfdf5; border-color: #a7f3d0; color: #047857; }
.ksp-cal-act--canceled { border-color: #fecdd3; color: #e11d48; }

/* Randevu detayı (offcanvas) */
.ksp-cal-detail { --bs-offcanvas-width: 400px; background: var(--ksp-surface); }
.ksp-cal-detail__head { align-items: flex-start; padding: 18px 20px; border-bottom: 1px solid var(--cal-line); }
.ksp-cal-detail__code { font-size: 12px; font-weight: 700; letter-spacing: .04em; color: #a8a29e; }
.ksp-cal-detail__head h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; font-weight: 800; }
.ksp-cal-detail__head h2 .material-symbols-rounded { font-size: 22px; color: #e11d48; }
.ksp-cal-close { width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--ksp-muted); }
.ksp-cal-close:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-cal-detail__body { display: flex; flex-direction: column; gap: 14px; padding: 18px 20px 28px; }
.ksp-cal-detail__who { display: flex; align-items: center; gap: 12px; }
.ksp-cal-ava--lg { width: 48px; height: 48px; border-radius: 14px; font-size: 16px; }
.ksp-cal-detail__who strong { display: block; margin-bottom: 4px; font-size: 17px; font-weight: 800; color: var(--ksp-text); }
.ksp-cal-detail__contact { display: flex; gap: 8px; }
.ksp-cal-detail__call, .ksp-cal-detail__wa { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 38px; border-radius: 10px; font-size: 13px; font-weight: 700; }
.ksp-cal-detail__call { border: 1px solid var(--ksp-border); color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-cal-detail__call:hover { border-color: #d6d3d1; color: var(--ksp-text); }
.ksp-cal-detail__wa { background: #059669; color: #fff; }
.ksp-cal-detail__wa:hover { background: #047857; color: #fff; }
.ksp-cal-detail__call .material-symbols-rounded, .ksp-cal-detail__wa .material-symbols-rounded { font-size: 18px; }
.ksp-cal-formula { margin: 0; padding: 8px 12px; border-radius: 10px; background: #fff1f2; color: #e11d48; font-size: 13px; font-weight: 600; }
.ksp-cal-detail__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; }
.ksp-cal-detail__meta > div { padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-bg); }
.ksp-cal-detail__meta dt { display: flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-cal-detail__meta dt .material-symbols-rounded { font-size: 15px; }
.ksp-cal-detail__meta dd { margin: 2px 0 0; font-size: 14px; font-weight: 700; color: var(--ksp-text); }
.ksp-cal-detail__h { margin: 4px 0 -6px; font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--cal-head); }
.ksp-cal-detail__items { list-style: none; margin: 0; padding: 0; border: 1px solid var(--ksp-border); border-radius: 12px; }
.ksp-cal-detail__items li { display: flex; justify-content: space-between; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--cal-line); font-size: 13px; font-weight: 600; }
.ksp-cal-detail__items li:last-child { border-bottom: 0; }
.ksp-cal-detail__items small { font-size: 12px; font-weight: 500; color: var(--ksp-muted); white-space: nowrap; }
.ksp-cal-detail__total { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; border: 1px solid #fecdd3; border-radius: 12px; background: linear-gradient(90deg, #fff1f2, #fff7ed); color: #1c1917; font-size: 13px; font-weight: 700; }
.ksp-cal-detail__total strong { font-size: 16px; font-weight: 800; color: #e11d48; }
.ksp-cal-detail__head .ksp-cal-close { margin: -4px -8px 0 auto; }
.ksp-cal-detail__note { margin: 12px 0 0; font-size: 13px; color: var(--cal-ink2); white-space: pre-line; }
.ksp-cal-detail__acts { display: flex; flex-wrap: wrap; gap: 8px; }
.ksp-cal-detail__acts .ksp-cal-act { flex: 1 1 calc(50% - 4px); height: 38px; font-size: 13px; } /* tek kalan düğme tam genişlik */
.ksp-cal-detail__locked { margin: 0; font-size: 13px; color: var(--ksp-muted); }
.ksp-cal-alert { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; border: 1px solid #fecdd3; border-radius: 12px; background: #fff1f2; color: #be123c; font-size: 13px; font-weight: 600; }
.ksp-cal-alert .material-symbols-rounded { font-size: 18px; }

/* Yeni Randevu modalı */
.ksp-cal-modal .modal-dialog { max-width: 760px; }
.ksp-cal-modal .modal-content { border: 0; border-radius: 16px; background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 30px 60px -20px rgba(28, 25, 23, .4); overflow: hidden; }
.ksp-cal-mhead { align-items: flex-start; gap: 12px; padding: 18px 22px; border-bottom: 1px solid #f0efee; }
.ksp-cal-mhead h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 20px; font-weight: 800; letter-spacing: -.02em; color: var(--ksp-text); }
.ksp-cal-mhead h2 .material-symbols-rounded { font-size: 24px; color: #e11d48; }
.ksp-cal-mhead p { margin: 4px 0 0; font-size: 13px; color: var(--cal-soft); }
.ksp-cal-mhead .ksp-cal-close { margin: -4px -8px 0 auto; }
.ksp-cal-mbody { display: flex; flex-direction: column; gap: 18px; padding: 18px 16px; }
.ksp-cal-sec { display: flex; flex-direction: column; gap: 12px; }
.ksp-cal-sec--soft { padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-bg); }
.ksp-cal-sec__head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 12px; }
.ksp-cal-sec__title { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 13px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--cal-head); }
.ksp-cal-sec__title .material-symbols-rounded { font-size: 18px; color: var(--cal-soft); }
.ksp-cal-sec__title .material-symbols-rounded.is-rose { color: #e11d48; }
.ksp-cal-link { display: inline-flex; align-items: center; gap: 2px; padding: 0; border: 0; background: none; color: #e11d48; font-size: 13px; font-weight: 700; }
.ksp-cal-link:hover { color: #be123c; text-decoration: underline; }
.ksp-cal-link .material-symbols-rounded { font-size: 17px; }
[data-mode="kayitli"] .ksp-cal-when-new, [data-mode="yeni"] .ksp-cal-when-saved { display: none !important; }
div.ksp-cal-when-saved { display: flex; flex-direction: column; gap: 10px; }
.ksp-cal-cols { display: grid; gap: 12px; }
.ksp-cal-cols--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ksp-cal-cols--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ksp-cal-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ksp-cal-label { margin: 0; font-size: 13px; color: var(--cal-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cal-label--sm { color: var(--cal-ink2); }
.ksp-cal-req { color: #e11d48; font-weight: 700; }
.ksp-cal-input { width: 100%; height: 36px; padding: 0 10px; border: 1px solid var(--ksp-border); border-radius: 8px; background-color: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 13.5px; }
.ksp-cal-input::placeholder { color: #a8a29e; }
.ksp-cal-input:focus { outline: 0; border-color: #fb7185; box-shadow: 0 0 0 3px rgba(225, 29, 72, .12); }
.ksp-cal-input--lg { height: 40px; border-radius: 10px; font-size: 14px; font-weight: 600; }
.ksp-cal-input--soft { border-color: #d6d3d1; font-weight: 500; }
select.ksp-cal-input.is-picked { border: 2px solid #e11d48; padding-inline-start: 9px; }
.ksp-cal-field:has(.ksp-cal-err:not(:empty)) .ksp-cal-input { border-color: #e11d48; }
.ksp-cal-err { margin: 0; font-size: 12px; font-weight: 600; color: #e11d48; }
.ksp-cal-err:empty { display: none; }
/* Müşteri araması ipucu ("En az 2 karakter yazın" / hız sınırı) — app.js */
.ksp-cal-hint { margin: 0; font-size: 12px; font-weight: 600; color: var(--ksp-muted); }
.ksp-cal-hint[hidden] { display: none; }
.ksp-cal-none { margin: 0; font-size: 13px; color: var(--cal-soft); }
.ksp-cal-picked { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 8px 12px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); }
.ksp-cal-picked__dot { width: 8px; height: 8px; flex-shrink: 0; border-radius: 50%; background: #10b981; }
.ksp-cal-picked strong { font-size: 13px; font-weight: 700; color: var(--ksp-text); white-space: nowrap; }
.ksp-cal-picked__phone { font-size: 13px; color: var(--ksp-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.ksp-cal-picked__formula { min-width: 0; margin-inline-start: auto; padding: 3px 8px; border-radius: 6px; background: #fff1f2; color: #e11d48; font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cal-newbox { display: flex; flex-direction: column; gap: 12px; padding: 12px; border: 1px solid #fbcfe8; border-radius: 12px; background: var(--ksp-surface); }
.ksp-cal-seg--sm > button { font-weight: 500; }
.ksp-cal-seg--sm > button.is-active { font-weight: 600; }
.ksp-cal-svcs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 6px; border: 1px solid var(--ksp-border); border-radius: 12px; }
.ksp-cal-svc { display: flex; flex-direction: column; justify-content: space-between; gap: 8px; min-height: 88px; margin: 0; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); cursor: pointer; transition: border-color .15s, background .15s, opacity .15s; }
.ksp-cal-svc:hover { border-color: #fda4af; }
.ksp-cal-svc:has(input:checked) { border-color: #f43f5e; background: #fff5f7; box-shadow: 0 0 0 .5px #f43f5e; }
.ksp-cal-svc.is-unavailable { opacity: .45; }
.ksp-cal-svc__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.ksp-cal-svc__name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 13.5px; font-weight: 600; line-height: 1.3; color: var(--ksp-text); }
.ksp-cal-svc .form-check-input { flex-shrink: 0; width: 18px; height: 18px; margin: 1px 0 0; border: 1.5px solid #d6d3d1; border-radius: 4px; cursor: pointer; }
.ksp-cal-svc .form-check-input:checked { background-color: #e11d48; border-color: #e11d48; }
.ksp-cal-svc .form-check-input:focus { border-color: #e11d48; box-shadow: 0 0 0 3px rgba(225, 29, 72, .18); }
.ksp-cal-svc__foot { position: relative; display: flex; align-items: center; gap: 6px; min-width: 0; padding-top: 8px; border-top: 1px solid var(--ksp-surface-2); }
.ksp-cal-svc__price { font-size: 14px; font-weight: 700; color: #e11d48; white-space: nowrap; }
/* "Personel vermiyor": ayraç çizgisinin üstünde etiket (akış dışı, kart yüksekliği sabit) */
.ksp-cal-svc__off { display: none; position: absolute; top: 0; inset-inline-start: 0; max-width: 100%; padding-inline-end: 6px; transform: translateY(-50%); background: var(--ksp-surface); font-size: 11px; font-weight: 600; line-height: 14px; color: #78716c; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cal-svc.is-unavailable .ksp-cal-svc__off { display: block; }
.ksp-cal-svc:has(input:checked) .ksp-cal-svc__off { background: #fff5f7; }
.ksp-cal-svc__dur { display: inline-flex; align-items: center; gap: 3px; margin-inline-start: auto; padding: 2px 7px; border-radius: 6px; background: var(--ksp-surface-2); color: var(--cal-soft); font-size: 12px; white-space: nowrap; }
.ksp-cal-svc__dur .material-symbols-rounded { font-size: 14px; }
.ksp-cal-sum { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border: 1px solid #fecdd3; border-radius: 12px; background: linear-gradient(90deg, #fff1f2, #fff7ed); color: #1c1917; }
.ksp-cal-sum__row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; min-width: 0; font-size: 13px; }
.ksp-cal-sum__row strong { font-weight: 700; }
.ksp-cal-sum__count { padding: 1px 9px; border: 1px solid #fda4af; border-radius: 999px; background: #fff; color: #e11d48; font-size: 12px; font-weight: 700; white-space: nowrap; }
.ksp-cal-sum__names, .ksp-cal-sum__none { min-width: 0; color: #78716c; }
.ksp-cal-sum__totals { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; font-size: 13px; color: #44403c; }
.ksp-cal-sum__totals > .material-symbols-rounded { font-size: 18px; color: #f59e0b; }
.ksp-cal-sum__box { padding: 3px 9px; border: 1px solid #e7e5e4; border-radius: 6px; background: #fff; color: #1c1917; font-size: 13px; font-weight: 700; white-space: nowrap; }
.ksp-cal-sum__box + span { margin-inline-start: 10px; }
.ksp-cal-sum__box--price { padding: 2px 10px; border-color: #fecdd3; border-radius: 8px; color: #e11d48; font-size: 16px; font-weight: 800; }
.ksp-cal-sum.is-empty .ksp-cal-sum__totals, .ksp-cal-foot.is-empty .ksp-cal-foot__total { opacity: .55; } /* hizmet seçilmemiş: toplamlar soluk, süre "—" */
.ksp-cal-staffs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ksp-cal-staff { container-type: inline-size; position: relative; display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 8px 10px; margin: 0; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.ksp-cal-staff:hover { border-color: #fda4af; }
.ksp-cal-staff:has(input:checked) { border-color: #f43f5e; box-shadow: 0 0 0 .5px #f43f5e; }
.ksp-cal-staff:has(input:focus-visible) { box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
.ksp-cal-staff__radio { position: absolute; opacity: 0; pointer-events: none; }
.ksp-cal-staff__ava { width: 40px; height: 40px; flex-shrink: 0; display: grid; place-items: center; border-radius: 10px; background: var(--staff) center / cover no-repeat; color: #fff; font-size: 14px; font-weight: 800; }
.ksp-cal-staff__body { display: flex; flex-direction: column; min-width: 0; }
.ksp-cal-staff__body strong, .ksp-cal-staff__body small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cal-staff__body strong { padding-inline-end: 18px; font-size: 14px; font-weight: 800; line-height: 1.3; color: var(--ksp-text); }
.ksp-cal-staff__body small { font-size: 12px; color: var(--ksp-muted); }
/* Mesai + Uzman hapları tek satır: dar kartta avatarın altından tam genişlik, geniş kartta ad sütununda */
.ksp-cal-staff__tags { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px; min-width: 0; }
@container (min-width: 260px) {
  .ksp-cal-staff__ava { grid-row: span 2; align-self: start; }
  .ksp-cal-staff__tags { grid-column: 2; margin-top: -2px; }
}
.ksp-cal-staff__check { position: absolute; top: 8px; inset-inline-end: 8px; font-size: 18px; color: #e11d48; font-variation-settings: 'FILL' 1; opacity: 0; transition: opacity .15s; }
.ksp-cal-staff:has(input:checked) .ksp-cal-staff__check { opacity: 1; }
.ksp-cal-tag { display: inline-flex; align-items: center; gap: 2px; padding: 1px 6px; border: 1px solid transparent; border-radius: 6px; font-size: 12px; white-space: nowrap; }
.ksp-cal-tag--shift { background: #ecfdf5; border-color: #a7f3d0; color: #047857; font-variant-numeric: tabular-nums; }
.ksp-cal-tag--off { background: #f5f5f4; border-color: #e7e5e4; color: #78716c; }
.ksp-cal-tag--star { background: #fffbeb; color: #b45309; font-weight: 700; }
.ksp-cal-tag--star .material-symbols-rounded { font-size: 13px; font-variation-settings: 'FILL' 1; }
.ksp-cal-end { display: flex; align-items: center; justify-content: space-between; gap: 6px; height: 40px; padding: 0 6px 0 12px; border: 1px solid #34d399; border-radius: 10px; background: #f0fdf4; }
.ksp-cal-end output { font-size: 15px; font-weight: 800; color: #065f46; font-variant-numeric: tabular-nums; }
.ksp-cal-end__lock { min-width: 0; padding: 2px 7px; border-radius: 6px; background: #d1fae5; color: #047857; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cal-foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: nowrap; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--ksp-border); background: var(--ksp-bg); }
.ksp-cal-foot > * { margin: 0; }
.ksp-cal-foot__total { display: flex; align-items: baseline; gap: 5px; font-size: 13px; color: var(--cal-soft); white-space: nowrap; }
.ksp-cal-foot__total strong { font-size: 15px; font-weight: 800; color: var(--ksp-text); }
.ksp-cal-foot__acts { display: flex; align-items: center; gap: 8px; }
.ksp-cal-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 42px; padding: 0 16px; border: 0; border-radius: 10px; font-size: 14px; font-weight: 700; white-space: nowrap; transition: background .15s, opacity .15s; }
.ksp-cal-btn .material-symbols-rounded { font-size: 18px; }
.ksp-cal-btn:disabled { opacity: .6; pointer-events: none; }
.ksp-cal-btn--ghost { order: 1; padding: 0 10px; background: transparent; color: var(--cal-ink2); font-weight: 600; }
.ksp-cal-btn--ghost:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-cal-btn--wa { order: 2; background: #059669; color: #fff; }
.ksp-cal-btn--wa:hover { background: #047857; color: #fff; }
.ksp-cal-btn--dark { order: 3; background: #1c1917; color: #fff; }
.ksp-cal-btn--dark:hover { background: #292524; color: #fff; }
[data-bs-theme="dark"] .ksp-cal-btn--dark { background: #fafaf9; color: #1c1917; }
[data-bs-theme="dark"] .ksp-cal-mhead { border-color: var(--ksp-border); }
[data-bs-theme="dark"] .ksp-cal-svc:has(input:checked) { background: rgba(244, 63, 94, .12); }
[data-bs-theme="dark"] .ksp-cal-svc:has(input:checked) .ksp-cal-svc__off { background: color-mix(in srgb, #f43f5e 12%, var(--ksp-surface)); }
/* Koyu tema: seçilen hizmet özeti ve hesaplanan bitiş saati parlak açık kutu olarak kalmasın */
[data-bs-theme="dark"] .ksp-cal-sum { border-color: rgba(244, 63, 94, .3); background: linear-gradient(90deg, rgba(244, 63, 94, .12), rgba(249, 115, 22, .08)); color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-cal-sum__count, [data-bs-theme="dark"] .ksp-cal-sum__box { border-color: var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-cal-sum__count, [data-bs-theme="dark"] .ksp-cal-sum__box--price { color: #fb7185; }
[data-bs-theme="dark"] .ksp-cal-sum__names, [data-bs-theme="dark"] .ksp-cal-sum__none, [data-bs-theme="dark"] .ksp-cal-sum__totals { color: var(--ksp-muted); }
[data-bs-theme="dark"] .ksp-cal-end { border-color: rgba(52, 211, 153, .4); background: rgba(16, 185, 129, .1); }
[data-bs-theme="dark"] .ksp-cal-end output { color: #6ee7b7; }
[data-bs-theme="dark"] .ksp-cal-end__lock { background: rgba(16, 185, 129, .18); color: #a7f3d0; }
@media (max-width: 1199.98px) {
  .ksp-cal-row__acts .ksp-cal-act span:not(.material-symbols-rounded) { display: none; }
  .ksp-cal-row__acts .ksp-cal-act { width: 30px; padding: 0; }
  .ksp-cal-list { --cal-acts: 144px; --cal-slots: repeat(4, 30px); }
}
@media (max-width: 991.98px) {
  .ksp-cal-list__head { display: none; }
  .ksp-cal-row { grid-template-columns: 48px 4px minmax(0, 1fr) auto; grid-template-areas: "time bar who status" "time bar svc total" "time bar staff acts"; row-gap: 4px; }
  .ksp-cal-row__time { grid-area: time; align-self: start; flex-direction: column; align-items: flex-start; }
  .ksp-cal-row__sep { display: none; }
  .ksp-cal-row__bar { grid-area: bar; }
  .ksp-cal-row__who { grid-area: who; }
  .ksp-cal-row__svc { grid-area: svc; }
  .ksp-cal-row__staff { grid-area: staff; font-size: 12px; }
  .ksp-cal-row__total { grid-area: total; text-align: end; }
  .ksp-cal-row__status { grid-area: status; text-align: end; }
  .ksp-cal-row__acts { grid-area: acts; }
}
@media (max-width: 767.98px) {
  .ksp-cal-bar { padding: 10px; }
  .ksp-cal-bar__title { flex-basis: 100%; margin: 0; }
  .ksp-cal-bar__end { width: 100%; margin: 0; }
  .ksp-cal-bar__staff { flex: 1 1 100%; }
  .ksp-cal-bar__staff select { flex: 1; max-width: none; }
  .ksp-cal-seg, .ksp-cal-add { flex: 1 1 auto; }
  .ksp-cal-bar .ksp-cal-seg > a { flex: 1; }
  .ksp-cal-grid { --cal-time: 56px; }
  .ksp-cal-time { font-size: 12px; }
  .ksp-cal-head__time { font-size: 10px; letter-spacing: .02em; }
  .ksp-cal-cols--2, .ksp-cal-cols--3, .ksp-cal-staffs { grid-template-columns: minmax(0, 1fr); }
  .ksp-cal-svcs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-cal-sum__totals { justify-content: flex-start; }
}
@media (max-width: 575.98px) {
  .ksp-cal-modal .modal-content { border-radius: 0; }
  .ksp-cal-mhead { padding: 14px 16px; }
  .ksp-cal-mhead h2 { font-size: 18px; }
  .ksp-cal-mbody { padding: 14px 12px; }
  .ksp-cal-sec--soft { padding: 12px; }
  .ksp-cal-picked { flex-wrap: wrap; }
  .ksp-cal-picked__formula { flex-basis: 100%; margin: 0; }
  /* Alt çubuk: 1. satır toplam + Vazgeç (küçük metin düğme), 2. satır WhatsApp | Oluştur */
  .ksp-cal-foot { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 8px 12px calc(10px + env(safe-area-inset-bottom)); }
  .ksp-cal-foot__acts { display: contents; }
  .ksp-cal-foot__total { grid-area: 1 / 1 / 2 / 3; align-self: center; min-width: 0; padding-inline-end: 84px; }
  .ksp-cal-btn--ghost { grid-area: 1 / 2; justify-self: end; height: 32px; padding: 0 8px; font-size: 13px; }
  .ksp-cal-btn--wa { grid-area: 2 / 1; }
  .ksp-cal-btn--dark { grid-area: 2 / 2; }
  .ksp-cal-btn--wa, .ksp-cal-btn--dark { min-width: 0; padding: 0 10px; font-size: 13px; }
  .ksp-cal-btn--wa .ksp-cal-btn__long { display: none; } /* yarım genişlikte uzun metin taşıyordu */
  .ksp-cal-btn--wa .ksp-cal-btn__short { display: inline; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ksp-cal-detail { --bs-offcanvas-width: 100%; }
}
.ksp-cal-btn__short { display: none; }
@media (max-width: 400px) { .ksp-cal-svcs { grid-template-columns: minmax(0, 1fr); } }

/* @kokpit-musteri — Salon Kokpiti > Müşteri CRM & Boya Kartları (views/panels/tenant/customers.php) */
.ksp-cus {
  --cus-line: #f0efee; --cus-soft: #57534e; --cus-ink2: #44403c; --cus-head: #292524; --cus-rose: #e11d48; --cus-rose-ink: #be123c;
  --cus-f-bg: #fce7f3; --cus-f-ink: #be185d; --cus-f-pill: #fdf2f8; --cus-f-line: #fbcfe8;
  --cus-m-bg: #e0f2fe; --cus-m-ink: #0369a1; --cus-m-pill: #f0f9ff; --cus-m-line: #bae6fd;
  --cus-formula-bg: #fff1f2; --cus-formula-line: #ffe4e6; --cus-tech-bg: #fff5f7; --cus-tech-line: #fecdd3;
  --cus-hero: linear-gradient(90deg, #fff5f7, #fff);
}
[data-bs-theme="dark"] .ksp-cus {
  --cus-line: rgba(255, 255, 255, .07); --cus-soft: #d6d3d1; --cus-ink2: #e7e5e4; --cus-head: #f5f5f4; --cus-rose: #fb7185; --cus-rose-ink: #fda4af;
  --cus-f-bg: rgba(236, 72, 153, .2); --cus-f-ink: #f9a8d4; --cus-f-pill: rgba(236, 72, 153, .12); --cus-f-line: rgba(236, 72, 153, .35);
  --cus-m-bg: rgba(14, 165, 233, .2); --cus-m-ink: #7dd3fc; --cus-m-pill: rgba(14, 165, 233, .12); --cus-m-line: rgba(14, 165, 233, .35);
  --cus-formula-bg: rgba(244, 63, 94, .1); --cus-formula-line: rgba(244, 63, 94, .25); --cus-tech-bg: rgba(244, 63, 94, .08); --cus-tech-line: rgba(244, 63, 94, .3);
  --cus-hero: linear-gradient(90deg, rgba(244, 63, 94, .13), rgba(244, 63, 94, 0));
}
.ksp-cus [hidden] { display: none !important; }

/* Başlık kartı */
.ksp-cus-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 16px; padding: 16px 20px; background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; }
.ksp-cus-head__text { min-width: 0; }
.ksp-cus-head__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; font-weight: 800; letter-spacing: 0; line-height: 1.3; color: var(--ksp-text); }
.ksp-cus-head__title .material-symbols-rounded { font-size: 22px; color: var(--cus-rose); }
.ksp-cus-head__lead { margin: 3px 0 0; font-size: 12.5px; color: var(--ksp-muted); }
.ksp-cus-head__acts { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-inline-start: auto; } /* tablette alt satıra inse de sağda */
.ksp-cus-seg { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface-2); }
.ksp-cus-seg > a { display: inline-flex; align-items: center; justify-content: center; height: 28px; padding: 0 12px; border-radius: 7px; color: var(--cus-soft); font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.ksp-cus-seg > a:hover { color: var(--ksp-text); }
.ksp-cus-seg > a.is-active { background: var(--ksp-surface); color: var(--ksp-text); font-weight: 700; box-shadow: 0 1px 3px rgba(28, 25, 23, .12); }
.ksp-cus-add { display: inline-flex; align-items: center; justify-content: center; gap: 4px; height: 36px; padding: 0 14px; border-radius: 10px; background: #ec003f; color: #fff; font-size: 13px; font-weight: 700; white-space: nowrap; box-shadow: 0 8px 16px -10px rgba(236, 0, 63, .8); }
.ksp-cus-add:hover { background: #c70036; color: #fff; }
.ksp-cus-add .material-symbols-rounded { font-size: 18px; }

/* İki sütun: liste (360px) + detay */
.ksp-cus-grid { display: grid; grid-template-columns: 360px minmax(0, 1fr); align-items: start; gap: 14px; margin-top: 14px; }
/* Sol sütun yapışkan (üst bar 68 + sekmeler 56): uzun geçmişte liste görünür kalır; liste yüksekliği görünüme göre */
.ksp-cus-side { position: sticky; top: 140px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ksp-cus-search { position: relative; margin: 0; }
.ksp-cus-search > .material-symbols-rounded { position: absolute; top: 50%; inset-inline-start: 12px; transform: translateY(-50%); font-size: 20px; color: #a8a29e; pointer-events: none; }
.ksp-cus-search input { width: 100%; height: 40px; padding: 0 12px; padding-inline-start: 40px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 13.5px; }
.ksp-cus-search input::placeholder { color: #a8a29e; }
.ksp-cus-search input:focus { outline: 0; border-color: #fb7185; box-shadow: 0 0 0 3px rgba(225, 29, 72, .12); }
.ksp-cus-list { max-height: max(360px, calc(100vh - 212px)); overflow-y: auto; overscroll-behavior: contain; margin-inline-end: -6px; padding: 2px 6px 8px 0; scrollbar-width: thin; scrollbar-color: #d6d3d1 transparent; transition: opacity .15s; }
.ksp-cus-list::-webkit-scrollbar { width: 6px; }
.ksp-cus-list::-webkit-scrollbar-thumb { border-radius: 6px; background: #d6d3d1; }
.ksp-cus-list.is-loading, .ksp-cus-main.is-loading { opacity: .55; pointer-events: none; }
.ksp-cus-items { display: flex; flex-direction: column; gap: 10px; }

/* Müşteri kartı */
.ksp-cus-card { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); color: var(--ksp-text); transition: border-color .15s, box-shadow .15s; }
.ksp-cus-card:hover { border-color: #fda4af; color: var(--ksp-text); }
.ksp-cus-card:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
/* Seçili: 1px kenarlık + iç yarı saydam halka ≈ 1.5px (1x DPR'de 1.5px kenarlık 1px'e yuvarlanıyordu); ölçü normal kartla aynı */
.ksp-cus-card.is-selected { border-color: #f43f5e; box-shadow: inset 0 0 0 1px rgba(244, 63, 94, .5), 0 10px 20px -12px rgba(244, 63, 94, .55); }
.ksp-cus-card__top { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ksp-cus-ava { width: 30px; height: 30px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: var(--ksp-surface-2); color: var(--cus-soft); font-size: 13px; font-weight: 800; }
.ksp-cus-card.is-female .ksp-cus-ava { background: var(--cus-f-bg); color: var(--cus-f-ink); }
.ksp-cus-card.is-male .ksp-cus-ava { background: var(--cus-m-bg); color: var(--cus-m-ink); }
.ksp-cus-card__who { flex: 1; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.ksp-cus-card__line { display: flex; align-items: center; gap: 6px; min-width: 0; }
.ksp-cus-card__name { min-width: 0; font-size: 14px; font-weight: 800; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cus-card__phone { font-size: 12px; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-cus-card__sum { display: flex; flex-direction: column; align-items: flex-end; flex-shrink: 0; line-height: 1.3; }
.ksp-cus-card__sum strong { font-size: 14px; font-weight: 800; font-variant-numeric: tabular-nums; }
.ksp-cus-card__sum small { font-size: 11px; color: #a8a29e; }
.ksp-cus-pill { flex-shrink: 0; display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border: 1px solid var(--ksp-border); border-radius: 999px; font-size: 11px; font-weight: 700; line-height: 1; white-space: nowrap; }
.ksp-cus-pill.is-female { background: var(--cus-f-pill); border-color: var(--cus-f-line); color: var(--cus-f-ink); }
.ksp-cus-pill.is-male { background: var(--cus-m-pill); border-color: var(--cus-m-line); color: var(--cus-m-ink); }
.ksp-cus-card__formula { display: flex; align-items: center; gap: 5px; min-width: 0; padding: 5px 8px; border: 1px solid var(--cus-formula-line); border-radius: 8px; background: var(--cus-formula-bg); color: var(--cus-rose-ink); font-size: 12px; line-height: 1.35; }
.ksp-cus-card__formula .material-symbols-rounded { flex-shrink: 0; font-size: 14px; color: #f43f5e; }
.ksp-cus-card__formula > span:last-child { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cus-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 8px; border-top: 1px solid var(--ksp-surface-2); font-size: 12px; color: var(--ksp-muted); }
.ksp-cus-card__foot > span:first-child { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cus-card__go { display: inline-flex; align-items: center; gap: 2px; flex-shrink: 0; font-weight: 700; color: var(--cus-rose); }
.ksp-cus-card__go .material-symbols-rounded { font-size: 14px; transition: transform .15s; }
.ksp-cus-card:hover .ksp-cus-card__go .material-symbols-rounded { transform: translateX(2px); }
.ksp-cus-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 34px 16px; border: 1px dashed #d6d3d1; border-radius: 14px; background: var(--ksp-surface); text-align: center; }
.ksp-cus-empty > .material-symbols-rounded { font-size: 34px; color: #d6d3d1; }
.ksp-cus-empty strong { font-size: 14px; font-weight: 800; color: var(--ksp-text); }
.ksp-cus-empty p { max-width: 280px; margin: 0 0 6px; font-size: 12.5px; color: var(--ksp-muted); }
.ksp-cus-more { display: flex; align-items: center; justify-content: center; gap: 4px; height: 36px; margin-top: 10px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--cus-ink2); font-size: 13px; font-weight: 700; }
.ksp-cus-more:hover { border-color: #fda4af; color: var(--cus-rose); }
.ksp-cus-more .material-symbols-rounded { font-size: 18px; }

/* Detay kartı */
.ksp-cus-detail { background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; overflow: hidden; }
.ksp-cus-dhead { display: flex; align-items: center; gap: 14px; padding: 18px 20px; background: var(--cus-hero); }
.ksp-cus-dava { width: 52px; height: 52px; flex-shrink: 0; display: grid; place-items: center; border-radius: 14px; background: linear-gradient(135deg, #ff2056, #f472b6); color: #fff; font-size: 20px; font-weight: 800; box-shadow: 0 10px 20px -12px rgba(255, 32, 86, .8); }
.ksp-cus-dhead__who { flex: 1; min-width: 0; }
.ksp-cus-dhead__line { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; }
.ksp-cus-dhead__line h2 { min-width: 0; margin: 0; font-size: 20px; font-weight: 800; letter-spacing: 0; line-height: 1.3; color: var(--ksp-text); overflow-wrap: anywhere; }
.ksp-cus-dhead__contact { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 5px 0 0; font-size: 12.5px; color: var(--cus-soft); }
.ksp-cus-dhead__contact > span { display: inline-flex; align-items: center; gap: 4px; min-width: 0; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ksp-cus-dhead__contact .material-symbols-rounded { font-size: 15px; color: #a8a29e; }
.ksp-cus-dhead__acts { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.ksp-cus-sq { width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--cus-ink2); transition: border-color .15s, background .15s; }
.ksp-cus-sq:hover { border-color: #d6d3d1; color: var(--ksp-text); }
.ksp-cus-sq .material-symbols-rounded { font-size: 18px; }
.ksp-cus-sq--wa { border-color: #a7f3d0; background: #ecfdf5; color: #059669; }
.ksp-cus-sq--wa:hover { border-color: #6ee7b7; background: #d1fae5; color: #047857; }
.ksp-cus-book { display: inline-flex; align-items: center; justify-content: center; gap: 4px; height: 34px; padding: 0 14px; border-radius: 10px; background: #1c1917; color: #fff; font-size: 13px; font-weight: 700; white-space: nowrap; }
.ksp-cus-book:hover { background: #292524; color: #fff; }
.ksp-cus-book .material-symbols-rounded { font-size: 18px; }
.ksp-cus-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; border-block: 1px solid var(--cus-line); }
.ksp-cus-stats > div { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 2px; min-width: 0; padding: 12px; text-align: center; }
.ksp-cus-stats > div + div { border-inline-start: 1px solid var(--cus-line); }
.ksp-cus-stats dt { font-size: 12px; font-weight: 500; color: var(--ksp-muted); }
.ksp-cus-stats dd { margin: 0; font-size: 16px; font-weight: 800; line-height: 1.4; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-cus-stats dd.is-money { color: var(--cus-rose); }
.ksp-cus-stats dd.is-date { font-size: 14px; font-weight: 700; line-height: 1.6; } /* satır kutusu 16px × 1.4 ile aynı: üç sütun aynı hizada */
.ksp-cus-sec { padding: 16px 20px; }
.ksp-cus-tech { border-bottom: 1px solid var(--cus-line); }
.ksp-cus-sec__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.ksp-cus-sec__title { display: flex; align-items: center; gap: 6px; min-width: 0; margin: 0; font-size: 12.5px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; color: var(--cus-head); }
.ksp-cus-sec__title .material-symbols-rounded { font-size: 18px; color: var(--cus-soft); }
.ksp-cus-tech .ksp-cus-sec__title { color: var(--cus-rose-ink); }
.ksp-cus-tech .ksp-cus-sec__title .material-symbols-rounded { color: var(--cus-rose); }
.ksp-cus-link { flex-shrink: 0; padding: 0; border: 0; background: none; color: var(--cus-rose); font-size: 12.5px; font-weight: 700; }
.ksp-cus-link:hover { color: var(--cus-rose-ink); text-decoration: underline; }
.ksp-cus-formula { margin: 0; padding: 10px 12px; border: 1px solid var(--cus-tech-line); border-radius: 10px; background: var(--cus-tech-bg); color: var(--ksp-text); font-size: 13px; line-height: 1.6; white-space: pre-line; overflow-wrap: anywhere; }
.ksp-cus-formula.is-empty { color: var(--ksp-muted); }
.ksp-cus-note { margin: 10px 0 0; padding: 8px 12px; border-radius: 8px; background: var(--ksp-bg); color: var(--ksp-muted); font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.ksp-cus-note b { margin-inline-end: 4px; font-weight: 700; color: var(--cus-soft); }
/* @musteri-kendi-karti — müşterinin Profilim'de doldurduğu Güzellik & Saç Kartı (salt okuma, KARARLAR §31) */
.ksp-cus-beauty { border-bottom: 1px solid var(--cus-line); }
.ksp-cus-beauty .ksp-cus-sec__title .material-symbols-rounded { color: #d97706; }
.ksp-cus-beauty__date { flex-shrink: 0; font-size: 12px; font-weight: 700; color: var(--ksp-muted); }
.ksp-cus-beauty__lead { margin: 0 0 10px; font-size: 12px; line-height: 1.5; color: var(--ksp-muted); }
.ksp-cus-beauty__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-cus-beauty__list li { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; border: 1px solid var(--ksp-border); border-radius: 10px; }
.ksp-cus-beauty__list span { font-size: 11px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-cus-beauty__list b { font-size: 13px; font-weight: 700; line-height: 1.45; color: var(--ksp-text); overflow-wrap: anywhere; }
.ksp-cus-beauty__warn, .ksp-cus-beauty__note { display: flex; align-items: flex-start; gap: 8px; margin: 10px 0 0; padding: 9px 12px; border: 1px solid transparent; border-radius: 10px; font-size: 12.5px; line-height: 1.55; overflow-wrap: anywhere; }
.ksp-cus-beauty__warn { border-color: #fde68a; background: var(--ksp-amber-50); color: #92400e; }
.ksp-cus-beauty__note { border-color: var(--cus-tech-line); background: var(--cus-tech-bg); color: var(--ksp-text); }
.ksp-cus-beauty__warn .material-symbols-rounded, .ksp-cus-beauty__note .material-symbols-rounded { flex-shrink: 0; font-size: 18px; }
.ksp-cus-beauty__note .material-symbols-rounded { color: var(--cus-rose); }
[data-bs-theme="dark"] .ksp-cus-beauty .ksp-cus-sec__title .material-symbols-rounded { color: #fbbf24; }
[data-bs-theme="dark"] .ksp-cus-beauty__warn { border-color: rgba(245, 158, 11, .35); color: #fcd34d; }
.ksp-cus-visits { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-cus-visit { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid var(--ksp-border); border-radius: 12px; }
.ksp-cus-visit__body { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ksp-cus-visit p { margin: 0; }
.ksp-cus-visit__l1 { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 6px; font-size: 12.5px; color: var(--cus-soft); font-variant-numeric: tabular-nums; }
.ksp-cus-visit__l1 strong { font-size: 13px; font-weight: 800; color: var(--ksp-text); }
.ksp-cus-visit__l2 { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 12.5px; color: var(--cus-ink2); }
.ksp-cus-visit__l2 .material-symbols-rounded { flex-shrink: 0; font-size: 15px; color: #f43f5e; }
.ksp-cus-visit__l3 { font-size: 12px; color: var(--ksp-muted); }
.ksp-cus-visit__l3:empty { display: none; }
.ksp-cus-visit__l3 em { color: var(--cus-rose); overflow-wrap: anywhere; }
.ksp-cus-visit__l3 span + em { margin-inline-start: 4px; }
.ksp-cus-visit__total { flex-shrink: 0; font-size: 15px; font-weight: 800; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-cus-status { display: inline-flex; align-items: center; height: 20px; margin-inline-start: 2px; padding: 0 8px; border-radius: 999px; background: #eff6ff; color: #1d4ed8; font-size: 11px; font-weight: 700; white-space: nowrap; }
.ksp-cus-status.is-completed { background: #ecfdf5; color: #047857; }
.ksp-cus-status.is-pending { background: #fffbeb; color: #b45309; }
.ksp-cus-status.is-canceled { background: #fff1f2; color: #be123c; }
.ksp-cus-status.is-no_show { background: #f5f5f4; color: #57534e; }
.ksp-cus-nohist, .ksp-cus-pick { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 22px 16px; border: 1px dashed var(--ksp-border); border-radius: 12px; text-align: center; }
.ksp-cus-nohist p { margin: 0; font-size: 13px; color: var(--ksp-muted); }
/* KVKK araçları — müşteri kartı (Color Lounge Aşama 9c, KARARLAR §82.9c) */
.ksp-cus-kvkk { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 12px; }
.ksp-cus-kvkk__title { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 14px; font-weight: 800; }
.ksp-cus-kvkk__lead { margin: 0; font-size: 12px; color: var(--ksp-muted); line-height: 1.5; }
.ksp-cus-kvkk__acts { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ksp-cus-kvkk__acts form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0; }
.ksp-cus-kvkk__btn { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 10px; background: transparent; color: var(--ksp-text); font-size: 13px; font-weight: 700; }
.ksp-cus-kvkk__btn.is-danger { border-color: #fecdd3; color: #be123c; }
.ksp-cus-kvkk__onay { width: 96px; height: 34px; padding: 0 10px; border: 1px solid var(--ksp-border); border-radius: 10px; background: transparent; color: var(--ksp-text); font-size: 13px; }.ksp-cus-pick { justify-content: center; min-height: 360px; border-style: solid; border-radius: 16px; background: var(--ksp-surface); }
.ksp-cus-pick > .material-symbols-rounded { font-size: 40px; color: #d6d3d1; }
.ksp-cus-pick strong { font-size: 15px; font-weight: 800; color: var(--ksp-text); }
.ksp-cus-pick p { max-width: 340px; margin: 0; font-size: 13px; color: var(--ksp-muted); }

/* Düzenle / Yeni müşteri modalı */
.ksp-cus-modal .modal-dialog { max-width: 460px; }
.ksp-cus-modal .modal-content { border: 0; border-radius: 16px; background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 30px 60px -20px rgba(28, 25, 23, .4); overflow: hidden; }
.ksp-cus-mhead { gap: 10px; padding: 18px 22px 14px; border-bottom: 1px solid var(--cus-line); }
.ksp-cus-mhead h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; font-weight: 800; letter-spacing: 0; color: var(--ksp-text); }
.ksp-cus-mhead h2 .material-symbols-rounded { font-size: 22px; color: #e11d48; }
.ksp-cus-modal[data-mode="edit"] [data-cus-title="new"], .ksp-cus-modal[data-mode="new"] [data-cus-title="edit"], .ksp-cus-modal[data-mode="new"] .ksp-cus-del { display: none; }
.ksp-cus-mclose { width: 32px; height: 32px; flex-shrink: 0; display: grid; place-items: center; margin: -4px -8px -4px auto; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--ksp-muted); }
.ksp-cus-mclose:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-cus-mbody { display: flex; flex-direction: column; gap: 12px; padding: 16px 22px; }
.ksp-cus-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ksp-cus-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ksp-cus-label { display: flex; align-items: center; gap: 4px; margin: 0; font-size: 13px; color: var(--cus-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-cus-label b { color: #e11d48; font-weight: 700; }
.ksp-cus-label--rose { font-weight: 700; color: #e11d48; }
.ksp-cus-label--rose .material-symbols-rounded { font-size: 17px; }
.ksp-cus-input { width: 100%; height: 40px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 10px; background-color: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 14px; }
.ksp-cus-input::placeholder { color: #a8a29e; }
.ksp-cus-input:focus { outline: 0; border-color: #fb7185; box-shadow: 0 0 0 3px rgba(225, 29, 72, .12); }
select.ksp-cus-input { -webkit-appearance: none; appearance: none; padding-inline-end: 34px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2378716c'%3E%3Cpath d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; background-size: 20px; cursor: pointer; }
[dir="rtl"] select.ksp-cus-input { background-position: left 10px center; }
.ksp-cus-input--formula { height: auto; min-height: 84px; padding: 9px 12px; border-color: var(--cus-tech-line); background-color: var(--cus-tech-bg); line-height: 1.5; resize: vertical; }
.ksp-cus-field:has(.ksp-cus-err:not(:empty)) .ksp-cus-input { border-color: #e11d48; }
.ksp-cus-err { margin: 0; font-size: 12px; color: #e11d48; }
.ksp-cus-err:empty { display: none; }
.ksp-cus-alert { display: flex; align-items: flex-start; gap: 8px; padding: 9px 12px; border: 1px solid #fecdd3; border-radius: 10px; background: #fff1f2; color: #be123c; font-size: 13px; font-weight: 600; }
.ksp-cus-alert .material-symbols-rounded { font-size: 18px; }
.ksp-cus-mfoot { flex-wrap: nowrap; justify-content: space-between; gap: 10px; padding: 14px 22px 18px; border-top: 1px solid var(--cus-line); }
.ksp-cus-mfoot > * { margin: 0; }
.ksp-cus-del { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: none; color: #e11d48; font-size: 13px; font-weight: 600; white-space: nowrap; }
.ksp-cus-del:hover { color: #be123c; text-decoration: underline; }
.ksp-cus-del .material-symbols-rounded { font-size: 17px; }
.ksp-cus-mfoot__acts { display: flex; align-items: center; gap: 6px; margin-inline-start: auto; }
.ksp-cus-cancel { height: 38px; padding: 0 12px; border: 0; border-radius: 10px; background: transparent; color: var(--cus-soft); font-size: 14px; font-weight: 600; }
.ksp-cus-cancel:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-cus-save { height: 38px; padding: 0 18px; border: 0; border-radius: 10px; background: #1c1917; color: #fff; font-size: 14px; font-weight: 700; }
.ksp-cus-save:hover { background: #292524; }
.ksp-cus-save:disabled, .ksp-cus-del:disabled { opacity: .6; pointer-events: none; }

/* Koyu tema: sabit açık renkli yüzeyler */
[data-bs-theme="dark"] .ksp-cus-book, [data-bs-theme="dark"] .ksp-cus-save { background: #fafaf9; color: #1c1917; }
[data-bs-theme="dark"] .ksp-cus-sq--wa { border-color: rgba(16, 185, 129, .35); background: rgba(16, 185, 129, .12); color: #34d399; }
[data-bs-theme="dark"] .ksp-cus-status { background: rgba(59, 130, 246, .16); color: #93c5fd; }
[data-bs-theme="dark"] .ksp-cus-status.is-completed { background: rgba(16, 185, 129, .15); color: #6ee7b7; }
[data-bs-theme="dark"] .ksp-cus-status.is-pending { background: rgba(245, 158, 11, .15); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-cus-status.is-canceled { background: rgba(244, 63, 94, .15); color: #fda4af; }
[data-bs-theme="dark"] .ksp-cus-status.is-no_show { background: rgba(255, 255, 255, .08); color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-cus-alert { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .12); color: #fda4af; }
[data-bs-theme="dark"] .ksp-cus-list { scrollbar-color: #57534e transparent; }
[data-bs-theme="dark"] .ksp-cus-empty { border-color: var(--ksp-border); }
[data-bs-theme="dark"] .ksp-cus-note { background: var(--ksp-surface-2); } /* koyu kartta "delik" gibi durmasın */

@media (max-width: 991.98px) {
  .ksp-cus-grid { grid-template-columns: minmax(0, 1fr); }
  .ksp-cus-side { position: static; }
  /* Tek sütun: iç kaydırma yok (sayfa akışı + "Daha fazla göster"); parmak listedeyken sayfa kilitlenmez, kart kesik bitmez */
  .ksp-cus-list { max-height: none; overflow: visible; overscroll-behavior: auto; margin-inline-end: 0; padding: 0; }
  .ksp-cus-main { scroll-margin-top: calc(var(--ksp-topbar-h) + 12px); }
}
@media (max-width: 767.98px) {
  .ksp-cus-head { padding: 14px 16px; }
  .ksp-cus-head__acts { width: 100%; }
  .ksp-cus-seg { flex: 1 1 auto; }
  .ksp-cus-seg > a { flex: 1; padding: 0 8px; }
  .ksp-cus-add { flex: 1 1 auto; }
  .ksp-cus-dhead { flex-wrap: wrap; padding: 16px; }
  .ksp-cus-dhead__acts { width: 100%; }
  .ksp-cus-dhead__acts .ksp-cus-book { flex: 1; }
  .ksp-cus-sec { padding: 14px 16px; }
  .ksp-cus-stats > div { padding: 10px 6px; }
  .ksp-cus-stats dd { font-size: 15px; }
  .ksp-cus-stats dd.is-date { font-size: 13px; }
  .ksp-cus-visit { align-items: flex-start; padding: 10px 12px; }
}
@media (max-width: 575.98px) {
  .ksp-cus-mhead { padding: 16px 16px 12px; }
  .ksp-cus-mbody { padding: 14px 16px; }
  .ksp-cus-mfoot { padding: 12px 16px calc(14px + env(safe-area-inset-bottom)); }
}
@media (max-width: 419.98px) {
  .ksp-cus-cols { grid-template-columns: minmax(0, 1fr); }
  .ksp-cus-visit { flex-wrap: wrap; }
  .ksp-cus-visit__total { width: 100%; text-align: end; }
}

/* @panel-bildirim — Üst bar zili (views/partials/panel-bell.php, app.js "@panel-bildirim") */
.ksp-bell__btn { position: relative; border-radius: 12px; transition: background-color .2s, color .2s, box-shadow .2s; }
.ksp-bell__icon { font-size: 23px; transform-origin: 50% 3px; }
.ksp-bell__badge { position: absolute; top: -4px; right: -4px;min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--ksp-gradient); color: #fff; font-size: .64rem; font-weight: 800; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--ksp-surface); }
.ksp-bell__badge[hidden] { display: none; }
/* Okunmamış: pembe dolgu + dolu zil + ara ara kısa sallanma */
.ksp-bell.is-unread .ksp-bell__btn { background: rgba(var(--ksp-primary-rgb), .1); color: var(--ksp-primary); }
.ksp-bell.is-unread .ksp-bell__icon { font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24; animation: ksp-bell-nudge 6s ease-in-out 2s infinite; }
/* Yeni bildirim anı: güçlü sallanma + parlayan hale + rozet zıplaması */
.ksp-bell.is-ringing .ksp-bell__btn { background: var(--ksp-gradient); color: #fff; animation: ksp-bell-halo 1.2s ease-out 3; }
.ksp-bell.is-ringing .ksp-bell__icon { animation: ksp-bell-ring 1.2s cubic-bezier(.36, .07, .19, .97) 3; }
.ksp-bell.is-ringing .ksp-bell__badge { background: #fff; color: var(--ksp-primary); box-shadow: 0 0 0 2px var(--ksp-primary); animation: ksp-bell-pop .6s ease-out; }
@keyframes ksp-bell-ring {
  0%, 100% { transform: rotate(0); }
  8% { transform: rotate(24deg); } 18% { transform: rotate(-22deg); } 28% { transform: rotate(18deg); }
  38% { transform: rotate(-14deg); } 48% { transform: rotate(9deg); } 58% { transform: rotate(-5deg); } 68% { transform: rotate(2deg); }
}
@keyframes ksp-bell-nudge {
  0%, 12%, 100% { transform: rotate(0); }
  2% { transform: rotate(16deg); } 4% { transform: rotate(-14deg); } 6% { transform: rotate(10deg); } 8% { transform: rotate(-6deg); } 10% { transform: rotate(3deg); }
}
@keyframes ksp-bell-halo {
  0% { box-shadow: 0 0 0 0 rgba(var(--ksp-primary-rgb), .55); }
  100% { box-shadow: 0 0 0 14px rgba(var(--ksp-primary-rgb), 0); }
}
@keyframes ksp-bell-pop { 0% { transform: scale(.4); } 60% { transform: scale(1.25); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) {
  .ksp-bell .ksp-bell__icon, .ksp-bell .ksp-bell__btn, .ksp-bell .ksp-bell__badge { animation: none !important; }
}

.ksp-bell__menu { width: min(380px, calc(100vw - 24px)); padding: 0; border-radius: 18px; border: 1px solid var(--ksp-border); box-shadow: 0 24px 48px -18px rgba(28, 25, 23, .32); overflow: hidden; }
.ksp-bell__head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .85rem 1rem; border-bottom: 1px solid var(--ksp-border); }
.ksp-bell__head strong { display: inline-flex; align-items: center; gap: .45rem; font-size: .95rem; font-weight: 800; }
.ksp-bell__head strong .material-symbols-rounded { font-size: 20px; color: var(--ksp-primary); font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24; }
.ksp-bell__readall { display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .55rem; border: 0; border-radius: 999px; background: rgba(var(--ksp-primary-rgb), .08); color: var(--ksp-primary); font-size: .74rem; font-weight: 700; }
.ksp-bell__readall .material-symbols-rounded { font-size: 16px; }
.ksp-bell__readall[hidden], .ksp-bell__unlock[hidden] { display: none; }
.ksp-bell__unlock { display: flex; align-items: center; gap: .5rem; margin: .6rem .8rem 0; padding: .55rem .7rem; border-radius: 12px; background: rgba(245, 158, 11, .12); color: #b45309; font-size: .76rem; font-weight: 600; }
.ksp-bell__unlock .material-symbols-rounded { font-size: 18px; }
.ksp-bell__list { max-height: min(380px, 55vh); overflow-y: auto; padding: .4rem; overscroll-behavior: contain; }
.ksp-bell__item { position: relative; display: flex; gap: .7rem; padding: .65rem .7rem; border-radius: 12px; color: var(--ksp-text); text-decoration: none; }
a.ksp-bell__item:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-bell__item.is-unread { background: rgba(var(--ksp-primary-rgb), .06); }
.ksp-bell__item.is-unread::after { content: ""; position: absolute; top: 1rem; right: .8rem; width: 8px; height: 8px; border-radius: 50%; background: var(--ksp-primary); }
.ksp-bell__ico { flex: 0 0 38px; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; font-size: 20px; background: rgba(var(--ksp-primary-rgb), .1); color: var(--ksp-primary); }
.ksp-bell__item--created .ksp-bell__ico { background: rgba(0, 153, 102, .12); color: var(--ksp-success); }
.ksp-bell__item--moved .ksp-bell__ico { background: rgba(43, 127, 255, .12); color: var(--ksp-info); }
.ksp-bell__item--canceled .ksp-bell__ico { background: rgba(var(--ksp-primary-rgb), .1); color: var(--ksp-primary); }
.ksp-bell__txt { display: flex; flex-direction: column; min-width: 0; padding-inline-end: 1rem; }
.ksp-bell__txt strong { font-size: .84rem; font-weight: 800; line-height: 1.3; }
.ksp-bell__txt small { font-size: .76rem; color: var(--ksp-muted); line-height: 1.35; overflow-wrap: anywhere; }
.ksp-bell__txt time { margin-top: .2rem; font-size: .68rem; font-weight: 700; color: var(--ksp-muted); opacity: .8; }
.ksp-bell__empty { display: flex; flex-direction: column; align-items: center; gap: .2rem; padding: 1.6rem 1rem; text-align: center; }
.ksp-bell__empty .material-symbols-rounded { font-size: 34px; color: var(--ksp-muted); opacity: .6; margin-bottom: .2rem; }
.ksp-bell__empty strong { font-size: .88rem; }
.ksp-bell__empty small { font-size: .76rem; color: var(--ksp-muted); }
.ksp-bell__settings { border-top: 1px solid var(--ksp-border); background: var(--ksp-surface-2); }
.ksp-bell__settings summary { display: flex; align-items: center; gap: .5rem; padding: .75rem 1rem; font-size: .82rem; font-weight: 700; cursor: pointer; list-style: none; }
.ksp-bell__settings summary::-webkit-details-marker { display: none; }
.ksp-bell__settings summary .material-symbols-rounded { font-size: 19px; color: var(--ksp-muted); }
.ksp-bell__chev { margin-inline-start: auto; transition: transform .2s; }
.ksp-bell__settings[open] .ksp-bell__chev { transform: rotate(180deg); }
.ksp-bell__row { display: grid; grid-template-columns: 1fr 150px 34px; align-items: center; gap: .5rem; padding: .3rem 1rem; }
.ksp-bell__row label { display: inline-flex; align-items: center; gap: .35rem; font-size: .78rem; font-weight: 600; }
.ksp-bell__row .form-select { border-radius: 10px; font-size: .78rem; }
.ksp-bell__row--volume { grid-template-columns: 1fr 184px; }
.ksp-bell__row--volume .material-symbols-rounded { font-size: 17px; color: var(--ksp-muted); }
.ksp-bell__row--volume .form-range::-webkit-slider-thumb { background: var(--ksp-primary); }
.ksp-bell__row--volume .form-range::-moz-range-thumb { background: var(--ksp-primary); }
.ksp-bell__row--volume .form-range:focus::-webkit-slider-thumb { box-shadow: 0 0 0 1px var(--ksp-surface), 0 0 0 .25rem rgba(var(--ksp-primary-rgb), .25); }
/* Masaüstü bildirimi anahtarı (sahip isteği 2026-09-25): panel arka plandayken işletim sistemi penceresi */
.ksp-bell__row--switch { grid-template-columns: 1fr; }
.ksp-bell__switch { display: flex; align-items: center; gap: .5rem; margin: 0; padding-inline-start: 0; cursor: pointer; }
.ksp-bell__switch .form-check-input { width: 2.2em; height: 1.2em; margin: 0; float: none; flex-shrink: 0; cursor: pointer; }
.ksp-bell__switch .form-check-input:checked { background-color: var(--ksp-primary); border-color: var(--ksp-primary); }
.ksp-bell__switch .form-check-input:disabled { cursor: not-allowed; }
.ksp-bell__switch span { display: inline-flex; align-items: center; gap: .35rem; font-size: .78rem; font-weight: 600; }
.ksp-bell__switch .material-symbols-rounded { font-size: 17px; color: var(--ksp-muted); }
.ksp-bell__note { margin: -.1rem 0 .3rem; padding: 0 1rem; color: var(--ksp-muted); font-size: .72rem; line-height: 1.35; }

.ksp-bell__play { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-primary); }
.ksp-bell__play:hover { background: rgba(var(--ksp-primary-rgb), .08); }
.ksp-bell__play .material-symbols-rounded { font-size: 20px; }
.ksp-bell__test { display: flex; align-items: center; justify-content: center; gap: .45rem; width: calc(100% - 2rem); margin: .6rem 1rem 1rem; padding: .6rem; border: 0; border-radius: 12px; background: var(--ksp-gradient); color: #fff; font-size: .82rem; font-weight: 700; }
.ksp-bell__test:disabled { opacity: .7; }
.ksp-bell__test .material-symbols-rounded { flex: 0 0 auto; width: 18px; font-size: 18px; overflow: hidden; }
.ksp-bell__test [data-bell-test-label] { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Telefonda menü üst barın altında iki yana 12px boşlukla açılır (Popper konumu kenara yapıştırıyordu) */
@media (max-width: 575.98px) {
  .ksp-bell__menu.show { position: fixed !important; inset: 70px 12px auto 12px !important; transform: none !important; width: auto; }
  .ksp-bell__list { max-height: 48vh; }
}
@media (max-width: 419.98px) {
  .ksp-bell__row { grid-template-columns: 1fr 148px 34px; }
  .ksp-bell__row--volume { grid-template-columns: 1fr 162px; }
}

/* @kokpit-personel — Salon Kokpiti > Personel & Vardiya (views/panels/tenant/staff.php); takvim izin hapı; salon sayfası "Uzman Kadro" */
.ksp-stf {
  --stf-line: #f0efee; --stf-ink2: #44403c; --stf-head: #292524; --stf-rose: #e11d48; --stf-faint: #a8a29e; --stf-box: #d6d3d1;
  --stf-shift-bg: #fafaf9; --stf-off-bg: #fafaf9;
  --stf-break-bg: #fffbeb; --stf-break-line: #fde68a; --stf-break-box: #fcd34d; --stf-break-ink: #b45309; --stf-break-icon: #d97706;
  --stf-pill-bg: #fff1f2; --stf-pill-line: #fecdd3; --stf-pill-ink: #e11d48; --stf-chip-ink: #be123c; --stf-chip-line: #f43f5e;
  --stf-warn-bg: #fffbeb; --stf-warn-line: #fde68a; --stf-warn-ink: #92400e;
  --stf-f-bg: #fdf2f8; --stf-f-line: #fbcfe8; --stf-f-ink: #be185d;
  --stf-m-bg: #eff6ff; --stf-m-line: #bfdbfe; --stf-m-ink: #1d4ed8;
  --stf-u-bg: #f5f3ff; --stf-u-line: #ddd6fe; --stf-u-ink: #6d28d9;
  --stf-dark-btn: #1c1917; --stf-dark-btn-ink: #fff;
}
[data-bs-theme="dark"] .ksp-stf {
  --stf-line: rgba(255, 255, 255, .07); --stf-ink2: #e7e5e4; --stf-head: #f5f5f4; --stf-rose: #fb7185; --stf-faint: #a8a29e; --stf-box: #57534e;
  --stf-shift-bg: var(--ksp-surface-2); --stf-off-bg: rgba(255, 255, 255, .025);
  --stf-break-bg: rgba(245, 158, 11, .1); --stf-break-line: rgba(245, 158, 11, .3); --stf-break-box: rgba(245, 158, 11, .45); --stf-break-ink: #fcd34d; --stf-break-icon: #fbbf24;
  --stf-pill-bg: rgba(244, 63, 94, .12); --stf-pill-line: rgba(244, 63, 94, .35); --stf-pill-ink: #fda4af; --stf-chip-ink: #fda4af; --stf-chip-line: #fb7185;
  --stf-warn-bg: rgba(245, 158, 11, .12); --stf-warn-line: rgba(245, 158, 11, .35); --stf-warn-ink: #fcd34d;
  --stf-f-bg: rgba(236, 72, 153, .12); --stf-f-line: rgba(236, 72, 153, .35); --stf-f-ink: #f9a8d4;
  --stf-m-bg: rgba(59, 130, 246, .12); --stf-m-line: rgba(59, 130, 246, .35); --stf-m-ink: #93c5fd;
  --stf-u-bg: rgba(139, 92, 246, .14); --stf-u-line: rgba(139, 92, 246, .38); --stf-u-ink: #c4b5fd;
  --stf-dark-btn: #fafaf9; --stf-dark-btn-ink: #1c1917;
}
.ksp-stf [hidden] { display: none !important; }

/* Başlık kartı */
.ksp-stf-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 16px; padding: 16px 20px; background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; }
.ksp-stf-head__text { min-width: 0; }
.ksp-stf-head__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; font-weight: 800; letter-spacing: 0; line-height: 1.3; color: var(--ksp-text); }
.ksp-stf-head__title .material-symbols-rounded { font-size: 22px; color: var(--stf-rose); }
.ksp-stf-head__lead { margin: 3px 0 0; font-size: 12.5px; color: var(--ksp-muted); }
.ksp-stf-add { display: inline-flex; align-items: center; justify-content: center; gap: 4px; height: 36px; margin-inline-start: auto; padding: 0 14px; border-radius: 10px; background: var(--stf-dark-btn); color: var(--stf-dark-btn-ink); font-size: 13px; font-weight: 700; white-space: nowrap; }
.ksp-stf-add:hover { background: #292524; color: #fff; }
[data-bs-theme="dark"] .ksp-stf-add:hover { background: #e7e5e4; color: #1c1917; }
.ksp-stf-add .material-symbols-rounded { font-size: 18px; }

/* İki sütun: kadro (300px) + seçili personel */
.ksp-stf-grid { display: grid; grid-template-columns: 300px minmax(0, 1fr); align-items: start; gap: 16px; margin-top: 16px; }
.ksp-stf-side { min-width: 0; }
.ksp-stf-label { margin: 2px 0 10px; font-size: 11.5px; font-weight: 800; letter-spacing: .05em; line-height: 1.4; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-stf-items { display: flex; flex-direction: column; gap: 10px; }
.ksp-stf-card { position: relative; display: flex; align-items: center; gap: 10px; padding: 12px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); transition: border-color .15s, box-shadow .15s; }
.ksp-stf-card:hover { border-color: #fda4af; }
/* Seçili: gerçek 1.5px kenarlık (yüksek DPI'da 1.5px, 1x ekranda net 1px; yarım piksel halka bulanıklığı yok); iç boşluk 0.5px azalır, içerik kaymaz */
.ksp-stf-card.is-selected { padding: 11.5px; border-width: 1.5px; border-color: #f43f5e; box-shadow: 0 6px 16px -10px rgba(244, 63, 94, .45); }
.ksp-stf-card:has(.ksp-stf-card__link:focus-visible) { box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
.ksp-stf-card.is-inactive { background: var(--ksp-bg); }
.ksp-stf-card.is-inactive .ksp-stf-ava, .ksp-stf-card.is-inactive .ksp-stf-card__link, .ksp-stf-card.is-inactive .ksp-stf-card__title, .ksp-stf-card.is-inactive .ksp-stf-sec:not(.is-inactive) { opacity: .5; }
.ksp-stf-ava { width: 40px; height: 40px; flex-shrink: 0; display: grid; place-items: center; border-radius: 10px; background: var(--staff, #ec003f) center / cover no-repeat; color: #fff; font-size: 14px; font-weight: 800; letter-spacing: .02em; }
.ksp-stf-ava--lg { width: 48px; height: 48px; border-radius: 12px; font-size: 17px; }
.ksp-stf-card__body { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.ksp-stf-card__link { display: block; min-width: 0; color: var(--ksp-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-stf-card__link:hover { color: var(--ksp-text); }
.ksp-stf-card__link:focus-visible { outline: 0; }
.ksp-stf-card__link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.ksp-stf-card__name { font-size: 14px; font-weight: 800; line-height: 1.35; }
.ksp-stf-card__title { font-size: 12px; line-height: 1.4; color: var(--ksp-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-stf-card__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; margin-top: 6px; }
.ksp-stf-card__days { font-size: 11.5px; color: var(--ksp-muted); white-space: nowrap; }
.ksp-stf-card__days::before { content: "•"; margin-inline-end: 5px; }
.ksp-stf-card__edit { position: relative; z-index: 1; flex-shrink: 0; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; color: #a8a29e; }
.ksp-stf-card__edit:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-stf-card__edit .material-symbols-rounded { font-size: 18px; }
.ksp-stf-sec { display: inline-flex; align-items: center; height: 20px; padding: 0 6px; border: 1px solid var(--ksp-border); border-radius: 6px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: 11px; font-weight: 700; line-height: 1; white-space: nowrap; }
.ksp-stf-sec.is-female { background: var(--stf-f-bg); border-color: var(--stf-f-line); color: var(--stf-f-ink); }
.ksp-stf-sec.is-male { background: var(--stf-m-bg); border-color: var(--stf-m-line); color: var(--stf-m-ink); }
.ksp-stf-sec.is-unisex { background: var(--stf-u-bg); border-color: var(--stf-u-line); color: var(--stf-u-ink); }
.ksp-stf-empty, .ksp-stf-pick { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 30px 16px; border: 1px dashed #d6d3d1; border-radius: 14px; background: var(--ksp-surface); text-align: center; }
.ksp-stf-empty > .material-symbols-rounded, .ksp-stf-pick > .material-symbols-rounded { font-size: 36px; color: #d6d3d1; }
.ksp-stf-empty strong, .ksp-stf-pick strong { font-size: 14px; font-weight: 800; color: var(--ksp-text); }
.ksp-stf-empty p, .ksp-stf-pick p { max-width: 320px; margin: 0 0 6px; font-size: 12.5px; color: var(--ksp-muted); }
.ksp-stf-pick { justify-content: center; min-height: 360px; border-style: solid; border-color: var(--ksp-border); border-radius: 16px; }
.ksp-stf-pick .ksp-stf-add { margin-inline-start: 0; }

/* Seçili personel kartı */
.ksp-stf-detail { background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; overflow: hidden; }
.ksp-stf-dhead { display: flex; align-items: center; gap: 14px; padding: 16px 20px; border-bottom: 1px solid var(--stf-line); }
.ksp-stf-dhead__who { flex: 1; min-width: 0; }
.ksp-stf-dhead__line { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; }
.ksp-stf-dhead__line h2 { min-width: 0; margin: 0; font-size: 18px; font-weight: 800; letter-spacing: 0; line-height: 1.3; color: var(--ksp-text); overflow-wrap: anywhere; }
.ksp-stf-phone { display: inline-flex; align-items: center; padding: 2px 8px; border: 1px solid var(--ksp-border); border-radius: 999px; color: var(--stf-ink2); font-size: 12px; line-height: 1.35; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ksp-stf-dhead__title { margin: 3px 0 0; font-size: 12.5px; color: var(--ksp-muted); overflow-wrap: anywhere; }
.ksp-stf-editbtn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; flex-shrink: 0; height: 34px; padding: 0 12px; border: 1px solid #d6d3d1; border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-size: 13px; font-weight: 600; white-space: nowrap; transition: border-color .15s; }
.ksp-stf-editbtn:hover { border-color: #a8a29e; color: var(--ksp-text); }
.ksp-stf-editbtn .material-symbols-rounded { font-size: 17px; }
[data-bs-theme="dark"] .ksp-stf-editbtn { border-color: rgba(255, 255, 255, .16); }
.ksp-stf-sched__head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; padding: 14px 20px 8px; }
.ksp-stf-title { display: flex; align-items: center; gap: 6px; min-width: 0; margin: 0; font-size: 12.5px; font-weight: 800; letter-spacing: .02em; line-height: 1.4; text-transform: uppercase; color: var(--stf-head); }
.ksp-stf-title .material-symbols-rounded { font-size: 18px; color: var(--stf-rose); }
/* Kayıt durumu: ipucu → "Kaydediliyor…" → yeşil "Kaydedildi" / kırmızı hata */
.ksp-stf-status { display: inline-flex; align-items: center; gap: 4px; margin: 0; font-size: 12px; color: var(--stf-faint); }
.ksp-stf-status__icon { display: none; font-size: 16px; }
.ksp-stf-status[data-mode="saving"] { color: var(--ksp-muted); }
.ksp-stf-status[data-mode="saved"] { color: #059669; font-weight: 600; }
.ksp-stf-status[data-mode="error"] { color: #e11d48; font-weight: 600; }
.ksp-stf-status[data-mode="saved"] .ksp-stf-status__icon, .ksp-stf-status[data-mode="error"] .ksp-stf-status__icon { display: inline-block; }
.ksp-stf-status:has([data-stf-status-text]:empty) { display: none; }
[data-bs-theme="dark"] .ksp-stf-status[data-mode="saved"] { color: #34d399; }
[data-bs-theme="dark"] .ksp-stf-status[data-mode="error"] { color: #fb7185; }
.ksp-stf-warn { display: flex; align-items: flex-start; gap: 8px; margin: 0 20px 10px; padding: 9px 12px; border: 1px solid var(--stf-warn-line); border-radius: 10px; background: var(--stf-warn-bg); color: var(--stf-warn-ink); font-size: 12.5px; font-weight: 600; line-height: 1.5; }
.ksp-stf-warn .material-symbols-rounded { flex-shrink: 0; font-size: 18px; color: var(--stf-break-icon); }
/* Tarihli dönem izni bilgi şeridi (StaffLeaves): "Yıllık İzin · 18–30 Eylül — bu tarihlerde tüm günler izinli" */
.ksp-stf-period { display: flex; align-items: flex-start; gap: 8px; margin: 0 20px 10px; padding: 9px 12px; border: 1px solid var(--stf-pill-line); border-radius: 10px; background: var(--stf-pill-bg); color: var(--stf-chip-ink); font-size: 12.5px; font-weight: 600; line-height: 1.5; }
.ksp-stf-period .material-symbols-rounded { flex-shrink: 0; font-size: 18px; color: var(--stf-pill-ink); }

/* Haftalık çizelge: 7 satır */
.ksp-stf-week { margin: 0 20px; border: 1px solid var(--ksp-border); border-radius: 14px; overflow: hidden; }
/* Üste hizalı: gün adı ilk hap satırıyla (40px) hizada kalır; hata metni eklenince tik / gün adı kaymaz */
.ksp-stf-day { position: relative; display: grid; grid-template-columns: 148px minmax(0, 1fr) auto; align-items: start; gap: 8px 12px; min-height: 64px; padding: 12px 16px; background: var(--ksp-surface); transition: background .15s; }
.ksp-stf-day + .ksp-stf-day { border-top: 1px solid var(--stf-line); }
.ksp-stf-day.is-off { background: var(--stf-off-bg); }
.ksp-stf-day.is-invalid { box-shadow: inset 3px 0 0 #e11d48; }
.ksp-stf-day__name { display: flex; align-items: center; gap: 10px; min-width: 0; min-height: 40px; margin: 0; cursor: pointer; }
.ksp-stf-day.is-off .ksp-stf-day__name { min-height: 26px; }
.ksp-stf-day__label { font-size: 14px; font-weight: 700; line-height: 1.3; color: var(--ksp-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-stf-day.is-off .ksp-stf-day__label { color: #a8a29e; text-decoration: line-through; }
.ksp-stf-cb { position: absolute; width: 18px; height: 18px; margin: 0; opacity: 0; pointer-events: none; }
.ksp-stf-cb__box { width: 18px; height: 18px; flex-shrink: 0; display: grid; place-items: center; border: 1.5px solid var(--stf-box); border-radius: 5px; background: var(--ksp-surface); color: transparent; transition: background .15s, border-color .15s; }
.ksp-stf-cb__box .material-symbols-rounded { font-size: 15px; font-variation-settings: "FILL" 0, "wght" 700, "GRAD" 0, "opsz" 20; }
.ksp-stf-cb:checked + .ksp-stf-cb__box { border-color: #2563eb; background: #2563eb; color: #fff; }
.ksp-stf-cb:checked + .ksp-stf-cb__box--rose { border-color: #e11d48; background: #e11d48; }
.ksp-stf-cb:focus-visible + .ksp-stf-cb__box { box-shadow: 0 0 0 3px rgba(37, 99, 235, .25); }
.ksp-stf-day__body { container: stf-day / inline-size; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ksp-stf-day__work { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.ksp-stf-day.is-off .ksp-stf-day__work, .ksp-stf-day:not(.is-off) .ksp-stf-day__off, .ksp-stf-day:not(.is-off) .ksp-stf-reason { display: none; }
.ksp-stf-day__off { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ksp-stf-shift { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--stf-shift-bg); }
.ksp-stf-shift > .material-symbols-rounded { font-size: 16px; color: #a8a29e; }
.ksp-stf-shift__label { font-size: 12px; color: var(--ksp-muted); white-space: nowrap; }
.ksp-stf-shift--break { border-color: var(--stf-break-line); background: var(--stf-break-bg); }
.ksp-stf-shift--break > .material-symbols-rounded { color: var(--stf-break-icon); }
.ksp-stf-shift--break .ksp-stf-shift__label { font-weight: 600; color: var(--stf-break-ink); }
.ksp-stf-shift--break .ksp-stf-time { border-color: var(--stf-break-box); }
.ksp-stf-dash { font-size: 12px; color: #a8a29e; }
.ksp-stf-time, .ksp-stf-date { height: 30px; padding: 0 6px 0 8px; border: 1px solid var(--ksp-border); border-radius: 8px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; color-scheme: light; }
[data-bs-theme="dark"] .ksp-stf-time, [data-bs-theme="dark"] .ksp-stf-date { color-scheme: dark; }
.ksp-stf-time { width: 86px; }
.ksp-stf-date { width: 108px; font-size: 12.5px; font-weight: 600; }
.ksp-stf-date.is-empty { color: var(--stf-faint); font-weight: 400; } /* boş "gg.aa.yyyy" girilmiş değer gibi görünmesin */
.ksp-stf-time--sm { width: 78px; height: 28px; font-size: 12.5px; } /* "İzin bitince mesai" küçük saat kutuları */
.ksp-stf-time:focus, .ksp-stf-date:focus { outline: 0; border-color: #fb7185; box-shadow: 0 0 0 3px rgba(225, 29, 72, .12); }
.ksp-stf-time::-webkit-datetime-edit, .ksp-stf-date::-webkit-datetime-edit { padding: 0; }
.ksp-stf-time::-webkit-calendar-picker-indicator, .ksp-stf-date::-webkit-calendar-picker-indicator { width: 14px; height: 14px; margin: 0 0 0 2px; padding: 0; cursor: pointer; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23a8a29e'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 18a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm.5-13H11v6l5.2 3.2.8-1.3-4.5-2.7V7z'/%3E%3C/svg%3E") center / 14px no-repeat; }
.ksp-stf-date::-webkit-calendar-picker-indicator { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23a8a29e'%3E%3Cpath d='M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V10h16v11zm0-13H4V5h16v3z'/%3E%3C/svg%3E"); }
.ksp-stf-x { width: 22px; height: 22px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 6px; background: transparent; color: var(--stf-break-ink); }
.ksp-stf-x:hover { background: rgba(217, 119, 6, .14); }
.ksp-stf-x .material-symbols-rounded { font-size: 15px; }
.ksp-stf-breakadd { display: inline-flex; align-items: center; gap: 2px; height: 30px; padding: 0 8px 0 4px; border: 0; border-radius: 8px; background: transparent; color: var(--stf-break-ink); font-size: 12px; font-weight: 600; white-space: nowrap; }
.ksp-stf-breakadd:hover { background: var(--stf-break-bg); }
.ksp-stf-breakadd .material-symbols-rounded { font-size: 16px; }
/* İzin nedeni çipleri: tek seçimli (radio), onay kutusu görünümü */
.ksp-stf-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ksp-stf-chip { position: relative; display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 4px 10px 4px 6px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--stf-ink2); font-size: 12px; font-weight: 600; line-height: 16px; white-space: nowrap; cursor: pointer; transition: border-color .15s, background .15s; }
.ksp-stf-chip:hover { border-color: #fda4af; }
.ksp-stf-chip input { position: absolute; opacity: 0; pointer-events: none; }
.ksp-stf-chip__box { width: 14px; height: 14px; display: grid; place-items: center; border: 1.5px solid var(--stf-box); border-radius: 4px; background: var(--ksp-surface); color: transparent; }
.ksp-stf-chip__box .material-symbols-rounded { font-size: 12px; font-variation-settings: "FILL" 0, "wght" 700, "GRAD" 0, "opsz" 20; }
.ksp-stf-chip:has(input:checked) { border-color: var(--stf-chip-line); background: var(--stf-pill-bg); color: var(--stf-chip-ink); }
.ksp-stf-chip:has(input:checked) .ksp-stf-chip__box { border-color: #e11d48; background: #e11d48; color: #fff; }
.ksp-stf-chip:has(input:focus-visible) { box-shadow: 0 0 0 3px rgba(225, 29, 72, .18); }
.ksp-stf-dates, .ksp-stf-keep { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.ksp-stf-dates__label { font-size: 12px; color: var(--ksp-muted); white-space: nowrap; }
.ksp-stf-dates__pair { display: inline-flex; align-items: center; gap: 6px; }
.ksp-stf-hint { font-size: 11.5px; line-height: 1.4; color: var(--stf-faint); }
/* İpucu / not tarih ve saat kutularının yanında kalır: yer darsa kendi içinde iki satıra sarar, alt satıra düşmez */
.ksp-stf-dates > .ksp-stf-hint, .ksp-stf-keep__note { flex: 1 1 130px; min-width: 0; }
.ksp-stf-link { display: inline-flex; align-items: center; gap: 3px; padding: 0; border: 0; background: none; color: var(--stf-rose); font-size: 12px; font-weight: 700; white-space: nowrap; }
.ksp-stf-link:hover { text-decoration: underline; }
.ksp-stf-link .material-symbols-rounded { font-size: 15px; }
.ksp-stf-dates .ksp-stf-link { margin-inline-start: auto; }
.ksp-stf-reason { display: inline-block; max-width: 250px; padding: 3px 10px; border: 1px solid var(--stf-pill-line); border-radius: 999px; background: var(--stf-pill-bg); color: var(--stf-pill-ink); font-size: 12px; font-weight: 600; line-height: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-stf-err { margin: 0; font-size: 12px; font-weight: 600; color: #e11d48; }
.ksp-stf-err:empty { display: none; }
.ksp-stf-day.is-invalid .ksp-stf-time { border-color: #fda4af; }

/* Verdiği hizmetler */
.ksp-stf-svcs { padding: 16px 20px 20px; }
.ksp-stf-svcs__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.ksp-stf-svcs__acts { display: inline-flex; align-items: center; gap: 12px; }
.ksp-stf-svcs__hint { display: none; margin: -4px 0 10px; }
.ksp-stf-svcs.is-editing .ksp-stf-svcs__hint { display: block; }
.ksp-stf-svclist { display: flex; flex-wrap: wrap; gap: 8px; }
.ksp-stf-svc { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; line-height: 18px; text-align: start; pointer-events: none; transition: opacity .15s, border-color .15s; }
.ksp-stf-svc[aria-pressed="false"] { display: none; }
.ksp-stf-svc__dot { width: 8px; height: 8px; flex-shrink: 0; border-radius: 50%; background: var(--dot, #a8a29e); }
.ksp-stf-svc__name { font-size: 12.5px; font-weight: 600; }
.ksp-stf-svc__min { font-size: 11.5px; color: #a8a29e; white-space: nowrap; }
.ksp-stf-svcs.is-editing .ksp-stf-svc { pointer-events: auto; cursor: pointer; }
.ksp-stf-svcs.is-editing .ksp-stf-svc[aria-pressed="true"] { border-color: #fda4af; }
.ksp-stf-svcs.is-editing .ksp-stf-svc[aria-pressed="false"] { display: inline-flex; border-style: dashed; opacity: .55; }
.ksp-stf-svcs.is-editing .ksp-stf-svc:hover { opacity: 1; border-color: #f43f5e; }
.ksp-stf-svcs.is-editing [data-stf-svc-empty] { display: none; }
.ksp-stf-none { margin: 0; font-size: 12.5px; color: var(--ksp-muted); }

/* Ekle / düzenle modalı (müşteri modalı kalıbı) */
.ksp-stf-modal .modal-dialog { max-width: 480px; }
.ksp-stf-modal .modal-content { border: 0; border-radius: 16px; background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 30px 60px -20px rgba(28, 25, 23, .4); overflow: hidden; }
.ksp-stf-mhead { gap: 10px; padding: 20px 22px 14px; border-bottom: 1px solid var(--stf-line); }
.ksp-stf-mhead h2 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 18px; font-weight: 800; letter-spacing: 0; color: var(--ksp-text); }
.ksp-stf-mbadge { width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center; border-radius: 10px; background: var(--stf-pill-bg); color: #e11d48; }
.ksp-stf-mbadge .material-symbols-rounded { font-size: 20px; }
.ksp-stf-modal[data-mode="edit"] [data-stf-title="new"], .ksp-stf-modal[data-mode="new"] [data-stf-title="edit"] { display: none; }
.ksp-stf-mclose { width: 32px; height: 32px; flex-shrink: 0; display: grid; place-items: center; margin: -4px -8px -4px auto; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--ksp-muted); }
.ksp-stf-mclose:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-stf-mbody { display: flex; flex-direction: column; gap: 12px; padding: 16px 22px; }
.ksp-stf-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ksp-stf-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; }
.ksp-stf-flabel { display: flex; align-items: center; gap: 4px; margin: 0; font-size: 13px; line-height: 1.4; color: var(--stf-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
legend.ksp-stf-flabel { float: none; width: auto; margin: 0 0 6px; padding: 0; font-size: 13px; }
.ksp-stf-flabel b { font-weight: 700; color: #e11d48; }
.ksp-stf-input { width: 100%; height: 40px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 10px; background-color: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 14px; }
.ksp-stf-input::placeholder { color: #a8a29e; }
.ksp-stf-input:focus { outline: 0; border-color: #fb7185; box-shadow: 0 0 0 3px rgba(225, 29, 72, .12); }
select.ksp-stf-input { -webkit-appearance: none; appearance: none; padding-inline-end: 34px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2378716c'%3E%3Cpath d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; background-size: 20px; cursor: pointer; }
[dir="rtl"] select.ksp-stf-input { background-position: left 10px center; }
.ksp-stf-field:has(.ksp-stf-ferr:not(:empty)) .ksp-stf-input { border-color: #e11d48; }
.ksp-stf-swatches { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-height: 40px; }
.ksp-stf-swatch { position: relative; width: 20px; height: 20px; margin: 0; border-radius: 50%; background: var(--sw); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); cursor: pointer; transition: box-shadow .15s; }
.ksp-stf-swatch input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.ksp-stf-swatch:has(input:checked) { box-shadow: 0 0 0 2px var(--ksp-surface), 0 0 0 4px var(--sw); }
.ksp-stf-swatch:has(input:focus-visible) { outline: 2px solid #1c1917; outline-offset: 4px; }
.ksp-stf-checks { display: flex; flex-wrap: wrap; gap: 10px 22px; padding-top: 2px; }
.ksp-stf-check { position: relative; display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 13.5px; color: var(--ksp-text); cursor: pointer; }
.ksp-stf-check .ksp-stf-cb:focus-visible + .ksp-stf-cb__box { box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
.ksp-stf-ferr { margin: 0; font-size: 12px; color: #e11d48; }
.ksp-stf-ferr:empty { display: none; }
.ksp-stf-alert { display: flex; align-items: flex-start; gap: 8px; padding: 9px 12px; border: 1px solid var(--stf-pill-line); border-radius: 10px; background: var(--stf-pill-bg); color: var(--stf-chip-ink); font-size: 13px; font-weight: 600; }
.ksp-stf-alert .material-symbols-rounded { font-size: 18px; }
.ksp-stf-mfoot { flex-wrap: nowrap; justify-content: flex-end; gap: 6px; padding: 14px 22px 18px; border-top: 1px solid var(--stf-line); }
.ksp-stf-mfoot > * { margin: 0; }
.ksp-stf-cancel { height: 38px; padding: 0 12px; border: 0; border-radius: 10px; background: transparent; color: var(--ksp-muted); font-size: 14px; font-weight: 600; }
.ksp-stf-cancel:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-stf-save { height: 38px; padding: 0 18px; border: 0; border-radius: 10px; background: var(--stf-dark-btn); color: var(--stf-dark-btn-ink); font-size: 14px; font-weight: 700; }
.ksp-stf-save:hover { opacity: .9; }
.ksp-stf-save:disabled { opacity: .6; pointer-events: none; }

@media (max-width: 991.98px) {
  .ksp-stf-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767.98px) {
  .ksp-stf-head { padding: 14px 16px; }
  .ksp-stf-add { flex: 1 1 auto; margin-inline-start: 0; }
  .ksp-stf-dhead { flex-wrap: wrap; padding: 14px 16px; }
  .ksp-stf-editbtn { width: 100%; }
  .ksp-stf-sched__head { padding: 12px 16px 8px; }
  .ksp-stf-week, .ksp-stf-warn, .ksp-stf-period { margin-inline: 16px; }
  .ksp-stf-svcs { padding: 14px 16px 18px; }
  /* Gün satırı: üstte tik + gün adı ve neden hapı, altta haplar / çipler tam genişlik */
  .ksp-stf-day { grid-template-columns: minmax(0, 1fr) auto; align-items: center; padding: 12px; }
  .ksp-stf-day .ksp-stf-day__name { min-height: 26px; }
  .ksp-stf-day__body { grid-column: 1 / -1; grid-row: 2; }
  .ksp-stf-reason { grid-column: 2; grid-row: 1; max-width: 190px; }
  .ksp-stf-dates .ksp-stf-link { margin-inline-start: 0; }
}
@media (max-width: 575.98px) {
  .ksp-stf-mhead { padding: 16px 16px 12px; }
  .ksp-stf-mbody { padding: 14px 16px; }
  .ksp-stf-mfoot { padding: 12px 16px calc(14px + env(safe-area-inset-bottom)); }
}
@media (max-width: 419.98px) {
  .ksp-stf-cols { grid-template-columns: minmax(0, 1fr); }
}
/* Dar gün gövdesi (telefon, gövde < 360px; tek satır "Öğle Molası" hapı ≈ 340px): haplar tam genişlik, üst satırda simge + etiket
   (+ molayı kaldır ×), alt satırda iki saat kutusu eşit genişlikte; tarih / saat çiftleri kendi satırında — kaptan taşma ve kırpılma yok */
@container stf-day (max-width: 359.98px) {
  .ksp-stf-day__work { flex-direction: column; align-items: stretch; }
  .ksp-stf-shift { display: flex; flex-wrap: wrap; gap: 3px 6px; padding: 6px 8px 8px; }
  .ksp-stf-shift::after { content: ""; order: 1; flex-basis: 100%; height: 0; }
  .ksp-stf-shift__label { flex: 1 1 auto; }
  .ksp-stf-shift .ksp-stf-time, .ksp-stf-shift .ksp-stf-dash { order: 2; }
  .ksp-stf-shift .ksp-stf-time, .ksp-stf-dates__pair .ksp-stf-date, .ksp-stf-dates__pair .ksp-stf-time { flex: 1 1 0; width: auto; min-width: 0; }
  .ksp-stf-breakadd { align-self: flex-start; }
  .ksp-stf-dates__pair { display: flex; flex: 1 1 100%; }
  .ksp-stf-dates .ksp-stf-link { margin-inline-start: 0; }
}

/* Randevu Takvimi: izinli personel (kolon başlığı hapı, çizgili kolon, randevu penceresi kartı) */
/* Hap, unvan satırının yerini alır: görünür yükseklik 17px, yerleşim yüksekliği unvan satırıyla eşit (11px × 1.2 ≈ 13px; negatif dikey
   boşluk) → izinli ve çalışan kolonlarda ad satırı aynı hizada */
.ksp-cal-head__who .ksp-cal-leave { display: block; max-width: 100%; margin: -1px 0 -3px; padding: 0 6px; border: 1px solid #fecdd3; border-radius: 999px; background: #fff1f2; color: #e11d48; font-size: 10.5px; font-weight: 700; line-height: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; align-self: flex-start; }
.ksp-cal-head__staff.is-leave .ksp-cal-ava { opacity: .55; filter: grayscale(.5); }
.ksp-cal-head__staff.is-leave .ksp-cal-head__who strong { color: var(--ksp-muted); }
.ksp-cal-col.is-leave .ksp-cal-slot.is-off { background: repeating-linear-gradient(45deg, rgba(244, 63, 94, .07) 0 6px, transparent 6px 12px) var(--ksp-bg); }
.ksp-cal-staff.is-leave { background: var(--ksp-bg); border-style: dashed; }
.ksp-cal-staff.is-leave:not(:has(input:checked)) { cursor: not-allowed; }
.ksp-cal-staff.is-leave .ksp-cal-staff__ava { opacity: .5; filter: grayscale(1); }
.ksp-cal-staff.is-leave .ksp-cal-staff__body strong { color: var(--ksp-muted); }
.ksp-cal-tag--leave { max-width: 100%; background: #fff1f2; border-color: #fecdd3; color: #e11d48; font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
[data-bs-theme="dark"] .ksp-cal-leave, [data-bs-theme="dark"] .ksp-cal-tag--leave { background: rgba(244, 63, 94, .12); border-color: rgba(244, 63, 94, .35); color: #fda4af; }
/* Koyu tema: randevu penceresi personel kartı etiketleri (mesai / uzman / çalışmıyor) ve izinli kart zemini normal kartla aynı ton */
[data-bs-theme="dark"] .ksp-cal-tag--shift { background: rgba(16, 185, 129, .12); border-color: rgba(16, 185, 129, .35); color: #6ee7b7; }
[data-bs-theme="dark"] .ksp-cal-tag--star { background: rgba(245, 158, 11, .12); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-cal-tag--off { background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .12); color: #a8a29e; }
[data-bs-theme="dark"] .ksp-cal-staff.is-leave { background: var(--ksp-surface); border-color: rgba(255, 255, 255, .16); }
[data-bs-theme="dark"] .ksp-cal-col.is-leave .ksp-cal-slot.is-off { background: repeating-linear-gradient(45deg, rgba(244, 63, 94, .1) 0 6px, transparent 6px 12px) var(--ksp-bg); }

/* Salon sayfası: "Uzman Kadro" kartları (views/site/salon.php) */

/* @kokpit-ayarlar — Salon Kokpiti > Ayarlar (views/panels/tenant/settings.php + partials/settings-*, app.js "@kokpit-ayarlar") */
.ksp-set {
  --set-line: #f0efee; --set-soft: #57534e; --set-ink2: #44403c; --set-faint: #a8a29e; --set-box: #d6d3d1; --set-soft-bg: #fafaf9;
  --set-rose: #e11d48; --set-rose-ink: #be123c; --set-rose-bg: #fff1f2; --set-rose-line: #fecdd3;
  --set-amber-bg: #fffbeb; --set-amber-line: #fde68a; --set-amber-ink: #b45309; --set-amber-text: #92400e;
  --set-green: #009966; --set-green-bg: #ecfdf5; --set-green-line: #a7f3d0; --set-green-ink: #047857;
  --set-dark-btn: #1c1917; --set-dark-btn-hover: #292524; --set-dark-btn-ink: #fff;
}
[data-bs-theme="dark"] .ksp-set {
  --set-line: rgba(255, 255, 255, .07); --set-soft: #d6d3d1; --set-ink2: #e7e5e4; --set-faint: #a8a29e; --set-box: #57534e; --set-soft-bg: rgba(255, 255, 255, .03);
  --set-rose: #fb7185; --set-rose-ink: #fda4af; --set-rose-bg: rgba(244, 63, 94, .12); --set-rose-line: rgba(244, 63, 94, .35);
  --set-amber-bg: rgba(245, 158, 11, .12); --set-amber-line: rgba(245, 158, 11, .35); --set-amber-ink: #fcd34d; --set-amber-text: #fcd34d;
  --set-green: #34d399; --set-green-bg: rgba(16, 185, 129, .12); --set-green-line: rgba(16, 185, 129, .35); --set-green-ink: #6ee7b7;
  --set-dark-btn: #fafaf9; --set-dark-btn-hover: #e7e5e4; --set-dark-btn-ink: #1c1917;
}
.ksp-set [hidden] { display: none !important; }
.ksp-set .material-symbols-rounded { flex-shrink: 0; }

/* Başlık kartı (müşteri / personel sayfalarıyla aynı ölçü) */
.ksp-set-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 16px; padding: 16px 20px; background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; }
.ksp-set-head__text { min-width: 0; }
.ksp-set-head__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; font-weight: 800; letter-spacing: 0; line-height: 1.3; color: var(--ksp-text); }
.ksp-set-head__title .material-symbols-rounded { font-size: 22px; color: var(--set-rose); }
.ksp-set-head__lead { margin: 3px 0 0; font-size: 12.5px; color: var(--ksp-muted); }
.ksp-set-head__acts { display: flex; align-items: center; gap: 18px; margin-inline-start: auto; }
.ksp-set-fill { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.ksp-set-fill__label { font-size: 12px; font-weight: 700; line-height: 1.2; color: var(--ksp-text); white-space: nowrap; }
.ksp-set-fill__bar { display: block; width: 120px; height: 6px; border-radius: 999px; background: var(--ksp-surface-2); overflow: hidden; }
.ksp-set-fill__bar > span { display: block; height: 100%; border-radius: inherit; background: #ec003f; transition: width .3s ease; }
.ksp-set-view { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 36px; padding: 0 14px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-size: 13px; font-weight: 700; white-space: nowrap; transition: border-color .15s; }
.ksp-set-view:hover { border-color: #d6d3d1; color: var(--ksp-text); }
.ksp-set-view .material-symbols-rounded { font-size: 17px; color: var(--ksp-muted); }

/* Gövde: 280px yapışkan bölüm menüsü + içerik */
.ksp-set-grid { display: grid; grid-template-columns: 280px minmax(0, 1fr); align-items: start; gap: 20px; margin-top: 16px; }
.ksp-set-side { position: sticky; top: 140px; min-width: 0; }
.ksp-set-main, .ksp-set-pane { min-width: 0; }
.ksp-set-pane, .ksp-set-form { display: flex; flex-direction: column; gap: 16px; margin: 0; }
.ksp-set-nav { padding: 8px; background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; }
.ksp-set-nav__list { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; list-style: none; }
.ksp-set-nav__item { position: relative; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; color: var(--ksp-text); transition: background .15s; }
.ksp-set-nav__item:hover { background: var(--set-soft-bg); color: var(--ksp-text); }
.ksp-set-nav__item:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(225, 29, 72, .22); }
.ksp-set-nav__item.is-active { background: var(--set-rose-bg); }
.ksp-set-nav__item.is-active::before { content: ""; position: absolute; top: 9px; bottom: 9px; inset-inline-start: 0; width: 3px; border-start-end-radius: 3px; border-end-end-radius: 3px; background: #ec003f; }
.ksp-set-nav__ico { width: 36px; height: 36px; flex-shrink: 0; display: grid; place-items: center; border-radius: 10px; background: var(--ksp-surface-2); color: var(--set-soft); transition: background .15s, color .15s; }
.ksp-set-nav__ico .material-symbols-rounded { font-size: 19px; }
.ksp-set-nav__item.is-active .ksp-set-nav__ico { background: var(--set-rose-bg); box-shadow: inset 0 0 0 1px var(--set-rose-line); color: #ec003f; }
.ksp-set-nav__text { flex: 1; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.ksp-set-nav__label { font-size: 13.5px; font-weight: 800; line-height: 1.3; }
.ksp-set-nav__hint { font-size: 11.5px; line-height: 1.35; color: var(--ksp-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-set-nav__ok { display: none; color: var(--set-green); }
.ksp-set-nav__ok .material-symbols-rounded { font-size: 18px; font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24; }
.ksp-set-nav__miss { flex-shrink: 0; display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 999px; background: var(--set-amber-bg); color: var(--set-amber-ink); font-size: 10.5px; font-weight: 800; line-height: 1; }
.ksp-set-nav__item.is-complete .ksp-set-nav__ok { display: inline-flex; }
.ksp-set-nav__item.is-complete .ksp-set-nav__miss { display: none; }
.ksp-set-nav__note { display: flex; align-items: flex-start; gap: 6px; margin: 6px 4px 0; padding: 10px 6px 4px; border-top: 1px solid var(--set-line); font-size: 11.5px; line-height: 1.45; color: var(--ksp-muted); }
.ksp-set-nav__note .material-symbols-rounded { font-size: 15px; color: #ec003f; font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24; }

/* İçerik kartı */
.ksp-set-card { min-width: 0; padding: 20px 22px; background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; }
.ksp-set-card__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ksp-set-card__title { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; min-width: 0; margin: 0; font-size: 15px; font-weight: 800; letter-spacing: 0; line-height: 1.35; color: var(--ksp-text); }
.ksp-set-card__title .material-symbols-rounded { font-size: 18px; color: var(--set-rose); }
.ksp-set-card__count { font-weight: 700; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-set-card__lead { margin: 3px 0 14px; font-size: 12px; line-height: 1.5; color: var(--ksp-muted); }
.ksp-set-note { display: flex; align-items: flex-start; gap: 6px; margin: 10px 0 0; font-size: 12px; line-height: 1.5; color: var(--ksp-muted); }
.ksp-set-note .material-symbols-rounded { margin-top: 1px; font-size: 15px; color: var(--set-faint); }
.ksp-set-warn { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 9px 12px; border: 1px solid var(--set-amber-line); border-radius: 10px; background: var(--set-amber-bg); color: var(--set-amber-text); font-size: 12.5px; font-weight: 600; line-height: 1.5; }
.ksp-set-warn .material-symbols-rounded { font-size: 18px; color: #d97706; }
.ksp-set-card > .ksp-set-warn { margin-bottom: 12px; }
.ksp-set-pill { flex-shrink: 0; display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--set-soft); font-size: 11.5px; font-weight: 800; font-variant-numeric: tabular-nums; }
.ksp-set-pill.is-full { background: var(--set-amber-bg); color: var(--set-amber-ink); }

/* Banner önizleme: salon sayfası üst alanının küçük kopyası (2fr ana + 1fr 2×2) */
.ksp-set-banner { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 8px; height: 220px; }
.ksp-set-banner__side { display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 8px; min-height: 0; }
.ksp-set-banner__slot { position: relative; min-width: 0; min-height: 0; border-radius: 8px; background: var(--ksp-surface-2); overflow: hidden; }
.ksp-set-banner__slot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ksp-set-banner__ph { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 24px; color: var(--set-box); }
.ksp-set-banner__slot:not(.is-empty) .ksp-set-banner__ph { display: none; }
.ksp-set-banner__main { border-radius: 12px; background: linear-gradient(135deg, #57534e, #1c1917); }
.ksp-set-banner__main .ksp-set-banner__ph { top: 42%; font-size: 40px; color: rgba(255, 255, 255, .22); }
.ksp-set-banner__main::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(12, 10, 9, .8) 0%, rgba(12, 10, 9, .35) 38%, rgba(12, 10, 9, 0) 68%); pointer-events: none; }
.ksp-set-banner__badge { position: absolute; z-index: 1; top: 10px; inset-inline-start: 10px; display: inline-flex; align-items: center; max-width: calc(100% - 20px); height: 22px; padding: 0 9px; border-radius: 999px; background: rgba(28, 25, 23, .72); color: #fff; font-size: 11px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.ksp-set-banner__cap { position: absolute; z-index: 1; inset-inline: 14px; bottom: 12px; display: flex; flex-direction: column; gap: 2px; min-width: 0; color: #fff; }
.ksp-set-banner__cap strong { font-size: 16px; font-weight: 800; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 1px 8px rgba(0, 0, 0, .35); }
.ksp-set-banner__cap small { font-size: 11px; line-height: 1.35; color: rgba(255, 255, 255, .86); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Tanıtım videosu banner'da açıkken ana kutuda video kapağı + oynat rozeti (app.js video bloğu açar) */
.ksp-set-banner__video { position: absolute; inset: 0; display: grid; place-items: center; background: #0c0a09; }
.ksp-set-banner__play { position: relative; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: rgba(12, 10, 9, .55); color: #fff; box-shadow: 0 6px 18px -8px rgba(0, 0, 0, .8); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.ksp-set-banner__play .material-symbols-rounded { font-size: 26px; font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24; }

/* Görsel yükleme: bırakma alanı + kuyruk | önerilen boyutlar */
.ksp-set-upl { display: grid; grid-template-columns: minmax(0, 1fr) 340px; align-items: start; gap: 16px; } /* kuyruk uzayınca boyut kutusu boş uzamasın */
.ksp-set-upl__main { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ksp-set-drop { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 230px; margin: 0; padding: 28px; border: 2px dashed var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); text-align: center; transition: border-color .15s, background .15s; }
.ksp-set-drop.is-over { border-color: #ec003f; background: #fff1f2; }
[data-bs-theme="dark"] .ksp-set-drop.is-over { background: var(--set-rose-bg); }
.ksp-set-drop.is-full { opacity: .55; }
.ksp-set-drop.is-full .ksp-set-pick { pointer-events: none; }
.ksp-set-drop__icon .material-symbols-rounded { font-size: 44px; color: #ec003f; }
.ksp-set-drop__title { margin-top: 2px; font-size: 14px; font-weight: 800; line-height: 1.35; color: var(--ksp-text); }
.ksp-set-drop__or { font-size: 12px; color: var(--ksp-muted); }
.ksp-set-drop .ksp-set-pick { margin: 4px 0 6px; }
.ksp-set-drop__meta { font-size: 11.5px; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-set-dark { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 40px; margin: 0; padding: 0 16px; border: 0; border-radius: 10px; background: var(--set-dark-btn); color: var(--set-dark-btn-ink); font-size: 13px; font-weight: 700; white-space: nowrap; cursor: pointer; transition: background .15s; }
.ksp-set-dark:hover { background: var(--set-dark-btn-hover); color: var(--set-dark-btn-ink); }
.ksp-set-dark:has(input:focus-visible), .ksp-set-dark:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(225, 29, 72, .3); }
.ksp-set-dark .material-symbols-rounded { font-size: 18px; }
.ksp-set-dark.is-busy { opacity: .7; pointer-events: none; }
.ksp-set-file { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; opacity: 0; overflow: hidden; clip-path: inset(50%); }
.ksp-set-queue { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-set-qi { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 8px 10px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); }
.ksp-set-qi__thumb { width: 40px; height: 40px; flex-shrink: 0; border-radius: 8px; background: var(--ksp-surface-2); object-fit: cover; }
.ksp-set-qi__body { flex: 1; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ksp-set-qi__line { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.ksp-set-qi__name { flex: 1; min-width: 0; font-size: 12.5px; font-weight: 700; color: var(--ksp-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-set-qi__size { flex-shrink: 0; font-size: 11.5px; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-set-qi__msg { margin: 0; font-size: 11.5px; line-height: 1.4; color: var(--ksp-muted); }
.ksp-set-qi__state { width: 22px; flex-shrink: 0; display: grid; place-items: center; color: var(--set-faint); }
.ksp-set-qi__state .material-symbols-rounded { font-size: 20px; font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24; }
.ksp-set-qi.is-done .ksp-set-qi__state { color: var(--set-green); }
.ksp-set-qi.is-done .ksp-set-bar > span { background: var(--set-green); }
.ksp-set-qi.is-error { border-color: var(--set-rose-line); }
.ksp-set-qi.is-error .ksp-set-qi__state, .ksp-set-qi.is-error .ksp-set-qi__msg { color: var(--set-rose); }
.ksp-set-qi.is-error .ksp-set-bar { display: none; }
.ksp-set-bar { display: block; width: 100%; height: 4px; border-radius: 999px; background: var(--ksp-surface-2); overflow: hidden; }
.ksp-set-bar > span { display: block; width: 0; height: 100%; border-radius: inherit; background: #ec003f; transition: width .2s; }
.ksp-set-specs { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 14px 16px; border: 1px solid var(--set-line); border-radius: 14px; background: var(--set-soft-bg); }
.ksp-set-specs__title { margin: 0; font-size: 13px; font-weight: 800; letter-spacing: 0; line-height: 1.35; color: var(--ksp-text); }
.ksp-set-specs__list { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.ksp-set-spec { display: flex; align-items: flex-start; gap: 12px; padding: 10px 0; }
.ksp-set-spec + .ksp-set-spec { border-top: 1px solid var(--ksp-border); }
.ksp-set-spec__ico { width: 36px; height: 36px; flex-shrink: 0; display: grid; place-items: center; border-radius: 10px; background: var(--set-rose-bg); color: var(--set-rose); }
.ksp-set-spec__ico .material-symbols-rounded { font-size: 20px; }
.ksp-set-spec__body { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.ksp-set-spec__name { font-size: 13px; font-weight: 800; line-height: 1.35; color: var(--ksp-text); }
.ksp-set-spec__rec { font-size: 13px; font-weight: 800; line-height: 1.4; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-set-spec__min { font-size: 11.5px; line-height: 1.4; color: var(--ksp-muted); }
.ksp-set-spec__hint { font-size: 11px; line-height: 1.4; color: var(--ksp-muted); } /* #a8a29e soft zeminde ≈2,5:1 idi */
.ksp-set-specs__note { display: flex; align-items: flex-start; gap: 6px; margin: 0; padding-top: 10px; border-top: 1px solid var(--ksp-border); font-size: 11.5px; line-height: 1.45; color: var(--ksp-muted); }
.ksp-set-specs__note .material-symbols-rounded { font-size: 16px; color: var(--set-rose); }

/* Galeri ızgarası */
.ksp-set-gal { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.ksp-set-gitem { position: relative; display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); overflow: hidden; transition: border-color .15s, box-shadow .15s, opacity .15s; }
.ksp-set-gitem.is-banner { border-color: var(--set-rose-line); }
.ksp-set-gitem.is-dragging { opacity: .4; }
.ksp-set-gitem.is-busy { opacity: .6; pointer-events: none; }
.ksp-set-gitem.is-moved { box-shadow: 0 0 0 3px rgba(225, 29, 72, .22); }
.ksp-set-gitem__media { position: relative; aspect-ratio: 4 / 3; background: var(--ksp-surface-2); }
/* Görsel mutlak konumlu: dikey / 4:3'ten dik görseller kutuyu uzatmaz (aspect-ratio'nun otomatik min-height'ı içerik boyuna izin veriyordu) */
.ksp-set-gitem__media { container-type: inline-size; overflow: hidden; }
.ksp-set-gitem__media img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.ksp-set-gitem__order { position: absolute; top: 8px; inset-inline-start: 8px; display: inline-flex; align-items: center; justify-content: center; gap: 3px; min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px; background: rgba(28, 25, 23, .72); color: #fff; font-size: 11px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.ksp-set-gitem.is-banner .ksp-set-gitem__order { padding: 0 8px 0 6px; background: #ec003f; box-shadow: 0 6px 14px -8px rgba(236, 0, 63, .9); }
.ksp-set-gitem__order .material-symbols-rounded { font-size: 14px; font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 20; }
.ksp-set-gitem__flags { position: absolute; top: 8px; inset-inline-end: 8px; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; max-width: calc(100% - 96px); }
/* Dar kart (992–1100 px'te 3 sütun ~195 px, ≤767 2 sütun): "Düşük çözünürlük" (≈103 px) + rozet payı 96 px sığmıyorsa
   işaretler görselin altına, sıra rozetiyle çakışmadan ve kırpılmadan */
@container (max-width: 204px) {
  .ksp-set-gitem__flags { top: auto; bottom: 8px; inset-inline: 8px; max-width: none; flex-direction: row; flex-wrap: wrap-reverse; align-items: flex-end; justify-content: flex-start; }
}
.ksp-set-flag { display: inline-flex; align-items: center; max-width: 100%; height: 20px; padding: 0 7px; border: 1px solid; border-radius: 999px; font-size: 10.5px; font-weight: 800; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-set-flag--low { border-color: #fde68a; background: #fffbeb; color: #b45309; }
.ksp-set-flag--demo { border-color: #e7e5e4; background: rgba(245, 245, 244, .94); color: #57534e; }
.ksp-set-gitem__body { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; padding: 10px 12px 12px; }
.ksp-set-gitem__meta { margin: 0; font-size: 11.5px; line-height: 1.4; color: var(--ksp-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.ksp-set-gitem__alt { margin: 0; font-size: 12px; line-height: 1.4; color: var(--ksp-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-set-gitem__acts { display: flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 8px; }
.ksp-set-inline { display: contents; }
.ksp-set-ibtn { width: 32px; height: 32px; flex-shrink: 0; display: grid; place-items: center; padding: 0; border: 1px solid var(--ksp-border); border-radius: 8px; background: var(--ksp-surface); color: var(--set-soft); transition: border-color .15s, background .15s, color .15s; }
.ksp-set-ibtn:hover { border-color: #d6d3d1; background: var(--set-soft-bg); color: var(--ksp-text); }
.ksp-set-ibtn:focus-visible { outline: 0; border-color: #fb7185; box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
.ksp-set-ibtn:disabled { opacity: .4; pointer-events: none; }
.ksp-set-ibtn .material-symbols-rounded { font-size: 18px; }
.ksp-set-ibtn--drag { color: var(--set-faint); cursor: grab; touch-action: none; }
.ksp-set-ibtn--drag:active { cursor: grabbing; }
.ksp-set-ibtn--banner:hover { border-color: #fde68a; background: #fffbeb; color: #d97706; }
.ksp-set-ibtn--delete { margin-inline-start: auto; color: #e11d48; }
.ksp-set-ibtn--delete:hover { border-color: #fecdd3; background: #fff1f2; color: #be123c; }
.ksp-set-gitem.is-banner .ksp-set-ibtn--banner, .ksp-set-ibtn--left, .ksp-set-ibtn--right { display: none; }
/* Dokunmatik / dar ekran: sürükleme yerine oklar */
@media (hover: none), (pointer: coarse), (max-width: 767.98px) {
  .ksp-set-ibtn--drag { display: none; }
  .ksp-set-ibtn--left, .ksp-set-ibtn--right { display: grid; }
}
.ksp-set-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 32px 16px; border: 1px dashed #d6d3d1; border-radius: 14px; text-align: center; }
.ksp-set-empty > .material-symbols-rounded { font-size: 40px; color: #d6d3d1; }
.ksp-set-empty strong { font-size: 14px; font-weight: 800; color: var(--ksp-text); }
.ksp-set-empty p { max-width: 340px; margin: 0; font-size: 12.5px; color: var(--ksp-muted); }

/* Tanıtım Videosu kartı (partials/settings-video.php, app.js "@kokpit-ayarlar" video bloğu) */
.ksp-set-vid__ytrow { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ksp-set-vid__ytform { flex: 1; display: flex; align-items: center; gap: 10px; min-width: 0; margin: 0; }
.ksp-set-vid__ytform .ksp-set-control { flex: 1; min-width: 0; }
.ksp-set-vid__ytsave, .ksp-set-vid__ytdel { flex-shrink: 0; margin: 0; }
.ksp-set-vid__ytsave .spinner-border { display: none; width: 15px; height: 15px; border-width: 2px; }
.ksp-set-vid__ytsave.is-busy .spinner-border { display: inline-block; }
.ksp-set-vid__ytsave.is-busy .material-symbols-rounded { display: none; }
.ksp-set-vid__ytlink { display: inline-flex; align-items: center; gap: 3px; font-size: 12.5px; font-weight: 700; line-height: 1.45; color: var(--set-soft); white-space: nowrap; }
.ksp-set-vid__ytlink:hover { color: var(--ksp-text); text-decoration: underline; }
.ksp-set-vid__ytlink .material-symbols-rounded { font-size: 15px; }
.ksp-set-vid__or { display: flex; align-items: center; gap: 12px; margin: 18px 0 12px; color: var(--ksp-muted); font-size: 12px; font-weight: 700; }
.ksp-set-vid__or::before, .ksp-set-vid__or::after { content: ""; flex: 1; height: 1px; background: var(--set-line); }
.ksp-set-vid__pick { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; margin: 0; }
.ksp-set-vid__pick .ksp-set-pick.is-busy { opacity: .7; pointer-events: none; }
.ksp-set-vid__meta { font-size: 11.5px; line-height: 1.45; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-set-vid .ksp-set-note { margin-top: 8px; }
.ksp-set-vid__uperr { margin-top: 8px; }
/* Durum: yükleniyor · işleniyor · hazır · hata (biri görünür) */
.ksp-set-vid__state { display: flex; flex-direction: column; margin-top: 14px; }
.ksp-set-vid__state:not(:has(.ksp-set-vid__row:not([hidden]))) { margin-top: 0; }
.ksp-set-vid__row { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); }
.ksp-set-vid__row--ready { border-color: var(--set-green-line); background: var(--set-green-bg); }
.ksp-set-vid__row--failed { border-color: var(--set-rose-line); background: var(--set-rose-bg); }
.ksp-set-vid__thumb { position: relative; width: 96px; height: 54px; flex-shrink: 0; display: grid; place-items: center; border-radius: 8px; background: #1c1917; overflow: hidden; }
.ksp-set-vid__thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* Kapağı olmayan durumlar (yükleniyor / işleniyor / hata): büyük boş kutu yerine simge rozeti */
.ksp-set-vid__thumb.is-ph { width: 44px; height: 44px; border-radius: 10px; background: var(--ksp-surface-2); color: var(--set-soft); }
.ksp-set-vid__thumb.is-error { background: rgba(225, 29, 72, .14); color: var(--set-rose); }
.ksp-set-vid__thumb .material-symbols-rounded { font-size: 22px; }
.ksp-set-vid__thumb .spinner-border { width: 20px; height: 20px; border-width: 2px; color: var(--set-soft); }
/* Kapak + rozet gerçek bir düğme (önizleme penceresini açar): süs değil, tıklanabilir */
.ksp-set-vid__thumb--btn { padding: 0; border: 0; cursor: pointer; }
.ksp-set-vid__thumb--btn:hover .ksp-set-vid__play, .ksp-set-vid__thumb--btn:focus-visible .ksp-set-vid__play { background: rgba(12, 10, 9, .85); transform: scale(1.06); }
.ksp-set-vid__thumb--btn:focus-visible { outline: 3px solid rgba(225, 29, 72, .35); outline-offset: 2px; }
.ksp-set-vid__thumb--btn:disabled { cursor: default; }
.ksp-set-vid__play { position: relative; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: rgba(12, 10, 9, .6); color: #fff; transition: background .15s, transform .15s; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.ksp-set-vid__thumb .ksp-set-vid__play .material-symbols-rounded { font-size: 18px; font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 20; }
.ksp-set-vid__body { flex: 1; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ksp-set-vid__msg { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0; font-size: 12.5px; font-weight: 700; line-height: 1.4; color: var(--ksp-text); }
.ksp-set-vid__ok { font-size: 17px; color: var(--set-green); font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24; }
/* Açık temada #009966 üzerinde beyaz 3,65:1 kalıyordu; koyu yeşil zeminle 5,5:1 (WCAG AA) */
.ksp-set-vid__badge { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 999px; background: var(--set-green-ink); color: #fff; font-size: 10.5px; font-weight: 800; line-height: 1; }
[data-bs-theme="dark"] .ksp-set-vid__badge { background: var(--set-green); color: #052e21; }
.ksp-set-vid__sub { margin: 0; font-size: 11.5px; line-height: 1.45; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-set-vid__row--failed .ksp-set-vid__msg { color: var(--set-rose-ink); }
/* Metin düğmeleri: WCAG 2.2 AA asgari hedef (24×24) altında kalmasın; ölçek Ayarlar standardında (13px) */
.ksp-set-vid__acts { display: flex; align-items: center; gap: 8px; flex-shrink: 0; margin-inline-start: auto; }
.ksp-set-vid__acts .ksp-set-textbtn, .ksp-set-vid__ytdel .ksp-set-textbtn { min-height: 32px; padding: 0 8px; border-radius: 8px; }
.ksp-set-vid__acts .ksp-set-textbtn:hover, .ksp-set-vid__ytdel .ksp-set-textbtn:hover { background: var(--set-soft-bg); }
.ksp-set-vid__acts .ksp-set-textbtn .material-symbols-rounded { font-size: 17px; }
.ksp-set-vid__row .ksp-set-bar { max-width: 340px; }
/* "Banner'da oynat" anahtarı */
.ksp-set-vid__switch { margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--set-line); }
.ksp-set-vid__switch .ksp-set-switch { grid-area: auto; }
.ksp-set-vid__switch .ksp-set-hint { margin-top: 6px; margin-inline-start: 46px; }
.ksp-set-vid__switch:has(input:disabled) .form-check-label { color: var(--ksp-muted); cursor: default; }
.ksp-set-vid__switch:has(input:disabled) .form-check-input { opacity: .55; cursor: default; }
/* Dar ekran: adres tek satır, "Kaldır" adresin yanında, "Kaydet" altında tam genişlik */
@media (max-width: 767.98px) {
  .ksp-set-vid__ytrow { align-items: flex-start; }
  .ksp-set-vid__ytform { flex-wrap: wrap; }
  .ksp-set-vid__ytform .ksp-set-control { flex: 1 0 100%; }
  .ksp-set-vid__ytsave { flex: 1; }
  .ksp-set-vid__ytdel { padding-top: 5px; }
  .ksp-set-vid__row { flex-wrap: wrap; }
  .ksp-set-vid__acts { flex-basis: 100%; justify-content: flex-end; margin-inline-start: 0; padding-top: 2px; }
  .ksp-set-vid__switch .ksp-set-hint { margin-inline-start: 0; }
}

/* Form alanları */
.ksp-set-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ksp-set-cols--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ksp-set-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; }
.ksp-set-cols + .ksp-set-field, .ksp-set-field + .ksp-set-field, .ksp-set-field + .ksp-set-cols { margin-top: 16px; }
.ksp-set-cols > .ksp-set-field { margin-top: 0; }
.ksp-set-label { display: flex; align-items: center; gap: 4px; margin: 0; padding: 0; font-size: 13px; font-weight: 600; line-height: 1.4; color: var(--set-ink2); }
legend.ksp-set-label { float: none; width: auto; margin-bottom: 6px; font-size: 13px; }
.ksp-set-input { width: 100%; height: 42px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 10px; background-color: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 14px; transition: border-color .15s, box-shadow .15s; }
.ksp-set-input::placeholder { color: #a8a29e; }
.ksp-set-input:focus { outline: 0; border-color: #fb7185; box-shadow: 0 0 0 3px rgba(225, 29, 72, .12); }
.ksp-set-input[readonly] { background-color: var(--set-soft-bg); color: var(--set-soft); }
.ksp-set-input[readonly]:focus { border-color: var(--ksp-border); box-shadow: none; }
.ksp-set-textarea { height: auto; min-height: 84px; padding: 10px 12px; line-height: 1.55; resize: vertical; }
select.ksp-set-input { -webkit-appearance: none; appearance: none; padding-inline-end: 32px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2378716c'%3E%3Cpath d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 8px center; background-size: 20px; cursor: pointer; }
[dir="rtl"] select.ksp-set-input { background-position: left 8px center; }
.ksp-set-field:has(> .ksp-set-err:not(:empty)) .ksp-set-input, .ksp-set-field:has(> .ksp-set-field__foot > .ksp-set-err:not(:empty)) .ksp-set-input, .ksp-set-input.is-invalid { border-color: #e11d48; }
.ksp-set-err { margin: 0; font-size: 12px; line-height: 1.45; color: #e11d48; }
.ksp-set-err:empty { display: none; }
.ksp-set-hint { margin: 0; font-size: 12px; line-height: 1.45; color: var(--ksp-muted); }
.ksp-set-field__foot { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; min-width: 0; }
.ksp-set-count { flex-shrink: 0; margin-inline-start: auto; font-size: 11.5px; line-height: 1.45; color: var(--set-faint); font-variant-numeric: tabular-nums; }
.ksp-set-count.is-near { color: var(--set-amber-ink); font-weight: 700; }
.ksp-set-control { position: relative; display: block; }
.ksp-set-control > .material-symbols-rounded { position: absolute; top: 50%; transform: translateY(-50%); font-size: 18px; color: var(--set-faint); pointer-events: none; }
.ksp-set-control.is-locked > .material-symbols-rounded { inset-inline-end: 12px; font-size: 17px; }
.ksp-set-control.is-locked .ksp-set-input { padding-inline-end: 38px; }
.ksp-set-control--icon > .material-symbols-rounded { inset-inline-start: 12px; }
.ksp-set-control--icon .ksp-set-input { padding-inline-start: 40px; font-variant-numeric: tabular-nums; }
.ksp-set-control--wa > .material-symbols-rounded { color: var(--set-green); }
.ksp-set-control--wa .ksp-set-input[readonly] { cursor: not-allowed; }
.ksp-set-group { display: flex; min-width: 0; }
.ksp-set-group__pre { width: 40px; flex-shrink: 0; display: grid; place-items: center; border: 1px solid var(--ksp-border); border-inline-end: 0; border-start-start-radius: 10px; border-end-start-radius: 10px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: 14px; font-weight: 700; }
.ksp-set-group .ksp-set-input { min-width: 0; border-start-start-radius: 0; border-end-start-radius: 0; }
.ksp-set-check { position: relative; display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; font-weight: 600; line-height: 1.4; color: var(--ksp-text); cursor: pointer; }
.ksp-set-check input { position: absolute; width: 18px; height: 18px; margin: 0; opacity: 0; }
.ksp-set-check__box { width: 18px; height: 18px; flex-shrink: 0; display: grid; place-items: center; border: 1.5px solid var(--set-box); border-radius: 5px; background: var(--ksp-surface); color: transparent; transition: background .15s, border-color .15s; }
.ksp-set-check__box .material-symbols-rounded { font-size: 15px; font-variation-settings: "FILL" 0, "wght" 700, "GRAD" 0, "opsz" 20; }
.ksp-set-check input:checked + .ksp-set-check__box { border-color: #e11d48; background: #e11d48; color: #fff; }
.ksp-set-check input:focus-visible + .ksp-set-check__box { box-shadow: 0 0 0 3px rgba(225, 29, 72, .22); }
.ksp-set-walink { display: inline-flex; align-items: center; gap: 3px; font-size: 12.5px; font-weight: 700; line-height: 1.4; color: var(--set-green); white-space: nowrap; }
.ksp-set-walink:hover { color: var(--set-green-ink); text-decoration: underline; }
.ksp-set-walink .material-symbols-rounded { font-size: 15px; }
.ksp-set-textbtn { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: none; color: var(--set-soft); font-size: 13px; font-weight: 700; white-space: nowrap; }
.ksp-set-textbtn:hover { color: var(--ksp-text); text-decoration: underline; }
.ksp-set-textbtn--rose { color: #e11d48; }
.ksp-set-textbtn--rose:hover { color: #be123c; }
.ksp-set-textbtn:disabled { opacity: .5; pointer-events: none; }

/* Logo */
.ksp-set-logo { display: flex; align-items: center; gap: 20px; }
.ksp-set-logo__pic { position: relative; width: 96px; height: 96px; flex-shrink: 0; display: grid; place-items: center; border-radius: 20px; background: linear-gradient(135deg, #ff2056, #ec003f); color: #fff; font-size: 28px; font-weight: 800; letter-spacing: .01em; overflow: hidden; box-shadow: 0 12px 24px -16px rgba(236, 0, 63, .8); }
.ksp-set-logo__pic img { position: absolute; inset: 0; width: 100%; height: 100%; background: var(--ksp-surface); object-fit: cover; }
.ksp-set-logo__pic.has-img { box-shadow: inset 0 0 0 1px var(--ksp-border); }
.ksp-set-logo__pic.has-img [data-set-logo-initials] { visibility: hidden; }
.ksp-set-logo__body { flex: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.ksp-set-logo__acts { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
.ksp-set-logo__spec { margin: 0; font-size: 12px; line-height: 1.45; color: var(--ksp-muted); }
.ksp-set-logo__body .ksp-set-bar { max-width: 240px; }

/* Fiyat segmenti: 4 seçim kartı */
.ksp-set-prices { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.ksp-set-price { position: relative; display: flex; flex-direction: column; gap: 2px; min-width: 0; margin: 0; padding: 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); cursor: pointer; transition: border-color .15s, background .15s; }
.ksp-set-price:hover { border-color: #fda4af; }
.ksp-set-price input { position: absolute; opacity: 0; pointer-events: none; }
.ksp-set-price__sym { font-size: 18px; font-weight: 800; line-height: 1.3; color: var(--ksp-text); }
.ksp-set-price__label { font-size: 11.5px; line-height: 1.35; color: var(--ksp-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-set-price__check { position: absolute; top: 8px; inset-inline-end: 8px; font-size: 18px; color: #ec003f; opacity: 0; transform: scale(.6); transition: opacity .15s, transform .15s; font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24; }
.ksp-set-price:has(input:checked) { border-color: #ec003f; background: #fff1f2; box-shadow: inset 0 0 0 .5px #ec003f; }
[data-bs-theme="dark"] .ksp-set-price:has(input:checked) { background: var(--set-rose-bg); border-color: #fb7185; box-shadow: inset 0 0 0 .5px #fb7185; }
.ksp-set-price:has(input:checked) .ksp-set-price__check { opacity: 1; transform: none; }
.ksp-set-price:has(input:focus-visible) { box-shadow: 0 0 0 3px rgba(225, 29, 72, .22); }
.ksp-set-clear { position: relative; align-self: flex-start; margin: 4px 0 0; color: var(--set-soft); font-size: 12.5px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.ksp-set-clear:hover { color: var(--ksp-text); }
.ksp-set-clear input { position: absolute; opacity: 0; pointer-events: none; }
.ksp-set-clear:has(input:checked) { color: var(--set-faint); text-decoration: none; cursor: default; }
.ksp-set-clear:has(input:focus-visible) { border-radius: 4px; box-shadow: 0 0 0 3px rgba(225, 29, 72, .22); }

/* Adres + salon sayfası bilgi kartı önizlemesi */
.ksp-set-addr { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin-top: 10px; }
.ksp-set-addr .ksp-set-note { margin: 0; }
.ksp-set-place { display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 10px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface-2); color: var(--set-soft); font-size: 12px; font-weight: 700; white-space: nowrap; }
.ksp-set-place .material-symbols-rounded { font-size: 15px; color: var(--set-faint); }
.ksp-set-pv { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px 20px; padding: 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--set-soft-bg); }
.ksp-set-pv__rows { flex: 1 1 260px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ksp-set-pv__row { display: flex; align-items: flex-start; gap: 6px; margin: 0; font-size: 13px; font-weight: 600; line-height: 1.45; color: var(--set-ink2); overflow-wrap: anywhere; }
.ksp-set-pv__row .material-symbols-rounded { font-size: 18px; }
.ksp-set-pv__row .is-rose { color: #e11d48; }
.ksp-set-pv__row .is-green { color: var(--set-green); }
.ksp-set-pv__row.is-empty { color: var(--set-faint); font-weight: 500; }
.ksp-set-pv__acts { display: flex; flex-wrap: wrap; gap: 8px; }
.ksp-set-pv__btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 40px; padding: 0 14px; border-radius: 10px; font-size: 13px; font-weight: 800; white-space: nowrap; }
.ksp-set-pv__btn .material-symbols-rounded { font-size: 18px; }
.ksp-set-pv__btn--wa { border: 1px solid var(--set-green-line); background: var(--set-green-bg); color: var(--set-green-ink); }
.ksp-set-pv__btn--book { background: #ec003f; color: #fff; box-shadow: 0 8px 16px -10px rgba(236, 0, 63, .8); }

/* Hakkında & olanaklar */
.ksp-set-ams { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-set-am { display: flex; align-items: center; gap: 8px; min-width: 0; height: 44px; padding: 0 4px 0 12px; border: 1px solid #f0efee; border-radius: 10px; background: #fafaf9; transition: opacity .15s, border-color .15s, box-shadow .15s; }
[data-bs-theme="dark"] .ksp-set-am { border-color: var(--set-line); background: var(--ksp-surface-2); }
.ksp-set-am.is-dragging { opacity: .4; }
.ksp-set-am.is-new { border-color: #a7f3d0; box-shadow: 0 0 0 3px rgba(16, 185, 129, .15); }
.ksp-set-am__ok { font-size: 17px; color: var(--set-green); font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 20; }
.ksp-set-am__text { flex: 1; min-width: 0; font-size: 13px; font-weight: 700; line-height: 1.3; color: var(--ksp-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-set-am__edit { flex: 1; min-width: 0; height: 32px; padding: 0 8px; border: 1px solid #fb7185; border-radius: 8px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 13px; font-weight: 700; box-shadow: 0 0 0 3px rgba(225, 29, 72, .12); }
.ksp-set-am__edit:focus { outline: 0; }
.ksp-set-am__acts { display: flex; align-items: center; gap: 0; flex-shrink: 0; }
.ksp-set-mini { width: 30px; height: 30px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--set-faint); transition: background .15s, color .15s; }
.ksp-set-mini:hover { background: #f0efee; color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-set-mini:hover { background: rgba(255, 255, 255, .08); }
.ksp-set-mini:focus-visible { outline: 0; box-shadow: 0 0 0 2px rgba(225, 29, 72, .35); }
.ksp-set-mini .material-symbols-rounded { font-size: 18px; }
.ksp-set-mini--drag { cursor: grab; touch-action: none; }
.ksp-set-mini--remove:hover { background: #fff1f2; color: #e11d48; }
[data-bs-theme="dark"] .ksp-set-mini--remove:hover { background: var(--set-rose-bg); color: #fda4af; }
.ksp-set-am.is-editing .ksp-set-am__text, .ksp-set-am.is-editing .ksp-set-mini--drag, .ksp-set-am.is-editing .ksp-set-mini--edit { display: none; }
.ksp-set-empty-line { display: flex; align-items: center; gap: 8px; margin: 0; padding: 12px 14px; border: 1px dashed #d6d3d1; border-radius: 10px; font-size: 12.5px; line-height: 1.45; color: var(--ksp-muted); }
[data-bs-theme="dark"] .ksp-set-empty-line, [data-bs-theme="dark"] .ksp-set-empty { border-color: var(--ksp-border); }
.ksp-set-empty-line .material-symbols-rounded { font-size: 18px; color: var(--set-box); }
.ksp-set-amadd { display: flex; gap: 8px; margin-top: 12px; }
.ksp-set-amadd .ksp-set-dark { height: 42px; }
.ksp-set-amadd + .ksp-set-err { margin-top: 6px; }
.ksp-set-sugs { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--set-line); }
.ksp-set-sugs__title { margin: 0 0 8px; font-size: 11px; font-weight: 800; letter-spacing: .06em; line-height: 1.4; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-set-sugs__list { display: flex; flex-wrap: wrap; gap: 6px; }
.ksp-set-sug { display: inline-flex; align-items: center; gap: 3px; height: 30px; padding: 0 12px 0 8px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--set-ink2); font-size: 12.5px; font-weight: 600; white-space: nowrap; transition: border-color .15s, color .15s; }
.ksp-set-sug:hover { border-color: #fda4af; color: var(--ksp-text); }
.ksp-set-sug:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
.ksp-set-sug .material-symbols-rounded { font-size: 16px; color: var(--set-rose); }

/* Çalışma saatleri */
.ksp-set-days { display: flex; flex-direction: column; }
.ksp-set-day { display: grid; grid-template-columns: 170px 104px auto minmax(0, 1fr); grid-template-areas: "name switch times copy" "err err err err"; align-items: center; column-gap: 14px; min-height: 63px; padding: 12px 0; border-bottom: 1px solid #f5f5f4; }
[data-bs-theme="dark"] .ksp-set-day { border-bottom-color: var(--set-line); }
/* Kart dar olduğunda (tablet, 992–1139 px) "Tüm açık günlere uygula" saat seçimlerinin üstüne binmesin: alt satıra, saatlerin altına iner */
.ksp-set-days { container-type: inline-size; }
@container (max-width: 760px) {
  .ksp-set-day { grid-template-columns: 170px 104px auto; grid-template-areas: "name switch times" ". . copy" "err err err"; }
  .ksp-set-day .ksp-set-copy { justify-self: start; margin-top: 4px; }
}
.ksp-set-day:first-child { padding-top: 4px; min-height: 55px; }
.ksp-set-day__name { grid-area: name; display: flex; align-items: center; gap: 8px; min-width: 0; }
.ksp-set-day__name strong { font-size: 13.5px; font-weight: 800; line-height: 1.3; color: var(--ksp-text); white-space: nowrap; }
.ksp-set-today { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 999px; background: #fff1f2; color: #e11d48; font-size: 10.5px; font-weight: 800; line-height: 1; }
[data-bs-theme="dark"] .ksp-set-today { background: var(--set-rose-bg); color: #fda4af; }
.ksp-set-switch { grid-area: switch; display: flex; align-items: center; gap: 8px; min-height: 0; margin: 0; padding: 0; }
.ksp-set-switch .form-check-input { float: none; flex-shrink: 0; width: 38px; height: 22px; margin: 0; border-color: var(--set-box); cursor: pointer; }
.ksp-set-switch .form-check-input:checked { border-color: #ec003f; background-color: #ec003f; }
.ksp-set-switch .form-check-input:focus { border-color: #fb7185; box-shadow: 0 0 0 3px rgba(225, 29, 72, .18); --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fb7185'/%3e%3c/svg%3e"); }
.ksp-set-switch .form-check-input:checked:focus { --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e"); }
.ksp-set-switch .form-check-label { font-size: 12.5px; font-weight: 700; line-height: 1.3; color: var(--ksp-text); cursor: pointer; }
/* Kapalı günde durum yalnız gri "Kapalı" hapıyla gösterilir (anahtar etiketi tekrar etmez; ekran okuyucu aria-label) */
.ksp-set-switch .is-off, .ksp-set-day.is-closed .ksp-set-switch .is-on { display: none; }
.ksp-set-day__times { grid-area: times; display: flex; align-items: center; gap: 8px; }
.ksp-set-time { width: 120px; height: 38px; padding-inline-start: 12px; font-size: 13.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ksp-set-day__dash { color: var(--set-faint); }
.ksp-set-day:has(.ksp-set-day__err:not(:empty)) .ksp-set-time { border-color: #e11d48; }
.ksp-set-closed { grid-area: times; justify-self: start; display: none; align-items: center; height: 28px; padding: 0 12px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: 12px; font-weight: 700; }
.ksp-set-day.is-closed .ksp-set-day__times { display: none; }
.ksp-set-day.is-closed .ksp-set-closed { display: inline-flex; }
.ksp-set-copy { grid-area: copy; justify-self: end; display: inline-flex; align-items: center; gap: 4px; padding: 4px 0; border: 0; background: none; color: #e11d48; font-size: 12px; font-weight: 700; white-space: nowrap; }
[data-bs-theme="dark"] .ksp-set-copy { color: #fb7185; }
.ksp-set-copy:hover { text-decoration: underline; }
.ksp-set-copy .material-symbols-rounded { font-size: 15px; }
.ksp-set-day__err { grid-area: err; margin-top: 6px; }
.ksp-set-sum { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; margin-top: 16px; padding: 14px; border-radius: 12px; background: #fafaf9; }
[data-bs-theme="dark"] .ksp-set-sum { background: var(--ksp-surface-2); }
.ksp-set-sum__line { display: flex; align-items: flex-start; gap: 8px; min-width: 0; margin: 0; font-size: 13px; font-weight: 700; line-height: 1.45; color: var(--ksp-text); }
.ksp-set-sum__line .material-symbols-rounded { margin-top: 1px; font-size: 18px; color: var(--set-rose); }
.ksp-set-status { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 6px 12px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface-2); color: var(--set-soft); font-size: 12.5px; font-weight: 700; line-height: 1.35; }
.ksp-set-status__dot { width: 8px; height: 8px; flex-shrink: 0; border-radius: 50%; background: #a8a29e; }
.ksp-set-status.is-open { border-color: #a7f3d0; background: #ecfdf5; color: #047857; }
.ksp-set-status.is-open .ksp-set-status__dot { background: #10b981; box-shadow: 0 0 0 3px rgba(16, 185, 129, .2); }
[data-bs-theme="dark"] .ksp-set-status.is-open { border-color: var(--set-green-line); background: var(--set-green-bg); color: var(--set-green-ink); }
.ksp-set-status.is-stale { opacity: .55; }

/* Kaydet çubuğu */
.ksp-set-savebar { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 12px 16px; background: var(--ksp-surface); border: 1px solid var(--ksp-border); border-radius: 16px; }
.ksp-set-savebar__dirty { display: flex; align-items: center; gap: 6px; min-width: 0; margin: 0; margin-inline-end: auto; font-size: 12.5px; font-weight: 700; color: var(--set-amber-ink); }
.ksp-set-savebar__dirty .material-symbols-rounded { font-size: 18px; }
.ksp-set-savebar__acts { display: flex; align-items: center; gap: 16px; }
.ksp-set-cancel { height: 42px; padding: 0 12px; border: 0; border-radius: 10px; background: transparent; color: var(--set-soft); font-size: 13.5px; font-weight: 700; white-space: nowrap; }
.ksp-set-cancel:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-set-cancel--link { padding: 0 2px; border-radius: 4px; }
.ksp-set-cancel--link:hover { background: none; text-decoration: underline; text-underline-offset: 3px; }
.ksp-set-save { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 42px; padding: 0 18px; border: 0; border-radius: 10px; background: #ec003f; color: #fff; font-size: 13.5px; font-weight: 800; white-space: nowrap; box-shadow: 0 8px 16px -10px rgba(236, 0, 63, .8); transition: background .15s; }
.ksp-set-save:hover { background: #c70036; color: #fff; }
.ksp-set-save:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(225, 29, 72, .3); }
.ksp-set-save .material-symbols-rounded { font-size: 18px; }
.ksp-set-save .spinner-border { display: none; width: 16px; height: 16px; border-width: 2px; }
.ksp-set-save.is-busy { pointer-events: none; opacity: .8; }
.ksp-set-save.is-busy .spinner-border { display: inline-block; }
.ksp-set-save.is-busy .material-symbols-rounded { display: none; }

/* Modallar (müşteri modalı kalıbı) */
.ksp-set-modal .modal-dialog { max-width: 440px; }
.ksp-set-modal .modal-content { border: 0; border-radius: 16px; background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 30px 60px -20px rgba(28, 25, 23, .4); overflow: hidden; }
.ksp-set-mhead { gap: 10px; padding: 18px 22px 14px; border-bottom: 1px solid var(--set-line); }
.ksp-set-mhead h2 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 17px; font-weight: 800; letter-spacing: 0; color: var(--ksp-text); }
.ksp-set-mbadge { width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center; border-radius: 10px; background: var(--set-rose-bg); color: #e11d48; }
.ksp-set-mbadge .material-symbols-rounded { font-size: 19px; }
.ksp-set-mclose { width: 32px; height: 32px; flex-shrink: 0; display: grid; place-items: center; margin: -4px -8px -4px auto; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--ksp-muted); }
.ksp-set-mclose:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-set-mbody { display: flex; flex-direction: column; gap: 14px; padding: 16px 22px; }
.ksp-set-mimg { display: block; width: 100%; aspect-ratio: 16 / 10; border-radius: 12px; background: var(--ksp-surface-2); object-fit: cover; }
/* Tanıtım videosu önizleme penceresi (setVideoPreviewModal): kaynak yalnız açılınca verilir */
.ksp-set-mvideo { display: block; width: 100%; max-height: 62vh; border-radius: 12px; background: #0c0a09; }
.ksp-set-mtext { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--set-ink2); }
.ksp-set-mfoot { flex-wrap: nowrap; justify-content: flex-end; gap: 8px; padding: 14px 22px 18px; border-top: 1px solid var(--set-line); }
.ksp-set-mfoot > * { margin: 0; }

/* Bildirim yığını: sağ alt (mevcut .ksp-toast bileşeni) */
.ksp-toast-stack.ksp-set-toasts { top: auto; bottom: 24px; }
.ksp-set-toasts .ksp-toast { font-size: 13.5px; font-weight: 600; max-width: min(460px, 100%); }

/* Koyu tema: sabit açık renkli yüzeyler */
[data-bs-theme="dark"] .ksp-set-flag--low { border-color: var(--set-amber-line); background: rgba(41, 37, 36, .92); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-set-flag--demo { border-color: rgba(255, 255, 255, .16); background: rgba(41, 37, 36, .92); color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-set-ibtn { border-color: rgba(255, 255, 255, .12); }
[data-bs-theme="dark"] .ksp-set-ibtn:hover { border-color: rgba(255, 255, 255, .22); background: var(--ksp-surface-2); }
[data-bs-theme="dark"] .ksp-set-ibtn--banner:hover { border-color: var(--set-amber-line); background: var(--set-amber-bg); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-set-ibtn--delete { color: #fb7185; }
[data-bs-theme="dark"] .ksp-set-ibtn--delete:hover { border-color: var(--set-rose-line); background: var(--set-rose-bg); color: #fda4af; }
[data-bs-theme="dark"] .ksp-set-view:hover { border-color: rgba(255, 255, 255, .2); }
[data-bs-theme="dark"] .ksp-set-textbtn--rose { color: #fb7185; }
[data-bs-theme="dark"] .ksp-set-price:hover { border-color: rgba(251, 113, 133, .6); }

@media (max-width: 1199.98px) {
  .ksp-set-upl { grid-template-columns: minmax(0, 1fr); }
  .ksp-set-gal { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ksp-set-cols--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* <992: menü yatay kaydırılan hap satırı */
@media (max-width: 991.98px) {
  .ksp-set-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; margin-top: 14px; }
  .ksp-set-side { position: static; }
  .ksp-set-nav { padding: 0; border: 0; border-radius: 0; background: none; }
  .ksp-set-nav__list { flex-direction: row; gap: 8px; margin-inline: -1rem; padding: 2px 1rem; overflow-x: auto; scrollbar-width: none; scroll-padding-inline: 1rem; scroll-snap-type: x proximity; }
  .ksp-set-nav__list::-webkit-scrollbar { display: none; }
  .ksp-set-nav__list > li { flex-shrink: 0; scroll-snap-align: start; }
  .ksp-set-nav__item { gap: 8px; height: 44px; padding: 0 12px 0 6px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); white-space: nowrap; }
  .ksp-set-nav__item.is-active { border-color: #fda4af; }
  .ksp-set-nav__item.is-active::before, .ksp-set-nav__hint, .ksp-set-nav__note { display: none; }
  .ksp-set-nav__ico { width: 32px; height: 32px; border-radius: 999px; }
  .ksp-set-nav__ico .material-symbols-rounded { font-size: 17px; }
  .ksp-set-nav__label { font-size: 13px; }
  .ksp-set-toasts.ksp-toast-stack { bottom: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom) + 16px); }
}
@media (max-width: 767.98px) {
  .ksp-set-head { padding: 14px 16px; }
  .ksp-set-head__acts { width: 100%; justify-content: space-between; }
  .ksp-set-fill { align-items: flex-start; }
  .ksp-set-card { padding: 16px; }
  .ksp-set-banner { height: 180px; gap: 6px; }
  .ksp-set-banner__side { gap: 6px; }
  .ksp-set-drop { min-height: 0; padding: 22px 16px; }
  .ksp-set-banner__cap strong { font-size: 14px; }
  .ksp-set-gal { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  /* Dar kartta işaretler görselin altına, sıra rozetiyle çakışmadan (sığmazsa yukarı doğru satır açar) */
  .ksp-set-gitem__flags { top: auto; bottom: 8px; inset-inline: 8px; max-width: none; flex-direction: row; flex-wrap: wrap-reverse; align-items: flex-end; justify-content: flex-start; }
  .ksp-set-gitem__body { padding: 8px 10px 10px; }
  /* Eylemler iki satır: oklar yarım yarım, banner / açıklama / sil üçte bir */
  .ksp-set-gitem__acts { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
  .ksp-set-gitem__acts .ksp-set-ibtn { width: auto; margin: 0; }
  .ksp-set-ibtn--left, .ksp-set-ibtn--right { grid-column: span 3; }
  .ksp-set-ibtn--banner, .ksp-set-ibtn--caption, .ksp-set-ibtn--delete { grid-column: span 2; }
  .ksp-set-gitem.is-banner .ksp-set-ibtn--caption, .ksp-set-gitem.is-banner .ksp-set-ibtn--delete { grid-column: span 3; }
  .ksp-set-cols, .ksp-set-cols--3 { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .ksp-set-logo { gap: 16px; }
  .ksp-set-logo__pic { width: 80px; height: 80px; border-radius: 18px; font-size: 24px; }
  .ksp-set-day { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name switch" "times times" "copy copy" "err err"; row-gap: 10px; }
  .ksp-set-day.is-closed .ksp-set-closed { justify-self: start; }
  .ksp-set-day__times .ksp-set-time { flex: 1; width: auto; }
  .ksp-set-copy { justify-self: start; }
  .ksp-set-copy[hidden] + .ksp-set-day__err { margin-top: 0; }
  .ksp-set-day__err { margin-top: 0; }
  /* Kaydet çubuğu: panel alt menüsünün üstüne yapışık */
  .ksp-set-savebar { position: sticky; bottom: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom) + 8px); z-index: 1020; padding: 10px 12px; box-shadow: 0 12px 32px -12px rgba(28, 25, 23, .35); }
  .ksp-set-savebar__acts { flex: 1; justify-content: flex-end; gap: 8px; }
  .ksp-set-savebar__dirty span:not(.material-symbols-rounded) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .ksp-set-savebar__dirty { margin-inline-end: 0; }
  .ksp-set-save { flex: 1; max-width: 260px; }
  .ksp-set-toasts.ksp-toast-stack { bottom: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom) + 84px); }
}
@media (max-width: 575.98px) {
  .ksp-set-prices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-set-ams { grid-template-columns: minmax(0, 1fr); }
  .ksp-set-mhead { padding: 16px 16px 12px; }
  .ksp-set-mbody { padding: 14px 16px; }
  .ksp-set-mfoot { padding: 12px 16px calc(14px + env(safe-area-inset-bottom)); }
  .ksp-set-logo { align-items: flex-start; }
}

/* Banner önizleme: salon sayfasıyla aynı düzen — sağdaki ilk kutu ana görselin kendisi (koyu seçili çerçeve), 4. kutuda "+N" */
.ksp-set-banner__slot.is-selected::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; box-shadow: inset 0 0 0 2px #1c1917, inset 0 0 0 4px #fff; pointer-events: none; }
[data-bs-theme="dark"] .ksp-set-banner__slot.is-selected::after { box-shadow: inset 0 0 0 2px #fafaf9, inset 0 0 0 4px #0c0a09; }
.ksp-set-banner__more { position: absolute; inset: 0; z-index: 2; display: grid; place-items: center; background: rgba(12, 10, 9, .55); color: #fff; font-size: 12px; font-weight: 800; white-space: nowrap; }
.ksp-set-banner__side .ksp-set-banner__slot { container-type: inline-size; }
.ksp-set-banner__more .is-short { display: none; }
@container (max-width: 96px) {
  .ksp-set-banner__more .is-long { display: none; }
  .ksp-set-banner__more .is-short { display: inline; }
}
/* Yükleme kuyruğu: çözülemeyen dosyada kırık görsel yerine yer tutucu simge */
.ksp-set-qi__thumb.is-broken { display: grid; place-items: center; color: var(--set-faint); }
.ksp-set-qi__thumb.is-broken .material-symbols-rounded { font-size: 20px; }
/* Logo kaldırma onayı: kare logo önizlemesi */
.ksp-set-mlogo { display: block; width: 88px; height: 88px; margin-inline: auto; border-radius: 20px; background: var(--ksp-surface-2); object-fit: cover; box-shadow: inset 0 0 0 1px var(--ksp-border); }

/* Klavye odağı: zemine karşı ≥3:1 dolu halka (önceki %20 pembe gölge beyazda ≈1,3:1 idi) */
.ksp-set .ksp-set-nav__item:focus-visible, .ksp-set-ibtn:focus-visible, .ksp-set-mini:focus-visible, .ksp-set-sug:focus-visible,
.ksp-set-save:focus-visible, .ksp-set-dark:focus-visible, .ksp-set-dark:has(input:focus-visible), .ksp-set-cancel:focus-visible,
.ksp-set-textbtn:focus-visible, .ksp-set-copy:focus-visible, .ksp-set-walink:focus-visible, .ksp-set-view:focus-visible,
.ksp-set-check input:focus-visible + .ksp-set-check__box, .ksp-set-price:has(input:focus-visible), .ksp-set-clear:has(input:focus-visible) {
  outline: 2px solid #e11d48; outline-offset: 2px; box-shadow: none;
}
.ksp-set-switch .form-check-input:focus-visible { outline: 2px solid #e11d48; outline-offset: 2px; }
[data-bs-theme="dark"] .ksp-set .ksp-set-nav__item:focus-visible, [data-bs-theme="dark"] .ksp-set-ibtn:focus-visible, [data-bs-theme="dark"] .ksp-set-mini:focus-visible,
[data-bs-theme="dark"] .ksp-set-sug:focus-visible, [data-bs-theme="dark"] .ksp-set-save:focus-visible, [data-bs-theme="dark"] .ksp-set-dark:focus-visible,
[data-bs-theme="dark"] .ksp-set-dark:has(input:focus-visible), [data-bs-theme="dark"] .ksp-set-cancel:focus-visible, [data-bs-theme="dark"] .ksp-set-textbtn:focus-visible,
[data-bs-theme="dark"] .ksp-set-copy:focus-visible, [data-bs-theme="dark"] .ksp-set-walink:focus-visible, [data-bs-theme="dark"] .ksp-set-view:focus-visible,
[data-bs-theme="dark"] .ksp-set-check input:focus-visible + .ksp-set-check__box, [data-bs-theme="dark"] .ksp-set-price:has(input:focus-visible),
[data-bs-theme="dark"] .ksp-set-clear:has(input:focus-visible), [data-bs-theme="dark"] .ksp-set-switch .form-check-input:focus-visible { outline-color: #fb7185; }

/* Koyu tema kontrastı: alan hata metni, kapalı gün anahtarı ve "Kapalı" hapı */
[data-bs-theme="dark"] .ksp-set-err { color: #fb7185; }
[data-bs-theme="dark"] .ksp-set-field:has(> .ksp-set-err:not(:empty)) .ksp-set-input, [data-bs-theme="dark"] .ksp-set-input.is-invalid,
[data-bs-theme="dark"] .ksp-set-day:has(.ksp-set-day__err:not(:empty)) .ksp-set-time { border-color: #fb7185; }
[data-bs-theme="dark"] .ksp-set .ksp-set-switch.form-switch .form-check-input:not(:checked) {
  border-color: #a8a29e; background-color: #292524;
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23d6d3d1'/%3e%3c/svg%3e");
}
[data-bs-theme="dark"] .ksp-set-closed { color: #d6d3d1; }

/* Masaüstü bildirimi kaydet çubuğuyla çakışırsa app.js yığını çubuğun üstüne taşır (--set-toast-lift) */
@media (min-width: 992px) {
  .ksp-toast-stack.ksp-set-toasts { bottom: calc(24px + var(--set-toast-lift, 0px)); transition: bottom .2s ease; }
}

/* Mobil dokunma hedefleri (≥40 px) */
@media (max-width: 767.98px) {
  .ksp-set-am { height: auto; min-height: 48px; }
  .ksp-set-am__acts { gap: 2px; }
  .ksp-set-mini { width: 40px; height: 40px; }
  .ksp-set-am__edit { height: 40px; }
  .ksp-set-sugs__list { gap: 8px; }
  .ksp-set-sug { height: 38px; padding: 0 14px 0 10px; }
  .ksp-set-check { min-height: 40px; }
  .ksp-set-clear { display: inline-flex; align-items: center; min-height: 40px; margin-top: 0; }
  .ksp-set-copy { min-height: 40px; }
  .ksp-set-switch .form-check-input { width: 46px; height: 28px; }
  .ksp-set-gitem__acts .ksp-set-ibtn { height: 40px; }
  .ksp-set-textbtn { min-height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .ksp-toast-stack.ksp-set-toasts { transition: none; }
}

/* @personel-foto — Personel penceresi "Profil Fotoğrafı" satırı (views/panels/partials/staff-photo.php, app.js "@personel-foto");
   personel avatarlarında <img> (liste kartı, detay başlığı, takvim kolon başlığı, randevu penceresi kartı) */
.ksp-stf-ava > img, .ksp-cal-ava > img, .ksp-cal-staff__ava > img { display: block; width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
/* Fotoğraflı avatarlarda ince iç halka (outline görselin üstünde çizilir, köşe yarıçapını izler): koyu fotoğraf koyu zeminde şeklini kaybetmesin */
.ksp-stf-ava > img, .ksp-cal-ava > img, .ksp-cal-staff__ava > img, .ksp-stf-photo__img { outline: 1px solid rgba(28, 25, 23, .08); outline-offset: -1px; }
[data-bs-theme="dark"] :is(.ksp-stf-ava, .ksp-cal-ava, .ksp-cal-staff__ava) > img, [data-bs-theme="dark"] .ksp-stf-photo__img { outline-color: rgba(255, 255, 255, .14); }
/* Fotoğraflı avatarda takvim rengi zemin kenarda renkli saçak bırakmasın */
.ksp-stf-ava:has(> img), .ksp-cal-ava:has(> img), .ksp-cal-staff__ava:has(> img) { background: var(--ksp-surface-2); }
.ksp-stf-photo { position: relative; display: flex; flex-direction: column; gap: 8px; padding-bottom: 16px; border-bottom: 1px solid var(--stf-line); margin-bottom: 2px; }
.ksp-stf-photo__row { display: flex; align-items: center; gap: 16px; min-width: 0; min-height: 92px; }
.ksp-stf-photo__ava { position: relative; width: 84px; height: 84px; flex-shrink: 0; display: grid; place-items: center; margin: 4px 0; border-radius: 50%; background: var(--staff, #ec003f); color: #fff; font-size: 26px; font-weight: 800; letter-spacing: .02em; line-height: 1; cursor: pointer; user-select: none; transition: background-color .2s, outline-color .15s; }
.ksp-stf-photo__initials:empty, .ksp-stf-photo__initials:not(:empty) + .ksp-stf-photo__person { display: none; }
.ksp-stf-photo__person .material-symbols-rounded { font-size: 40px; }
.ksp-stf-photo__img { position: absolute; inset: 0; display: none; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; background: var(--ksp-surface-2); }
.ksp-stf-photo.has-photo .ksp-stf-photo__img { display: block; }
.ksp-stf-photo.has-photo .ksp-stf-photo__initials, .ksp-stf-photo.has-photo .ksp-stf-photo__person { display: none; }
.ksp-stf-photo.has-photo .ksp-stf-photo__ava { background: var(--ksp-surface-2); }
.ksp-stf-photo__over { position: absolute; inset: 0; display: grid; place-items: center; border-radius: 50%; background: rgba(28, 25, 23, .55); color: #fff; opacity: 0; transition: opacity .15s; }
.ksp-stf-photo__over .material-symbols-rounded { font-size: 26px; }
.ksp-stf-photo__ava:hover .ksp-stf-photo__over, .ksp-stf-photo.is-drag .ksp-stf-photo__over, .ksp-stf-photo:has(.ksp-stf-photo__input:focus-visible) .ksp-stf-photo__over { opacity: 1; }
.ksp-stf-photo.is-drag .ksp-stf-photo__ava { outline: 2px dashed #e11d48; outline-offset: 4px; }
/* Katman açıkken (üzerine gelme, sürükleme, klavye odağı) baş harfler / kişi ikonu solar: kamera ikonu tek başına, üst üste binmez */
.ksp-stf-photo__initials, .ksp-stf-photo__person { transition: opacity .15s; }
.ksp-stf-photo__ava:hover :is(.ksp-stf-photo__initials, .ksp-stf-photo__person), .ksp-stf-photo.is-drag :is(.ksp-stf-photo__initials, .ksp-stf-photo__person), .ksp-stf-photo:has(.ksp-stf-photo__input:focus-visible) :is(.ksp-stf-photo__initials, .ksp-stf-photo__person) { opacity: 0; }
.ksp-stf-photo.is-busy :is(.ksp-stf-photo__initials, .ksp-stf-photo__person) { opacity: 1; }
/* İlerleme halkası: dairenin 3px dışında; yükleme bitince (sunucu işlerken) dönen yay */
.ksp-stf-photo__ring { position: absolute; inset: -6px; width: calc(100% + 12px); height: calc(100% + 12px); overflow: visible; transform: rotate(-90deg); pointer-events: none; opacity: 0; transition: opacity .15s; }
.ksp-stf-photo__ring circle { fill: none; stroke-width: 3; }
.ksp-stf-photo__track { stroke: var(--stf-pill-line); }
.ksp-stf-photo__bar { stroke: #e11d48; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; transition: stroke-dashoffset .2s ease-out; }
.ksp-stf-photo.is-busy .ksp-stf-photo__ring { opacity: 1; }
.ksp-stf-photo.is-busy .ksp-stf-photo__ava { cursor: progress; }
.ksp-stf-photo.is-busy .ksp-stf-photo__over { opacity: 0; }
.ksp-stf-photo.is-processing .ksp-stf-photo__ring { animation: ksp-stf-photo-spin .9s linear infinite; }
.ksp-stf-photo.is-processing .ksp-stf-photo__bar { stroke-dashoffset: 72 !important; }
@keyframes ksp-stf-photo-spin { from { transform: rotate(-90deg); } to { transform: rotate(270deg); } }
/* Metin bloğu normal akışta (grid): başlık, iki ipucu, düğme satırı alt alta — hiçbir öğe konumlandırılmaz, üst üste binemez */
.ksp-stf-photo__text { display: grid; grid-template-columns: minmax(0, 1fr); align-content: center; min-width: 0; }
.ksp-stf-photo__title { display: block; margin: 0; font-size: 13px; font-weight: 700; line-height: 18px; color: var(--ksp-text); }
.ksp-stf-photo__hint { display: block; margin: 0; font-size: 11.5px; line-height: 17px; color: var(--ksp-muted); }
.ksp-stf-photo__actions { position: static; display: flex; flex-wrap: wrap; align-items: center; gap: 4px; min-height: 32px; margin-top: 10px; }
.ksp-stf-photo__input { position: absolute; top: 0; left: 0; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; opacity: 0; }
.ksp-stf-photo__btn { position: static; flex: none; display: inline-flex; align-items: center; gap: 6px; height: 32px; margin: 0; padding: 0 12px 0 10px; line-height: 1; border-radius: 8px; background: var(--stf-dark-btn); color: var(--stf-dark-btn-ink); font-size: 12.5px; font-weight: 700; white-space: nowrap; cursor: pointer; transition: opacity .15s, box-shadow .15s; }
.ksp-stf-photo__btn .material-symbols-rounded { font-size: 17px; }
.ksp-stf-photo__btn:hover { opacity: .9; }
.ksp-stf-photo:has(.ksp-stf-photo__input:focus-visible) .ksp-stf-photo__btn { box-shadow: 0 0 0 3px rgba(225, 29, 72, .25); }
.ksp-stf-photo__remove { height: 32px; padding: 0 10px; border: 0; border-radius: 8px; background: transparent; color: var(--stf-rose); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.ksp-stf-photo__remove:hover { background: var(--stf-pill-bg); }
.ksp-stf-photo__remove:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
.ksp-stf-photo__remove[hidden] { display: none; }
.ksp-stf-photo.is-busy .ksp-stf-photo__btn, .ksp-stf-photo.is-busy .ksp-stf-photo__remove { opacity: .55; pointer-events: none; }
/* İpucu yuvası: ipuçları, durum ve hata metni aynı grid hücresinde üst üste (öncelik hata > durum > ipuçları). Gizlenen visibility ile
   yerini korur → yükleme başlarken / biterken ya da hata çıkınca satır yüksekliği değişmez, ortalı pencere zıplamaz. Boş durum alanı
   0 yükseklikte ağaçta kalır (aria-live bölgesi baştan var olsun). */
.ksp-stf-photo__text { grid-template-areas: "title" "info" "actions"; }
.ksp-stf-photo__title { grid-area: title; }
.ksp-stf-photo__info, .ksp-stf-photo__status, .ksp-stf-photo__err { grid-area: info; align-self: start; min-width: 0; }
.ksp-stf-photo__status, .ksp-stf-photo__err { align-self: center; } /* kısa metin yuvada dikey ortalı: başlık ile düğmeler arasında boşluk dengeli */
.ksp-stf-photo__info { display: grid; grid-template-columns: minmax(0, 1fr); }
.ksp-stf-photo__actions { grid-area: actions; }
.ksp-stf-photo__status { margin: 0; font-size: 12px; font-weight: 600; line-height: 17px; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-stf-photo__err { line-height: 17px; }
.ksp-stf-photo__err:not(:empty) ~ .ksp-stf-photo__status, .ksp-stf-photo__err:not(:empty) ~ .ksp-stf-photo__info, .ksp-stf-photo__status:not(:empty) ~ .ksp-stf-photo__info { visibility: hidden; }
@media (max-width: 575.98px) {
  /* Dokunmatik hedef: telefonda düğmeler 40px, aralarında 8px (masaüstünde 32px) */
  .ksp-stf-photo__actions { gap: 8px; min-height: 40px; }
  .ksp-stf-photo__btn, .ksp-stf-photo__remove { height: 40px; }
  .ksp-stf-photo__btn { padding: 0 14px 0 12px; }
  .ksp-stf-photo__remove { padding: 0 12px; }
}
@media (max-width: 419.98px) {
  .ksp-stf-photo__row { gap: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .ksp-stf-photo.is-processing .ksp-stf-photo__ring { animation-duration: 2.4s; }
}

/* @salon-sayfa — Herkese açık salon sayfası yeni tasarım (views/site/salon.php + views/site/salon/*, app.js "@salon-sayfa").
   Önizleme: /onizleme/salon/{slug}. Ölçü ve renkler kullanıcının 1920 px referans görselinden piksel ölçümüyle (içerik 1216 px;
   Tailwind v4 paleti: rose-600 #ec003f, emerald-500 #00bc7d, amber-500 #fe9a00). Eski .ksp-salon stilleri ayrı ve korunur. */
.ksp-sp { padding-bottom: 56px; color: #1c1917; letter-spacing: 0; }
.ksp-sp-wrap { max-width: 1280px; margin-inline: auto; padding-inline: 32px; }
.ksp-sp .material-symbols-rounded { vertical-align: 0; }
.ksp-sp h2, .ksp-sp h3 { letter-spacing: 0; } /* taban h1–h5 -.02em referansta yok */

/* (0) Alt gezinti şeridi */
.ksp-sp-bar { background: #fff; border-bottom: 1px solid #e7e5e4; }
.ksp-sp-bar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 56px; }
.ksp-sp-bar__back { display: inline-flex; align-items: center; gap: 6px; min-width: 0; font-size: 14px; font-weight: 500; color: #44403c; white-space: nowrap; }
.ksp-sp-bar__back .material-symbols-rounded { font-size: 17px; }
.ksp-sp-bar__back:hover { color: #ec003f; }
.ksp-sp-bar__end { display: flex; align-items: center; gap: 8px; min-width: 0; }
.ksp-sp-crumbs { display: flex; align-items: center; gap: 3px; margin: 0; padding: 0; list-style: none; font-size: 12px; color: #78716c; white-space: nowrap; }
.ksp-sp-crumbs li + li::before { content: ">"; margin-inline-end: 3px; }
.ksp-sp-crumbs a { color: #78716c; }
.ksp-sp-crumbs a:hover { color: #1c1917; }

/* (1) Galeri banner — referanstan tek bilinçli fark: yükseklikleri hizalı ızgara */
.ksp-sp-hero { display: grid; grid-template-columns: minmax(0, 2.06fr) minmax(0, 1fr); gap: 18px; height: 520px; margin-top: 24px; }
.ksp-sp-hero.is-single { grid-template-columns: minmax(0, 1fr); }
.ksp-sp-hero.is-empty { height: 280px; } /* görsel yok: mesh zeminli kısa bant (boş koyu blok olmasın) */
.ksp-sp-hero__main { position: relative; overflow: hidden; border-radius: 16px; background: #0c0a09; isolation: isolate; }
.ksp-sp-hero__main .ksp-mesh { opacity: 1; filter: saturate(1.4); }
.ksp-sp-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity .2s ease; }
.ksp-sp-hero__img.is-fading { opacity: 0; }
.ksp-sp-hero__shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to top, rgba(12, 10, 9, .78) 0%, rgba(12, 10, 9, .35) 38%, transparent 62%); }
.ksp-sp-hero__zoom { position: absolute; inset: 0; width: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.ksp-sp-hero__zoom:focus-visible { outline: 3px solid #fff; outline-offset: -6px; border-radius: 16px; }
.ksp-sp-hero__badges { position: absolute; top: 16px; inset-inline-start: 16px; display: flex; flex-wrap: wrap; gap: 8px; pointer-events: none; }
.ksp-sp-badge { display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 12px; border-radius: 8px; background: rgba(28, 25, 23, .82); color: #fff; font-size: 12px; font-weight: 700; line-height: 1; white-space: nowrap; }
.ksp-sp-badge .material-symbols-rounded { font-size: 16px; }
.ksp-sp-badge--ok { padding-inline-start: 9px; background: #009966; }
.ksp-sp-hero__text { position: absolute; bottom: 16px; inset-inline: 16px 170px; color: #fff; pointer-events: none; }
.ksp-sp-hero__main.is-empty .ksp-sp-hero__text { inset-inline-end: 16px; }
.ksp-sp-hero__title { margin: 0; font-size: 36px; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; color: #fff; text-shadow: 0 2px 12px rgba(0, 0, 0, .35); overflow-wrap: anywhere; }
.ksp-sp-hero__tagline { margin: 5px 0 0; font-size: 14px; font-weight: 600; line-height: 1.45; color: rgba(255, 255, 255, .92); text-shadow: 0 1px 8px rgba(0, 0, 0, .3); }
.ksp-sp-hero__all { position: absolute; bottom: 18px; inset-inline-end: 16px; display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .92); color: #1c1917; font-size: 12px; font-weight: 700; line-height: 1.35; box-shadow: 0 4px 14px -6px rgba(0, 0, 0, .45); transition: background .15s; }
.ksp-sp-hero__all .material-symbols-rounded { font-size: 15px; }
.ksp-sp-hero__all:hover { background: #fff; }
.ksp-sp-thumbs { display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 18px; min-height: 0; }
.ksp-sp-hero.is-rows-1 .ksp-sp-thumbs { grid-template-rows: minmax(0, 1fr); }
.ksp-sp-hero.is-rows-2 .ksp-sp-thumbs { grid-template-rows: repeat(2, minmax(0, 1fr)); }
.ksp-sp-hero.is-rows-3 .ksp-sp-thumbs { grid-template-rows: repeat(3, minmax(0, 1fr)); }
.ksp-sp-thumb { position: relative; display: block; min-height: 0; padding: 0; border: 0; border-radius: 14px; overflow: hidden; background: #e7e5e4; cursor: pointer; }
.ksp-sp-thumb:nth-child(n+4) { display: none; } /* masaüstü: en fazla 3 kutu (referans); ilk kutu ana görselin kendisi */
.ksp-sp-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; transition: filter .15s; }
.ksp-sp-thumb:hover img { filter: brightness(1.05); }
.ksp-sp-thumb::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; pointer-events: none; }
.ksp-sp-thumb.is-active { outline: 2px solid #1c1917; outline-offset: 0; }
.ksp-sp-thumb.is-active::after { box-shadow: inset 0 0 0 2px #fff; }
.ksp-sp-thumb__more { position: absolute; inset: 0; z-index: 1; display: grid; place-items: center; background: rgba(12, 10, 9, .55); color: #fff; font-size: 15px; font-weight: 800; }

/* (1b) Tanıtım videosu: banner'da kapak görselinin yerine sessiz + döngülü oynatma, başlığın üstünde oynat / izle hapları.
   Video ana görselin hemen ardında; kaynağı app.js yalnız kutu görünür olunca atar (preload="none"). */
.ksp-sp-hero__vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #0c0a09; }
.ksp-sp-hero__vid[hidden] { display: none; }
.ksp-sp-hero__vacts { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; pointer-events: auto; }
/* Yükseklik / tipografi banner'ın mevcut "Tüm fotoğraflar" hapıyla (.ksp-sp-hero__all) aynı ölçekte */
.ksp-sp-vbtn { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 12px 0 9px; border: 0; border-radius: 999px; background: rgba(12, 10, 9, .62); color: #fff; font-size: 12px; font-weight: 700; line-height: 1.35; white-space: nowrap; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: background .15s; }
.ksp-sp-vbtn:hover, .ksp-sp-vbtn:focus-visible { background: rgba(12, 10, 9, .85); color: #fff; }
.ksp-sp-vbtn:focus-visible { outline: 3px solid rgba(255, 255, 255, .8); outline-offset: 2px; }
.ksp-sp-vbtn .material-symbols-rounded { font-size: 16px; font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24; }
.ksp-sp-vbtn .is-pause { display: none; }
.ksp-sp-vbtn[aria-pressed="true"] .is-play { display: none; }
.ksp-sp-vbtn[aria-pressed="true"] .is-pause { display: inline-block; }
.ksp-sp-vbtn--watch { background: rgba(255, 255, 255, .92); color: #1c1917; box-shadow: 0 4px 14px -6px rgba(0, 0, 0, .45); }
.ksp-sp-vbtn--watch:hover, .ksp-sp-vbtn--watch:focus-visible { background: #fff; color: #1c1917; }
.ksp-sp-vbtn--watch .material-symbols-rounded { color: #ec003f; }

/* Tam ekran oynatıcı (galeri tam ekranıyla aynı kabuk) */
.ksp-sp-vbox__title { min-width: 0; margin: 0; font-size: 14px; font-weight: 700; line-height: 1.35; color: rgba(255, 255, 255, .88); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Örtük satır 'auto' iken çocuğun max-height:100%'i 720px'e çözülüyor ve oynatıcı viewport'a sığmıyordu:
   kısa ekranlarda <video> kontrol çubuğu ekran dışında kalıyordu. Satır/sütun minmax(0,1fr) ile sınırlanır. */
.ksp-sp-vbox__stage { display: grid; grid-template-rows: minmax(0, 1fr); grid-template-columns: minmax(0, 1fr); place-items: center; padding: 0 20px 20px; }
.ksp-sp-vbox__video { width: 100%; max-width: 1280px; max-height: 100%; border-radius: 12px; background: #0c0a09; }
.ksp-sp-vbox__frame { position: relative; width: min(100%, 1280px); max-height: 100%; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #000; }
.ksp-sp-vbox__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* (2) Bilgi kartı */
.ksp-sp-info { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; margin-top: 26px; padding: 20px 20px 18px; background: #fff; border: 1px solid #e7e5e4; border-radius: 16px; box-shadow: 0 1px 2px rgba(28, 25, 23, .04); }
.ksp-sp-info__main { min-width: 0; flex: 1 1 auto; }
/* Salonun logosu (Ayarlar > Genel); yalnız yüklendiyse basılır */
.ksp-sp-info__logo { flex: 0 0 auto; width: 52px; height: 52px; border: 1px solid #e7e5e4; border-radius: 12px; object-fit: cover; background: #fff; }
.ksp-sp-info__row { display: flex; flex-wrap: wrap; align-items: center; gap: 13px; }
.ksp-sp-rating { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px 0 10px; border: 1px solid #fee685; border-radius: 8px; background: #fffbeb; white-space: nowrap; }
.ksp-sp-rating .material-symbols-rounded { font-size: 20px; color: #fe9a00; }
.ksp-sp-rating strong { margin-inline-start: -2px; font-size: 14px; font-weight: 800; letter-spacing: .01em; color: #973c00; }
.ksp-sp-rating__count { font-size: 14px; font-weight: 500; color: #78716c; }
.ksp-sp-rating.is-new .ksp-sp-rating__count { font-size: 13px; font-weight: 600; }
.ksp-sp-info__dot { width: 6px; height: 6px; border-radius: 50%; background: #d6d3d1; }
.ksp-sp-price { display: inline-flex; align-items: center; gap: 3px; height: 24px; padding: 0 10px; border-radius: 6px; background: #f5f5f4; color: #44403c; font-size: 12px; font-weight: 700; white-space: nowrap; }
.ksp-sp-info__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 15px; margin: 10px 0 0; padding: 0; list-style: none; font-size: 12px; font-weight: 500; line-height: 20px; color: #57534e; }
.ksp-sp-info__meta li { display: inline-flex; align-items: center; gap: 5px; min-width: 0; }
.ksp-sp-info__meta .material-symbols-rounded { flex-shrink: 0; font-size: 18px; }
.ksp-sp-info__meta .is-address .material-symbols-rounded { color: #ec003f; }
.ksp-sp-info__meta .is-hours .material-symbols-rounded { color: #78716c; }
.ksp-sp-info__meta .is-phone .material-symbols-rounded { color: #009966; }
.ksp-sp-info__meta .is-phone a { color: #57534e; }
.ksp-sp-info__meta .is-phone a:hover { color: #009966; }
/* Diğer iletişim ikonları (e-posta / Instagram / web sitesi): puan satırında küçük renkli rozetler */
.ksp-sp-ilinks { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ksp-sp-ilink { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border: 1px solid transparent; border-radius: 8px; transition: filter .15s, transform .15s; }
.ksp-sp-ilink .material-symbols-rounded { font-size: 15px; }
.ksp-sp-ilink .bi { font-size: 13px; line-height: 1; }
.ksp-sp-ilink.is-email { background: #fff1f4; border-color: #ffd6e0; color: #ec003f; }
.ksp-sp-ilink.is-instagram { background: #fdf2f8; border-color: #f6d2e8; color: #c13584; }
.ksp-sp-ilink.is-website { background: #effdf9; border-color: #b6f2e2; color: #0f766e; }
.ksp-sp-ilink:hover, .ksp-sp-ilink:focus-visible { filter: brightness(.97); transform: translateY(-1px); }
.ksp-sp-info__actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.ksp-sp-btn-wa { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 38px; padding: 0 16px; border: 1px solid #a4f4cf; border-radius: 10px; background: #ecfdf5; color: #006045; font-size: 12px; font-weight: 800; white-space: nowrap; transition: background .15s; }
.ksp-sp-btn-wa .bi { font-size: 16px; line-height: 1; color: #009966; } /* referanstaki yuvarlak konuşma balonu: Bootstrap Icons bi-chat */
.ksp-sp-btn-wa:hover, .ksp-sp-btn-wa:focus-visible { background: #d0fae5; color: #006045; }
.ksp-sp-btn-book { display: inline-flex; align-items: center; justify-content: center; gap: 9px; height: 40px; padding: 0 24px 0 23px; border-radius: 10px; background: #ec003f; color: #fff; font-size: 14px; font-weight: 800; white-space: nowrap; box-shadow: 0 8px 18px -8px rgba(236, 0, 63, .55); transition: background .15s; }
.ksp-sp-btn-book .material-symbols-rounded { font-size: 17px; }
.ksp-sp-btn-book:hover, .ksp-sp-btn-book:focus-visible { background: #d00037; color: #fff; }
/* Üçüncü eylem (yalnız bireysel uzman künyesi, sahip 2026-09-26): "Detaylı Uzman Profili".
   Satır içi düğmedir — .ksp-sp-btn-soft (tam genişlik blok) BURADA KULLANILMAZ, satırı taşırır.
   Ton nötr: pembe CTA ile yarışmaz, WhatsApp ile aynı yükseklik ve köşe. */
/* Koyu tema (denetim bulgusu 2026-09-26): düğme açık temanın zemininde kalıp koyu kartta bembeyaz blok oluyordu */
/* Uzman künyesi (sahip, 2026-09-26: "butonları kısalt, yazıları yan yana getir"): düğme dolguları sıkı,
   eylem grubu daha az yer kaplar → metin sütunu genişler, telefon · adres · saat salondaki gibi tek satır.
   Salon künyesi (.ksp-sp-info olmadan --uz) bu kurallardan etkilenmez. */

/* (3) Sekme satırı — alt çizgi iç gölgeyle (kaydırma kabı kenarlığı kırpmasın) */
.ksp-sp-tabs { position: relative; display: flex; gap: 24px; margin-top: 32px; overflow-x: auto; scrollbar-width: none; box-shadow: inset 0 -1px 0 #e7e5e4; }
.ksp-sp-tabs::-webkit-scrollbar { display: none; }
.ksp-sp-tab { position: relative; flex-shrink: 0; display: inline-flex; align-items: center; gap: 8px; padding: 0 8px 16px; border: 0; background: none; color: #78716c; font-size: 14px; font-weight: 600; line-height: 21px; white-space: nowrap; transition: color .15s; }
.ksp-sp-tab .material-symbols-rounded { font-size: 20px; } /* glif yüksekliği referanstaki 16–17 px çizgi ikonlara yakın */
.ksp-sp-tab::after { content: ""; position: absolute; inset-inline: 0; bottom: 1px; height: 2px; background: transparent; }
.ksp-sp-tab:hover { color: #1c1917; }
.ksp-sp-tab.is-active { color: #ec003f; }
.ksp-sp-tab.is-active::after { background: #ec003f; }
.ksp-sp-tab:focus-visible { outline-offset: -3px; border-radius: 8px; }
.ksp-sp-tab__short { display: none; } /* 768–991 px'te uzun etiketin yerine (dört sekme tek satıra sığar) */

/* (4) Sekme içerikleri */
.ksp-sp-panel { padding-top: 26px; }
.ksp-sp-panel:focus-visible { outline: 0; }
.ksp-sp-sechead { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 23px; }
.ksp-sp-sechead__title { margin: 0; font-size: 18px; font-weight: 800; line-height: 1.35; color: #1c1917; }
.ksp-sp-sechead__lead, .ksp-sp-reviews__lead { margin: 3px 0 0; font-size: 12px; line-height: 1.5; color: #78716c; }
.ksp-sp-pill-rose { flex-shrink: 0; display: inline-flex; align-items: center; height: 26px; padding: 0 12px; border: 1px solid #ffccd3; border-radius: 6px; background: #fff1f2; color: #ec003f; font-size: 12px; font-weight: 700; white-space: nowrap; }
.ksp-sp-empty { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 44px 20px; border: 1px solid #e7e5e4; border-radius: 16px; background: #fff; text-align: center; }
.ksp-sp-empty .material-symbols-rounded { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; background: #fff1f2; color: #ec003f; font-size: 26px; }
.ksp-sp-empty p { margin: 0; max-width: 420px; font-size: 13px; font-weight: 600; color: #57534e; }
.ksp-sp-empty.is-inline { padding: 28px 16px 12px; border: 0; }

/* (4a) Uzman kartları */
/* İzin hapı: sığarsa tek satır; sığmazsa bilgi kaybolmasın diye dengeli iki satır (tek kelime alt satırda yalnız kalmaz) */
/* Aynı satırdaki kartlar uzadığında (izinli kart) fazla boşluk kimlik bloğunun altına gider: "Uzmanlık alanları",
   çipler ve düğme kartlar arasında hizalı kalır, çip → ayırıcı aralığı 16 px'te sabit */

/* (4b) Hizmetler & fiyat menüsü (referans görseli yok: uzman sekmesinin ölçeğiyle) */
.ksp-sp-cats { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.ksp-sp-cat { display: inline-flex; align-items: center; height: 34px; padding: 0 16px; border: 1px solid #e7e5e4; border-radius: 999px; background: #fff; color: #292524; font-size: 12px; font-weight: 700; white-space: nowrap; transition: border-color .15s, background .15s, color .15s; }
.ksp-sp-cat:hover { border-color: #d6d3d1; }
.ksp-sp-cat.is-active { border-color: #ec003f; background: #ec003f; color: #fff; }
.ksp-sp-svc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.ksp-sp-svc { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto 1fr; grid-template-areas: "text cta" "price price"; column-gap: 14px; min-height: 116px; padding: 18px 20px; border: 1px solid #e7e5e4; border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(28, 25, 23, .05); }
.ksp-sp-svc__text { grid-area: text; min-width: 0; }
.ksp-sp-svc__name { margin: 0; font-size: 15px; font-weight: 800; line-height: 1.4; letter-spacing: -.01em; color: #1c1917; }
.ksp-sp-svc__dur { display: inline-block; margin-inline-start: 4px; padding: 2px 7px; border-radius: 6px; background: #f5f5f4; color: #57534e; font-size: 11px; font-weight: 700; line-height: 1.35; letter-spacing: 0; white-space: nowrap; vertical-align: 2px; }
.ksp-sp-svc__desc { margin: 4px 0 0; font-size: 12px; line-height: 1.5; color: #78716c; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ksp-sp-svc__cta { grid-area: cta; align-self: start; display: inline-flex; align-items: center; gap: 2px; height: 34px; padding: 0 10px 0 14px; border: 1px solid #ffccd3; border-radius: 10px; background: #fff1f2; color: #ec003f; font-size: 12px; font-weight: 800; white-space: nowrap; transition: background .15s; }
.ksp-sp-svc__cta .material-symbols-rounded { font-size: 18px; }
.ksp-sp-svc__cta:hover, .ksp-sp-svc__cta:focus-visible { background: #ffe4e6; color: #ec003f; }
.ksp-sp-svc__price { grid-area: price; align-self: end; margin: 0; padding-top: 14px; font-size: 19px; font-weight: 800; line-height: 1.2; letter-spacing: -.01em; color: #1c1917; }

/* (4c) Hakkında & olanaklar */
.ksp-sp-about { display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.ksp-sp-about.is-even { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ksp-sp-about__col { display: grid; gap: 20px; min-width: 0; }
.ksp-sp-card { min-width: 0; padding: 20px 22px; border: 1px solid #e7e5e4; border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(28, 25, 23, .05); }
.ksp-sp-card__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; font-weight: 800; line-height: 1.35; letter-spacing: -.01em; color: #1c1917; }
.ksp-sp-card__title .material-symbols-rounded { font-size: 18px; color: #ec003f; }
.ksp-sp-card__sub { margin: 10px 0 0; font-size: 12px; font-style: normal; line-height: 1.6; color: #78716c; }
.ksp-sp-about__text { margin: 12px 0 0; font-size: 13px; line-height: 1.75; color: #57534e; }
.ksp-sp-amenities { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; margin: 14px 0 0; padding: 0; list-style: none; }
.ksp-sp-amenity { display: flex; align-items: center; gap: 10px; min-width: 0; height: 42px; padding: 0 14px; border: 1px solid #f5f5f4; border-radius: 10px; background: #fafaf9; color: #292524; font-size: 12px; font-weight: 700; }
.ksp-sp-amenity .material-symbols-rounded { flex-shrink: 0; font-size: 17px; color: #00bc7d; }
/* Dar kart (sahip, 2026-09-26): olanaklar sağ sütunda, "Servis Bölgesi" kartıyla aynı yoğunlukta —
   tek sütun, ince satır, küçük yazı. Sol sütunda kalan kartlar etkilenmez. */

.ksp-sp-amenity span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-sp-status { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; padding: 10px 14px; border: 1px solid #e7e5e4; border-radius: 10px; background: #f5f5f4; color: #57534e; font-size: 12px; font-weight: 700; line-height: 1.4; }
.ksp-sp-status::before { content: ""; flex-shrink: 0; width: 8px; height: 8px; border-radius: 50%; background: #a8a29e; }
.ksp-sp-status.is-open { border-color: #a4f4cf; background: #ecfdf5; color: #007a55; }
.ksp-sp-status.is-open::before { background: #00bc7d; box-shadow: 0 0 0 3px rgba(0, 188, 125, .18); }
.ksp-sp-week { margin-top: 12px; }
.ksp-sp-week summary { display: inline-flex; align-items: center; gap: 2px; color: #ec003f; font-size: 12px; font-weight: 700; cursor: pointer; list-style: none; border-radius: 6px; }
.ksp-sp-week summary::-webkit-details-marker { display: none; }
.ksp-sp-week summary .material-symbols-rounded { font-size: 18px; transition: transform .2s; }
.ksp-sp-week[open] summary .material-symbols-rounded { transform: rotate(180deg); }
.ksp-sp-week__hide, .ksp-sp-week[open] .ksp-sp-week__show { display: none; }
.ksp-sp-week[open] .ksp-sp-week__hide { display: inline; }
.ksp-sp-week ul { margin: 10px 0 0; padding: 0; list-style: none; }
.ksp-sp-week li { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-top: 1px solid #f5f5f4; font-size: 12px; color: #57534e; }
.ksp-sp-week li.is-today { color: #ec003f; font-weight: 800; }
.ksp-sp-btn-soft { display: flex; align-items: center; justify-content: center; gap: 2px; width: 100%; height: 40px; margin-top: 14px; border-radius: 10px; background: #f5f5f4; color: #1c1917; font-size: 12px; font-weight: 800; transition: background .15s; }
.ksp-sp-btn-soft .material-symbols-rounded { font-size: 17px; }
.ksp-sp-btn-soft:hover, .ksp-sp-btn-soft:focus-visible { background: #e7e5e4; color: #1c1917; }

/* (4d) Müşteri yorumları */
.ksp-sp-reviews { padding: 24px 26px; border: 1px solid #e7e5e4; border-radius: 18px; background: #fff; box-shadow: 0 1px 2px rgba(28, 25, 23, .05); }
.ksp-sp-reviews__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; padding-bottom: 18px; border-bottom: 1px solid #f5f5f4; }
.ksp-sp-score { flex-shrink: 0; display: inline-flex; align-items: center; gap: 5px; margin: 0; padding: 8px 14px; border: 1px solid #fee685; border-radius: 12px; background: #fffbeb; white-space: nowrap; }
.ksp-sp-score .material-symbols-rounded { font-size: 22px; color: #fe9a00; }
.ksp-sp-score strong { font-size: 19px; font-weight: 800; line-height: 1.2; color: #1c1917; }
.ksp-sp-score small { align-self: flex-end; padding-bottom: 3px; font-size: 12px; font-weight: 700; color: #a8a29e; }
/* minmax(0, 1fr): ızgara öğesinin min-width'i auto olsaydı uzun hizmet etiketi (nowrap) kartı ve sayfayı yatay taşırırdı */
.ksp-sp-review-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 0; padding: 0; list-style: none; }
.ksp-sp-review { min-width: 0; padding: 14px 18px; border: 1px solid #f5f5f4; border-radius: 12px; background: #fafaf9; }
.ksp-sp-review__head { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ksp-sp-review__ava { flex-shrink: 0; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #ffe4e6; color: #ec003f; font-size: 11px; font-weight: 800; }
.ksp-sp-review__ava.is-tone-1 { background: #dbeafe; color: #1447e6; }
.ksp-sp-review__ava.is-tone-2 { background: #dcfce7; color: #008236; }
.ksp-sp-review__ava.is-tone-3 { background: #fef3c6; color: #bb4d00; }
.ksp-sp-review__who { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; }
.ksp-sp-review__name { font-size: 13px; font-weight: 800; line-height: 1.35; color: #1c1917; }
.ksp-sp-review__svc { font-size: 11px; line-height: 1.4; color: #78716c; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-sp-review__meta { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.ksp-sp-stars { display: inline-flex; gap: 1px; }
.ksp-sp-stars .material-symbols-rounded { font-size: 15px; color: #e7e5e4; font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 20; }
.ksp-sp-stars .material-symbols-rounded.is-on { color: #fe9a00; }
.ksp-sp-review__date { font-size: 11px; line-height: 1.4; color: #a8a29e; white-space: nowrap; }
.ksp-sp-review__text { margin: 10px 0 0; font-size: 13px; line-height: 1.65; color: #44403c; overflow-wrap: anywhere; }
.ksp-sp-reviews__more { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-top: 18px; }
.ksp-sp-reviews__status { margin: 0; font-size: 12px; font-weight: 600; color: #ec003f; }
.ksp-sp-reviews__status:empty, .ksp-sp-reviews__status.is-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ksp-sp-btn-outline { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 18px; border: 1px solid #e7e5e4; border-radius: 10px; background: #fff; color: #1c1917; font-size: 12px; font-weight: 700; transition: border-color .15s, background .15s; }
.ksp-sp-btn-outline:hover { border-color: #d6d3d1; background: #fafaf9; }
.ksp-sp-btn-outline:disabled { opacity: .75; cursor: progress; }

/* Tam ekran galeri */
.ksp-sp-lightbox .modal-content { display: flex; flex-direction: column; border: 0; border-radius: 0; background: #0c0a09; color: #fff; }
.ksp-sp-lightbox__top { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; height: 64px; padding: 0 20px; }
.ksp-sp-lightbox__count { font-size: 14px; font-weight: 700; color: rgba(255, 255, 255, .85); font-variant-numeric: tabular-nums; }
.ksp-sp-lightbox__close, .ksp-sp-lightbox__nav { display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .1); color: #fff; transition: background .15s; }
.ksp-sp-lightbox__close { width: 44px; height: 44px; }
.ksp-sp-lightbox__close .material-symbols-rounded { font-size: 24px; }
.ksp-sp-lightbox__close:hover, .ksp-sp-lightbox__nav:hover { background: rgba(255, 255, 255, .22); }
.ksp-sp-lightbox__close:focus-visible, .ksp-sp-lightbox__nav:focus-visible, .ksp-sp-lightbox__thumb:focus-visible { outline: 3px solid rgba(255, 255, 255, .8); outline-offset: 2px; }
.ksp-sp-lightbox__stage { position: relative; flex: 1 1 auto; min-height: 0; touch-action: pan-y; }
.ksp-sp-lightbox__img { position: absolute; top: 0; inset-inline-start: 96px; width: calc(100% - 192px); height: 100%; object-fit: contain; user-select: none; -webkit-user-drag: none; transition: opacity .2s; }
.ksp-sp-lightbox__img.is-fading { opacity: 0; }
.ksp-sp-lightbox__nav { position: absolute; top: 50%; z-index: 1; width: 52px; height: 52px; transform: translateY(-50%); }
.ksp-sp-lightbox__nav .material-symbols-rounded { font-size: 30px; }
.ksp-sp-lightbox__nav.is-prev { inset-inline-start: 24px; }
.ksp-sp-lightbox__nav.is-next { inset-inline-end: 24px; }
.ksp-sp-lightbox__strip { flex-shrink: 0; display: flex; gap: 8px; padding: 16px 20px 20px; overflow-x: auto; scrollbar-width: none; }
.ksp-sp-lightbox__strip::-webkit-scrollbar { display: none; }
.ksp-sp-lightbox__strip > :first-child { margin-inline-start: auto; }
.ksp-sp-lightbox__strip > :last-child { margin-inline-end: auto; }
.ksp-sp-lightbox__thumb { position: relative; flex: 0 0 76px; height: 56px; padding: 0; border: 0; border-radius: 8px; overflow: hidden; background: #292524; opacity: .5; transition: opacity .15s; }
.ksp-sp-lightbox__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ksp-sp-lightbox__thumb:hover { opacity: .85; }
.ksp-sp-lightbox__thumb.is-active { opacity: 1; outline: 2px solid #fff; outline-offset: 0; }

/* Mobil yapışkan alt CTA (WhatsApp + Randevu Al) */
.ksp-sp-sticky { display: flex; gap: 10px; }
/* Bottom nav'ın ortadaki yuvarlak düğmesi (is-fab, 26 px yukarı taşar) düğmelerin alt kenarına binmesin: alt boşluk + gövde payı */
@media (max-width: 767.98px) {
  .ksp-sticky-cta.ksp-sp-sticky { padding-bottom: 24px; }
  body:has(.ksp-sp-sticky) { padding-bottom: calc(var(--ksp-bottom-h) + 86px + env(safe-area-inset-bottom)); }
}
.ksp-sp-sticky__wa { flex: 0 0 48px; display: grid; place-items: center; height: 48px; border-radius: 12px; background: #00bc7d; color: #fff; font-size: 22px; box-shadow: 0 8px 18px -10px rgba(0, 188, 125, .9); }
.ksp-sp-sticky__wa:hover { background: #009966; color: #fff; }
.ksp-sp-sticky__book { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; gap: 8px; height: 48px; border-radius: 12px; background: #ec003f; color: #fff; font-size: 15px; font-weight: 800; box-shadow: 0 8px 18px -8px rgba(236, 0, 63, .55); }
.ksp-sp-sticky__book .material-symbols-rounded { font-size: 19px; }
.ksp-sp-sticky__book:hover { background: #d00037; color: #fff; }

/* Uzun, boşluksuz metin (yapıştırılmış bağlantı, 255 karakterlik adres vb.) kartı taşırıp sayfayı yatay kaydırmasın */
.ksp-sp-info__meta li > span:last-child, .ksp-sp-sechead > div, .ksp-sp-reviews__head > div, .ksp-sp-review__name { min-width: 0; }
.ksp-sp-info__meta li > span:last-child,
.ksp-sp-hero__tagline,
.ksp-sp-sechead__title,
.ksp-sp-sechead__lead,
.ksp-sp-svc__name,
.ksp-sp-svc__desc,
.ksp-sp-svc__price,
.ksp-sp-card__title,
.ksp-sp-card__sub,
.ksp-sp-about__text,
.ksp-sp-review__name,
.ksp-sp-empty p { overflow-wrap: anywhere; }
.ksp-sp-card__title > span:not(.material-symbols-rounded), .ksp-sp-card__title { min-width: 0; }
.ksp-sp-hero__tagline { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Kırılımlar */
@media (max-width: 1279.98px) { .ksp-sp-hero { height: 460px; } }
@media (max-width: 1199.98px) {
  .ksp-sp-hero { height: 400px; }
  .ksp-sp-hero__title { font-size: 32px; }
  .ksp-sp-thumbs { gap: 12px; }
}
@media (max-width: 991.98px) {
  .ksp-sp-wrap { padding-inline: 24px; }
  .ksp-sp-hero { height: 340px; }
  .ksp-sp-hero__title { font-size: 28px; }
  .ksp-sp-hero__tagline { font-size: 13px; }
  .ksp-sp-info { flex-direction: column; align-items: flex-start; }
    .ksp-sp-about, .ksp-sp-about.is-even { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .ksp-sp-tab__long { display: none; }
  .ksp-sp-tab__short { display: inline; }
}
/* app.js: ≥768 px'te uzun etiketler sığmıyorsa (ör. 992–1030 px, büyük yorum sayısı) */
@media (min-width: 768px) {
  .ksp-sp-tabs.is-compact .ksp-sp-tab__long { display: none; }
  .ksp-sp-tabs.is-compact .ksp-sp-tab__short { display: inline; }
  /* 2. ve 3. kademe (sahip isteği 2026-09-24: Magazin + S.S.S. ile 9 sekme oldu, "tüm menü o alana sığsın").
     Yalnız sığmadığında uygulanır — 4 sekmeli salonda hiçbiri devreye girmez, tasarım aynen kalır. */
  .ksp-sp-tabs.is-tight { gap: 14px; }
  .ksp-sp-tabs.is-tight .ksp-sp-tab { gap: 6px; padding-inline: 4px; font-size: 13px; }
  .ksp-sp-tabs.is-tight .ksp-sp-tab .material-symbols-rounded { font-size: 18px; }
  .ksp-sp-tabs.is-xtight { gap: 9px; }
  .ksp-sp-tabs.is-xtight .ksp-sp-tab { gap: 5px; padding-inline: 2px; font-size: 12.5px; }
  .ksp-sp-tabs.is-xtight .ksp-sp-tab .material-symbols-rounded { font-size: 17px; }
  /* Son kademe (sahip: "hepsi sığacak şekilde ayarla"): dar masaüstünde 9 sekme başka türlü sığmıyor.
     İkonlar süs, etiket ise anlam taşır → önce ikon gider. Yalnız bu kademede ve yalnız gerekince. */
  .ksp-sp-tabs.is-nano { gap: 12px; }
  .ksp-sp-tabs.is-nano .ksp-sp-tab { gap: 0; padding-inline: 0; font-size: 12.5px; }
  .ksp-sp-tabs.is-nano .ksp-sp-tab .material-symbols-rounded { display: none; }
}
@media (max-width: 767.98px) {
  .ksp-sp-wrap { padding-inline: 16px; }
  .ksp-sp-crumbs { display: none; }
      .ksp-sp-hero, .ksp-sp-hero.is-single { display: block; height: auto; margin-top: 16px; }
  .ksp-sp-hero__main { aspect-ratio: 4 / 3; max-height: 300px; border-radius: 14px; }
  .ksp-sp-hero.is-empty .ksp-sp-hero__main { aspect-ratio: auto; height: 200px; }
  .ksp-sp-hero__badges { top: 12px; inset-inline-start: 12px; gap: 6px; }
  .ksp-sp-badge { height: 22px; padding: 0 9px; font-size: 11px; }
  .ksp-sp-badge--ok { padding-inline-start: 7px; }
  .ksp-sp-badge .material-symbols-rounded { font-size: 14px; }
  .ksp-sp-hero__text { bottom: 12px; inset-inline: 14px 58px; }
  .ksp-sp-hero__title { font-size: 24px; }
  .ksp-sp-hero__tagline { margin-top: 2px; font-size: 13px; }
  .ksp-sp-hero__all { bottom: 14px; inset-inline-end: 12px; width: 34px; height: 34px; padding: 0; justify-content: center; }
  .ksp-sp-hero__all .material-symbols-rounded { font-size: 18px; }
  .ksp-sp-hero__all-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .ksp-sp-thumbs { display: flex; gap: 8px; margin: 8px -2px 0; padding: 2px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .ksp-sp-thumbs::-webkit-scrollbar { display: none; }
  .ksp-sp-thumb, .ksp-sp-thumb:nth-child(n+4) { display: block; flex: 0 0 72px; height: 56px; border-radius: 10px; scroll-snap-align: start; }
  .ksp-sp-thumb__more { display: none; }
  .ksp-sp-info { margin-top: 16px; padding: 16px; }
  .ksp-sp-info__meta { flex-direction: column; align-items: flex-start; gap: 6px; }
  .ksp-sp-info__meta li { align-items: flex-start; }
  .ksp-sp-info__meta .material-symbols-rounded { margin-top: 1px; }
  .ksp-sp-tabs { gap: 16px; margin-top: 24px; margin-inline: -16px; padding-inline: 12px; }
  .ksp-sp-panel { padding-top: 20px; }
  .ksp-sp-sechead { flex-direction: column; align-items: flex-start; gap: 10px; margin-bottom: 18px; }
  .ksp-sp-cats { flex-wrap: nowrap; margin-inline: -16px; padding-inline: 16px; overflow-x: auto; scrollbar-width: none; }
  .ksp-sp-cats::-webkit-scrollbar { display: none; }
  .ksp-sp-svc-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .ksp-sp-reviews { padding: 18px 16px; }
  .ksp-sp-reviews__head { flex-direction: column; align-items: flex-start; gap: 12px; }
  .ksp-sp-lightbox__img { inset-inline-start: 0; width: 100%; }
  .ksp-sp-lightbox__nav { width: 44px; height: 44px; background: rgba(12, 10, 9, .55); }
  .ksp-sp-lightbox__nav.is-prev { inset-inline-start: 10px; }
  .ksp-sp-lightbox__nav.is-next { inset-inline-end: 10px; }
  .ksp-sp-lightbox__top { height: 56px; padding: 0 12px 0 16px; }
  .ksp-sp-lightbox__strip { padding: 12px 12px 16px; }
  .ksp-sp-lightbox__thumb { flex-basis: 64px; height: 48px; }
  .ksp-sp-vbox__stage { padding: 0 12px 16px; }
  .ksp-sp-hero__vacts { gap: 6px; margin-bottom: 8px; }
  .ksp-sp-vbtn { padding: 0 11px 0 8px; font-size: 11.5px; }
  .ksp-sp-vbtn .material-symbols-rounded { font-size: 15px; }
}
@media (max-width: 575.98px) {
  .ksp-sp-info__dot { display: none; }
  .ksp-sp-info__row { gap: 8px; }
  .ksp-sp-svc__price { min-width: 0; font-size: 17px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  /* Eşit genişlik: flex-basis 0 kenarlık farkını (WhatsApp 1 px çerçeveli) paylaştırıyordu; ızgara sütunları birebir eşit */
  .ksp-sp-info__actions { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); width: 100%; }
  .ksp-sp-info__actions > a { min-width: 0; height: 40px; padding: 0 10px; }
    .ksp-sp-svc { grid-template-areas: "text text" "price cta"; }
  .ksp-sp-svc__cta { align-self: end; }
  .ksp-sp-amenities { grid-template-columns: minmax(0, 1fr); }
}

/* Koyu tema */
[data-bs-theme="dark"] .ksp-sp { color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-sp-bar,
[data-bs-theme="dark"] .ksp-sp-info,
[data-bs-theme="dark"] .ksp-sp-svc,
[data-bs-theme="dark"] .ksp-sp-card,
[data-bs-theme="dark"] .ksp-sp-reviews,
[data-bs-theme="dark"] .ksp-sp-empty,
[data-bs-theme="dark"] .ksp-sp-cat,
[data-bs-theme="dark"] .ksp-sp-btn-outline { background: var(--ksp-surface); border-color: var(--ksp-border); box-shadow: none; }
[data-bs-theme="dark"] .ksp-sp-empty.is-inline { background: transparent; }
[data-bs-theme="dark"] .ksp-sp-bar__back, [data-bs-theme="dark"] .ksp-sp-cat, [data-bs-theme="dark"] .ksp-sp-btn-outline { color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-sp-crumbs a, [data-bs-theme="dark"] .ksp-sp-crumbs { color: var(--ksp-muted); }
[data-bs-theme="dark"] .ksp-sp-crumbs a:hover { color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-sp-cat.is-active { background: var(--ksp-primary); border-color: var(--ksp-primary); color: #fff; }
[data-bs-theme="dark"] .ksp-sp-rating,
[data-bs-theme="dark"] .ksp-sp-score { background: rgba(254, 154, 0, .12); border-color: rgba(254, 154, 0, .3); }
[data-bs-theme="dark"] .ksp-sp-rating strong { color: #ffb900; }
[data-bs-theme="dark"] .ksp-sp-rating__count,
[data-bs-theme="dark"] .ksp-sp-sechead__lead,
[data-bs-theme="dark"] .ksp-sp-reviews__lead,
[data-bs-theme="dark"] .ksp-sp-svc__desc,
[data-bs-theme="dark"] .ksp-sp-card__sub,
[data-bs-theme="dark"] .ksp-sp-review__svc,
[data-bs-theme="dark"] .ksp-sp-tab { color: var(--ksp-muted); }
[data-bs-theme="dark"] .ksp-sp-info__dot { background: rgba(255, 255, 255, .2); }
[data-bs-theme="dark"] .ksp-sp-price,
[data-bs-theme="dark"] .ksp-sp-svc__dur { background: var(--ksp-surface-2); color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-sp-btn-soft { background: var(--ksp-surface-2); color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-sp-btn-soft:hover { background: #44403c; color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-sp-info__meta, [data-bs-theme="dark"] .ksp-sp-info__meta .is-phone a, [data-bs-theme="dark"] .ksp-sp-about__text, [data-bs-theme="dark"] .ksp-sp-week li { color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-sp-sechead__title,
[data-bs-theme="dark"] .ksp-sp-svc__name,
[data-bs-theme="dark"] .ksp-sp-svc__price,
[data-bs-theme="dark"] .ksp-sp-card__title,
[data-bs-theme="dark"] .ksp-sp-score strong,
[data-bs-theme="dark"] .ksp-sp-review__name,
[data-bs-theme="dark"] .ksp-sp-amenity,
[data-bs-theme="dark"] .ksp-sp-tab:hover { color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-sp-tabs { box-shadow: inset 0 -1px 0 var(--ksp-border); }
[data-bs-theme="dark"] .ksp-sp-tab.is-active { color: #ff637e; }
[data-bs-theme="dark"] .ksp-sp-tab.is-active::after { background: #ff637e; }
[data-bs-theme="dark"] .ksp-sp-btn-wa { background: rgba(0, 188, 125, .12); border-color: rgba(0, 188, 125, .35); color: #5ee9b5; }
[data-bs-theme="dark"] .ksp-sp-btn-wa .bi { color: #5ee9b5; }
[data-bs-theme="dark"] .ksp-sp-btn-wa:hover { background: rgba(0, 188, 125, .2); color: #5ee9b5; }
[data-bs-theme="dark"] .ksp-sp-pill-rose,
[data-bs-theme="dark"] .ksp-sp-svc__cta { background: rgba(255, 32, 86, .12); border-color: rgba(255, 32, 86, .3); color: #ff637e; }
[data-bs-theme="dark"] .ksp-sp-svc__cta:hover { background: rgba(255, 32, 86, .2); color: #ff637e; }
[data-bs-theme="dark"] .ksp-sp-week summary,
[data-bs-theme="dark"] .ksp-sp-week li.is-today { color: #ff637e; }
[data-bs-theme="dark"] .ksp-sp-empty .material-symbols-rounded { background: rgba(255, 32, 86, .12); color: #ff637e; }
[data-bs-theme="dark"] .ksp-sp-reviews__head,
[data-bs-theme="dark"] .ksp-sp-week li { border-color: var(--ksp-border); }
/* Koyu temada kart ritmine uygun koyu karşılık (6 kartlık ızgarada parlak beyaz bloklar oluşmasın) */
[data-bs-theme="dark"] .ksp-sp-amenity, [data-bs-theme="dark"] .ksp-sp-review { background: var(--ksp-surface-2); border-color: var(--ksp-border); }
[data-bs-theme="dark"] .ksp-sp-status { background: var(--ksp-surface-2); border-color: var(--ksp-border); color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-sp-status.is-open { background: rgba(0, 188, 125, .12); border-color: rgba(0, 188, 125, .3); color: #5ee9b5; }
[data-bs-theme="dark"] .ksp-sp-review__text, [data-bs-theme="dark"] .ksp-sp-empty p { color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-sp-stars .material-symbols-rounded { color: #44403c; }
[data-bs-theme="dark"] .ksp-sp-stars .material-symbols-rounded.is-on { color: #fe9a00; }
[data-bs-theme="dark"] .ksp-sp-review__ava { background: rgba(255, 32, 86, .16); color: #ff637e; }
[data-bs-theme="dark"] .ksp-sp-review__ava.is-tone-1 { background: rgba(43, 127, 255, .18); color: #8ec5ff; }
[data-bs-theme="dark"] .ksp-sp-review__ava.is-tone-2 { background: rgba(0, 201, 80, .16); color: #7bf1a8; }
[data-bs-theme="dark"] .ksp-sp-review__ava.is-tone-3 { background: rgba(254, 154, 0, .16); color: #ffd230; }
[data-bs-theme="dark"] .ksp-sp-thumb { background: var(--ksp-surface-2); }
[data-bs-theme="dark"] .ksp-sp-thumb.is-active { outline-color: #fafaf9; }
[data-bs-theme="dark"] .ksp-sp-thumb.is-active::after { box-shadow: inset 0 0 0 2px #0c0a09; }

@media (prefers-reduced-motion: reduce) {
  .ksp-sp-hero__img,
.ksp-sp-lightbox__img,
.ksp-sp-thumb img,
.ksp-sp-week summary .material-symbols-rounded { transition: none; }
}
/* @salon-sayfa-son */

/* @kokpit-sekme-8 — Kokpit sekme satırında 8 modül (yayına almada eklenen "Ayarlar"): 1320 px kapta "Tüm Salon / Kadın / Erkek"
   seçicisiyle birlikte taşmadan sığsın diye yatay iç boşluk, ikon aralığı ve ikon boyutu biraz daraltılır (7 sekmede etkisiz). */
.ksp-ptabs__nav:has(> .ksp-ptabs__tab:nth-child(8)) .ksp-ptabs__tab { padding-inline: .4rem; gap: .25rem; }
.ksp-ptabs__nav:has(> .ksp-ptabs__tab:nth-child(8)) .ksp-ptabs__tab .material-symbols-rounded { font-size: 16px; }

/* @kokpit-hizmet — Salon Kokpiti > Hizmet Kataloğu (views/panels/tenant/services.php + partials/service-*, app.js "@kokpit-hizmet").
   Ölçüler kullanıcının referans tasarımından; renkler token karşılıklarıyla koyu temada da aynı hiyerarşiyi korur. */
.ksp-svc {
  --svc-rose: #e11d48; --svc-rose-bg: #fff1f2; --svc-rose-line: #fecdd3;
  --svc-ink2: #44403c; --svc-soft: #57534e; --svc-faint: #a8a29e; --svc-box: #d6d3d1;
  --svc-line: #f5f5f4; --svc-off-bg: #f5f5f4; --svc-off-ink: #78716c;
  --svc-dark: #1c1917; --svc-dark-hover: #292524; --svc-dark-ink: #fff;
  --svc-shadow: 0 1px 2px rgba(28, 25, 23, .04); --svc-shadow-hover: 0 12px 28px -18px rgba(28, 25, 23, .3);
  --svc-ring: 0 0 0 3px rgba(236, 0, 63, .18);
  --svc-warn-bg: #fffbeb; --svc-warn-line: #fde68a; --svc-warn-ink: #92400e;
}
[data-bs-theme="dark"] .ksp-svc {
  --svc-rose: #fb7185; --svc-rose-bg: rgba(244, 63, 94, .14); --svc-rose-line: rgba(244, 63, 94, .35);
  --svc-ink2: #e7e5e4; --svc-soft: #d6d3d1; --svc-faint: #a8a29e; --svc-box: #57534e;
  --svc-line: rgba(255, 255, 255, .07); --svc-off-bg: rgba(255, 255, 255, .07); --svc-off-ink: #a8a29e;
  --svc-dark: #fafaf9; --svc-dark-hover: #fff; --svc-dark-ink: #1c1917;
  --svc-shadow: 0 1px 2px rgba(0, 0, 0, .35); --svc-shadow-hover: 0 12px 28px -18px rgba(0, 0, 0, .9);
  --svc-ring: 0 0 0 3px rgba(251, 113, 133, .22);
  --svc-warn-bg: rgba(245, 158, 11, .12); --svc-warn-line: rgba(245, 158, 11, .35); --svc-warn-ink: #fcd34d;
}
.ksp-svc [hidden] { display: none !important; }

/* Başlık kartı: rose ikon + başlık + açıklama, sağda koyu "Yeni Hizmet Ekle" */
.ksp-svc-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 24px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); box-shadow: var(--svc-shadow); }
.ksp-svc-head__text { min-width: 0; }
/* İkon başlığın İLK satırıyla hizalı kalır (başlık dar ekranda iki satıra sarınca satır arasına kaymaz) */
.ksp-svc-head__title { display: flex; align-items: flex-start; gap: 10px; margin: 0; font-size: 20px; font-weight: 800; letter-spacing: 0; line-height: 26px; color: var(--ksp-text); }
.ksp-svc-head__title .material-symbols-rounded { flex-shrink: 0; display: grid; place-items: center; height: 26px; font-size: 22px; color: var(--svc-rose); }
.ksp-svc-head__lead { margin: 4px 0 0; font-size: 13px; font-weight: 500; line-height: 1.45; color: var(--ksp-muted); }
/* Sayaç satırı (toplam · aktif · pasif) başlık kartının içinde durur */
.ksp-svc-head__count { margin: 6px 0 0; font-size: 12.5px; font-weight: 500; line-height: 1.45; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-svc-head__count:empty { display: none; }
.ksp-svc-add { display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex-shrink: 0; height: 44px; padding: 0 20px; border: 0; border-radius: 10px; background: var(--svc-dark); color: var(--svc-dark-ink); font-family: inherit; font-size: 14px; font-weight: 700; line-height: 1; white-space: nowrap; }
.ksp-svc-add:hover, .ksp-svc-add:focus { background: var(--svc-dark-hover); color: var(--svc-dark-ink); }
.ksp-svc-add:focus-visible { outline: 0; box-shadow: var(--svc-ring); }
.ksp-svc-add .material-symbols-rounded { font-size: 18px; }

/* Kart ızgarası: 3 sütun · tablette 2 · telefonda 1 */
.ksp-svc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 20px; }
/* Sayfalama satırı: yalnız 500'den fazla hizmette basılır (tek sayfaya sığan katalogda hiç görünmez) */
.ksp-svc-pager { display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; margin-top: 20px; }
.ksp-svc-pager__btn { display: inline-flex; align-items: center; gap: 4px; height: 40px; padding: 0 14px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-size: 13px; font-weight: 700; }
.ksp-svc-pager__btn:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-svc-pager__btn.is-off { opacity: .45; pointer-events: none; }
.ksp-svc-pager__btn .material-symbols-rounded { font-size: 18px; }
.ksp-svc-pager__range { font-size: 12.5px; font-weight: 600; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }

/* Hizmet kartı */
.ksp-svc-card { display: flex; flex-direction: column; min-width: 0; padding: 18px 20px 16px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); box-shadow: var(--svc-shadow); transition: box-shadow .15s, opacity .15s; }
.ksp-svc-card:hover { box-shadow: var(--svc-shadow-hover); }
.ksp-svc-card.is-passive { opacity: .72; }
.ksp-svc-card__top { display: flex; align-items: center; gap: 6px; min-width: 0; }
.ksp-svc-pill { display: inline-flex; align-items: center; min-width: 0; height: 24px; padding: 0 10px; border-radius: 6px; background: var(--svc-rose-bg); color: var(--svc-rose); font-size: 11px; font-weight: 800; letter-spacing: .04em; line-height: 1; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-svc-pill--off { flex-shrink: 0; background: var(--svc-off-bg); color: var(--svc-off-ink); letter-spacing: 0; text-transform: none; }
.ksp-svc-card__acts { display: flex; align-items: center; gap: 2px; flex-shrink: 0; margin-inline-start: auto; margin-inline-end: -6px; }
.ksp-svc-card__acts form { margin: 0; line-height: 0; }
.ksp-svc-icon { width: 32px; height: 32px; flex-shrink: 0; display: grid; place-items: center; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--svc-faint); transition: background .15s, color .15s; }
.ksp-svc-icon .material-symbols-rounded { font-size: 19px; }
.ksp-svc-icon:hover { background: var(--ksp-surface-2); }
.ksp-svc-icon--edit:hover { color: var(--ksp-text); }
.ksp-svc-icon--del:hover { color: var(--svc-rose); }
.ksp-svc-icon:focus-visible { outline: 0; box-shadow: var(--svc-ring); }
/* Ad ve açıklama en fazla iki satır: kart yükseklikleri satırda dengeli kalır */
.ksp-svc-card__name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; margin: 12px 0 0; font-size: 16px; font-weight: 800; letter-spacing: 0; line-height: 1.35; color: var(--ksp-text); overflow: hidden; overflow-wrap: anywhere; }
.ksp-svc-card__desc { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; margin: 6px 0 0; font-size: 13px; font-weight: 500; line-height: 1.45; color: var(--ksp-muted); overflow: hidden; overflow-wrap: anywhere; }
/* Alt satır kartın dibine yaslanır (en az 18px boşluk): aynı satırdaki kartlarda süre / fiyat aynı hizada */
.ksp-svc-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 18px; }
.ksp-svc-time { display: inline-flex; align-items: center; gap: 6px; min-width: 0; height: 30px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-text); font-size: 13px; font-weight: 700; line-height: 1; white-space: nowrap; }
.ksp-svc-time .material-symbols-rounded { flex-shrink: 0; font-size: 15px; color: var(--svc-rose); }
.ksp-svc-price { flex-shrink: 0; font-size: 20px; font-weight: 800; line-height: 1.2; color: var(--svc-rose); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Boş durum: ızgaranın tamamını kaplar */
.ksp-svc-empty { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 48px 20px 44px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); box-shadow: var(--svc-shadow); text-align: center; }
.ksp-svc-empty > .material-symbols-rounded { font-size: 40px; color: var(--svc-box); }
.ksp-svc-empty strong { font-size: 16px; font-weight: 800; color: var(--ksp-text); }
.ksp-svc-empty p { max-width: 420px; margin: 0 0 8px; font-size: 13px; line-height: 1.5; color: var(--ksp-muted); }

/* Yeni / düzenle ve silme pencereleri */
.ksp-svc-modal .modal-dialog { max-width: 460px; }
.ksp-svc-modal .modal-content { border: 0; border-radius: 16px; background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 30px 60px -20px rgba(28, 25, 23, .4); overflow: hidden; }
.ksp-svc-mhead { gap: 10px; padding: 20px 22px 0; border: 0; }
.ksp-svc-mtitle { min-width: 0; margin: 0; font-size: 18px; font-weight: 800; letter-spacing: 0; line-height: 1.35; color: var(--ksp-text); }
.ksp-svc-modal[data-mode="new"] [data-svc-title="edit"], .ksp-svc-modal[data-mode="edit"] [data-svc-title="new"] { display: none; }
.ksp-svc-mclose { width: 32px; height: 32px; flex-shrink: 0; display: grid; place-items: center; margin: -4px -6px -4px auto; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--ksp-muted); }
.ksp-svc-mclose:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-svc-mclose .material-symbols-rounded { font-size: 20px; }
/* Gövdenin altında alanlar arası boşluk kadar (14px) nefes payı: son satır ayırıcı çizgiye yapışmaz */
.ksp-svc-mbody { display: flex; flex-direction: column; gap: 14px; padding: 18px 22px 14px; }
.ksp-svc-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ksp-svc-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ksp-svc-label { margin: 0; font-size: 12.5px; font-weight: 600; line-height: 1.4; color: var(--svc-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-svc-label b { font-weight: 600; color: var(--svc-rose); }
.ksp-svc-input { width: 100%; height: 44px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 10px; background-color: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 14px; }
.ksp-svc-input::placeholder { color: var(--svc-faint); }
.ksp-svc-input:focus { outline: 0; border-color: var(--svc-rose); box-shadow: var(--svc-ring); }
select.ksp-svc-input { -webkit-appearance: none; appearance: none; padding-inline-end: 34px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2378716c'%3E%3Cpath d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; background-size: 20px; cursor: pointer; }
[dir="rtl"] select.ksp-svc-input { background-position: left 10px center; }
/* Uzun seçenek metni (ör. "Kadın Kuaförü & Güzellik") dar sütunda sert kesilmesin */
select.ksp-svc-input { text-overflow: ellipsis; }
.ksp-svc-input--area { height: auto; padding: 11px 12px; line-height: 1.5; resize: vertical; }
.ksp-svc-count { align-self: flex-end; margin: -2px 0 0; font-size: 11.5px; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-svc-err { margin: 0; font-size: 12px; line-height: 1.4; color: var(--svc-rose); }
.ksp-svc-err:empty { display: none; }
.ksp-svc-field:has(.ksp-svc-err:not(:empty)) .ksp-svc-input { border-color: var(--svc-rose); }
.ksp-svc-alert { display: flex; align-items: flex-start; gap: 8px; padding: 9px 12px; border: 1px solid var(--svc-rose-line); border-radius: 10px; background: var(--svc-rose-bg); color: var(--svc-rose); font-size: 13px; font-weight: 600; line-height: 1.45; }
.ksp-svc-alert .material-symbols-rounded { flex-shrink: 0; font-size: 18px; }
/* Onay kutuları: alt sırada yan yana iki etiket (dar ekranda alt alta) */
.ksp-svc-checks { display: flex; flex-wrap: wrap; gap: 10px 22px; padding-top: 2px; }
.ksp-svc-check { position: relative; display: inline-flex; align-items: center; gap: 9px; margin: 0; font-size: 12.5px; font-weight: 600; line-height: 1.4; color: var(--svc-ink2); cursor: pointer; }
.ksp-svc-cb { position: absolute; width: 18px; height: 18px; margin: 0; opacity: 0; pointer-events: none; }
.ksp-svc-cb__box { width: 18px; height: 18px; flex-shrink: 0; display: grid; place-items: center; border: 1.5px solid var(--svc-box); border-radius: 5px; background: var(--ksp-surface); color: transparent; transition: background .15s, border-color .15s; }
.ksp-svc-cb__box .material-symbols-rounded { font-size: 14px; font-variation-settings: "FILL" 0, "wght" 700, "GRAD" 0, "opsz" 20; }
.ksp-svc-cb:checked + .ksp-svc-cb__box { border-color: var(--svc-rose); background: var(--svc-rose); color: #fff; }
[data-bs-theme="dark"] .ksp-svc-cb:checked + .ksp-svc-cb__box { color: #1c1917; }
.ksp-svc-cb:focus-visible + .ksp-svc-cb__box { box-shadow: var(--svc-ring); }
.ksp-svc-check__text { min-width: 0; }
/* Ayırıcı çizgi gövdenin altında, düğmeler çizgiden 16px aşağıda (referans ölçüsü) */
.ksp-svc-mfoot { flex-wrap: nowrap; justify-content: flex-end; gap: 8px; margin-top: 0; padding: 16px 22px 20px; border-top: 1px solid var(--svc-line); }
.ksp-svc-mfoot > * { margin: 0; }
.ksp-svc-cancel { height: 44px; padding: 0 14px; border: 0; border-radius: 10px; background: transparent; color: var(--svc-soft); font-family: inherit; font-size: 14px; font-weight: 600; }
.ksp-svc-cancel:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-svc-save { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 0 22px; border: 0; border-radius: 10px; background: var(--svc-dark); color: var(--svc-dark-ink); font-family: inherit; font-size: 14px; font-weight: 700; line-height: 1; }
.ksp-svc-save:hover { background: var(--svc-dark-hover); }
.ksp-svc-save:disabled { opacity: .6; pointer-events: none; }
.ksp-svc-save--danger { background: #e11d48; color: #fff; }
.ksp-svc-save--danger:hover { background: #be123c; color: #fff; }
.ksp-svc-spin { width: 15px; height: 15px; flex-shrink: 0; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: ksp-svc-spin .7s linear infinite; }
@keyframes ksp-svc-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .ksp-svc-spin { animation-duration: 2s; } }
/* Silme penceresi */
.ksp-svc-deltext { margin: 0; font-size: 14px; line-height: 1.55; color: var(--svc-ink2); overflow-wrap: anywhere; }
.ksp-svc-warn { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 10px 12px; border: 1px solid var(--svc-warn-line); border-radius: 10px; background: var(--svc-warn-bg); color: var(--svc-warn-ink); font-size: 12.5px; font-weight: 600; line-height: 1.45; }
.ksp-svc-warn .material-symbols-rounded { flex-shrink: 0; font-size: 18px; }

/* Kırılımlarda YALNIZ sütun sayısı değişir: aralık 24px, ızgaranın başlık kartına uzaklığı 20px sabit (referans) */
@media (max-width: 1199.98px) {
  .ksp-svc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  /* Telefon: başlık kartı dikey, düğme başlığın altında tam genişlik; kartlar tek sütun.
     Punto ve kart iç boşluğu referanstaki gibi kalır (yalnız yön ve düğme genişliği değişir). */
  .ksp-svc-head { flex-direction: column; align-items: stretch; gap: 14px; }
  .ksp-svc-add { width: 100%; }
  .ksp-svc-grid { grid-template-columns: minmax(0, 1fr); }
  .ksp-svc-empty { padding: 36px 16px 32px; }
  /* Dokunma hedefi: kutu ve yazı aynı boyutta kalır, etiketin tıklanabilir yüksekliği 44px olur */
  .ksp-svc-check { min-height: 44px; }
  .ksp-svc-checks { gap: 0 22px; }
}
/* Bildirim yığını bu sayfada ALTA alınır: üstte kalınca sekme satırındaki "Tüm Salon / Kadın / Erkek"
   bölüm seçicisini 5 saniye boyunca örtüyordu (sunucu flash'ı ve app.js bildirimi aynı yığını kullanır). */
body:has(.ksp-svc) .ksp-toast-stack { top: auto; bottom: 24px; }
@media (max-width: 991.98px) {
  body:has(.ksp-svc) .ksp-toast-stack { bottom: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom) + 16px); }
}

@media (max-width: 575.98px) {
  /* Pencere tam genişlik (iki yanda 12px); alt çubuk kaydırma boyunca görünür kalır */
  .ksp-svc-modal .modal-dialog { max-width: none; margin: 12px; }
  .ksp-svc-mhead { padding: 18px 16px 0; }
  .ksp-svc-mbody { padding: 16px 16px 14px; }
  .ksp-svc-mfoot { padding: 14px 16px calc(16px + env(safe-area-inset-bottom)); background: var(--ksp-surface); }
  .ksp-svc-cols { grid-template-columns: minmax(0, 1fr); }
}

/* @kokpit-paket — Salon Kokpiti > Hizmet Kataloğu "Paket Hazırla" sihirbazı
   (views/panels/partials/package-wizard.php + package-preview.php, app.js "@kokpit-paket").
   Katalog penceresiyle AYNI aile: token, boşluk, düğme biçimi "@kokpit-hizmet" bloğundan (.ksp-svc-*) devralınır;
   burada yalnız sihirbaza özgü düzen (adım şeridi, hizmet seçimi, görsel kutusu, canlı önizleme) tanımlanır.
   Önizleme kartı ana sayfadaki .ksp-pkg kuralını kullanır: burada YALNIZ koyu sahne ve ölçek vardır. */

/* Başlıkta iki yol: "Paket Hazırla" (ikincil) + "Yeni Hizmet Ekle" (birincil) */
.ksp-svc-head__acts { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.ksp-svc-add--ghost { border: 1px solid var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); }
.ksp-svc-add--ghost:hover, .ksp-svc-add--ghost:focus { background: var(--ksp-surface-2); color: var(--ksp-text); }
/* Katalog kartında paket rozeti ve "vitrinde eksik" uyarısı */
.ksp-svc-pill--pkg { flex-shrink: 0; gap: 4px; padding-inline: 8px; background: var(--svc-dark); color: var(--svc-dark-ink); letter-spacing: .04em; }
.ksp-svc-pill--pkg .material-symbols-rounded { font-size: 13px; }
.ksp-svc-card__warn { display: flex; align-items: flex-start; gap: 6px; margin: 10px 0 0; padding: 7px 10px; border: 1px solid var(--svc-warn-line); border-radius: 9px; background: var(--svc-warn-bg); color: var(--svc-warn-ink); font-size: 12px; font-weight: 600; line-height: 1.4; }
.ksp-svc-card__warn .material-symbols-rounded { flex-shrink: 0; font-size: 16px; }
/* Hizmet penceresindeki tek satır yönlendirme (kaldırılan "Paket olarak göster" kutusunun yerine) */
.ksp-svc-note { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 9px 12px; border: 1px dashed var(--ksp-border); border-radius: 10px; color: var(--ksp-muted); font-size: 12.5px; font-weight: 500; line-height: 1.45; }
.ksp-svc-note .material-symbols-rounded { flex-shrink: 0; font-size: 18px; color: var(--svc-rose); }

/* Pencere: solda adımlar, sağda canlı önizleme. Genişlik "@kokpit-hizmet" bloğundaki
   .ksp-svc-modal .modal-dialog (460px) kuralını aynı ağırlıkta ezer: sihirbaz iki sütun ister. */
.ksp-pkg-modal .modal-dialog { max-width: 1020px; }
.ksp-pkg-modal[data-mode="new"] [data-pkg-title="edit"], .ksp-pkg-modal[data-mode="edit"] [data-pkg-title="new"] { display: none; }
.ksp-pkg-mbody { display: grid; grid-template-columns: minmax(0, 1fr) 396px; align-items: start; gap: 22px; padding: 18px 22px 14px; }
.ksp-pkg-wiz { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
/* Adım kipi YALNIZ JS varsa: app.js data-step yazınca öteki bölümler gizlenir (JS yoksa üçü de açık kalır) */
.ksp-pkg-wiz[data-step="1"] [data-pkg-step]:not([data-pkg-step="1"]),
.ksp-pkg-wiz[data-step="2"] [data-pkg-step]:not([data-pkg-step="2"]),
.ksp-pkg-wiz[data-step="3"] [data-pkg-step]:not([data-pkg-step="3"]) { display: none; }

.ksp-pkg-steps { display: flex; align-items: center; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ksp-pkg-step { display: flex; align-items: center; gap: 7px; flex: 1; min-width: 0; padding: 8px 10px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-muted); font-size: 12px; font-weight: 700; line-height: 1.2; }
.ksp-pkg-step__no { width: 20px; height: 20px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: var(--svc-off-bg); color: var(--svc-off-ink); font-size: 11px; font-weight: 800; }
.ksp-pkg-step__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-pkg-step.is-done { color: var(--ksp-text); }
.ksp-pkg-step.is-done .ksp-pkg-step__no { background: var(--svc-rose-bg); color: var(--svc-rose); }
.ksp-pkg-step.is-now { border-color: var(--svc-rose); color: var(--ksp-text); }
.ksp-pkg-step.is-now .ksp-pkg-step__no { background: var(--svc-rose); color: #fff; }
[data-bs-theme="dark"] .ksp-pkg-step.is-now .ksp-pkg-step__no { color: #1c1917; }

.ksp-pkg-pane { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.ksp-pkg-pane__title { margin: 0; font-size: 15px; font-weight: 800; line-height: 1.35; color: var(--ksp-text); }
.ksp-pkg-pane__lead { margin: -10px 0 0; font-size: 12.5px; font-weight: 500; line-height: 1.45; color: var(--ksp-muted); }
.ksp-pkg-hint { margin: -2px 0 0; font-size: 11.5px; font-weight: 500; line-height: 1.4; color: var(--ksp-muted); }
.ksp-pkg-note { margin: 0; padding: 14px 12px; border: 1px dashed var(--ksp-border); border-radius: 10px; color: var(--ksp-muted); font-size: 12.5px; line-height: 1.45; text-align: center; }
.ksp-pkg-totals { margin: 0; font-size: 12.5px; font-weight: 700; line-height: 1.45; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-pkg-totals:empty { display: none; }

/* Adım 1: hizmet seçimi (kaydırmalı liste) + madde satırları */
.ksp-pkg-picks { display: flex; flex-direction: column; gap: 2px; max-height: 268px; overflow-y: auto; padding: 4px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); }
.ksp-pkg-picks:empty { display: none; }
.ksp-pkg-pick { position: relative; display: flex; align-items: center; gap: 10px; min-width: 0; margin: 0; padding: 9px 10px; border-radius: 9px; cursor: pointer; }
.ksp-pkg-pick:hover { background: var(--ksp-surface-2); }
.ksp-pkg-pick:has(.ksp-svc-cb:checked) { background: var(--svc-rose-bg); }
.ksp-pkg-pick:has(.ksp-svc-cb:focus-visible) { box-shadow: var(--svc-ring); }
.ksp-pkg-pick__text { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
.ksp-pkg-pick__text strong { font-size: 13px; font-weight: 700; line-height: 1.35; color: var(--ksp-text); overflow-wrap: anywhere; }
.ksp-pkg-pick__text small { font-size: 11.5px; font-weight: 600; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-pkg-pick .ksp-svc-pill { flex-shrink: 0; max-width: 184px; }
.ksp-pkg-lines { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-pkg-line { display: flex; align-items: center; gap: 6px; min-width: 0; }
.ksp-pkg-line .ksp-svc-input { height: 40px; }
.ksp-pkg-addline { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px; border: 1px dashed var(--ksp-border); border-radius: 9px; background: transparent; color: var(--ksp-text); font-family: inherit; font-size: 12.5px; font-weight: 700; }
.ksp-pkg-addline:hover { background: var(--ksp-surface-2); }
.ksp-pkg-addline:disabled { opacity: .5; pointer-events: none; }
.ksp-pkg-addline .material-symbols-rounded { font-size: 17px; }

/* Adım 2: görsel kutusu (sürükle-bırak + seç) */
.ksp-pkg-drop { display: grid; grid-template-columns: 172px minmax(0, 1fr); align-items: center; gap: 14px; }
.ksp-pkg-drop__input { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.ksp-pkg-drop__box { position: relative; aspect-ratio: 4 / 3; display: grid; place-items: center; overflow: hidden; margin: 0; border: 1.5px dashed var(--svc-box); border-radius: 12px; background: var(--ksp-surface-2); cursor: pointer; }
.ksp-pkg-drop__box:hover, .ksp-pkg-drop.is-over .ksp-pkg-drop__box { border-color: var(--svc-rose); }
.ksp-pkg-drop__input:focus-visible ~ .ksp-pkg-drop__box { border-color: var(--svc-rose); box-shadow: var(--svc-ring); }
.ksp-pkg-drop__img { display: none; width: 100%; height: 100%; object-fit: cover; }
.ksp-pkg-drop.has-image .ksp-pkg-drop__img { display: block; }
.ksp-pkg-drop.has-image .ksp-pkg-drop__empty { display: none; }
.ksp-pkg-drop__empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px; color: var(--ksp-muted); font-size: 11.5px; font-weight: 600; line-height: 1.35; text-align: center; }
.ksp-pkg-drop__empty .material-symbols-rounded { font-size: 26px; color: var(--svc-box); }
.ksp-pkg-drop__side { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ksp-pkg-drop__acts { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ksp-pkg-drop__btn { display: inline-flex; align-items: center; gap: 6px; height: 38px; margin: 0; padding: 0 14px; border: 1px solid var(--ksp-border); border-radius: 9px; background: var(--ksp-surface); color: var(--ksp-text); font-size: 12.5px; font-weight: 700; cursor: pointer; }
.ksp-pkg-drop__btn:hover { background: var(--ksp-surface-2); }
.ksp-pkg-drop__btn .material-symbols-rounded { font-size: 17px; }
.ksp-pkg-drop__remove { height: 38px; padding: 0 10px; font-size: 12.5px; }

/* Adım 3: fiyat üçlüsü */
.ksp-pkg-cols3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* Canlı önizleme: ana sayfadaki koyu bölümü taklit eden sahne; kart .ksp-pkg kuralıyla birebir */
.ksp-pkg-side { position: sticky; top: 0; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ksp-pkg-side__title { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-pkg-side__title .material-symbols-rounded { font-size: 17px; }
.ksp-pkg-stage { padding: 18px; border-radius: 16px; background: radial-gradient(60% 45% at 85% 12%, rgba(136, 19, 55, .3), transparent 70%), linear-gradient(180deg, #1c1917, #292524); }
.ksp-pkg-stage .ksp-pkg { border-radius: 14px; }
.ksp-pkg-stage .ksp-pkg__img { height: 150px; }
/* Ana sayfadaki kart daha geniş bir sütunda durur: dar önizlemede fiyat satırı kırılmasın */
.ksp-pkg-stage .ksp-pkg__price { flex-shrink: 0; }
.ksp-pkg-stage .ksp-pkg__price strong { white-space: nowrap; }
.ksp-pkg-stage .ksp-pkg__foot { gap: .5rem; }
.ksp-pkg-stage .ksp-checklist li.is-empty { opacity: .45; }

.ksp-pkg-mfoot { flex-wrap: wrap; justify-content: flex-end; }
.ksp-pkg-progress { margin: 0 auto 0 0; font-size: 12px; font-weight: 700; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-pkg-back { display: inline-flex; align-items: center; gap: 6px; }
.ksp-pkg-back .material-symbols-rounded, [data-pkg-next] .material-symbols-rounded { font-size: 18px; }
[data-pkg-next] { display: inline-flex; align-items: center; gap: 6px; }

@media (max-width: 1199.98px) {
  /* Tablet: iki sütun sığmıyor, pencere daralır */
  .ksp-pkg-modal .modal-dialog { max-width: 720px; }
}
@media (max-width: 991.98px) {
  /* Telefon / tablet: adımlar tam genişlik, önizleme EN ALTTA (kullanıcı isteği) */
  .ksp-pkg-mbody { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .ksp-pkg-side { position: static; }
  .ksp-pkg-stage { padding: 14px; }
}
@media (max-width: 575.98px) {
  .ksp-pkg-modal .modal-dialog { max-width: none; margin: 12px; }
  .ksp-pkg-mbody { padding: 16px 16px 14px; }
  .ksp-pkg-cols3 { grid-template-columns: minmax(0, 1fr); }
  .ksp-pkg-drop { grid-template-columns: minmax(0, 1fr); }
  /* Telefonda bölüm hapı hizmet adını iki satıra kırmasın: hap kısalır (ellipsis), ad öne geçer */
  .ksp-pkg-pick .ksp-svc-pill { max-width: 112px; }
  .ksp-pkg-step__text { display: none; }
  .ksp-pkg-step { flex: 0 0 auto; justify-content: center; padding: 8px; }
  .ksp-pkg-steps { justify-content: flex-start; }
  .ksp-pkg-mfoot .ksp-svc-cancel, .ksp-pkg-mfoot .ksp-svc-save { flex: 1 1 auto; justify-content: center; }
  .ksp-pkg-progress { flex: 1 0 100%; margin: 0 0 4px; text-align: center; }
  .ksp-svc-head__acts { flex-direction: column; align-items: stretch; width: 100%; }
}

/* @kokpit-musteri-aktarim — Salon Kokpiti > Müşteri CRM "Müşterileri İçeri Aktar" sihirbazı
   (views/panels/partials/customers-import.php + customers-header.php, app.js "@kokpit-musteri-aktarim").
   "Yeni Müşteri Ekle" penceresiyle AYNI aile: token, boşluk, alan ve düğme biçimi "@kokpit-musteri"
   bloğundan (.ksp-cus-*) devralınır; burada YALNIZ sihirbaza özgü düzen (adım şeridi, kaynak kartı,
   sürükle-bırak kutusu, önizleme tablosu, cinsiyet satırları) tanımlanır. Dosya sonuna EKLENİR. */

/* Başlıkta ikinci yol: "İçeri Aktar" (ikincil) + "Yeni Müşteri Ekle" (birincil) */
.ksp-cus-add--ghost { border: 1px solid var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); box-shadow: none; }
.ksp-cus-add--ghost:hover, .ksp-cus-add--ghost:focus-visible { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-imp-nojs { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--ksp-muted); }
.ksp-imp-nojs .material-symbols-rounded { font-size: 17px; }

/* Pencere: tek sütun dört adım. "@kokpit-musteri" bloğundaki .ksp-cus-modal .modal-dialog (460px)
   kuralını aynı ağırlıkta ezer: önizleme tablosu daha geniş bir pencere ister. */
.ksp-imp-modal .modal-dialog { max-width: 720px; }
.ksp-imp-body { gap: 14px; }
.ksp-imp-pane { display: flex; flex-direction: column; gap: 12px; min-width: 0; margin: 0; }
.ksp-imp-pane__title { display: flex; align-items: center; gap: 7px; margin: 0; font-size: 15px; font-weight: 800; line-height: 1.35; color: var(--ksp-text); }
.ksp-imp-pane__title .material-symbols-rounded { font-size: 20px; color: var(--cus-rose); }
/* Adım değişince odak başlığa taşınır (ekran okuyucu için, app.js setStep); görsel odak halkası başlıkta gösterilmez */
.ksp-imp-pane__title:focus, .ksp-imp-pane__title:focus-visible { outline: 0; box-shadow: none; }
.ksp-imp-pane__lead { margin: -8px 0 0; font-size: 12.5px; font-weight: 500; line-height: 1.5; color: var(--ksp-muted); }
.ksp-imp-pane__foot { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.ksp-imp-sub { margin: 2px 0 -4px; font-size: 12px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; color: var(--cus-head); }
.ksp-imp-sub:empty { display: none; }
.ksp-imp-hint { display: flex; align-items: flex-start; gap: 6px; margin: 0; font-size: 12px; font-weight: 500; line-height: 1.45; color: var(--ksp-muted); }
.ksp-imp-hint:empty { display: none; }
.ksp-imp-hint .material-symbols-rounded { flex-shrink: 0; font-size: 16px; }
.ksp-imp-note { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 9px 12px; border: 1px solid var(--cus-tech-line); border-radius: 10px; background: var(--cus-tech-bg); color: var(--cus-rose-ink); font-size: 12.5px; font-weight: 600; line-height: 1.45; }
.ksp-imp-note .material-symbols-rounded { flex-shrink: 0; font-size: 18px; color: var(--cus-rose); }

/* Adım şeridi (dördüncü adımdan sonraki sonuç ekranı şeritte yer almaz) */
.ksp-imp-steps { display: flex; align-items: center; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ksp-imp-step { display: flex; align-items: center; gap: 7px; flex: 1; min-width: 0; padding: 8px 10px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-muted); font-size: 12px; font-weight: 700; line-height: 1.2; }
.ksp-imp-step__no { width: 20px; height: 20px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: var(--ksp-surface-2); color: var(--cus-soft); font-size: 11px; font-weight: 800; }
.ksp-imp-step__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-imp-step.is-done { color: var(--ksp-text); }
.ksp-imp-step.is-done .ksp-imp-step__no { background: var(--cus-f-bg); color: var(--cus-f-ink); }
.ksp-imp-step.is-now { border-color: var(--cus-rose); color: var(--ksp-text); }
.ksp-imp-step.is-now .ksp-imp-step__no { background: var(--cus-rose); color: #fff; }
[data-bs-theme="dark"] .ksp-imp-step.is-now .ksp-imp-step__no { color: #1c1917; }

/* Adım 1 — kaynak kartı + sürükle-bırak kutusu */
.ksp-imp-src { display: flex; align-items: center; gap: 12px; width: 100%; padding: 14px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); color: var(--ksp-text); text-align: start; }
.ksp-imp-src:hover { border-color: #fda4af; }
.ksp-imp-src:focus-visible { outline: 0; border-color: var(--cus-rose); box-shadow: 0 0 0 3px rgba(225, 29, 72, .18); }
.ksp-imp-src__ico { width: 40px; height: 40px; flex-shrink: 0; display: grid; place-items: center; border-radius: 12px; background: var(--cus-f-bg); color: var(--cus-f-ink); }
.ksp-imp-src__ico .material-symbols-rounded { font-size: 22px; }
.ksp-imp-src__text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.ksp-imp-src__text strong { font-size: 14px; font-weight: 800; line-height: 1.3; }
.ksp-imp-src__text small { font-size: 12px; font-weight: 500; line-height: 1.45; color: var(--ksp-muted); }
.ksp-imp-src__go { flex-shrink: 0; font-size: 18px; color: var(--cus-rose); }
.ksp-imp-drop { position: relative; }
.ksp-imp-drop__input { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.ksp-imp-drop__box { display: flex; flex-direction: column; align-items: center; gap: 4px; margin: 0; padding: 22px 16px; border: 1.5px dashed var(--cus-tech-line); border-radius: 14px; background: var(--ksp-surface-2); text-align: center; cursor: pointer; }
.ksp-imp-drop__box:hover, .ksp-imp-drop.is-over .ksp-imp-drop__box { border-color: var(--cus-rose); }
.ksp-imp-drop__input:focus-visible ~ .ksp-imp-drop__box { border-color: var(--cus-rose); box-shadow: 0 0 0 3px rgba(225, 29, 72, .18); }
.ksp-imp-drop__box > .material-symbols-rounded { font-size: 30px; color: var(--cus-rose); }
.ksp-imp-drop__box strong { font-size: 14px; font-weight: 800; color: var(--ksp-text); }
.ksp-imp-drop__box span { font-size: 12.5px; color: var(--ksp-muted); }
.ksp-imp-drop__box small { font-size: 11.5px; font-weight: 600; color: var(--ksp-muted); }
.ksp-imp-drop.is-busy { opacity: .6; pointer-events: none; }
.ksp-imp-tpl { align-self: flex-start; display: inline-flex; align-items: center; gap: 5px; height: 34px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--cus-ink2); font-family: inherit; font-size: 12.5px; font-weight: 700; }
.ksp-imp-tpl:hover { border-color: #fda4af; color: var(--cus-rose); }
.ksp-imp-tpl .material-symbols-rounded { font-size: 17px; }

/* Adım 2 — sütun eşleme + ilk 20 satırlık önizleme (yalnız bu 20 satır DOM'a girer) */
.ksp-imp-maps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ksp-imp-tablewrap { max-height: 300px; overflow: auto; border: 1px solid var(--ksp-border); border-radius: 12px; scrollbar-width: thin; scrollbar-color: #d6d3d1 transparent; }
.ksp-imp-table { width: 100%; margin: 0; border-collapse: collapse; font-size: 12.5px; }
.ksp-imp-table th, .ksp-imp-table td { padding: 8px 10px; text-align: start; vertical-align: top; border-bottom: 1px solid var(--cus-line); overflow-wrap: anywhere; }
.ksp-imp-table thead th { position: sticky; top: 0; z-index: 1; background: var(--ksp-surface-2); color: var(--cus-head); font-size: 11.5px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; }
.ksp-imp-table tbody tr:last-child td { border-bottom: 0; }
.ksp-imp-table td:nth-child(3) { font-variant-numeric: tabular-nums; white-space: nowrap; }
.ksp-imp-badge { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--cus-soft); font-size: 11px; font-weight: 700; line-height: 1; white-space: nowrap; }
.ksp-imp-badge.is-yeni { background: #ecfdf5; color: #047857; }
.ksp-imp-badge.is-var { background: #eff6ff; color: #1d4ed8; }
.ksp-imp-badge.is-arsiv { background: #fffbeb; color: #b45309; }
.ksp-imp-badge.is-hatali { background: #fff1f2; color: #be123c; }
.ksp-imp-why { display: block; margin-top: 2px; font-size: 11px; font-weight: 500; color: var(--ksp-muted); }

/* Otomatik eşleme özeti: "Ad Soyad ← First Name + Last Name"; zorunlu alan bulunamadıysa rose vurgu.
   Seçim kutuları (.ksp-imp-mapbox) gizli başlar, "Eşlemeyi değiştir" ya da tanınmayan dosyada açılır. */
.ksp-imp-autohead { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ksp-imp-link { display: inline-flex; align-items: center; gap: 4px; flex-shrink: 0; padding: 0; border: 0; background: none; color: var(--cus-rose); font-family: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.ksp-imp-link:hover { text-decoration: underline; }
.ksp-imp-link .material-symbols-rounded { font-size: 17px; }
.ksp-imp-auto { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.ksp-imp-auto li { display: flex; align-items: center; gap: 6px; min-width: 0; padding: 8px 10px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface-2); font-size: 12.5px; color: var(--ksp-text); }
.ksp-imp-auto li b { flex-shrink: 0; font-weight: 800; }
.ksp-imp-auto li .material-symbols-rounded { flex-shrink: 0; font-size: 16px; color: var(--ksp-muted); }
.ksp-imp-auto li span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--cus-ink2); font-weight: 600; }
.ksp-imp-auto li.is-empty span:last-child { color: var(--ksp-muted); font-weight: 500; }
.ksp-imp-auto li.is-missing { border-color: var(--cus-rose); background: var(--cus-tech-bg); }
.ksp-imp-auto li.is-missing span:last-child { color: var(--cus-rose-ink); }
.ksp-imp-mapbox { display: flex; flex-direction: column; gap: 10px; padding: 12px; border: 1px dashed var(--cus-tech-line); border-radius: 12px; }

/* Özet + sonuç — özet satırları, onay kutuları, hata listesi */
.ksp-imp-sum { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ksp-imp-sum li { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid var(--ksp-border); border-radius: 10px; font-size: 13px; font-weight: 600; color: var(--ksp-text); }
.ksp-imp-sum li .material-symbols-rounded { flex-shrink: 0; font-size: 18px; color: var(--ksp-muted); }
.ksp-imp-sum li.is-good .material-symbols-rounded { color: #059669; }
.ksp-imp-sum li.is-bad .material-symbols-rounded { color: var(--cus-rose); }
.ksp-imp-check { display: flex; align-items: flex-start; gap: 9px; margin: 0; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 10px; font-size: 12.5px; font-weight: 600; line-height: 1.45; color: var(--cus-ink2); cursor: pointer; }
.ksp-imp-check:hover { background: var(--ksp-surface-2); }
.ksp-imp-check input { width: 18px; height: 18px; flex-shrink: 0; margin: 0; accent-color: #e11d48; cursor: pointer; }
.ksp-imp-check--must { border-color: var(--cus-tech-line); background: var(--cus-tech-bg); color: var(--ksp-text); }
.ksp-imp-check--must:hover { background: var(--cus-formula-bg); }
.ksp-imp-errs { display: flex; flex-direction: column; gap: 4px; max-height: 220px; overflow-y: auto; margin: 0; padding: 0; list-style: none; scrollbar-width: thin; }
.ksp-imp-errs li { padding: 7px 10px; border-radius: 8px; background: var(--cus-formula-bg); color: var(--cus-rose-ink); font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }

/* Alt bar: solda ilerleme / adım sayacı, sağda İptal · Geri · İleri (mevcut pencerenin yerleşimi) */
.ksp-imp-foot { flex-wrap: wrap; justify-content: flex-end; }
.ksp-imp-progress { margin: 0 auto 0 0; font-size: 12px; font-weight: 700; color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-imp-progress:empty { display: none; }
.ksp-imp-back, [data-imp-run] { display: inline-flex; align-items: center; gap: 6px; }
.ksp-imp-back .material-symbols-rounded { font-size: 18px; }
.ksp-imp-spin { width: 15px; height: 15px; flex-shrink: 0; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: ksp-svc-spin .7s linear infinite; }

[data-bs-theme="dark"] .ksp-imp-badge.is-yeni { background: rgba(16, 185, 129, .16); color: #6ee7b7; }
[data-bs-theme="dark"] .ksp-imp-badge.is-var { background: rgba(59, 130, 246, .16); color: #93c5fd; }
[data-bs-theme="dark"] .ksp-imp-badge.is-arsiv { background: rgba(245, 158, 11, .16); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-imp-badge.is-hatali { background: rgba(244, 63, 94, .16); color: #fda4af; }
[data-bs-theme="dark"] .ksp-imp-tablewrap { scrollbar-color: #57534e transparent; }
[data-bs-theme="dark"] .ksp-imp-sum li.is-good .material-symbols-rounded { color: #34d399; }

@media (max-width: 767.98px) {
  .ksp-imp-modal .modal-dialog { max-width: none; }
  .ksp-imp-maps { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575.98px) {
  .ksp-imp-modal .modal-dialog { margin: 12px; }
  .ksp-imp-step__text { display: none; }
  .ksp-imp-auto { grid-template-columns: minmax(0, 1fr); }
  .ksp-imp-autohead { flex-wrap: wrap; }
  .ksp-imp-step { flex: 1 1 auto; justify-content: center; padding: 8px; }
  .ksp-imp-foot .ksp-cus-cancel, .ksp-imp-foot .ksp-cus-save { flex: 1 1 auto; justify-content: center; }
  .ksp-imp-foot .ksp-cus-mfoot__acts { flex-wrap: wrap; width: 100%; }
  .ksp-imp-progress { flex: 1 0 100%; margin: 0 0 6px; text-align: center; }
  .ksp-imp-drop__box { padding: 18px 12px; }
}

/* @kokpit-kasa — Salon Kokpiti > Kasa: "Adisyon, POS Kasa & Finansal Bilanço" (views/panels/tenant/cash.php +
   partials/cash-*, app.js "@kokpit-kasa", docs/KASA-ADISYON.md). Kullanıcı referans tasarımı birebir (2026-09-18).
   Önek .ksp-cash-; renkler kokpit token'larından (açık / koyu tema). Dosya sonuna EKLENİR. */
.ksp-cash { --cash-rose: #e11d48; --cash-rose-bg: #fff1f2; --cash-ink2: #44403c; --cash-soft: #78716c; --cash-line: #f0eeec;
  --cash-mono: ui-monospace, SFMono-Regular, "Cascadia Mono", Menlo, Consolas, monospace;
  display: flex; flex-direction: column; gap: 16px; }
[data-bs-theme="dark"] .ksp-cash { --cash-rose: #fb7185; --cash-rose-bg: rgba(244, 63, 94, .14); --cash-ink2: #d6d3d1; --cash-soft: #a8a29e; --cash-line: rgba(255, 255, 255, .06); }
.ksp-cash-mono { font-family: var(--cash-mono); font-size: 11.5px; letter-spacing: -.01em; }

/* Başlık kartı + sekme hapları */
.ksp-cash-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px 20px; padding: 18px 22px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); box-shadow: 0 1px 2px rgba(28, 25, 23, .03); }
.ksp-cash-head__id { display: flex; align-items: center; gap: 14px; min-width: 0; }
.ksp-cash-head__ico { width: 40px; height: 40px; flex-shrink: 0; display: grid; place-items: center; border-radius: 12px; background: var(--cash-rose-bg); color: var(--cash-rose); }
.ksp-cash-head__ico .material-symbols-rounded { font-size: 22px; }
.ksp-cash-head__title { margin: 0; font-size: 18px; font-weight: 800; line-height: 1.3; letter-spacing: -.01em; color: var(--ksp-text); }
.ksp-cash-head__lead { margin: 2px 0 0; font-size: 12px; font-weight: 500; line-height: 1.45; color: var(--ksp-muted); }
.ksp-cash-tabs { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-cash-tab { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border: 1.5px solid transparent; border-radius: 10px; color: var(--cash-ink2); font-size: 12.5px; font-weight: 600; white-space: nowrap; text-decoration: none; }
.ksp-cash-tab .material-symbols-rounded { font-size: 17px; }
.ksp-cash-tab--adisyon .material-symbols-rounded { color: var(--cash-rose); }
.ksp-cash-tab--z .material-symbols-rounded { color: #059669; }
.ksp-cash-tab--aylik .material-symbols-rounded { color: #9333ea; }
.ksp-cash-tab--gider .material-symbols-rounded { color: #ea580c; }
.ksp-cash-tab:hover { color: var(--ksp-text); background: var(--ksp-surface); }
.ksp-cash-tab.is-active { border-color: var(--ksp-text); background: var(--ksp-surface); color: var(--ksp-text); font-weight: 700; box-shadow: 0 1px 3px rgba(28, 25, 23, .1); }

/* Göstergeler */
.ksp-cash-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.ksp-cash-kpis--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ksp-cash-kpi { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; min-width: 0; padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); box-shadow: 0 1px 2px rgba(28, 25, 23, .03); }
.ksp-cash-kpi__text { display: flex; flex-direction: column; min-width: 0; }
.ksp-cash-kpi__label { font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #57534e; }
.ksp-cash-kpi__value { margin: 10px 0 4px; font-size: 26px; font-weight: 800; line-height: 1.1; letter-spacing: -.02em; color: var(--ksp-text); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ksp-cash-kpi__value--purple { color: #7e22ce; }
.ksp-cash-kpi__value--blue { color: #1d4ed8; }
.ksp-cash-kpi__value--green { color: #047857; }
.ksp-cash-kpi__value--amber { color: #c2410c; }
.ksp-cash-kpi__value--rose { color: var(--cash-rose); }
.ksp-cash-kpi__foot { font-size: 11.5px; font-weight: 500; color: var(--ksp-muted); }
.ksp-cash-kpi__ico { width: 40px; height: 40px; flex-shrink: 0; display: grid; place-items: center; border-radius: 12px; }
.ksp-cash-kpi__ico .material-symbols-rounded { font-size: 20px; }
.ksp-cash-kpi__ico--rose { background: var(--cash-rose-bg); color: var(--cash-rose); }
.ksp-cash-kpi__ico--purple { background: #faf5ff; color: #9333ea; }
.ksp-cash-kpi__ico--blue { background: #eff6ff; color: #2563eb; }
.ksp-cash-kpi__ico--green { background: #ecfdf5; color: #059669; }
.ksp-cash-kpi__ico--amber { background: #fffbeb; color: #d97706; }

/* Kartlar, araç çubuğu, düğmeler */
.ksp-cash-card { border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); box-shadow: 0 1px 2px rgba(28, 25, 23, .03); }
.ksp-cash-card--table { overflow: hidden; }
.ksp-cash-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 12px; }
.ksp-cash-search { position: relative; display: flex; align-items: center; flex: 1 1 260px; min-width: 0; margin: 0; }
.ksp-cash-search > .material-symbols-rounded { position: absolute; inset-inline-start: 12px; font-size: 18px; color: var(--ksp-muted); pointer-events: none; }
.ksp-cash-search input { width: 100%; height: 40px; padding: 0 12px 0 38px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-text); font-family: inherit; font-size: 13px; }
.ksp-cash-search input:focus { outline: 0; border-color: var(--cash-rose); box-shadow: 0 0 0 3px rgba(225, 29, 72, .15); background: var(--ksp-surface); }
.ksp-cash-bar__funnel { display: inline-flex; color: var(--ksp-muted); }
.ksp-cash-bar__funnel .material-symbols-rounded { font-size: 18px; }
.ksp-cash-select { height: 40px; min-width: 150px; padding: 0 34px 0 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2378716c' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center; color: var(--ksp-text); font-family: inherit; font-size: 13px; font-weight: 600; appearance: none; cursor: pointer; }
.ksp-cash-select:focus { outline: 0; border-color: var(--cash-rose); box-shadow: 0 0 0 3px rgba(225, 29, 72, .15); }
.ksp-cash-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 40px; padding: 0 16px; border: 1px solid transparent; border-radius: 12px; font-family: inherit; font-size: 13px; font-weight: 700; white-space: nowrap; text-decoration: none; cursor: pointer; }
.ksp-cash-btn .material-symbols-rounded { font-size: 18px; }
.ksp-cash-btn--dark { background: #1c1917; color: #fff; }
.ksp-cash-btn--dark:hover { background: #292524; color: #fff; }
.ksp-cash-btn--rose { background: var(--cash-rose); color: #fff; box-shadow: 0 8px 18px -8px rgba(225, 29, 72, .6); }
.ksp-cash-btn--rose:hover { background: #be123c; color: #fff; }
.ksp-cash-btn--ghost { border-color: var(--ksp-border); background: var(--ksp-surface); color: var(--cash-ink2); }
.ksp-cash-btn--ghost:hover { border-color: #fda4af; color: var(--cash-rose); }
.ksp-cash-btn--text { background: none; color: var(--cash-ink2); }
.ksp-cash-btn--text:hover { color: var(--ksp-text); background: var(--ksp-surface-2); }
.ksp-cash-btn:disabled { opacity: .6; cursor: progress; }
[data-bs-theme="dark"] .ksp-cash-btn--dark { background: #fafaf9; color: #1c1917; }
.ksp-cash-bar__add { margin-inline-start: auto; }
.ksp-cash-icon-btn { width: 32px; height: 32px; display: inline-grid; place-items: center; padding: 0; border: 0; border-radius: 8px; background: none; color: #a8a29e; cursor: pointer; }
.ksp-cash-icon-btn:hover { background: var(--cash-rose-bg); color: var(--cash-rose); }
.ksp-cash-icon-btn .material-symbols-rounded { font-size: 18px; }

/* Tablo */
.ksp-cash-tablewrap { overflow-x: auto; scrollbar-width: thin; }
.ksp-cash-table { width: 100%; margin: 0; border-collapse: collapse; font-size: 13px; color: var(--ksp-text); }
.ksp-cash-table th { padding: 12px 14px; background: var(--ksp-surface-2); color: var(--cash-soft); font-size: 11px; font-weight: 800; letter-spacing: .05em; text-align: start; text-transform: uppercase; white-space: nowrap; border-bottom: 1px solid var(--ksp-border); }
.ksp-cash-table td { padding: 14px; vertical-align: middle; border-bottom: 1px solid var(--cash-line); }
.ksp-cash-table tbody tr:last-child td { border-bottom: 0; }
.ksp-cash-table tbody tr:hover td { background: rgba(250, 250, 249, .7); }
[data-bs-theme="dark"] .ksp-cash-table tbody tr:hover td { background: rgba(255, 255, 255, .02); }
.ksp-cash-table .is-amount, .ksp-cash-table th.is-amount { text-align: end; white-space: nowrap; }
.ksp-cash-table .is-action, .ksp-cash-table th.is-action { text-align: center; width: 64px; }
.ksp-cash-table td.is-date { white-space: nowrap; color: var(--cash-ink2); }
.ksp-cash-table td.is-title strong { display: block; font-size: 13px; font-weight: 700; line-height: 1.35; }
.ksp-cash-table td.is-title small { display: block; margin-top: 2px; font-size: 11.5px; color: var(--ksp-muted); line-height: 1.4; }
.ksp-cash-table td.is-title { min-width: 240px; }
.ksp-cash-table td.is-supplier span { display: block; font-size: 12.5px; color: var(--cash-ink2); }
.ksp-cash-table td.is-supplier small { display: block; margin-top: 2px; color: var(--ksp-muted); font-size: 10.5px; }
.ksp-cash-table--exp td.is-amount strong { font-size: 13.5px; font-weight: 800; color: #dc2626; font-variant-numeric: tabular-nums; }
[data-bs-theme="dark"] .ksp-cash-table--exp td.is-amount strong { color: #f87171; }
.ksp-cash-pay { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--cash-ink2); white-space: nowrap; }
.ksp-cash-pay .material-symbols-rounded { font-size: 17px; color: var(--ksp-muted); }

/* Kategori hapları (ExpenseCategory::tone) */
.ksp-cash-cat { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px; border: 1px solid; border-radius: 999px; font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.ksp-cash-cat .material-symbols-rounded { font-size: 15px; }
.ksp-cash-cat--purple { background: #faf5ff; border-color: #e9d5ff; color: #7e22ce; }
.ksp-cash-cat--blue { background: #eff6ff; border-color: #bfdbfe; color: #1d4ed8; }
.ksp-cash-cat--amber { background: #fffbeb; border-color: #fde68a; color: #b45309; }
.ksp-cash-cat--orange { background: #fff7ed; border-color: #fed7aa; color: #c2410c; }
.ksp-cash-cat--brown { background: #fdf8f3; border-color: #e7d3c1; color: #7c4a21; }
.ksp-cash-cat--pink { background: #fdf2f8; border-color: #fbcfe8; color: #be185d; }
.ksp-cash-cat--teal { background: #f0fdfa; border-color: #99f6e4; color: #0f766e; }
.ksp-cash-cat--slate { background: #f8fafc; border-color: #e2e8f0; color: #475569; }
[data-bs-theme="dark"] .ksp-cash-cat { background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .12); }
[data-bs-theme="dark"] .ksp-cash-cat--purple { color: #d8b4fe; }
[data-bs-theme="dark"] .ksp-cash-cat--blue { color: #93c5fd; }
[data-bs-theme="dark"] .ksp-cash-cat--amber { color: #fcd34d; }
[data-bs-theme="dark"] .ksp-cash-cat--orange { color: #fdba74; }
[data-bs-theme="dark"] .ksp-cash-cat--brown { color: #e7c9a9; }
[data-bs-theme="dark"] .ksp-cash-cat--pink { color: #f9a8d4; }
[data-bs-theme="dark"] .ksp-cash-cat--teal { color: #5eead4; }
[data-bs-theme="dark"] .ksp-cash-cat--slate { color: #cbd5e1; }
[data-bs-theme="dark"] .ksp-cash-kpi__ico--purple { background: rgba(147, 51, 234, .16); color: #d8b4fe; }
[data-bs-theme="dark"] .ksp-cash-kpi__ico--blue { background: rgba(37, 99, 235, .16); color: #93c5fd; }
[data-bs-theme="dark"] .ksp-cash-kpi__ico--green { background: rgba(5, 150, 105, .16); color: #6ee7b7; }
[data-bs-theme="dark"] .ksp-cash-kpi__ico--amber { background: rgba(217, 119, 6, .16); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-cash-kpi__label { color: var(--ksp-muted); }
[data-bs-theme="dark"] .ksp-cash-kpi__value--purple { color: #d8b4fe; }
[data-bs-theme="dark"] .ksp-cash-kpi__value--blue { color: #93c5fd; }
[data-bs-theme="dark"] .ksp-cash-kpi__value--green { color: #6ee7b7; }
[data-bs-theme="dark"] .ksp-cash-kpi__value--amber { color: #fdba74; }

/* Alt bilgi, sayfalama, boş durum, "sıradaki adım" */
.ksp-cash-foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 12px 16px; border-top: 1px solid var(--ksp-border); font-size: 12px; font-weight: 600; color: var(--ksp-muted); }
.ksp-cash-pager { display: flex; align-items: center; gap: 8px; }
.ksp-cash-pager .ksp-cash-btn { height: 32px; padding: 0 10px; font-size: 12px; }
.ksp-cash-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 44px 20px; text-align: center; }
.ksp-cash-empty__ico { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 4px; border-radius: 14px; background: var(--ksp-surface-2); color: var(--ksp-muted); }
.ksp-cash-empty strong { font-size: 14px; font-weight: 800; color: var(--ksp-text); }
.ksp-cash-empty p { max-width: 440px; margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--ksp-muted); }
.ksp-cash-soon { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 48px 20px; border: 1px dashed var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); text-align: center; }
.ksp-cash-soon__ico { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 16px; background: var(--cash-rose-bg); color: var(--cash-rose); }
.ksp-cash-soon__title { margin: 6px 0 0; font-size: 16px; font-weight: 800; color: var(--ksp-text); }
.ksp-cash-soon__text { max-width: 480px; margin: 0 0 8px; font-size: 13px; line-height: 1.55; color: var(--ksp-muted); }

/* Pencere: koyu başlık şeridi (referans "Yeni Gider Kaydı Girişi" / "Yeni Adisyon Aç") */
.ksp-cash-modal .modal-dialog { max-width: 480px; }
.ksp-cash-modal .modal-content { border: 0; border-radius: 24px; background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 30px 60px -20px rgba(28, 25, 23, .45); overflow: hidden; }
.ksp-cash-mhead { align-items: center; gap: 12px; padding: 18px 22px; border: 0; background: #1c1917; color: #fff; }
.ksp-cash-mhead .modal-title { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 16px; font-weight: 800; }
.ksp-cash-mhead__ico { display: inline-flex; color: #fb7185; }
.ksp-cash-mhead__ico .material-symbols-rounded { font-size: 22px; }
.ksp-cash-mclose { width: 32px; height: 32px; display: grid; place-items: center; margin-inline-start: auto; padding: 0; border: 0; border-radius: 8px; background: none; color: #d6d3d1; cursor: pointer; }
.ksp-cash-mclose:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.ksp-cash-mbody { display: flex; flex-direction: column; gap: 14px; padding: 20px 22px; }
.ksp-cash-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ksp-cash-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; }
.ksp-cash-label { margin: 0; padding: 0; font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #57534e; }
[data-bs-theme="dark"] .ksp-cash-label { color: var(--ksp-muted); }
.ksp-cash-input { width: 100%; height: 42px; padding: 0 14px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-text); font-family: inherit; font-size: 13.5px; font-weight: 500; }
.ksp-cash-input::placeholder { color: #a8a29e; font-weight: 400; }
.ksp-cash-input.is-mono { font-family: var(--cash-mono); font-size: 12.5px; }
select.ksp-cash-input { padding-inline-end: 34px; background: var(--ksp-surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2378716c' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center; appearance: none; font-weight: 600; cursor: pointer; }
.ksp-cash-input:focus { outline: 0; border-color: var(--cash-rose); background-color: var(--ksp-surface); box-shadow: 0 0 0 3px rgba(225, 29, 72, .15); }
.ksp-cash-field.is-invalid .ksp-cash-input { border-color: var(--cash-rose); }
.ksp-cash-err { margin: 0; font-size: 11.5px; font-weight: 600; color: var(--cash-rose); }
.ksp-cash-err:empty { display: none; }
.ksp-cash-seg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; padding: 4px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-cash-seg label { position: relative; margin: 0; cursor: pointer; }
.ksp-cash-seg input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ksp-cash-seg label > span { display: flex; align-items: center; justify-content: center; gap: 5px; height: 34px; padding: 0 6px; border-radius: 9px; color: var(--cash-soft); font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.ksp-cash-seg label > span .material-symbols-rounded { font-size: 16px; }
.ksp-cash-seg input:checked + span { background: var(--ksp-surface); color: var(--ksp-text); font-weight: 700; box-shadow: 0 1px 3px rgba(28, 25, 23, .12); }
.ksp-cash-seg input:focus-visible + span { box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
.ksp-cash-alert { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; border: 1px solid #fecdd3; border-radius: 12px; background: var(--cash-rose-bg); color: #be123c; font-size: 12.5px; font-weight: 600; }
.ksp-cash-alert .material-symbols-rounded { font-size: 18px; }
.ksp-cash-mfoot { gap: 8px; padding: 14px 22px 20px; border-top: 1px solid var(--cash-line); }
.ksp-cash-mfoot > * { margin: 0; }
.ksp-cash-mfoot .ksp-cash-btn--dark { border-radius: 14px; padding: 0 20px; }

@media (max-width: 991.98px) {
  .ksp-cash-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-cash-tabs { width: 100%; }
}
@media (max-width: 767.98px) {
  .ksp-cash-head { padding: 16px; }
  .ksp-cash-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .ksp-cash-tabs::-webkit-scrollbar { display: none; }
  .ksp-cash-kpis, .ksp-cash-kpis--3 { grid-template-columns: minmax(0, 1fr); }
  .ksp-cash-select { flex: 1 1 140px; min-width: 0; }
  .ksp-cash-bar__funnel { display: none; }
  .ksp-cash-bar__add { flex: 1 1 100%; margin: 0; }
}
@media (max-width: 575.98px) {
  .ksp-cash-cols { grid-template-columns: minmax(0, 1fr); }
  .ksp-cash-modal .modal-dialog { margin: 12px; }
  .ksp-cash-seg span { font-size: 12px; }
}

/* @kokpit-kasa-adisyon — Kasa > Adisyonlar (partials/cash-tickets, cash-ticket-new, cash-ticket-manage; app.js
   "@kokpit-kasa-adisyon") + Hizmetler > Ürünler & Stok (views/panels/tenant/products.php). Referans görseller 12-16.
   .ksp-cash token'larını kullanır (@kokpit-kasa). Dosya sonuna EKLENİR. */
.ksp-cash-tab__badge { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--cash-rose); color: #fff; font-size: 10.5px; font-weight: 800; font-style: normal; }
.ksp-cash-head__acts { display: flex; flex-wrap: wrap; gap: 8px; }
.ksp-cash-head__ico--amber { background: #fffbeb; color: #d97706; }
.ksp-cash-bar__count { margin-inline-start: auto; font-size: 12px; font-weight: 600; color: var(--ksp-muted); white-space: nowrap; }
.ksp-cash-noscript { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 12.5px; font-weight: 600; color: var(--ksp-muted); }
.ksp-cash-cols--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ksp-tk-muted { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 12px; color: var(--ksp-muted); }
.ksp-tk-muted .material-symbols-rounded { font-size: 16px; }

/* Durum hapları (liste + kart + pencere başlığı) */
.ksp-tk-pill { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 10.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.ksp-tk-pill--open { background: #fef3c7; color: #b45309; }
.ksp-tk-pill--cash { background: #d1fae5; color: #047857; }
.ksp-tk-pill--card { background: #ccfbf1; color: #0f766e; }
.ksp-tk-pill--transfer { background: #ede9fe; color: #6d28d9; }
.ksp-tk-pill--canceled { background: #f5f5f4; color: #78716c; }
.ksp-tk-pill--paid { background: #d1fae5; color: #047857; }
[data-bs-theme="dark"] .ksp-tk-pill--open { background: rgba(245, 158, 11, .18); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-tk-pill--cash, [data-bs-theme="dark"] .ksp-tk-pill--paid { background: rgba(16, 185, 129, .18); color: #6ee7b7; }
[data-bs-theme="dark"] .ksp-tk-pill--card { background: rgba(20, 184, 166, .18); color: #5eead4; }
[data-bs-theme="dark"] .ksp-tk-pill--transfer { background: rgba(139, 92, 246, .2); color: #c4b5fd; }
[data-bs-theme="dark"] .ksp-tk-pill--canceled { background: rgba(255, 255, 255, .06); color: #a8a29e; }

/* Koltuktaki müşteriler — açık adisyon kartları */
.ksp-tk-open { display: flex; flex-direction: column; gap: 12px; }
.ksp-tk-open__head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.ksp-tk-open__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--ksp-text); }
.ksp-tk-dot { width: 8px; height: 8px; border-radius: 50%; background: #f59e0b; box-shadow: 0 0 0 3px rgba(245, 158, 11, .18); }
.ksp-tk-open__empty { display: flex; align-items: center; gap: 8px; margin: 0; padding: 18px; border: 1px dashed #fcd34d; border-radius: 16px; background: var(--ksp-surface); font-size: 13px; color: var(--ksp-muted); }
.ksp-tk-open__empty .material-symbols-rounded { color: #d97706; }
.ksp-tk-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.ksp-tk-card { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 14px; border: 1.5px solid #fcd34d; border-radius: 16px; background: var(--ksp-surface); box-shadow: 0 6px 18px -12px rgba(217, 119, 6, .45); }
/* Yeni açılan adisyon ("Adisyonu Başlat" sonrası #adisyon-{id}; sahip kararı 2026-09-21): kart görünüme gelir ve kısa süre parlar */
.ksp-tk-card { scroll-margin-top: calc(var(--ksp-topbar-h) + 24px); }
.ksp-tk-card:target { animation: ksp-tk-flash 2.4s ease-out 1; }
@keyframes ksp-tk-flash { 0%, 35% { border-color: #f59e0b; box-shadow: 0 0 0 4px rgba(245, 158, 11, .35), 0 6px 18px -12px rgba(217, 119, 6, .45); } 100% { box-shadow: 0 6px 18px -12px rgba(217, 119, 6, .45); } }
@media (prefers-reduced-motion: reduce) { .ksp-tk-card:target { animation: none; border-color: #f59e0b; } }
.ksp-tk-card__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--ksp-muted); }
.ksp-tk-card__top .ksp-cash-mono { font-size: 10.5px; }
.ksp-tk-card__title { margin: -4px 0 0; font-size: 15px; font-weight: 800; color: var(--ksp-text); }
.ksp-tk-card__info { display: flex; flex-direction: column; gap: 3px; margin: 0; padding: 9px 11px; border: 1px solid var(--cash-line); border-radius: 10px; background: var(--ksp-surface-2); font-size: 12px; }
.ksp-tk-card__info div { display: flex; justify-content: space-between; gap: 8px; }
.ksp-tk-card__info dt { font-weight: 500; color: var(--ksp-muted); }
.ksp-tk-card__info dd { min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ksp-text); }
.ksp-tk-card__info dd.ksp-cash-mono { font-size: 11px; color: var(--ksp-muted); }
.ksp-tk-card__items { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.ksp-tk-card__label { font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-tk-card__items ul { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; list-style: none; }
.ksp-tk-card__items li { display: flex; justify-content: space-between; gap: 8px; font-size: 11.5px; color: var(--cash-ink2); }
.ksp-tk-card__items li span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-tk-card__items li span::before { content: "• "; }
.ksp-tk-card__items li b { flex-shrink: 0; font-weight: 700; font-variant-numeric: tabular-nums; }
.ksp-tk-card__more { font-size: 11px; font-weight: 700; color: var(--cash-rose); }
.ksp-tk-card__none { font-size: 11.5px; color: var(--ksp-muted); }
.ksp-tk-card__foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; padding-top: 10px; border-top: 1px solid var(--cash-line); }
.ksp-tk-card__foot > div { display: flex; flex-direction: column; }
.ksp-tk-card__foot strong { font-size: 20px; font-weight: 800; color: var(--cash-rose); font-variant-numeric: tabular-nums; }
.ksp-tk-card__go { height: 34px; padding: 0 12px; border-radius: 10px; font-size: 12px; }

/* Liste */
.ksp-cash-table--tk td { font-size: 12.5px; }
.ksp-cash-table--tk td.is-number .ksp-cash-mono, .ksp-cash-table--tk td.is-date .ksp-cash-mono { font-size: 11px; }
.ksp-cash-table--tk td.is-station strong { font-weight: 700; white-space: nowrap; }
.ksp-cash-table--tk td.is-items { max-width: 220px; }
.ksp-cash-table--tk td.is-items span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ksp-muted); }
.ksp-cash-table td.is-muted { color: var(--ksp-muted); }
.ksp-cash-table .is-action { width: auto; }
.ksp-tk-amount { font-size: 13.5px; font-weight: 800; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-tk-amount--product { color: #c2410c; }
[data-bs-theme="dark"] .ksp-tk-amount--product { color: #fdba74; }
.ksp-tk-acts { display: inline-flex; align-items: center; gap: 4px; }
.ksp-tk-inspect { height: 30px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 9px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.ksp-tk-inspect:hover { border-color: #fda4af; color: var(--cash-rose); }
.ksp-pr-stock { font-weight: 700; font-variant-numeric: tabular-nums; }
.ksp-pr-stock.is-low { color: var(--cash-rose); }

/* Pencereler: koyu başlık + kare ikon (Yeni Adisyon Aç, Adisyon Yönet) */
.ksp-tk-mhead { gap: 12px; padding: 16px 20px; }
.ksp-tk-mhead__ico { width: 40px; height: 40px; flex-shrink: 0; display: grid; place-items: center; border-radius: 12px; }
.ksp-tk-mhead__ico--rose { background: rgba(244, 63, 94, .18); color: #fb7185; border: 1px solid rgba(244, 63, 94, .35); }
.ksp-tk-mhead__ico--amber { background: rgba(245, 158, 11, .16); color: #fbbf24; border: 1px solid rgba(245, 158, 11, .4); }
.ksp-tk-mhead__text { min-width: 0; flex: 1; }
.ksp-tk-mhead__text .modal-title { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 16px; }
.ksp-tk-mhead__text p { margin: 2px 0 0; font-size: 12px; color: #a8a29e; }
.ksp-tk-mhead__text p b { color: #f5f5f4; font-weight: 700; }
.ksp-tk-print { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border-radius: 10px; background: #44403c; color: #fff; font-size: 12.5px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.ksp-tk-print:hover { background: #57534e; color: #fff; }
.ksp-tk-print .material-symbols-rounded { font-size: 17px; }

/* Yeni Adisyon Aç */
.ksp-tk-new .modal-dialog { max-width: 520px; }
.ksp-tk-newbody { gap: 16px; }
.ksp-tk-sec { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ksp-tk-sec__row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.ksp-tk-sec__label { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #57534e; }
.ksp-tk-sec__label .material-symbols-rounded { font-size: 16px; color: var(--cash-rose); }
.ksp-tk-sec__label--amber .material-symbols-rounded { color: #d97706; }
[data-bs-theme="dark"] .ksp-tk-sec__label { color: var(--ksp-muted); }
.ksp-tk-station { border-color: #fda4af; }
.ksp-tk-mini-seg { display: inline-flex; gap: 2px; padding: 3px; border-radius: 10px; background: var(--ksp-surface-2); }
.ksp-tk-mini-seg label { position: relative; margin: 0; cursor: pointer; }
.ksp-tk-mini-seg input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ksp-tk-mini-seg span { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 7px; color: var(--cash-soft); font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.ksp-tk-mini-seg input:checked + span { background: var(--ksp-surface); color: var(--ksp-text); font-weight: 700; box-shadow: 0 1px 3px rgba(28, 25, 23, .12); }
.ksp-tk-mini-seg input:focus-visible + span { box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
.ksp-tk-customer { display: flex; flex-direction: column; gap: 6px; }
/* Dikey sütunda arama kutusu: .ksp-cash-search'ün yatay çubuktaki flex-basis'i (260px) burada YÜKSEKLİK olur → sıfırlanır */
.ksp-tk-customer .ksp-cash-search, .ksp-tk-right .ksp-cash-search { flex: none; }
.ksp-tk-results { display: flex; flex-direction: column; gap: 4px; max-height: 180px; overflow-y: auto; margin: 0; padding: 0; list-style: none; }
.ksp-tk-results button { display: flex; justify-content: space-between; gap: 8px; width: 100%; padding: 8px 10px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 12.5px; text-align: start; cursor: pointer; }
.ksp-tk-results button small { color: var(--ksp-muted); font-variant-numeric: tabular-nums; }
.ksp-tk-results button:hover, .ksp-tk-results button.is-picked { border-color: var(--cash-rose); background: var(--cash-rose-bg); }
.ksp-tk-results li.is-empty { padding: 6px 2px; font-size: 12px; color: var(--ksp-muted); }
.ksp-tk-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ksp-tk-chips--scroll { max-height: 128px; overflow-y: auto; padding-inline-end: 4px; scrollbar-width: thin; }
.ksp-tk-chip { position: relative; margin: 0; cursor: pointer; }
.ksp-tk-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ksp-tk-chip span { display: inline-flex; align-items: center; min-height: 32px; padding: 5px 11px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--cash-ink2); font-size: 12px; font-weight: 600; line-height: 1.35; }
.ksp-tk-chip:hover span { border-color: #fda4af; }
.ksp-tk-chip input:checked + span { border-color: #fb7185; background: var(--cash-rose-bg); color: #be123c; }
[data-bs-theme="dark"] .ksp-tk-chip input:checked + span { color: #fda4af; }
.ksp-tk-chip input:focus-visible + span { box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
.ksp-tk-chip.is-out { cursor: not-allowed; opacity: .5; }

/* Adisyon Yönet / Tahsil */
.ksp-tk-manage .modal-dialog { max-width: 980px; }
.ksp-tk-mbody { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); padding: 0; }
.ksp-tk-left { display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 18px 20px; }
.ksp-tk-left__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid var(--cash-line); font-size: 11.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--cash-soft); }
.ksp-tk-left__head .ksp-cash-mono { font-weight: 500; text-transform: none; letter-spacing: 0; }
.ksp-tk-lines { display: flex; flex-direction: column; gap: 8px; min-height: 90px; max-height: 300px; overflow-y: auto; margin: 0; padding: 0; list-style: none; scrollbar-width: thin; }
.ksp-tk-line { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-tk-line__ico { flex-shrink: 0; font-size: 20px; color: var(--cash-rose); }
.ksp-tk-line__ico.is-product { color: #2563eb; }
.ksp-tk-line__ico.is-custom { color: #d97706; }
.ksp-tk-line__text { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.ksp-tk-line__text strong { font-size: 13px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.ksp-tk-line__text small { font-size: 11px; color: var(--ksp-muted); }
.ksp-tk-step { display: inline-flex; align-items: center; flex-shrink: 0; border: 1px solid var(--ksp-border); border-radius: 9px; background: var(--ksp-surface); }
.ksp-tk-step button { width: 26px; height: 28px; padding: 0; border: 0; background: none; color: var(--cash-ink2); font-size: 15px; font-weight: 700; cursor: pointer; }
.ksp-tk-step button:disabled { opacity: .35; cursor: default; }
.ksp-tk-step span { min-width: 22px; font-size: 12.5px; font-weight: 700; text-align: center; font-variant-numeric: tabular-nums; }
.ksp-tk-line__total { flex-shrink: 0; min-width: 64px; font-size: 13px; font-weight: 800; text-align: end; font-variant-numeric: tabular-nums; }
.ksp-tk-line .ksp-cash-icon-btn { flex-shrink: 0; }
.ksp-tk-lines li.is-empty { padding: 22px 10px; border: 1px dashed var(--ksp-border); border-radius: 12px; font-size: 12.5px; text-align: center; color: var(--ksp-muted); }
.ksp-tk-closed { display: flex; align-items: center; gap: 6px; margin: 0; padding: 8px 10px; border-radius: 10px; background: var(--ksp-surface-2); font-size: 12px; font-weight: 600; color: var(--ksp-muted); }
.ksp-tk-closed .material-symbols-rounded { font-size: 16px; }
.ksp-tk-adjust { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-tk-adjust .ksp-cash-input { height: 38px; background-color: var(--ksp-surface); }
.ksp-tk-discount { display: flex; gap: 6px; }
.ksp-tk-discount select { flex: 1; min-width: 0; }
.ksp-tk-discount input { width: 96px; flex-shrink: 0; }
.ksp-tk-sum { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; border-radius: 14px; background: #1c1917; color: #d6d3d1; font-size: 12.5px; }
.ksp-tk-sum > div { display: flex; justify-content: space-between; gap: 8px; }
.ksp-tk-sum > div:not(:last-child) { padding-bottom: 6px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.ksp-tk-sum b { color: #fafaf9; font-weight: 700; font-variant-numeric: tabular-nums; }
.ksp-tk-sum__total { align-items: baseline; padding-top: 4px; }
.ksp-tk-sum__total span { font-size: 16px; font-weight: 800; color: #fff; }
.ksp-tk-sum__total strong { font-size: 24px; font-weight: 800; color: #fb7185; font-variant-numeric: tabular-nums; }
.ksp-tk-left__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ksp-tk-cancel { padding: 0; border: 0; background: none; color: var(--ksp-muted); font-family: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.ksp-tk-cancel:hover { color: var(--cash-rose); text-decoration: underline; }
.ksp-tk-paybtn { height: 42px; padding: 0 20px; border-radius: 12px; }
.ksp-tk-right { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 18px 20px; border-inline-start: 1px solid var(--ksp-border); }
.ksp-tk-right__title { margin: 0; font-size: 13px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--ksp-text); }
.ksp-tk-right__lead { margin: -6px 0 0; font-size: 12px; color: var(--ksp-muted); }
.ksp-tk-performer { display: flex; align-items: center; gap: 8px; margin: 0; padding: 0 12px; height: 42px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); font-size: 12.5px; font-weight: 600; color: var(--ksp-muted); }
.ksp-tk-performer .material-symbols-rounded { font-size: 17px; color: var(--cash-ink2); }
.ksp-tk-performer select { flex: 1; min-width: 0; height: 100%; border: 0; background: transparent; color: var(--ksp-text); font-family: inherit; font-size: 13px; font-weight: 800; cursor: pointer; }
.ksp-tk-performer select:focus { outline: 0; }
.ksp-tk-performer:focus-within { border-color: var(--cash-rose); box-shadow: 0 0 0 3px rgba(225, 29, 72, .15); }
.ksp-tk-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; padding: 3px; border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-tk-tabs button { display: flex; align-items: center; justify-content: center; gap: 5px; height: 34px; padding: 0 6px; border: 1.5px solid transparent; border-radius: 9px; background: none; color: var(--cash-ink2); font-family: inherit; font-size: 12.5px; font-weight: 600; white-space: nowrap; cursor: pointer; }
.ksp-tk-tabs button .material-symbols-rounded { font-size: 16px; }
.ksp-tk-tabs button.is-active { border-color: var(--ksp-text); background: var(--ksp-surface); color: var(--ksp-text); font-weight: 700; box-shadow: 0 1px 3px rgba(28, 25, 23, .1); }
.ksp-tk-catalog { display: flex; flex-direction: column; gap: 8px; max-height: 330px; overflow-y: auto; margin: 0; padding: 0 2px 0 0; list-style: none; scrollbar-width: thin; }
.ksp-tk-cat { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); }
.ksp-tk-cat__text { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.ksp-tk-cat__text strong { font-size: 13px; font-weight: 700; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-tk-cat__text small { font-size: 11px; color: var(--ksp-muted); }
.ksp-tk-cat__price { flex-shrink: 0; font-size: 13px; font-weight: 800; font-variant-numeric: tabular-nums; }
.ksp-tk-cat__price.is-product { color: #c2410c; }
.ksp-tk-cat__add { width: 28px; height: 28px; flex-shrink: 0; display: grid; place-items: center; padding: 0; border: 0; border-radius: 8px; background: var(--ksp-surface-2); color: var(--cash-ink2); cursor: pointer; }
.ksp-tk-cat__add:hover { background: var(--cash-rose-bg); color: var(--cash-rose); }
.ksp-tk-cat__add:disabled { opacity: .4; cursor: not-allowed; }
.ksp-tk-cat__add .material-symbols-rounded { font-size: 18px; }
.ksp-tk-catalog li.is-empty { padding: 16px 8px; font-size: 12.5px; text-align: center; color: var(--ksp-muted); }
.ksp-tk-custom { display: flex; flex-direction: column; gap: 8px; }
.ksp-tk-manage.is-closed [data-tk-m-add], .ksp-tk-manage.is-closed [data-tk-m-adjust], .ksp-tk-manage.is-closed [data-tk-m-actions] { display: none; }
.ksp-tk-manage.is-closed .ksp-tk-mbody { grid-template-columns: minmax(0, 1fr); }
.ksp-tk-manage.is-busy .ksp-tk-mbody { opacity: .7; pointer-events: none; }

@media (max-width: 1199.98px) { .ksp-tk-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767.98px) {
  .ksp-tk-cards { grid-template-columns: minmax(0, 1fr); }
  .ksp-tk-mbody { grid-template-columns: minmax(0, 1fr); }
  .ksp-tk-right { border-inline-start: 0; border-top: 1px solid var(--ksp-border); }
  .ksp-tk-lines, .ksp-tk-catalog { max-height: none; }
  .ksp-tk-mhead { flex-wrap: wrap; }
  .ksp-tk-print { order: 3; }
  .ksp-cash-bar__count { flex: 1 1 100%; margin: 0; }
  .ksp-cash-cols--3 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575.98px) {
  .ksp-tk-adjust { grid-template-columns: minmax(0, 1fr); }
  .ksp-tk-line { flex-wrap: wrap; }
  .ksp-tk-line__text { flex: 1 1 60%; }
  .ksp-tk-left__foot { flex-direction: column-reverse; align-items: stretch; }
  .ksp-tk-paybtn { width: 100%; }
}

/* @kokpit-kasa-tahsilat — "Tahsilat & Adisyon Kapat" (partials/cash-ticket-pay.php) ve "Adisyon Bilgi Fişi"
   (partials/cash-ticket-receipt.php; fişin kendisi views/panels/tenant/cash-receipt.php, A6). Kullanıcı referansı 2026-09-18.
   Dosya sonuna EKLENİR. */
.ksp-cash-btn--green { background: #059669; color: #fff; border-radius: 14px; box-shadow: 0 8px 18px -10px rgba(5, 150, 105, .7); }
.ksp-cash-btn--green:hover { background: #047857; color: #fff; }
.ksp-tk-paym .modal-dialog { max-width: 470px; }
.ksp-tk-due { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 18px 14px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface-2); text-align: center; }
.ksp-tk-due span { font-size: 12.5px; font-weight: 600; color: var(--ksp-muted); }
.ksp-tk-due strong { font-size: 28px; font-weight: 800; line-height: 1.15; color: var(--cash-rose); font-variant-numeric: tabular-nums; }
.ksp-tk-due small { font-size: 11.5px; color: var(--ksp-muted); }
.ksp-tk-methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ksp-tk-method { position: relative; margin: 0; cursor: pointer; }
.ksp-tk-method input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ksp-tk-method > span { display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); color: var(--cash-ink2); font-size: 13px; font-weight: 600; }
.ksp-tk-method > span .material-symbols-rounded { font-size: 18px; }
.ksp-tk-method--rose .material-symbols-rounded { color: var(--cash-rose); }
.ksp-tk-method--green .material-symbols-rounded { color: #059669; }
.ksp-tk-method--blue .material-symbols-rounded { color: #2563eb; }
.ksp-tk-method--purple .material-symbols-rounded { color: #9333ea; }
.ksp-tk-method:hover > span { border-color: #fda4af; }
.ksp-tk-method input:checked + span { border: 1.5px solid var(--ksp-text); background: var(--cash-rose-bg); color: #be123c; font-weight: 800; }
[data-bs-theme="dark"] .ksp-tk-method input:checked + span { color: #fda4af; }
.ksp-tk-method input:focus-visible + span { box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
.ksp-tk-split { display: flex; flex-direction: column; gap: 8px; padding: 12px; border: 1px dashed #d8b4fe; border-radius: 12px; }
.ksp-tk-split__row { display: grid; grid-template-columns: 120px minmax(0, 1fr) 32px; align-items: center; gap: 8px; margin: 0; }
.ksp-tk-split__row > span { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: var(--cash-ink2); }
.ksp-tk-split__row > span .material-symbols-rounded { font-size: 17px; color: var(--ksp-muted); }
.ksp-tk-split__row .ksp-cash-input { height: 38px; text-align: end; font-variant-numeric: tabular-nums; }
.ksp-tk-split__state { margin: 0; font-size: 12.5px; font-weight: 700; text-align: end; }
.ksp-tk-split__state.is-ok { color: #059669; }
.ksp-tk-split__state.is-bad { color: var(--cash-rose); }

.ksp-tk-rcm .modal-dialog { max-width: 460px; }
.ksp-tk-rcm .ksp-cash-mhead { padding: 14px 18px; }
.ksp-tk-rcm__title { font-size: 13.5px !important; letter-spacing: .06em; text-transform: uppercase; }
.ksp-tk-rcm__print { display: inline-flex; align-items: center; gap: 6px; height: 32px; margin-inline-start: auto; padding: 0 12px; border: 0; border-radius: 999px; background: var(--cash-rose); color: #fff; font-family: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.ksp-tk-rcm__print:hover { background: #be123c; }
.ksp-tk-rcm__print .material-symbols-rounded { font-size: 17px; }
.ksp-tk-rcm .ksp-cash-mclose { margin-inline-start: 4px; }
.ksp-tk-rcm__body { padding: 0; background: #fafaf9; }
.ksp-tk-rcm__frame { display: block; width: 100%; min-height: 420px; border: 0; background: #fafaf9; }
@media (max-width: 575.98px) {
  .ksp-tk-methods { grid-template-columns: minmax(0, 1fr); }
  .ksp-tk-split__row { grid-template-columns: 96px minmax(0, 1fr) 32px; }
}

/* @kokpit-kasa-rapor — Kasa > Günlük Z Raporu (partials/cash-z.php) ve Aylık Bilanço (partials/cash-monthly.php).
   Referans görseller 17-18. .ksp-printable kartı yazdırmada tek başına basılır (diğer her şey gizlenir). Dosya sonuna EKLENİR. */
.ksp-cash-sub { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding: 14px 18px; }
.ksp-cash-sub__id { display: flex; align-items: center; gap: 12px; min-width: 0; }
.ksp-cash-sub__ico { width: 36px; height: 36px; flex-shrink: 0; display: grid; place-items: center; border-radius: 10px; background: var(--cash-rose-bg); color: var(--cash-rose); }
.ksp-cash-sub__ico--purple { background: #faf5ff; color: #9333ea; }
.ksp-cash-sub__ico .material-symbols-rounded { font-size: 20px; }
.ksp-cash-sub__title { margin: 0; font-size: 14px; font-weight: 800; color: var(--ksp-text); }
.ksp-cash-sub__lead { margin: 1px 0 0; font-size: 11.5px; color: var(--ksp-muted); }
.ksp-cash-sub__acts { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0; }
.ksp-cash-date { display: inline-flex; align-items: center; gap: 6px; height: 40px; margin: 0; padding: 0 10px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); font-size: 12.5px; font-weight: 600; color: var(--ksp-muted); }
.ksp-cash-date input { height: 100%; border: 0; background: transparent; color: var(--ksp-text); font-family: var(--cash-mono); font-size: 12.5px; }
.ksp-cash-date input:focus { outline: 0; }

.ksp-rep { display: flex; flex-direction: column; gap: 18px; padding: 24px; }
.ksp-rep__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding-bottom: 16px; border-bottom: 2px solid var(--ksp-text); }
.ksp-rep__name { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 0; font-size: 20px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; color: var(--ksp-text); }
.ksp-rep__badge { display: inline-flex; align-items: center; height: 22px; padding: 0 10px; border-radius: 999px; background: #1c1917; color: #fff; font-size: 10px; font-weight: 800; letter-spacing: .06em; }
[data-bs-theme="dark"] .ksp-rep__badge { background: #fafaf9; color: #1c1917; }
.ksp-rep__contact { margin: 4px 0 0; font-size: 11.5px; color: var(--ksp-muted); }
.ksp-rep__hint { display: flex; align-items: center; gap: 5px; margin: 6px 0 0; font-size: 11.5px; color: #b45309; }
.ksp-rep__hint .material-symbols-rounded { font-size: 15px; }
.ksp-rep__date { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; flex-shrink: 0; text-align: end; }
.ksp-rep__date span { font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-rep__date strong { font-size: 14px; font-weight: 800; color: var(--ksp-text); }
.ksp-rep__date small { font-size: 10.5px; color: var(--ksp-muted); }
.ksp-rep__kpis .ksp-rep__kpi { background: var(--ksp-surface); }
.ksp-rep__kico { flex-shrink: 0; display: inline-flex; }
.ksp-rep__kico .material-symbols-rounded { font-size: 20px; }
.ksp-rep__kico--green { color: #059669; }
.ksp-rep__kico--rose { color: var(--cash-rose); }
.ksp-rep__kico--blue { color: #2563eb; }
.ksp-rep__amber { color: #d97706; font-weight: 700; }
.ksp-rep__panels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ksp-rep__panel { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding: 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-rep__phead { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid var(--ksp-border); }
.ksp-rep__phead h3 { margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--ksp-text); }
.ksp-rep__phead strong { font-size: 14px; font-weight: 800; color: var(--ksp-text); }
.ksp-rep__shield { display: inline-flex; color: #059669; }
.ksp-rep__shield .material-symbols-rounded { font-size: 19px; }
.ksp-rep__line { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); font-size: 12.5px; }
.ksp-rep__line > span { display: flex; align-items: center; gap: 8px; min-width: 0; color: var(--cash-ink2); font-weight: 600; }
.ksp-rep__line > b { flex-shrink: 0; font-weight: 800; font-variant-numeric: tabular-nums; }
.ksp-rep__line--stack > span { flex-direction: column; align-items: flex-start; gap: 2px; }
.ksp-rep__line--stack small { font-size: 11px; font-weight: 500; color: var(--ksp-muted); }
.ksp-rep__lico { display: inline-flex; font-style: normal; }
.ksp-rep__lico .material-symbols-rounded { font-size: 17px; }
.ksp-rep__lico--rose { color: var(--cash-rose); }
.ksp-rep__lico--amber { color: #d97706; }
.is-neg { color: #dc2626 !important; }
.is-pos { color: #059669 !important; }
.is-blue { color: #2563eb !important; }
[data-bs-theme="dark"] .is-neg { color: #f87171 !important; }
[data-bs-theme="dark"] .is-pos { color: #34d399 !important; }
.ksp-rep__sublabel { margin-top: 6px; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-rep__methods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ksp-rep__methods div { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 6px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); text-align: center; }
.ksp-rep__methods span { font-size: 11px; color: var(--ksp-muted); }
.ksp-rep__methods b { font-size: 13.5px; font-weight: 800; font-variant-numeric: tabular-nums; }
.ksp-rep__opening { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.ksp-rep__opening input { width: 110px; height: 32px; text-align: end; font-weight: 700; background: var(--ksp-surface); }
.ksp-rep__opening input.is-saved { border-color: #059669; box-shadow: 0 0 0 3px rgba(5, 150, 105, .15); }
.ksp-rep__opening span { font-size: 12px; color: var(--ksp-muted); }
.ksp-rep__expected { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border-radius: 12px; background: #1c1917; color: #fff; }
.ksp-rep__expected div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ksp-rep__expected span { font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.ksp-rep__expected strong { font-size: 20px; font-weight: 800; color: #fb7185; font-variant-numeric: tabular-nums; }
.ksp-rep__expected small { font-size: 10.5px; color: #a8a29e; }
.ksp-rep__list { display: flex; flex-direction: column; gap: 10px; }
.ksp-rep__lhead { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ksp-rep__lhead h3 { margin: 0; font-size: 12.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--ksp-text); }
.ksp-rep__lhead span { font-size: 11.5px; color: var(--ksp-muted); }
.ksp-rep__list .ksp-cash-tablewrap { border: 1px solid var(--ksp-border); border-radius: 12px; }
.ksp-rep__empty { margin: 0; padding: 20px; border: 1px dashed var(--ksp-border); border-radius: 12px; font-size: 12.5px; text-align: center; color: var(--ksp-muted); }

/* Aylık Bilanço — resmi gelir tablosu */
.ksp-pnl__block { display: flex; flex-direction: column; gap: 0; border: 1px solid var(--ksp-border); border-radius: 12px; overflow: hidden; }
.ksp-pnl__bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; background: #1c1917; color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.ksp-pnl__bar b { font-size: 13px; font-variant-numeric: tabular-nums; }
.ksp-pnl__bar--light { background: var(--ksp-surface-2); color: var(--ksp-text); border-bottom: 1px solid var(--ksp-border); }
[data-bs-theme="dark"] .ksp-pnl__bar:not(.ksp-pnl__bar--light) { background: #0c0a09; }
.ksp-pnl__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 14px; border-bottom: 1px solid var(--cash-line); font-size: 12.5px; color: var(--cash-ink2); }
.ksp-pnl__row b { flex-shrink: 0; font-weight: 700; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-pnl__row.is-total { border-bottom: 0; background: var(--ksp-surface-2); font-weight: 800; color: var(--ksp-text); text-transform: uppercase; font-size: 11.5px; letter-spacing: .03em; }
.ksp-pnl__row.is-total b { font-weight: 800; }
.ksp-pnl__row.is-neg b { color: #dc2626; }
.ksp-pnl__row.is-neg { color: var(--cash-ink2) !important; }
.ksp-pnl__note { display: flex; align-items: flex-start; gap: 5px; margin: 0; padding: 8px 14px; font-size: 11px; color: var(--ksp-muted); }
.ksp-pnl__note .material-symbols-rounded { font-size: 15px; }
.ksp-pnl__gross { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border: 1px solid #e9d5ff; border-radius: 12px; background: #faf5ff; }
.ksp-pnl__gross span { display: block; font-size: 12.5px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; color: #6b21a8; }
.ksp-pnl__gross small { font-size: 11px; color: #7e22ce; }
.ksp-pnl__gross b { font-size: 18px; font-weight: 800; color: #6b21a8; font-variant-numeric: tabular-nums; }
[data-bs-theme="dark"] .ksp-pnl__gross { background: rgba(147, 51, 234, .12); border-color: rgba(147, 51, 234, .35); }
[data-bs-theme="dark"] .ksp-pnl__gross span, [data-bs-theme="dark"] .ksp-pnl__gross b, [data-bs-theme="dark"] .ksp-pnl__gross small { color: #d8b4fe; }
.ksp-pnl__net { display: flex; flex-direction: column; gap: 14px; padding: 18px 20px; border-radius: 14px; background: #1c1917; color: #fff; }
.ksp-pnl__net-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ksp-pnl__net-head strong { display: block; font-size: 14px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.ksp-pnl__net-head small { font-size: 11px; color: #a8a29e; }
.ksp-pnl__net-head b { font-size: 26px; font-weight: 800; font-variant-numeric: tabular-nums; }
.ksp-pnl__net-head b.is-neg { color: #fb7185 !important; }
.ksp-pnl__net-head b.is-pos { color: #34d399 !important; }
.ksp-pnl__stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .1); }
.ksp-pnl__stats span { display: block; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #a8a29e; }
.ksp-pnl__stats b { font-size: 13.5px; font-weight: 800; }

@media (max-width: 991.98px) { .ksp-rep__panels { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 575.98px) {
  .ksp-rep { padding: 16px; }
  .ksp-rep__head { flex-direction: column; }
  .ksp-rep__date { align-items: flex-start; text-align: start; }
  .ksp-rep__methods { grid-template-columns: minmax(0, 1fr); }
  .ksp-pnl__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-pnl__net-head { flex-direction: column; align-items: flex-start; }
  .ksp-rep__line { flex-wrap: wrap; }
}

/* Yazdırma: sayfada .ksp-printable varsa yalnız o basılır (Z raporu / Aylık Bilanço), renkler korunur.
   Panel iskeletinin kardeşleri (kenar çubuğu, üst bar, sekmeler, flash, bottom nav) ve Kasa içindeki diğer kartlar
   display:none ile akıştan çıkar; rapor kartı sayfanın başından akar, uzun rapor doğal olarak sayfalara bölünür. */
@media print {
  @page { size: A4 portrait; margin: 10mm; }
  body:has(.ksp-printable) { padding: 0 !important; background: #fff !important; }
  body:has(.ksp-printable) .ksp-panel__shell > :not(.ksp-panel__body),
  body:has(.ksp-printable) .ksp-panel__body > :not(.ksp-panel__content),
  body:has(.ksp-printable) .ksp-cash > :not(.ksp-printable),
  body:has(.ksp-printable) .ksp-bottom-nav,
  body:has(.ksp-printable) .ksp-printable .ksp-no-print { display: none !important; }
  body:has(.ksp-printable) .ksp-panel__shell, body:has(.ksp-printable) .ksp-panel__body, body:has(.ksp-printable) .ksp-panel__content { display: block !important; margin: 0 !important; padding: 0 !important; max-width: none !important; overflow: visible !important; }
  body:has(.ksp-printable) .ksp-printable { margin: 0; padding: 0; border: 0 !important; box-shadow: none !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body:has(.ksp-printable) .ksp-printable .ksp-cash-tablewrap { overflow: visible; }
  body:has(.ksp-printable) .ksp-rep__opening input { border: 0; box-shadow: none; background: transparent; }
  body:has(.ksp-printable) .ksp-pnl__block, body:has(.ksp-printable) .ksp-rep__panel, body:has(.ksp-printable) .ksp-pnl__net { break-inside: avoid; }
  /* A4 genişliği (~718px) mobil kırılımın altında kalır: masaüstü ızgarası zorlanır, yazılar bir tık küçülür */
  body:has(.ksp-printable) .ksp-rep__kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
  body:has(.ksp-printable) .ksp-rep__kpis .ksp-cash-kpi { padding: 10px 12px; }
  body:has(.ksp-printable) .ksp-rep__kpis .ksp-cash-kpi__value { font-size: 17px; margin: 6px 0 2px; }
  body:has(.ksp-printable) .ksp-rep__panels { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  body:has(.ksp-printable) .ksp-rep__methods { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body:has(.ksp-printable) .ksp-rep__head { flex-direction: row; }
  body:has(.ksp-printable) .ksp-pnl__stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  body:has(.ksp-printable) .ksp-cash-table td, body:has(.ksp-printable) .ksp-cash-table th { padding: 7px 8px; font-size: 11px; }
}
/* Fiş no ve saat aralığı tabloda kırılmaz; parçalı ödeme hapı */
.ksp-cash-table--tk td.is-number, .ksp-cash-table--tk td.is-muted { white-space: nowrap; }
.ksp-tk-pill--split { background: #f3e8ff; color: #7e22ce; }
[data-bs-theme="dark"] .ksp-tk-pill--split { background: rgba(147, 51, 234, .2); color: #d8b4fe; }

/* @kokpit-muhasebeci — "Muhasebeci Paylaşım Linki" penceresi (partials/cash-share-modal.php) ve muhasebeci görünümü
   (layouts/share.php + views/accountant/*). .ksp-cash token'larını kullanır. Dosya sonuna EKLENİR. */
.ksp-share-open { position: relative; }
.ksp-share-dot { position: absolute; top: 7px; inset-inline-end: 7px; width: 8px; height: 8px; border: 2px solid var(--ksp-surface); border-radius: 50%; background: #10b981; }
.ksp-share .modal-dialog { max-width: 520px; }
.ksp-share__lead { margin: 0; font-size: 12.5px; line-height: 1.55; color: var(--cash-ink2); }
.ksp-share__scope { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.ksp-share__scope li { display: flex; align-items: flex-start; gap: 6px; padding: 8px 10px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface-2); font-size: 11.5px; font-weight: 600; line-height: 1.4; color: var(--cash-ink2); }
.ksp-share__scope .material-symbols-rounded { flex-shrink: 0; font-size: 16px; color: #9333ea; }
.ksp-share__ok { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border: 1px solid #a7f3d0; border-radius: 12px; background: #ecfdf5; color: #047857; font-size: 12.5px; font-weight: 600; }
.ksp-share__ok .material-symbols-rounded { font-size: 18px; }
[data-bs-theme="dark"] .ksp-share__ok { background: rgba(16, 185, 129, .12); border-color: rgba(16, 185, 129, .35); color: #6ee7b7; }
.ksp-share__state { display: flex; flex-direction: column; gap: 8px; padding: 12px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-share__status { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.ksp-share__status small { font-size: 11.5px; color: var(--ksp-muted); }
.ksp-share__link { display: flex; gap: 6px; }
.ksp-share__link .ksp-cash-input { flex: 1; min-width: 0; background: var(--ksp-surface); font-size: 11.5px; }
.ksp-share__link .ksp-cash-btn { flex-shrink: 0; height: 42px; }
.ksp-share__pw { position: relative; display: block; }
.ksp-share__pw .ksp-cash-input { padding-inline-end: 44px; }
.ksp-share__pw .ksp-cash-icon-btn { position: absolute; top: 5px; inset-inline-end: 6px; }
.ksp-share__foot { flex-wrap: wrap; }
.ksp-share__danger { display: flex; align-items: center; gap: 14px; margin-inline-end: auto; }
.ksp-share__danger .ksp-tk-cancel { font-size: 12px; }
.ksp-share__danger [data-share-revoke]:hover { color: #dc2626; }

/* Muhasebeci görünümü (paylaşım sayfası) */
.ksp-share-page { min-height: 100vh; background: var(--ksp-bg); }
.ksp-share-page__main { max-width: 1180px; margin: 0 auto; padding: 24px 16px 48px; }
.ksp-acct { gap: 14px; }
.ksp-acct__ro { display: inline-flex; align-items: center; gap: 3px; margin-inline-start: 6px; padding: 1px 8px; border-radius: 999px; background: #ecfdf5; color: #047857; font-size: 10.5px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; vertical-align: middle; }
.ksp-acct__ro .material-symbols-rounded { font-size: 13px; }
.ksp-acct__logout { display: flex; justify-content: flex-end; margin: -6px 0 0; }
.ksp-acct__logout .ksp-tk-cancel { display: inline-flex; align-items: center; gap: 4px; }
.ksp-acct__logout .material-symbols-rounded { font-size: 16px; }
.ksp-acct__tabs { align-self: flex-start; }
.ksp-acct__totals { display: flex; flex-wrap: wrap; gap: 6px; }
.ksp-acct__totals .ksp-cash-cat b { margin-inline-start: 2px; }
.ksp-cash-table tfoot th { padding: 12px 14px; background: var(--ksp-surface-2); font-size: 12px; font-weight: 800; color: var(--ksp-text); border-top: 2px solid var(--ksp-border); }
.ksp-acct__days td { font-variant-numeric: tabular-nums; }
.ksp-acct .ksp-rep__lhead { align-items: center; }
.ksp-acct .ksp-rep__lhead .ksp-rep__name { font-size: 16px; }
.ksp-acct-login { max-width: 400px; margin: 10vh auto 0; padding: 28px 24px; border: 1px solid var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); box-shadow: 0 20px 40px -24px rgba(28, 25, 23, .35); text-align: center; }
.ksp-acct-login__ico { width: 52px; height: 52px; display: inline-grid; place-items: center; border-radius: 16px; background: #1c1917; color: #fb7185; }
.ksp-acct-login__ico .material-symbols-rounded { font-size: 26px; }
.ksp-acct-login__title { margin: 14px 0 2px; font-size: 18px; font-weight: 800; color: var(--ksp-text); }
.ksp-acct-login__salon { margin: 0; font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--cash-rose, #e11d48); }
.ksp-acct-login__lead { margin: 10px 0 18px; font-size: 12.5px; line-height: 1.55; color: var(--ksp-muted); }
.ksp-acct-login__form { display: flex; flex-direction: column; gap: 6px; text-align: start; }
.ksp-acct-login__form .ksp-cash-btn { margin-top: 6px; }
.ksp-acct-login__foot { display: flex; align-items: center; justify-content: center; gap: 5px; margin: 16px 0 0; font-size: 11.5px; color: var(--ksp-muted); }
.ksp-acct-login__foot .material-symbols-rounded { font-size: 15px; }
@media (max-width: 575.98px) {
  .ksp-share__scope { grid-template-columns: minmax(0, 1fr); }
  .ksp-share__link { flex-direction: column; }
  .ksp-share__danger { flex: 1 1 100%; margin: 0 0 6px; }
}
@media print {
  .ksp-share-page .ksp-acct > :not(.ksp-printable) { display: none !important; }
  .ksp-share-page__main { padding: 0; max-width: none; }
}

/* @kokpit-bordro — Personel > "Personel Prim, Hakediş & Bordro Raporu" (views/panels/tenant/payroll.php, partials/payroll-*,
   staff-tabs, staff-pay-fields; docs/PERSONEL-PRIM-HAKEDIS.md). Kasa bileşenleri (.ksp-cash-*) üzerine; önek .ksp-pay-. Dosya sonuna EKLENİR. */
.ksp-pay [hidden], .ksp-pay-form [hidden] { display: none !important; }

/* Üst şerit: iki sekme hapı + Yeni Personel Tanımla */
.ksp-pay-tabs { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; padding: 10px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); box-shadow: 0 1px 2px rgba(28, 25, 23, .03); }
.ksp-stf > .ksp-pay-tabs { margin-bottom: 16px; }
.ksp-pay-tabs__list { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.ksp-pay-tab { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 0 18px; border-radius: 999px; background: #f5f5f4; color: #292524; font-size: 13px; font-weight: 700; text-decoration: none; white-space: nowrap; transition: background-color .15s, color .15s; }
.ksp-pay-tab .material-symbols-rounded { font-size: 18px; }
.ksp-pay-tab:hover { background: #e7e5e4; color: #1c1917; }
.ksp-pay-tab.is-active { background: #e11d48; color: #fff; box-shadow: 0 8px 18px -10px rgba(225, 29, 72, .7); }
.ksp-pay-tab__short { display: none; }
[data-bs-theme="dark"] .ksp-pay-tab { background: rgba(255, 255, 255, .06); color: #e7e5e4; }
[data-bs-theme="dark"] .ksp-pay-tab.is-active { background: #e11d48; color: #fff; }
.ksp-pay .ksp-stf-add { background: #1c1917; color: #fff; }
[data-bs-theme="dark"] .ksp-pay .ksp-stf-add { background: #fafaf9; color: #1c1917; }

/* Başlık kartı + dönem segmenti */
.ksp-pay-head__text { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; }
.ksp-pay-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px 3px 6px; border: 1px solid #99f6e4; border-radius: 999px; background: #f0fdfa; color: #0f766e; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.ksp-pay-chip .material-symbols-rounded { font-size: 15px; }
[data-bs-theme="dark"] .ksp-pay-chip { border-color: rgba(45, 212, 191, .35); background: rgba(45, 212, 191, .1); color: #5eead4; }
.ksp-pay-head__title { margin: 0; font-size: 20px; font-weight: 800; line-height: 1.25; letter-spacing: -.01em; color: var(--ksp-text); }
.ksp-pay-periods { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-pay-period { display: inline-flex; align-items: center; height: 34px; padding: 0 14px; border-radius: 10px; color: var(--cash-ink2); font-size: 12.5px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.ksp-pay-period:hover { color: var(--ksp-text); background: var(--ksp-surface); }
.ksp-pay-period.is-active { background: #e11d48; color: #fff; box-shadow: 0 6px 14px -8px rgba(225, 29, 72, .7); }

/* KPI kartları (5'li) */
.ksp-pay-kpis { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.ksp-pay-kpi .ksp-cash-kpi__value { font-size: 24px; }
.ksp-pay-kpi--rose { border-color: #fecdd3; }
.ksp-pay-kpi--green { border-color: #a7f3d0; }
.ksp-pay-kpi--dark { border-color: #1c1917; background: #1c1917; }
.ksp-pay-kpi--dark .ksp-cash-kpi__label, .ksp-pay-kpi--dark .ksp-cash-kpi__foot { color: #a8a29e; }
.ksp-pay-kpi--dark .ksp-cash-kpi__value--green { color: #34d399; }
[data-bs-theme="dark"] .ksp-pay-kpi--rose { border-color: rgba(244, 63, 94, .4); }
[data-bs-theme="dark"] .ksp-pay-kpi--green { border-color: rgba(16, 185, 129, .4); }
[data-bs-theme="dark"] .ksp-pay-kpi--dark { border-color: rgba(255, 255, 255, .1); background: #0c0a09; }
.ksp-pay-ico--gray { background: var(--ksp-surface-2); color: #57534e; }
.ksp-pay-ico--rose { background: var(--cash-rose-bg); color: var(--cash-rose); }
.ksp-pay-ico--green { background: #ecfdf5; color: #059669; }
.ksp-pay-ico--amber { background: #fffbeb; color: #d97706; }
.ksp-pay-ico--dark { background: #292524; color: #34d399; }
[data-bs-theme="dark"] .ksp-pay-ico--gray { color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-pay-ico--green { background: rgba(16, 185, 129, .14); }
[data-bs-theme="dark"] .ksp-pay-ico--amber { background: rgba(245, 158, 11, .14); }

/* "Kuaför Sektörü Standartları" bilgi paneli */
.ksp-pay-std { padding: 20px 22px; border-radius: 16px; background: linear-gradient(135deg, #0c0a09 0%, #1c1917 45%, #3b0764 100%); color: #fafaf9; }
.ksp-pay-std__head { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin-bottom: 14px; }
.ksp-pay-std__chip { padding: 4px 10px; border: 1px solid rgba(232, 121, 249, .45); border-radius: 999px; background: rgba(192, 38, 211, .22); color: #f5d0fe; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.ksp-pay-std__title { margin: 0; font-size: 15px; font-weight: 800; color: #fff; }
.ksp-pay-std__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 22px; margin: 0; padding: 0; list-style: none; }
.ksp-pay-std__list li { display: flex; align-items: flex-start; gap: 10px; }
.ksp-pay-std__num { width: 22px; height: 22px; flex-shrink: 0; display: grid; place-items: center; border-radius: 7px; background: rgba(255, 255, 255, .1); color: #f0abfc; font-size: 11.5px; font-weight: 800; }
.ksp-pay-std__list p { margin: 0; font-size: 12.5px; line-height: 1.55; color: #d6d3d1; }
.ksp-pay-std__list b { color: #fff; }

/* Tablo kartı */
.ksp-pay-card__head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; padding: 16px 20px; border-bottom: 1px solid var(--cash-line); }
.ksp-pay-card__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; font-weight: 800; color: var(--ksp-text); }
.ksp-pay-card__title .material-symbols-rounded { font-size: 20px; color: var(--cash-rose); }
.ksp-pay-card__sub { margin: 3px 0 0; font-size: 12px; color: var(--ksp-muted); }
.ksp-pay-count { padding: 4px 10px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--cash-ink2); font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.ksp-pay-table th.is-center, .ksp-pay-table td.is-center, .ksp-pay-lines th.is-center, .ksp-pay-lines td.is-center { text-align: center; }
.ksp-pay-table th, .ksp-pay-table th.is-amount { padding: 10px 8px; white-space: normal; line-height: 1.3; vertical-align: bottom; }
.ksp-pay-table th:first-child, .ksp-pay-table td:first-child { padding-inline-start: 18px; }
.ksp-pay-table td { padding: 12px 8px; white-space: nowrap; }
.ksp-pay-kpi .ksp-cash-kpi__label { letter-spacing: .03em; }
.ksp-pay-who { display: flex; align-items: center; gap: 10px; }
.ksp-pay-ava { width: 36px; height: 36px; border-radius: 10px; font-size: 13px; }
.ksp-pay-who__text { display: flex; flex-direction: column; min-width: 0; }
.ksp-pay-who__text strong { font-size: 13.5px; font-weight: 800; color: var(--ksp-text); white-space: nowrap; }
.ksp-pay-who__text small { font-size: 11.5px; color: var(--ksp-muted); white-space: nowrap; }
.ksp-pay-badge { display: inline-flex; align-items: center; padding: 4px 10px; border: 1px solid transparent; border-radius: 999px; font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.ksp-pay-badge--rose { border-color: #fecdd3; background: #fff1f2; color: #be123c; }
.ksp-pay-badge--blue { border-color: #bfdbfe; background: #eff6ff; color: #1d4ed8; }
.ksp-pay-badge--teal { border-color: #99f6e4; background: #f0fdfa; color: #0f766e; }
.ksp-pay-badge--slate { border-color: #e7e5e4; background: #f5f5f4; color: #44403c; }
[data-bs-theme="dark"] .ksp-pay-badge--rose { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .12); color: #fda4af; }
[data-bs-theme="dark"] .ksp-pay-badge--blue { border-color: rgba(59, 130, 246, .35); background: rgba(59, 130, 246, .12); color: #93c5fd; }
[data-bs-theme="dark"] .ksp-pay-badge--teal { border-color: rgba(45, 212, 191, .35); background: rgba(45, 212, 191, .1); color: #5eead4; }
[data-bs-theme="dark"] .ksp-pay-badge--slate { border-color: rgba(255, 255, 255, .12); background: rgba(255, 255, 255, .06); color: #d6d3d1; }
.ksp-pay-qty { display: inline-block; padding: 3px 9px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--cash-ink2); font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.ksp-pay-rose { color: var(--cash-rose); font-weight: 700; }
.ksp-pay-amber { color: #c2410c; font-weight: 600; }
.ksp-pay-muted { color: var(--ksp-muted); }
.ksp-pay-tip { display: block; font-size: 11px; color: var(--ksp-muted); }
.ksp-pay-net { display: inline-block; padding: 4px 10px; border: 1px solid #a7f3d0; border-radius: 10px; background: #ecfdf5; color: #047857; font-weight: 800; }
.ksp-pay-net.is-negative { border-color: #fecdd3; background: #fff1f2; color: #be123c; }
[data-bs-theme="dark"] .ksp-pay-net { border-color: rgba(16, 185, 129, .35); background: rgba(16, 185, 129, .12); color: #6ee7b7; }
[data-bs-theme="dark"] .ksp-pay-net.is-negative { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .12); color: #fda4af; }
.ksp-pay-acts { display: inline-flex; align-items: center; gap: 4px; }
.ksp-pay-act { display: inline-flex; align-items: center; gap: 3px; height: 32px; padding: 0 8px; border: 1px solid var(--ksp-border); border-radius: 9px; background: var(--ksp-surface-2); color: var(--cash-ink2); font-family: inherit; font-size: 11.5px; font-weight: 700; white-space: nowrap; cursor: pointer; }
.ksp-pay-act .material-symbols-rounded { font-size: 16px; }
.ksp-pay-act:hover { border-color: #d6d3d1; color: var(--ksp-text); }
.ksp-pay-act--amber { border-color: #fcd34d; background: #fffbeb; color: #b45309; }
.ksp-pay-act--amber:hover { border-color: #f59e0b; color: #92400e; }
[data-bs-theme="dark"] .ksp-pay-act--amber { border-color: rgba(245, 158, 11, .45); background: rgba(245, 158, 11, .1); color: #fcd34d; }
.ksp-pay-icbtn { width: 32px; height: 32px; flex-shrink: 0; display: inline-grid; place-items: center; padding: 0; border: 1px solid var(--ksp-border); border-radius: 9px; background: var(--ksp-surface); color: var(--cash-soft); text-decoration: none; cursor: pointer; }
.ksp-pay-icbtn .material-symbols-rounded { font-size: 17px; }
.ksp-pay-icbtn:hover { border-color: #fda4af; color: var(--cash-rose); }
.ksp-pay-icbtn--danger:hover { border-color: #fca5a5; background: #fef2f2; color: #dc2626; }

/* İşlem Detayı penceresi + Hakediş Pusulası */
.ksp-pay-dmodal .modal-dialog { max-width: 820px; }
.ksp-pay-dbody { padding: 20px 22px; }
.ksp-pay-adv-lead { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--ksp-muted); }
.ksp-pay-slip { display: flex; flex-direction: column; gap: 16px; }
.ksp-pay-slip__head { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; }
.ksp-pay-slip__who small { font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--cash-rose); }
.ksp-pay-slip__who h3 { margin: 2px 0 4px; font-size: 18px; font-weight: 800; color: var(--ksp-text); }
.ksp-pay-slip__who p { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0; font-size: 12.5px; color: var(--ksp-muted); }
.ksp-pay-slip__period { display: flex; flex-direction: column; align-items: flex-end; padding: 8px 12px; border-radius: 12px; background: var(--ksp-surface-2); font-size: 12px; color: var(--ksp-muted); }
.ksp-pay-slip__period strong { font-size: 13px; color: var(--ksp-text); }
.ksp-pay-sum { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; margin: 0; padding: 12px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; }
.ksp-pay-sum__row { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px dashed var(--cash-line); font-size: 13px; }
.ksp-pay-sum__row dt { font-weight: 500; color: var(--cash-ink2); }
.ksp-pay-sum__row dd { margin: 0; font-weight: 700; color: var(--ksp-text); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ksp-pay-sum__row.is-rose dd { color: var(--cash-rose); }
.ksp-pay-sum__row.is-muted dd { color: var(--ksp-muted); }
.ksp-pay-sum__row.is-amber dd { color: #c2410c; }
.ksp-pay-sum__row.is-total, .ksp-pay-sum__row.is-amber, .ksp-pay-sum__row.is-net { grid-column: 1 / -1; }
.ksp-pay-sum__row.is-total { border-top: 1px solid var(--ksp-border); border-bottom-style: solid; margin-top: 4px; }
.ksp-pay-sum__row.is-total dt, .ksp-pay-sum__row.is-net dt { font-weight: 800; color: var(--ksp-text); }
.ksp-pay-sum__row.is-net { border-bottom: 0; font-size: 15px; }
.ksp-pay-sum__row.is-net dd { color: #047857; font-size: 17px; font-weight: 800; }
[data-bs-theme="dark"] .ksp-pay-sum__row.is-net dd { color: #34d399; }
.ksp-pay-slip__sec h4 { display: flex; align-items: center; gap: 6px; margin: 0 0 8px; font-size: 13px; font-weight: 800; color: var(--ksp-text); }
.ksp-pay-slip__sec h4 .material-symbols-rounded { font-size: 18px; color: var(--cash-rose); }
.ksp-pay-slip__sec .ksp-cash-tablewrap { border: 1px solid var(--ksp-border); border-radius: 12px; }
.ksp-pay-lines { font-size: 12.5px; }
.ksp-pay-lines th, .ksp-pay-lines td { padding: 9px 12px; }
.ksp-pay-lines td.is-mono { font-family: var(--cash-mono); font-size: 11.5px; white-space: nowrap; }
.ksp-pay-lines__cust { display: block; font-size: 11px; color: var(--ksp-muted); }
.ksp-pay-kind { display: inline-block; padding: 1px 6px; border-radius: 6px; font-size: 10px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; vertical-align: 1px; }
.ksp-pay-kind--service { background: #fff1f2; color: #be123c; }
.ksp-pay-kind--product { background: #eff6ff; color: #1d4ed8; }
.ksp-pay-kind--custom { background: #fffbeb; color: #b45309; }
.ksp-pay-slip__empty { margin: 0; padding: 14px; border: 1px dashed var(--ksp-border); border-radius: 12px; font-size: 12.5px; text-align: center; color: var(--ksp-muted); }
.ksp-pay-slip__note { margin: 6px 0 0; font-size: 11px; color: var(--ksp-muted); }
.ksp-pay-advs { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ksp-pay-advs li { display: flex; align-items: center; gap: 12px; padding: 9px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; }
.ksp-pay-advs__main { display: flex; flex-direction: column; flex: 1; min-width: 0; font-size: 12.5px; }
.ksp-pay-advs__main strong { font-weight: 700; color: var(--ksp-text); }
.ksp-pay-advs__main small { font-size: 11.5px; color: var(--ksp-muted); }
.ksp-pay-advs b { color: #c2410c; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ksp-pay-slip__sign { display: none; }

/* Personel penceresi: "$ Personel Prim & Hakediş Modeli" */
.ksp-pay-form { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; padding: 14px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-pay-form__title { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 14px; font-weight: 800; color: var(--ksp-text); }
.ksp-pay-form__title .material-symbols-rounded { font-size: 19px; color: #e11d48; }
.ksp-pay-box { display: flex; flex-direction: column; gap: 10px; padding: 12px; border: 1px solid #fecdd3; border-radius: 12px; background: #fff1f2; }
[data-bs-theme="dark"] .ksp-pay-box { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .08); }
.ksp-pay-extra { display: flex; flex-direction: column; gap: 10px; padding: 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); }
.ksp-pay-in { position: relative; }
.ksp-pay-in.has-suffix .ksp-stf-input { padding-inline-end: 96px; }
.ksp-pay-in__suffix { position: absolute; inset-inline-end: 12px; top: 50%; transform: translateY(-50%); font-size: 12px; font-weight: 700; color: #be123c; pointer-events: none; }
.ksp-pay-hint { margin: 0; font-size: 11.5px; line-height: 1.45; color: var(--ksp-muted); }

@media (max-width: 1199.98px) {
  .ksp-pay-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .ksp-pay-tab__long { display: none; }
  .ksp-pay-tab__short { display: inline; }
  .ksp-pay-tabs__list { flex: 1; }
  .ksp-pay-tab { flex: 1; justify-content: center; padding: 0 12px; }
  .ksp-pay-tabs .ksp-stf-add { flex: 1 1 100%; margin: 0; }
  .ksp-pay-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-pay-kpi--dark { grid-column: 1 / -1; }
  .ksp-pay-std__list { grid-template-columns: 1fr; }
  .ksp-pay-periods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .ksp-pay-period { justify-content: center; padding: 0 8px; }
  .ksp-pay-sum { grid-template-columns: 1fr; }
  .ksp-pay-slip__period { align-items: flex-start; }
}

/* Yazdırma: İşlem Detayı penceresi tek başına (body.ksp-pay-printing, app.js "@kokpit-bordro") */
@media print {
  body.ksp-pay-printing { padding: 0 !important; background: #fff !important; }
  body.ksp-pay-printing .ksp-panel__shell > :not(.ksp-panel__body),
  body.ksp-pay-printing .ksp-panel__body > :not(.ksp-panel__content),
  body.ksp-pay-printing .ksp-pay > :not(#payDetailModal),
  body.ksp-pay-printing .ksp-bottom-nav, body.ksp-pay-printing .modal-backdrop, body.ksp-pay-printing .ksp-toast-stack,
  body.ksp-pay-printing .ksp-no-print { display: none !important; }
  body.ksp-pay-printing .ksp-panel__shell, body.ksp-pay-printing .ksp-panel__body, body.ksp-pay-printing .ksp-panel__content { display: block !important; margin: 0 !important; padding: 0 !important; max-width: none !important; overflow: visible !important; }
  body.ksp-pay-printing .ksp-panel__shell { min-height: 0 !important; }
  body.ksp-pay-printing #payDetailModal { position: static !important; display: block !important; height: auto !important; overflow: visible !important; }
  body.ksp-pay-printing #payDetailModal .modal-dialog { max-width: none; min-height: 0 !important; height: auto !important; margin: 0; transform: none !important; }
  body.ksp-pay-printing #payDetailModal .modal-content { max-height: none !important; border: 0; border-radius: 0; box-shadow: none; overflow: visible; }
  body.ksp-pay-printing #payDetailModal .modal-body { max-height: none !important; overflow: visible !important; padding: 0; }
  body.ksp-pay-printing .ksp-pay-slip { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body.ksp-pay-printing .ksp-pay-slip .ksp-cash-tablewrap { overflow: visible; }
  body.ksp-pay-printing .ksp-pay-slip__sign { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 36px; break-inside: avoid; }
  body.ksp-pay-printing .ksp-pay-slip__sign div { padding-top: 8px; border-top: 1px solid #a8a29e; font-size: 11px; text-align: center; color: #57534e; }
  body.ksp-pay-printing .ksp-pay-sum { grid-template-columns: 1fr 1fr; break-inside: avoid; }
}

/* @kokpit-personel-sil — Personel penceresi "Personeli Sil" (partials/staff-modal.php, app.js "@kokpit-personel") +
   bordroda silinmiş personel etiketi (partials/payroll-table.php, payroll-detail.php). Dosya sonuna EKLENİR. */
.ksp-stf-del { display: inline-flex; align-items: center; gap: 4px; height: 38px; margin-inline-end: auto !important; padding: 0 12px; border: 0; border-radius: 10px; background: transparent; color: #e11d48; font-size: 14px; font-weight: 600; }
.ksp-stf-del .material-symbols-rounded { font-size: 18px; }
.ksp-stf-del:hover { background: #fff1f2; color: #be123c; }
.ksp-stf-del:disabled { opacity: .6; pointer-events: none; }
[data-bs-theme="dark"] .ksp-stf-del { color: #fb7185; }
[data-bs-theme="dark"] .ksp-stf-del:hover { background: rgba(244, 63, 94, .12); color: #fda4af; }
.ksp-pay-gone { display: inline-block; margin-inline-start: 4px; padding: 1px 7px; border-radius: 6px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; vertical-align: 2px; cursor: help; }

/* @kokpit-degisim — Hizmetler > Öncesi & Sonrası Değişimler (views/panels/tenant/transformations.php, partials/transformation-*,
   app.js "@kokpit-degisim"). Kasa bileşenleri (.ksp-cash-*) üzerine; önek .ksp-tf-. Dosya sonuna EKLENİR. */
.ksp-tf [hidden], .ksp-tf-modal [hidden] { display: none !important; }
.ksp-tf-head__text { min-width: 0; }
.ksp-tf-head__count { margin: 4px 0 0; font-size: 11.5px; font-weight: 600; color: var(--cash-soft); }

/* Boş durum */
.ksp-tf-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 56px 20px; border: 1px dashed var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); text-align: center; }
.ksp-tf-empty__ico { width: 56px; height: 56px; display: grid; place-items: center; margin-bottom: 4px; border-radius: 16px; background: var(--cash-rose-bg); color: var(--cash-rose); }
.ksp-tf-empty__ico .material-symbols-rounded { font-size: 28px; }
.ksp-tf-empty__title { margin: 0; font-size: 16px; font-weight: 800; color: var(--ksp-text); }
.ksp-tf-empty__text { max-width: 520px; margin: 0 0 8px; font-size: 13px; line-height: 1.55; color: var(--ksp-muted); }

/* Kart ızgarası */
.ksp-tf-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.ksp-tf-card { display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); box-shadow: 0 1px 2px rgba(28, 25, 23, .03); overflow: hidden; transition: box-shadow .15s, border-color .15s; }
.ksp-tf-card:hover { border-color: #d6d3d1; box-shadow: 0 10px 24px -16px rgba(28, 25, 23, .35); }
.ksp-tf-card.is-off .ksp-tf-card__media { filter: grayscale(.6); opacity: .8; }
.ksp-tf-card__media { position: relative; display: grid; grid-template-columns: 1fr 1fr; aspect-ratio: 16 / 9; background: #1c1917; }
.ksp-tf-card__half { position: relative; margin: 0; overflow: hidden; }
.ksp-tf-card__half + .ksp-tf-card__half { border-inline-start: 2px solid #fff; }
.ksp-tf-card__half img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ksp-tf-card__half figcaption { position: absolute; bottom: 8px; inset-inline-start: 8px; padding: 2px 8px; border-radius: 999px; background: rgba(28, 25, 23, .72); color: #fff; font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.ksp-tf-card__half--after figcaption { background: #e11d48; }
.ksp-tf-card__noimg { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; color: #a8a29e; font-size: 11px; font-weight: 600; }
.ksp-tf-card__cat { position: absolute; top: 10px; inset-inline-start: 10px; padding: 3px 9px; border-radius: 999px; background: rgba(255, 255, 255, .92); color: #be123c; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.ksp-tf-badge { position: absolute; top: 10px; inset-inline-end: 10px; padding: 3px 9px; border-radius: 999px; font-size: 10.5px; font-weight: 800; }
.ksp-tf-badge--live { background: #ecfdf5; color: #047857; }
.ksp-tf-badge--draft { background: #f5f5f4; color: #57534e; }
.ksp-tf-card__body { display: flex; flex-direction: column; gap: 6px; flex: 1; padding: 14px 16px 12px; }
.ksp-tf-card__title { margin: 0; font-size: 14.5px; font-weight: 800; line-height: 1.35; color: var(--ksp-text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ksp-tf-card__meta { margin: 0; font-size: 12px; color: var(--ksp-muted); }
.ksp-tf-card__warn { display: flex; align-items: flex-start; gap: 5px; margin: 2px 0 0; padding: 6px 9px; border-radius: 10px; background: #fffbeb; color: #b45309; font-size: 11.5px; font-weight: 600; line-height: 1.4; }
.ksp-tf-card__warn .material-symbols-rounded { font-size: 15px; }
.ksp-tf-card__foot { display: flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 8px; border-top: 1px solid var(--cash-line); }
.ksp-tf-card__likes { display: inline-flex; align-items: center; gap: 3px; margin-inline-end: auto; color: var(--cash-rose); font-size: 12px; font-weight: 700; }
.ksp-tf-card__likes .material-symbols-rounded { font-size: 16px; font-variation-settings: 'FILL' 1; }
.ksp-tf-icbtn { width: 34px; height: 34px; display: inline-grid; place-items: center; padding: 0; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--cash-soft); cursor: pointer; }
.ksp-tf-icbtn .material-symbols-rounded { font-size: 18px; }
.ksp-tf-icbtn:hover { border-color: #fda4af; color: var(--cash-rose); }
.ksp-tf-icbtn--danger:hover { border-color: #fca5a5; background: #fef2f2; color: #dc2626; }
.ksp-tf-switch { position: relative; display: inline-flex; margin: 0 4px 0 0; cursor: pointer; }
.ksp-tf-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ksp-tf-switch__track { width: 38px; height: 22px; border-radius: 999px; background: #d6d3d1; transition: background-color .15s; position: relative; }
.ksp-tf-switch__track::after { content: ''; position: absolute; top: 3px; inset-inline-start: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .25); transition: transform .15s; }
.ksp-tf-switch input:checked + .ksp-tf-switch__track { background: #16a34a; }
.ksp-tf-switch input:checked + .ksp-tf-switch__track::after { transform: translateX(16px); }
[dir="rtl"] .ksp-tf-switch input:checked + .ksp-tf-switch__track::after { transform: translateX(-16px); }
.ksp-tf-switch input:focus-visible + .ksp-tf-switch__track { box-shadow: 0 0 0 3px rgba(22, 163, 74, .25); }
.ksp-tf-switch input:disabled + .ksp-tf-switch__track { opacity: .6; }

/* Pencere */
.ksp-tf-modal .modal-dialog { max-width: 760px; }
.ksp-tf-sec { display: flex; align-items: center; gap: 6px; margin: 6px 0 0; padding-top: 12px; border-top: 1px solid var(--cash-line); font-size: 13px; font-weight: 800; color: var(--ksp-text); }
.ksp-tf-sec:first-of-type { margin-top: 0; padding-top: 0; border-top: 0; }
.ksp-tf-sec .material-symbols-rounded { font-size: 18px; color: var(--cash-rose); }
.ksp-tf-area { height: auto; min-height: 76px; padding-top: 10px; padding-bottom: 10px; line-height: 1.5; resize: vertical; }
.ksp-tf-area.is-mono { font-family: var(--cash-mono); font-size: 12.5px; }
.ksp-tf-hint { display: flex; align-items: flex-start; gap: 5px; margin: -6px 0 0; font-size: 11.5px; line-height: 1.45; color: var(--ksp-muted); }
.ksp-tf-hint--rose { margin-top: -8px; color: #be123c; }
.ksp-tf-hint .material-symbols-rounded { font-size: 15px; }
.ksp-tf-counter { margin: -8px 0 0; font-size: 11px; font-weight: 700; color: var(--cash-soft); text-align: end; }
.ksp-tf-counter.is-over { color: var(--cash-rose); }
.ksp-tf-uploads { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ksp-tf-up { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding: 10px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-tf-up--after { border-color: #fecdd3; background: #fff1f2; }
.ksp-tf-up.is-invalid { border-color: var(--cash-rose); }
.ksp-tf-up__label { font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #57534e; }
.ksp-tf-up--after .ksp-tf-up__label { color: #be123c; }
.ksp-tf-up__frame { position: relative; aspect-ratio: 4 / 3; border: 1px dashed #d6d3d1; border-radius: 10px; background: var(--ksp-surface); overflow: hidden; }
.ksp-tf-up__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ksp-tf-up__empty { position: absolute; inset: 0; display: grid; place-items: center; color: #a8a29e; }
.ksp-tf-up__empty .material-symbols-rounded { font-size: 32px; }
.ksp-tf-up__pick { align-self: flex-start; height: 34px; padding: 0 12px; font-size: 12.5px; cursor: pointer; }
.ksp-tf-check { display: inline-flex; align-items: center; gap: 8px; margin: 2px 0 0; font-size: 13.5px; font-weight: 600; color: var(--ksp-text); cursor: pointer; }
.ksp-tf-check input { width: 18px; height: 18px; accent-color: #e11d48; }

[data-bs-theme="dark"] .ksp-tf-card:hover { border-color: rgba(255, 255, 255, .16); }
[data-bs-theme="dark"] .ksp-tf-card__half + .ksp-tf-card__half { border-color: var(--ksp-surface); }
[data-bs-theme="dark"] .ksp-tf-badge--live { background: rgba(16, 185, 129, .16); color: #6ee7b7; }
[data-bs-theme="dark"] .ksp-tf-badge--draft { background: rgba(255, 255, 255, .1); color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-tf-card__warn { background: rgba(245, 158, 11, .12); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-tf-up--after { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .08); }
[data-bs-theme="dark"] .ksp-tf-up__frame { border-color: rgba(255, 255, 255, .14); }
[data-bs-theme="dark"] .ksp-tf-switch__track { background: #57534e; }
[data-bs-theme="dark"] .ksp-tf-hint--rose { color: #fda4af; }

@media (max-width: 767.98px) {
  .ksp-tf-head__acts { width: 100%; }
  .ksp-tf-head__acts > * { flex: 1 1 auto; }
  .ksp-tf-grid { grid-template-columns: 1fr; }
  .ksp-tf-uploads { grid-template-columns: 1fr 1fr; gap: 8px; }
  .ksp-tf-modal .modal-dialog { margin: 0; max-width: none; min-height: 100%; }
  .ksp-tf-modal .modal-content { min-height: 100dvh; border-radius: 0; }
}

/* @salon-degisim — Salon sayfası > Öncesi & Sonrası Değişimler (views/site/salon/transformations*.php, app.js "@salon-degisim").
   Kullanıcı referans tasarımı birebir (2026-09-18); önek .ksp-sp-tf-. Dosya sonuna EKLENİR. */
.ksp-sp-tf [hidden] { display: none !important; }
.ksp-sp-tf { display: flex; flex-direction: column; gap: 18px; }

/* Portföy kartı */
.ksp-sp-tf-intro { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 20px; padding: 16px 22px; border: 1px solid #e7e5e4; border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(28, 25, 23, .05); }
.ksp-sp-tf-intro__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 17px; font-weight: 800; color: #1c1917; }
.ksp-sp-tf-intro__title .material-symbols-rounded { color: #ec003f; font-size: 22px; }
.ksp-sp-tf-intro__lead { margin: 3px 0 0; font-size: 12.5px; color: #78716c; }
.ksp-sp-tf-pill { display: inline-flex; align-items: center; gap: 5px; padding: 6px 14px; border: 1px solid #fda4af; border-radius: 999px; background: #fff1f2; color: #e11d48; font-size: 12px; font-weight: 700; white-space: nowrap; }
.ksp-sp-tf-pill .material-symbols-rounded { font-size: 16px; }

/* Başlık + kategori hapları */
.ksp-sp-tf-head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 14px 24px; }
.ksp-sp-tf-head__text { max-width: 560px; }
.ksp-sp-tf-chip { display: inline-flex; align-items: center; gap: 5px; padding: 4px 12px; border: 1px solid #fecdd3; border-radius: 999px; background: #fff1f2; color: #e11d48; font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.ksp-sp-tf-chip .material-symbols-rounded { font-size: 15px; }
.ksp-sp-tf-head__title { margin: 12px 0 6px; font-size: 30px; font-weight: 800; line-height: 1.15; letter-spacing: -.02em !important; color: #1c1917; }
.ksp-sp-tf-head__lead { margin: 0; font-size: 13.5px; line-height: 1.55; color: #78716c; }
.ksp-sp-tf-cats { display: flex; flex-wrap: wrap; gap: 6px; max-width: 560px; padding: 6px; border: 1px solid #e7e5e4; border-radius: 16px; background: #f5f5f4; }
.ksp-sp-tf-cat { height: 32px; padding: 0 14px; border: 0; border-radius: 10px; background: transparent; color: #44403c; font-size: 12px; font-weight: 700; white-space: nowrap; cursor: pointer; transition: background .15s, color .15s; }
.ksp-sp-tf-cat:hover { background: #fff; color: #1c1917; }
.ksp-sp-tf-cat.is-active { background: #ec003f; color: #fff; box-shadow: 0 6px 14px -8px rgba(236, 0, 63, .7); }

/* Ana kart */
.ksp-sp-tf-stage { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); border: 1px solid #e7e5e4; border-radius: 22px; background: #fff; box-shadow: 0 18px 40px -28px rgba(28, 25, 23, .45); overflow: hidden; }
.ksp-sp-tf-dark { display: flex; flex-direction: column; gap: 14px; padding: 20px; background: #0c0a09; color: #fafaf9; }
.ksp-sp-tf-dark__top { display: flex; flex-direction: column; gap: 12px; }
.ksp-sp-tf-dark__id { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.ksp-sp-tf-dark__cat { padding: 4px 10px; border-radius: 999px; background: #ec003f; color: #fff; font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.ksp-sp-tf-dark__salon { font-size: 12px; font-weight: 600; color: #d6d3d1; }
.ksp-sp-tf-modes { display: inline-flex; align-self: flex-start; gap: 4px; padding: 4px; border: 1px solid rgba(255, 255, 255, .1); border-radius: 12px; background: rgba(255, 255, 255, .06); }
.ksp-sp-tf-mode { height: 30px; padding: 0 12px; border: 0; border-radius: 8px; background: transparent; color: #d6d3d1; font-size: 11.5px; font-weight: 700; cursor: pointer; }
.ksp-sp-tf-mode:hover { color: #fff; }
.ksp-sp-tf-mode.is-active { background: #ec003f; color: #fff; }

/* Karşılaştırıcı: öncesi üstte, sol parçası --tf-pos kadar görünür */
.ksp-sp-tf-cmp { position: relative; aspect-ratio: 3 / 2; border-radius: 16px; background: #292524; overflow: hidden; touch-action: pan-y; user-select: none; cursor: ew-resize; }
.ksp-sp-tf-cmp__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; }
.ksp-sp-tf-cmp__img--before { clip-path: inset(0 calc(100% - var(--tf-pos, 50%)) 0 0); }
[dir="rtl"] .ksp-sp-tf-cmp__img--before { clip-path: inset(0 0 0 calc(100% - var(--tf-pos, 50%))); }
.ksp-sp-tf-cmp:not(.is-dragging) .ksp-sp-tf-cmp__img--before, .ksp-sp-tf-cmp:not(.is-dragging) .ksp-sp-tf-cmp__line, .ksp-sp-tf-cmp:not(.is-dragging) .ksp-sp-tf-cmp__handle { transition: clip-path .35s ease, inset-inline-start .35s ease; }
.ksp-sp-tf-cmp__line { position: absolute; top: 0; bottom: 0; inset-inline-start: var(--tf-pos, 50%); width: 2px; margin-inline-start: -1px; background: #fff; box-shadow: 0 0 12px rgba(0, 0, 0, .35); pointer-events: none; }
.ksp-sp-tf-cmp__handle { position: absolute; top: 50%; inset-inline-start: var(--tf-pos, 50%); width: 42px; height: 42px; display: grid; place-items: center; padding: 0; border: 3px solid #fff; border-radius: 50%; background: #fff; color: #ec003f; box-shadow: 0 6px 18px rgba(0, 0, 0, .35); transform: translate(-50%, -50%); cursor: ew-resize; }
[dir="rtl"] .ksp-sp-tf-cmp__handle { transform: translate(50%, -50%); }
.ksp-sp-tf-cmp__handle .material-symbols-rounded { font-size: 22px; font-weight: 700; }
.ksp-sp-tf-cmp__handle:focus-visible { outline: 3px solid #fda4af; outline-offset: 2px; }
.ksp-sp-tf-cmp__tag { position: absolute; top: 12px; padding: 5px 10px; border-radius: 8px; font-size: 10.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; pointer-events: none; }
.ksp-sp-tf-cmp__tag--before { inset-inline-start: 12px; background: rgba(28, 25, 23, .78); color: #fff; }
.ksp-sp-tf-cmp__tag--after { inset-inline-end: 12px; background: #ec003f; color: #fff; }
.ksp-sp-tf-cmp__hint { position: absolute; bottom: 12px; left: 50%; display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border-radius: 999px; background: rgba(28, 25, 23, .72); color: #fff; font-size: 11px; font-weight: 700; white-space: nowrap; transform: translateX(-50%); pointer-events: none; backdrop-filter: blur(4px); }
.ksp-sp-tf-cmp__hint .material-symbols-rounded { font-size: 15px; color: #fbbf24; }
/* Yan Yana: iki görsel yarım genişlik; Sonuç Odak: yalnız sonrası */
.ksp-sp-tf-cmp[data-mode="side"] { cursor: default; }
.ksp-sp-tf-cmp[data-mode="side"] .ksp-sp-tf-cmp__img--before { clip-path: none; width: 50%; border-inline-end: 2px solid #fff; }
.ksp-sp-tf-cmp[data-mode="side"] .ksp-sp-tf-cmp__img--after { inset-inline-start: 50%; width: 50%; }
.ksp-sp-tf-cmp[data-mode="result"] { cursor: default; }
.ksp-sp-tf-cmp[data-mode="result"] .ksp-sp-tf-cmp__img--before, .ksp-sp-tf-cmp[data-mode="result"] .ksp-sp-tf-cmp__tag--before { display: none; }
.ksp-sp-tf-cmp:not([data-mode="slider"]) .ksp-sp-tf-cmp__line, .ksp-sp-tf-cmp:not([data-mode="slider"]) .ksp-sp-tf-cmp__handle, .ksp-sp-tf-cmp:not([data-mode="slider"]) .ksp-sp-tf-cmp__hint { display: none; }

.ksp-sp-tf-focus { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.ksp-sp-tf-focus__btn { min-height: 34px; padding: 4px 8px; border: 1px solid rgba(255, 255, 255, .18); border-radius: 10px; background: #fff; color: #1c1917; font-size: 11px; font-weight: 700; line-height: 1.25; cursor: pointer; }
.ksp-sp-tf-focus__btn:hover { border-color: #fda4af; }
.ksp-sp-tf-focus__btn.is-active { border-color: #ec003f; background: #ec003f; color: #fff; }
.ksp-sp-tf-dark__foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; margin-top: auto; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .08); }
.ksp-sp-tf-staff { display: flex; align-items: center; gap: 10px; }
.ksp-sp-tf-staff__ava { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(236, 0, 63, .45); border-radius: 50%; background: rgba(236, 0, 63, .12); color: #fb7185; }
.ksp-sp-tf-staff__ava .material-symbols-rounded { font-size: 18px; }
.ksp-sp-tf-staff small { display: block; font-size: 10.5px; color: #a8a29e; }
.ksp-sp-tf-staff strong { display: block; font-size: 13px; font-weight: 800; color: #fff; }
.ksp-sp-tf-facts { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; font-weight: 700; }
.ksp-sp-tf-facts__dur { display: inline-flex; align-items: center; gap: 4px; color: #e7e5e4; }
.ksp-sp-tf-facts__dur .material-symbols-rounded { font-size: 16px; color: #fbbf24; }
.ksp-sp-tf-facts__price { color: #34d399; }

/* Sağ panel */
.ksp-sp-tf-info { display: flex; flex-direction: column; gap: 14px; padding: 24px 26px; }
.ksp-sp-tf-info__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ksp-sp-tf-info__salon { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; color: #ec003f; }
.ksp-sp-tf-info__salon .material-symbols-rounded { font-size: 15px; }
.ksp-sp-tf-like { display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 12px; border: 1px solid #e7e5e4; border-radius: 999px; background: #fff; color: #57534e; font-size: 12px; font-weight: 700; cursor: pointer; transition: border-color .15s, color .15s; }
.ksp-sp-tf-like .material-symbols-rounded { font-size: 17px; }
.ksp-sp-tf-like:hover { border-color: #fda4af; color: #e11d48; }
.ksp-sp-tf-like.is-on { border-color: #fecdd3; background: #fff1f2; color: #e11d48; }
.ksp-sp-tf-like.is-on .material-symbols-rounded { font-variation-settings: 'FILL' 1; }
.ksp-sp-tf-like:disabled { opacity: .6; }
.ksp-sp-tf-like__msg { margin: -8px 0 0; font-size: 11.5px; font-weight: 600; color: #e11d48; text-align: end; }
.ksp-sp-tf-info__title { margin: 0; font-size: 22px; font-weight: 800; line-height: 1.25; color: #1c1917; }
.ksp-sp-tf-info__desc { margin: 0; font-size: 13px; line-height: 1.6; color: #57534e; white-space: pre-line; }
.ksp-sp-tf-notes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ksp-sp-tf-note { padding: 12px 14px; border: 1px solid #e7e5e4; border-radius: 12px; background: #fff; }
.ksp-sp-tf-note--result { border-color: #fecdd3; background: #fff1f2; }
.ksp-sp-tf-note__label { display: block; margin-bottom: 4px; font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #78716c; }
.ksp-sp-tf-note--result .ksp-sp-tf-note__label { color: #e11d48; }
.ksp-sp-tf-note p { margin: 0; font-size: 12.5px; line-height: 1.5; color: #44403c; white-space: pre-line; }
.ksp-sp-tf-note--result p { font-weight: 600; color: #1c1917; }
.ksp-sp-tf-block__title { margin: 0 0 8px; font-size: 13px; font-weight: 800; color: #1c1917; }
.ksp-sp-tf-block__label { margin: 0 0 8px; font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #78716c; }
.ksp-sp-tf-checks { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ksp-sp-tf-checks li { display: flex; align-items: flex-start; gap: 7px; font-size: 12.5px; line-height: 1.45; color: #44403c; }
.ksp-sp-tf-checks .material-symbols-rounded { font-size: 17px; color: #10b981; font-variation-settings: 'FILL' 1; }
.ksp-sp-tf-formula { padding: 12px 14px; border: 1px solid #ddd6fe; border-radius: 12px; background: #f5f3ff; }
.ksp-sp-tf-formula__label { display: flex; align-items: center; gap: 5px; margin-bottom: 8px; font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #6d28d9; }
.ksp-sp-tf-formula__label .material-symbols-rounded { font-size: 16px; }
.ksp-sp-tf-formula__text { margin: 0; padding: 10px 12px; border: 1px solid #ede9fe; border-radius: 8px; background: #fff; font-family: ui-monospace, SFMono-Regular, "Cascadia Mono", Menlo, Consolas, monospace; font-size: 11.5px; line-height: 1.6; color: #6d28d9; white-space: pre-line; overflow-wrap: anywhere; }
.ksp-sp-tf-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ksp-sp-tf-chips li { padding: 5px 10px; border: 1px solid #e7e5e4; border-radius: 8px; background: #fff; font-size: 11.5px; font-weight: 600; color: #44403c; }
.ksp-sp-tf-book { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; margin-top: 4px; padding: 0 20px; border-radius: 14px; background: #ec003f; color: #fff; font-size: 14.5px; font-weight: 800; text-align: center; text-decoration: none; box-shadow: 0 12px 24px -12px rgba(236, 0, 63, .75); transition: background .15s, transform .15s; }
.ksp-sp-tf-book:hover { background: #c8003a; color: #fff; }
.ksp-sp-tf-book .material-symbols-rounded { font-size: 19px; }
.ksp-sp-tf-book__note { margin: -6px 0 0; font-size: 11px; color: #a8a29e; text-align: center; }

/* Diğer örnekler */
.ksp-sp-tf-others__head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 6px 16px; margin-bottom: 10px; }
.ksp-sp-tf-others__title { margin: 0; font-size: 14px; font-weight: 800; color: #1c1917; }
.ksp-sp-tf-others__hint { font-size: 11.5px; color: #a8a29e; }
.ksp-sp-tf-thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-sp-tf-thumb { display: flex; flex-direction: column; gap: 3px; width: 100%; height: 100%; padding: 6px 6px 10px; border: 2px solid #e7e5e4; border-radius: 14px; background: #fff; text-align: start; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.ksp-sp-tf-thumb:hover { border-color: #fda4af; }
.ksp-sp-tf-thumb.is-active { border-color: #ec003f; background: #fff1f2; box-shadow: 0 8px 18px -12px rgba(236, 0, 63, .6); }
.ksp-sp-tf-thumb__img { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; margin-bottom: 6px; aspect-ratio: 16 / 10; border-radius: 10px; background: #e7e5e4; overflow: hidden; }
.ksp-sp-tf-thumb__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ksp-sp-tf-thumb__cat { padding-inline: 4px; font-size: 9.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #e11d48; }
.ksp-sp-tf-thumb__title { padding-inline: 4px; font-size: 12.5px; font-weight: 800; line-height: 1.3; color: #1c1917; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.ksp-sp-tf-thumb__meta { padding-inline: 4px; font-size: 11px; color: #78716c; }

/* Koyu tema */
[data-bs-theme="dark"] .ksp-sp-tf-intro, [data-bs-theme="dark"] .ksp-sp-tf-stage, [data-bs-theme="dark"] .ksp-sp-tf-thumb, [data-bs-theme="dark"] .ksp-sp-tf-note, [data-bs-theme="dark"] .ksp-sp-tf-like, [data-bs-theme="dark"] .ksp-sp-tf-chips li { border-color: rgba(255, 255, 255, .1); background: var(--ksp-surface, #1c1917); }
[data-bs-theme="dark"] .ksp-sp-tf-intro__title, [data-bs-theme="dark"] .ksp-sp-tf-head__title, [data-bs-theme="dark"] .ksp-sp-tf-info__title, [data-bs-theme="dark"] .ksp-sp-tf-block__title, [data-bs-theme="dark"] .ksp-sp-tf-others__title, [data-bs-theme="dark"] .ksp-sp-tf-thumb__title, [data-bs-theme="dark"] .ksp-sp-tf-note--result p { color: #fafaf9; }
[data-bs-theme="dark"] .ksp-sp-tf-info__desc, [data-bs-theme="dark"] .ksp-sp-tf-note p, [data-bs-theme="dark"] .ksp-sp-tf-checks li, [data-bs-theme="dark"] .ksp-sp-tf-chips li { color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-sp-tf-cats { border-color: rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .05); }
[data-bs-theme="dark"] .ksp-sp-tf-cat { color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-sp-tf-cat:hover { background: rgba(255, 255, 255, .08); color: #fff; }
[data-bs-theme="dark"] .ksp-sp-tf-note--result, [data-bs-theme="dark"] .ksp-sp-tf-thumb.is-active, [data-bs-theme="dark"] .ksp-sp-tf-pill, [data-bs-theme="dark"] .ksp-sp-tf-chip { border-color: rgba(244, 63, 94, .4); background: rgba(244, 63, 94, .1); }
[data-bs-theme="dark"] .ksp-sp-tf-formula { border-color: rgba(139, 92, 246, .35); background: rgba(139, 92, 246, .1); }
[data-bs-theme="dark"] .ksp-sp-tf-formula__label, [data-bs-theme="dark"] .ksp-sp-tf-formula__text { color: #c4b5fd; }
[data-bs-theme="dark"] .ksp-sp-tf-formula__text { border-color: rgba(139, 92, 246, .25); background: rgba(0, 0, 0, .25); }

@media (max-width: 991.98px) {
  .ksp-sp-tf-stage { grid-template-columns: 1fr; }
}
@media (max-width: 767.98px) {
  .ksp-sp-tf-intro { padding: 14px 16px; }
  .ksp-sp-tf-head__title { font-size: 24px; }
  .ksp-sp-tf-cats { flex-wrap: nowrap; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .ksp-sp-tf-cats::-webkit-scrollbar { display: none; }
  .ksp-sp-tf-dark { padding: 14px; }
  .ksp-sp-tf-info { padding: 18px 16px; }
  .ksp-sp-tf-notes { grid-template-columns: 1fr; }
  .ksp-sp-tf-focus__btn { font-size: 10.5px; }
  .ksp-sp-tf-thumbs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; scrollbar-width: thin; }
  .ksp-sp-tf-thumbs li { flex: 0 0 170px; scroll-snap-align: start; }
}
/* @salon-degisim: masaüstünde karşılaştırıcı sol panelin boş yüksekliğini doldurur (sağ panel uzun olduğunda boşluk kalmasın) */
@media (min-width: 992px) {
  .ksp-sp-tf-cmp { flex: 1 1 auto; aspect-ratio: auto; min-height: 340px; }
}
/* @kokpit-paket: hizmet seçim listesi kategori başlıkları + "N hizmet başka kategoride · Tümünü göster" (2026-09-18) */
.ksp-pkg-group { margin: 6px 0 0; padding: 6px 10px 2px; font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-pkg-group:first-child { margin-top: 0; }
.ksp-pkg-more { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; margin: 6px 0 0; font-size: 12px; color: var(--ksp-muted); }
.ksp-pkg-more__btn { padding: 0; border: 0; background: none; color: #e11d48; font-size: 12px; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.ksp-pkg-more__btn:hover { color: #be123c; }

/* @personel-profil — Uzman "Detaylı Profil" (views/site/salon/staff*.php), Kokpit "Profil & Portal" (panels/tenant/staff-profile.php,
   partials/staff-profile-form, staff-portfolio, staff-portal-card), Personel Portalı (views/staff-portal/*), bordro mutabakat rozeti.
   Kullanıcı isteği 2026-09-18: eğik yazı YOK, sitenin modern dili. Önekler .ksp-spp- (site), .ksp-sprof- (kokpit / portal),
   .ksp-portal- (portal). Dosya sonuna EKLENİR. */

/* Uzman kartı: iki düğme yan yana */

/* Detaylı Profil penceresi */

/* Kokpit "Profil & Portal" + Personel Portalı (Kasa bileşenleri .ksp-cash-* üzerine) */
.ksp-sprof [hidden], .ksp-portal [hidden] { display: none !important; }
.ksp-stf-dhead__acts { display: flex; flex-wrap: wrap; gap: 6px; }
.ksp-sprof-ava { width: 48px; height: 48px; border-radius: 14px; font-size: 16px; }
.ksp-sprof-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 16px; align-items: start; }
.ksp-sprof-grid--single { grid-template-columns: minmax(0, 1fr); }
.ksp-sprof-main, .ksp-sprof-side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.ksp-sprof-card { display: flex; flex-direction: column; gap: 14px; padding: 20px 22px; }
.ksp-sprof-card__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ksp-sprof-card__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; font-weight: 800; color: var(--ksp-text); }
.ksp-sprof-card__title .material-symbols-rounded { font-size: 20px; color: var(--cash-rose); }
.ksp-sprof-card > .ksp-sprof-card__title:not(:first-of-type) { margin-top: 6px; padding-top: 14px; border-top: 1px solid var(--cash-line); }
.ksp-sprof-row { display: grid; grid-template-columns: minmax(0, 200px); }
.ksp-sprof-area { height: auto; min-height: 84px; padding-top: 10px; padding-bottom: 10px; line-height: 1.5; resize: vertical; }
.ksp-sprof-hint { margin: 0; font-size: 11.5px; line-height: 1.45; color: var(--ksp-muted); }
.ksp-sprof-lead { margin: -4px 0 0; font-size: 12.5px; line-height: 1.55; color: var(--ksp-muted); }
.ksp-sprof-actions { display: flex; justify-content: flex-end; }
.ksp-sprof-count { padding: 4px 10px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--cash-ink2); font-size: 11.5px; font-weight: 700; }
.ksp-sprof-empty { margin: 0; padding: 14px; border: 1px dashed var(--ksp-border); border-radius: 12px; font-size: 12.5px; text-align: center; color: var(--ksp-muted); }
.ksp-sprof-works { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-sprof-work { position: relative; display: flex; flex-direction: column; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); overflow: hidden; }
.ksp-sprof-work img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; }
.ksp-sprof-work__text { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px 10px; min-width: 0; }
.ksp-sprof-work__cat { font-size: 9.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--cash-rose); }
.ksp-sprof-work__text strong { font-size: 12.5px; font-weight: 800; color: var(--ksp-text); }
.ksp-sprof-work__text small { font-size: 11px; color: var(--ksp-muted); }
.ksp-sprof-work form { position: absolute; top: 8px; right: 8px; margin: 0; }
.ksp-sprof-work__del { width: 30px; height: 30px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 9px; background: rgba(28, 25, 23, .72); color: #fff; cursor: pointer; }
.ksp-sprof-work__del:hover { background: #dc2626; }
.ksp-sprof-work__del .material-symbols-rounded { font-size: 17px; }
.ksp-sprof-add { display: flex; flex-direction: column; gap: 12px; padding: 14px; border: 1px dashed #fda4af; border-radius: 14px; background: var(--cash-rose-bg); }
.ksp-sprof-file { height: auto; padding: 9px 12px; }
.ksp-sprof-pill { padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 800; white-space: nowrap; }
.ksp-sprof-pill--on { background: #ecfdf5; color: #047857; }
.ksp-sprof-pill--off { background: #f5f5f4; color: #57534e; }
.ksp-sprof-pill--warn { background: #fffbeb; color: #b45309; }
.ksp-sprof-link { display: flex; gap: 8px; }
.ksp-sprof-link .ksp-cash-input { flex: 1; min-width: 0; font-size: 12px; }
.ksp-sprof-warn { display: flex; align-items: flex-start; gap: 6px; margin: 0; padding: 10px 12px; border-radius: 12px; background: #fffbeb; color: #b45309; font-size: 12.5px; font-weight: 600; }
.ksp-sprof-pass { display: flex; flex-direction: column; gap: 10px; }
.ksp-sprof-danger { display: flex; flex-wrap: wrap; gap: 4px; padding-top: 8px; border-top: 1px solid var(--cash-line); }
.ksp-sprof-danger form { margin: 0; }
.ksp-sprof-revoke { color: #dc2626; }
.ksp-sprof-sub { display: flex; align-items: center; gap: 6px; margin: 6px 0 0; font-size: 13px; font-weight: 800; color: var(--ksp-text); }
.ksp-sprof-sub .material-symbols-rounded { font-size: 18px; color: var(--cash-rose); }
.ksp-sprof-settle { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-sprof-settle li { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; font-size: 12.5px; }
.ksp-sprof-settle__month { font-weight: 800; color: var(--ksp-text); }
.ksp-sprof-settle small { margin-inline-start: auto; color: var(--ksp-muted); }
.ksp-sprof-settle__note { flex-basis: 100%; margin: 0; font-size: 12px; color: #b45309; }

/* Bordro: mutabakat rozeti (bu ay) */
.ksp-pay-settle { display: flex; align-items: center; justify-content: flex-end; gap: 3px; margin-top: 4px; font-size: 10.5px; font-weight: 800; white-space: nowrap; }
.ksp-pay-settle .material-symbols-rounded { font-size: 14px; }
.ksp-pay-settle--ok { color: #047857; }
.ksp-pay-settle--dispute { color: #b45309; cursor: help; }
.ksp-pay-settle--wait { color: var(--ksp-muted); font-weight: 600; }

/* Personel Portalı */
.ksp-portal { max-width: 1080px; margin: 0 auto; padding: 20px 16px 48px; }
.ksp-portal__bar { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.ksp-portal__month { display: flex; flex-direction: column; gap: 6px; margin: 0; min-width: 220px; }
.ksp-portal__sheet-head { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.ksp-portal__sheet-head small { font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--cash-rose); }
.ksp-portal__sheet-head h2 { margin: 2px 0 0; font-size: 19px; font-weight: 800; color: var(--ksp-text); }
.ksp-portal__kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.ksp-portal__kpi { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); }
.ksp-portal__kpi span { font-size: 10.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--cash-soft); }
.ksp-portal__kpi strong { font-size: 18px; font-weight: 800; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-portal__kpi strong.is-rose { color: var(--cash-rose); }
.ksp-portal__kpi strong.is-amber { color: #c2410c; }
.ksp-portal__kpi.is-net { border-color: #1c1917; background: #1c1917; }
.ksp-portal__kpi.is-net span { color: #a8a29e; }
.ksp-portal__kpi.is-net strong { color: #34d399; }
.ksp-portal__table { border: 1px solid var(--ksp-border); border-radius: 12px; }
.ksp-portal__stamp { display: flex; align-items: center; gap: 6px; margin: 0; padding: 10px 12px; border-radius: 12px; font-size: 12.5px; font-weight: 700; }
.ksp-portal__stamp--approved { background: #ecfdf5; color: #047857; }
.ksp-portal__stamp--disputed { background: #fffbeb; color: #b45309; }
.ksp-portal__settle form { margin: 0; }
.ksp-portal__approve { display: flex; }
.ksp-portal__dispute { display: flex; flex-direction: column; gap: 10px; padding-top: 12px; border-top: 1px solid var(--cash-line); }
.ksp-portal__dispute-btn { align-self: flex-start; }
.ksp-portal__decided { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 12px 14px; border-radius: 12px; font-size: 13px; font-weight: 700; }
.ksp-portal__decided--approved { background: #ecfdf5; color: #047857; }
.ksp-portal__decided--disputed { background: #fffbeb; color: #b45309; }
.ksp-portal__decided .ksp-cash-btn { margin-inline-start: auto; }
@media (max-width: 991.98px) {
  .ksp-sprof-grid { grid-template-columns: minmax(0, 1fr); }
  .ksp-portal__kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .ksp-portal__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-sprof-card { padding: 16px; }
  .ksp-sprof-link { flex-direction: column; }
}
@media print {
  .ksp-share-page .ksp-portal > :not(.ksp-printable) { display: none !important; }
  .ksp-share-page .ksp-portal { padding: 0; max-width: none; }
  .ksp-share-page .ksp-portal .ksp-printable { border: 0 !important; box-shadow: none !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .ksp-share-page .ksp-portal__kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
/* @personel-profil: portal kalem tablosu dar ekranda yatay kayar; tarih ve adisyon numarası bölünmez */
.ksp-portal__table .ksp-cash-table { min-width: 640px; }
.ksp-portal__table td:nth-child(1), .ksp-portal__table td:nth-child(2) { white-space: nowrap; }
/* @personel-profil: Profil & Portal sayfasında üst şerit + personel seçici */
.ksp-sprof .ksp-stf-add { background: #1c1917; color: #fff; }
[data-bs-theme="dark"] .ksp-sprof .ksp-stf-add { background: #fafaf9; color: #1c1917; }
.ksp-sprof-pick { width: auto; min-width: 200px; height: 40px; }

/* @salon-randevu — Salon sayfası "Randevu Al" penceresi (views/site/salon/booking-modal.php + booking-done.php; app.js "@salon-randevu").
   Kullanıcı referansı 2026-09-18 birebir: koyu başlık, adım şeridi, kartlı hizmet / uzman listeleri, tarih şeridi + saat ızgarası,
   iletişim formu + özet, koyu bilet. Eğik yazı yok. Önek .ksp-bk-. Dosya sonuna EKLENİR. */
.ksp-bk .modal-dialog { max-width: 672px; }
.ksp-bk .modal-content { border: 0; border-radius: 24px; background: #fff; color: #1c1917; box-shadow: 0 30px 70px -24px rgba(28, 25, 23, .55); overflow: hidden; }
.ksp-bk, .ksp-bk * { font-style: normal !important; }
.ksp-bk__head { display: flex; align-items: center; gap: 14px; padding: 20px 22px 20px 22px; background: #1f1b19; color: #fff; }
.ksp-bk__logo { flex-shrink: 0; width: 44px; height: 44px; display: grid; place-items: center; border: 2px solid rgba(255, 255, 255, .92); border-radius: 10px; background: #44403c; color: #fff; font-size: 14px; font-weight: 800; overflow: hidden; }
.ksp-bk__logo img { width: 100%; height: 100%; object-fit: cover; }
.ksp-bk__who { min-width: 0; }
.ksp-bk__eyebrow { margin: 0 0 3px; color: #ff4d7a; font-size: 10.5px; font-weight: 800; letter-spacing: .05em; line-height: 1.2; text-transform: uppercase; }
.ksp-bk__salon { margin: 0; color: #fff; font-size: 17px; font-weight: 800; line-height: 1.3; letter-spacing: -.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-bk__close { flex-shrink: 0; width: 34px; height: 34px; display: grid; place-items: center; margin-inline-start: auto; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .1); color: #e7e5e4; cursor: pointer; transition: background .15s; }
.ksp-bk__close .material-symbols-rounded { font-size: 19px; }
.ksp-bk__close:hover { background: rgba(255, 255, 255, .2); color: #fff; }

/* Adım şeridi: 1 Hizmetler — 2 Uzman — 3 Tarih & Saat — 4 İletişim */
.ksp-bk-steps { display: flex; align-items: center; gap: 10px; margin: 0; padding: 12px 22px; border-bottom: 1px solid #e7e5e4; background: #faf9f7; list-style: none; }
.ksp-bk-step { display: inline-flex; align-items: center; gap: 9px; flex-shrink: 0; color: #292524; font-size: 13px; font-weight: 500; }
.ksp-bk-step__n { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: #e7e5e4; color: #44403c; font-size: 12px; font-weight: 700; }
.ksp-bk-step.is-active .ksp-bk-step__n { background: #ec003f; color: #fff; }
.ksp-bk-step.is-active .ksp-bk-step__label { color: #1c1917; font-weight: 600; }
.ksp-bk-steps__line { flex: 1 1 24px; max-width: 34px; height: 1.5px; margin-inline: auto; background: #d6d3d1; }

.ksp-bk__body { padding: 26px 24px 22px; }
.ksp-bk-pane[hidden] { display: none !important; }
.ksp-bk-title { margin: 0; color: #1c1917; font-size: 17px; font-weight: 800; letter-spacing: -.01em; line-height: 1.35; outline: 0; }
.ksp-bk-lead { margin: 3px 0 16px; color: #78716c; font-size: 12.5px; line-height: 1.5; }
.ksp-bk-alert { margin: 0 0 14px; padding: 10px 14px; border: 1px solid #fecdd3; border-radius: 12px; background: #fff1f2; color: #be123c; font-size: 13px; font-weight: 600; }

/* (1) Hizmetler — liste kendi içinde kayar (referans: başlık sabit, kartlar kayar) */
.ksp-bk-svcs, .ksp-bk-pros { max-height: 322px; margin-inline-end: -10px; padding-inline-end: 10px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #a8a29e transparent; }
.ksp-bk-svcs { display: flex; flex-direction: column; gap: 10px; }
.ksp-bk-svc { position: relative; display: flex; align-items: center; gap: 14px; min-height: 66px; margin: 0; padding: 12px 18px 12px 16px; border: 1px solid #e7e5e4; border-radius: 14px; background: #fff; cursor: pointer; transition: border-color .15s, background .15s; }
.ksp-bk-svc:hover { border-color: #d6d3d1; }
.ksp-bk-svc.is-selected { border-color: #ec003f; background: #fff5f7; }
.ksp-bk-svc__input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.ksp-bk-svc__box { flex-shrink: 0; width: 20px; height: 20px; display: grid; place-items: center; border: 1.5px solid #d6d3d1; border-radius: 6px; background: #fff; color: transparent; transition: background .15s, border-color .15s; }
.ksp-bk-svc__box .material-symbols-rounded { font-size: 15px; font-weight: 700; }
.ksp-bk-svc.is-selected .ksp-bk-svc__box { border-color: #ec003f; background: #ec003f; color: #fff; }
.ksp-bk-svc__input:focus-visible + .ksp-bk-svc__box { outline: 2px solid #ec003f; outline-offset: 2px; }
.ksp-bk-svc__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.ksp-bk-svc__name { color: #1c1917; font-size: 14.5px; font-weight: 700; line-height: 1.35; }
.ksp-bk-svc__meta { color: #78716c; font-size: 11.5px; line-height: 1.45; }
.ksp-bk-svc__price { flex-shrink: 0; color: #1c1917; font-size: 15.5px; font-weight: 800; white-space: nowrap; }

/* (2) Uzman kartları — iki sütun */
.ksp-bk-pros { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-content: start; }
.ksp-bk-pro { position: relative; display: flex; align-items: center; gap: 16px; min-height: 96px; margin: 0; padding: 16px 16px; border: 1px solid #e7e5e4; border-radius: 14px; background: #fff; cursor: pointer; transition: border-color .15s, background .15s; }
.ksp-bk-pro[hidden] { display: none; }
.ksp-bk-pro:hover { border-color: #d6d3d1; }
.ksp-bk-pro.is-selected { border-color: #ec003f; background: #fff5f7; box-shadow: inset 0 0 0 .5px #ec003f; }
.ksp-bk-pro.is-unfit { order: 1; cursor: not-allowed; opacity: .55; } /* uygun uzmanlar önce */
.ksp-bk-pro__input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.ksp-bk-pro:has(.ksp-bk-pro__input:focus-visible) { outline: 2px solid #ec003f; outline-offset: 2px; }
.ksp-bk-pro__ava, .ksp-bk-pro__ico { flex-shrink: 0; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 10px; overflow: hidden; }
.ksp-bk-pro__ava { background: #e7e5e4; color: #57534e; font-size: 14px; font-weight: 800; }
.ksp-bk-pro__ava img { width: 100%; height: 100%; object-fit: cover; }
.ksp-bk-pro__ico { border-radius: 12px; background: #f5f5f4; color: #ec003f; }
.ksp-bk-pro__ico .material-symbols-rounded { font-size: 22px; }
.ksp-bk-pro__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ksp-bk-pro__name { color: #1c1917; font-size: 15px; font-weight: 800; line-height: 1.3; }
.ksp-bk-pro__role { color: #ec003f; font-size: 11.5px; font-weight: 700; line-height: 1.35; }
.ksp-bk-pro__sub { color: #a8a29e; font-size: 11px; line-height: 1.4; }
.ksp-bk-pro--any .ksp-bk-pro__sub { color: #78716c; font-size: 11.5px; }
.ksp-bk-pro__unfit { color: #b45309; font-size: 11px; font-weight: 600; }
/* İzin rozeti (BookingCatalog::leave): "Bugün izinli · Yıllık İzin · 30 Eylül'e kadar"; aralık boyunca izinliyse kart kapalı (.is-leave) */
.ksp-bk-pro__leave { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; margin-top: 4px; padding: 2px 8px; border-radius: 999px; background: #fff1f2; color: #be123c; font-size: 11px; font-weight: 600; line-height: 1.5; }
.ksp-bk-pro__leave .material-symbols-rounded { font-size: 14px; }
.ksp-bk-pro.is-leave { opacity: .7; }
.ksp-bk-empty { display: flex; align-items: flex-start; gap: 8px; margin: 14px 0 0; padding: 12px 14px; border-radius: 12px; background: #f5f5f4; color: #57534e; font-size: 13px; line-height: 1.5; }
.ksp-bk-empty[hidden] { display: none; }
.ksp-bk-empty--top { margin: 0 0 14px; border: 1px solid #fde68a; background: #fffbeb; color: #92400e; }
.ksp-bk-empty--top .material-symbols-rounded { color: #d97706; }
.ksp-bk-empty .material-symbols-rounded { font-size: 19px; color: #a8a29e; }
.ksp-bk-retry { margin-inline-start: auto; padding: 4px 12px; border: 1px solid #d6d3d1; border-radius: 8px; background: #fff; color: #1c1917; font-size: 12.5px; font-weight: 700; }

/* (3) Tarih şeridi + saat ızgarası */
.ksp-bk-label { margin: 0 0 10px; color: #78716c; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.ksp-bk-dates { display: flex; gap: 8px; margin-bottom: 20px; padding-bottom: 8px; overflow-x: auto; scrollbar-width: thin; scrollbar-color: #a8a29e transparent; }
.ksp-bk-date { flex: 0 0 70px; height: 70px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; padding: 0; border: 1px solid #e7e5e4; border-radius: 10px; background: #fff; color: #1c1917; transition: border-color .15s, background .15s; }
.ksp-bk-date:hover:not(:disabled) { border-color: #d6d3d1; }
.ksp-bk-date__dow { color: #57534e; font-size: 10.5px; font-weight: 700; letter-spacing: .02em; }
.ksp-bk-date__day { font-size: 16px; font-weight: 800; line-height: 1.2; }
.ksp-bk-date__mon { color: #78716c; font-size: 10px; }
.ksp-bk-date.is-active { border-color: #ec003f; background: #ec003f; color: #fff; }
.ksp-bk-date.is-active .ksp-bk-date__dow, .ksp-bk-date.is-active .ksp-bk-date__mon { color: #fff; }
.ksp-bk-date.is-full { background: #fafaf9; color: #a8a29e; cursor: not-allowed; }
.ksp-bk-date.is-full .ksp-bk-date__dow, .ksp-bk-date.is-full .ksp-bk-date__mon { color: #a8a29e; }
.ksp-bk-date.is-leave { border-color: #fecdd3; background: #fff1f2; }
.ksp-bk-date.is-leave .ksp-bk-date__mon { color: #be123c; font-weight: 600; }
.ksp-bk-slots { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.ksp-bk-slots:empty { display: none; }
.ksp-bk-slot { height: 34px; padding: 0; border: 1px solid #e7e5e4; border-radius: 10px; background: #fff; color: #1c1917; font-size: 13.5px; font-weight: 600; font-variant-numeric: tabular-nums; transition: border-color .15s, background .15s; }
.ksp-bk-slot:hover { border-color: #d6d3d1; }
.ksp-bk-slot.is-active { border-color: #ec003f; background: #ec003f; color: #fff; }
.ksp-bk-date:focus-visible, .ksp-bk-slot:focus-visible { outline: 2px solid #ec003f; outline-offset: 2px; }

/* (4) İletişim formu + özet */
.ksp-bk-form { margin: 0; }
.ksp-bk-flabel { display: block; margin: 0 0 7px; color: #292524; font-size: 12.5px; font-weight: 700; }
.ksp-bk-flabel:not(:first-child) { margin-top: 16px; }
.ksp-bk-field { display: flex; align-items: center; gap: 10px; height: 42px; padding: 0 14px; border: 1px solid #e7e5e4; border-radius: 10px; background: #fafaf9; transition: border-color .15s, box-shadow .15s; }
.ksp-bk-field .material-symbols-rounded { font-size: 19px; color: #a8a29e; }
.ksp-bk-field input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: #1c1917; font: inherit; font-size: 13.5px; }
/* Faz H: indirim kuponu seçici — aynı alan kutusunun içinde, ok işareti tarayıcıdan */
.ksp-bk-field .ksp-bk-select { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: #1c1917; font: inherit; font-size: 13.5px; }
.ksp-bk-field:focus-within, .ksp-bk-note:focus { border-color: #ec003f; box-shadow: 0 0 0 3px rgba(236, 0, 63, .12); }
.ksp-bk-field:has(input[aria-invalid="true"]), .ksp-bk-note[aria-invalid="true"] { border-color: #e11d48; }
.ksp-bk-field input::placeholder, .ksp-bk-note::placeholder { color: #a8a29e; }
.ksp-bk-note { display: block; width: 100%; min-height: 58px; padding: 10px 14px; border: 1px solid #e7e5e4; border-radius: 10px; background: #fafaf9; color: #1c1917; font: inherit; font-size: 12.5px; resize: vertical; outline: 0; }
.ksp-bk-ferr { display: block; margin-top: 5px; color: #e11d48; font-size: 12px; font-weight: 600; }
.ksp-bk-ferr[hidden] { display: none; }
.ksp-bk-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ksp-bk-policy { display: flex; align-items: flex-start; gap: 6px; margin: 18px 0 0; padding: 10px 12px; border: 1px solid #e7e5e4; border-radius: 12px; background: #fafaf9; color: #57534e; font-size: .8rem; line-height: 1.5; }
.ksp-bk-policy .material-symbols-rounded { font-size: 17px; flex-shrink: 0; margin-top: 1px; color: #a8a29e; }
.ksp-bk-policy--done { margin: 16px auto 0; max-width: 460px; text-align: start; }
:root[data-theme="dark"] .ksp-bk-policy { border-color: #3f3b38; background: #26221f; color: #d6d3d1; }
.ksp-bk-sum { margin: 22px 0 0; padding: 14px 16px 12px; border: 1px solid #e7e5e4; border-radius: 14px; background: #f5f5f4; }
.ksp-bk-sum > div { display: flex; justify-content: space-between; gap: 16px; padding: 3px 0; }
.ksp-bk-sum dt { color: #78716c; font-size: 12px; font-weight: 400; }
.ksp-bk-sum dd { margin: 0; color: #1c1917; font-size: 12.5px; font-weight: 700; text-align: end; }
.ksp-bk-sum > .ksp-bk-sum__total { align-items: center; margin-top: 8px; padding-top: 10px; border-top: 1px solid #d6d3d1; }
.ksp-bk-sum__total dt { color: #1c1917; font-size: 14.5px; font-weight: 800; }
.ksp-bk-sum__total dd { color: #ec003f; font-size: 15px; font-weight: 800; }

/* Alt çubuk: Geri · Toplam Tutar · ileri / onay */
.ksp-bk__foot { display: flex; align-items: center; gap: 16px; padding: 16px 20px 16px 24px; border-top: 1px solid #e7e5e4; background: #fff; }
.ksp-bk-back { display: inline-flex; align-items: center; gap: 6px; padding: 6px 8px 6px 2px; border: 0; background: none; color: #292524; font-size: 13.5px; font-weight: 600; }
.ksp-bk-back .material-symbols-rounded { font-size: 20px; }
.ksp-bk-back:hover { color: #ec003f; }
.ksp-bk-total { display: flex; flex-direction: column; align-items: flex-end; margin-inline-start: auto; line-height: 1.2; }
.ksp-bk-total small { color: #57534e; font-size: 10.5px; font-weight: 600; }
.ksp-bk-total strong { color: #1c1917; font-size: 16px; font-weight: 800; }
.ksp-bk-next { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 38px; margin-inline-start: auto; padding: 0 14px 0 20px; border: 0; border-radius: 10px; background: #ec003f; color: #fff; font-size: 13.5px; font-weight: 800; white-space: nowrap; box-shadow: 0 8px 18px -10px rgba(236, 0, 63, .6); transition: background .15s, opacity .15s; }
.ksp-bk-total:not([hidden]) + .ksp-bk-next { margin-inline-start: 0; }
.ksp-bk-next .material-symbols-rounded { font-size: 19px; }
.ksp-bk-next:hover:not(:disabled) { background: #d00037; }
.ksp-bk-next:disabled { background: #f2799a; box-shadow: none; cursor: not-allowed; }
.ksp-bk-next__lead { display: none; }
.ksp-bk-next.is-confirm { padding: 0 20px 0 16px; background: #059669; box-shadow: 0 8px 18px -10px rgba(5, 150, 105, .6); }
.ksp-bk-next.is-confirm:hover:not(:disabled) { background: #047857; }
.ksp-bk-next.is-confirm:disabled { background: #6fc3a6; }
.ksp-bk-next.is-confirm .ksp-bk-next__lead { display: inline-block; font-size: 18px; }
.ksp-bk-next.is-confirm .ksp-bk-next__trail { display: none; }
.ksp-bk-back[hidden], .ksp-bk-total[hidden] { display: none; }

/* Başarı: onay + koyu bilet */
.ksp-bk.is-done .ksp-bk-steps, .ksp-bk.is-done .ksp-bk__foot { display: none; }
.ksp-bk.is-done .ksp-bk__body { padding: 40px 24px 40px; }
.ksp-bk-done:not([hidden]) { display: flex; flex-direction: column; align-items: center; text-align: center; }
.ksp-bk-done__ok { width: 64px; height: 64px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 50%; background: #d1fae5; color: #059669; }
.ksp-bk-done__ok .material-symbols-rounded { font-size: 30px; }
.ksp-bk-done__pill { padding: 4px 12px; border: 1px solid #a7f3d0; border-radius: 999px; background: #ecfdf5; color: #047857; font-size: 11.5px; font-weight: 800; }
.ksp-bk-done__title { margin: 12px 0 6px; color: #1c1917; font-size: 22px; font-weight: 800; letter-spacing: -.02em; outline: 0; }
.ksp-bk-done__lead { margin: 0 0 22px; color: #78716c; font-size: 12.5px; }
.ksp-bk-ticket { width: 100%; max-width: 448px; padding: 18px 20px 18px; border-radius: 16px; background: #1f1b19; color: #fff; text-align: start; box-shadow: 0 22px 40px -20px rgba(28, 25, 23, .7); }
.ksp-bk-ticket__top { display: flex; justify-content: space-between; gap: 16px; padding-bottom: 12px; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.ksp-bk-ticket__top small { display: block; margin-bottom: 2px; color: #a8a29e; font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.ksp-bk-ticket__code { color: #ff4d7a; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 16px; font-weight: 800; letter-spacing: .12em; }
.ksp-bk-ticket__amount { text-align: end; }
.ksp-bk-ticket__amount strong { color: #34d399; font-size: 16px; font-weight: 800; }
.ksp-bk-ticket__rows { margin: 12px 0 0; }
.ksp-bk-ticket__rows > div { display: flex; justify-content: space-between; gap: 16px; padding: 2px 0; }
.ksp-bk-ticket__rows dt { color: #a8a29e; font-size: 12px; font-weight: 400; white-space: nowrap; }
.ksp-bk-ticket__rows dd { margin: 0; color: #fff; font-size: 12.5px; font-weight: 700; text-align: end; }
.ksp-bk-ticket__rows dd.is-when { color: #facc15; }
/* Uzman kart ödemesi alanı (KARARLAR §67): biletin altında, aynı genişlikte; "Kartla Öde" tam genişlik */
/* Koyu temada "Kartla Öde" zeminle aynı renkte kalıyordu (--ink düğmesiyle aynı ters çevirme) */
.ksp-bk-done__acts { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 28px; }
.ksp-bk-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 22px; border: 0; border-radius: 10px; font-size: 13px; font-weight: 800; white-space: nowrap; text-decoration: none; transition: background .15s; }
.ksp-bk-btn[hidden] { display: none; }
.ksp-bk-btn--wa { background: #059669; color: #fff; }
.ksp-bk-btn--wa:hover { background: #047857; color: #fff; }
.ksp-bk-btn--wa .bi { font-size: 15px; }
.ksp-bk-btn--ink { background: #1c1917; color: #fff; }
.ksp-bk-btn--ink:hover { background: #44403c; color: #fff; }

/* Koyu tema */
[data-bs-theme="dark"] .ksp-bk .modal-content, [data-bs-theme="dark"] .ksp-bk__foot { background: var(--ksp-surface, #1c1917); color: #fafaf9; }
[data-bs-theme="dark"] .ksp-bk-steps { background: rgba(255, 255, 255, .03); border-color: rgba(255, 255, 255, .1); }
[data-bs-theme="dark"] .ksp-bk-step, [data-bs-theme="dark"] .ksp-bk-step.is-active .ksp-bk-step__label, [data-bs-theme="dark"] .ksp-bk-title,
[data-bs-theme="dark"] .ksp-bk-svc__name, [data-bs-theme="dark"] .ksp-bk-svc__price, [data-bs-theme="dark"] .ksp-bk-pro__name, [data-bs-theme="dark"] .ksp-bk-date,
[data-bs-theme="dark"] .ksp-bk-slot, [data-bs-theme="dark"] .ksp-bk-flabel, [data-bs-theme="dark"] .ksp-bk-sum dd, [data-bs-theme="dark"] .ksp-bk-sum__total dt,
[data-bs-theme="dark"] .ksp-bk-back, [data-bs-theme="dark"] .ksp-bk-total strong, [data-bs-theme="dark"] .ksp-bk-done__title, [data-bs-theme="dark"] .ksp-bk-field input,
[data-bs-theme="dark"] .ksp-bk-note { color: #fafaf9; }
[data-bs-theme="dark"] .ksp-bk-step__n { background: rgba(255, 255, 255, .12); color: #e7e5e4; }
[data-bs-theme="dark"] .ksp-bk-svc, [data-bs-theme="dark"] .ksp-bk-pro, [data-bs-theme="dark"] .ksp-bk-date, [data-bs-theme="dark"] .ksp-bk-slot,
[data-bs-theme="dark"] .ksp-bk-field, [data-bs-theme="dark"] .ksp-bk-note, [data-bs-theme="dark"] .ksp-bk-sum, [data-bs-theme="dark"] .ksp-bk-empty,
[data-bs-theme="dark"] .ksp-bk-svc__box { border-color: rgba(255, 255, 255, .12); background: rgba(255, 255, 255, .04); }
[data-bs-theme="dark"] .ksp-bk-svc.is-selected, [data-bs-theme="dark"] .ksp-bk-pro.is-selected { border-color: #ff4d7a; background: rgba(236, 0, 63, .14); }
[data-bs-theme="dark"] .ksp-bk-date.is-active, [data-bs-theme="dark"] .ksp-bk-slot.is-active { border-color: #ec003f; background: #ec003f; }
[data-bs-theme="dark"] .ksp-bk-date__dow, [data-bs-theme="dark"] .ksp-bk-empty { color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-bk__foot, [data-bs-theme="dark"] .ksp-bk-sum > .ksp-bk-sum__total { border-color: rgba(255, 255, 255, .1); }
[data-bs-theme="dark"] .ksp-bk-total small { color: #a8a29e; }
[data-bs-theme="dark"] .ksp-bk-ticket { background: #0c0a09; box-shadow: 0 0 0 1px rgba(255, 255, 255, .08); }
[data-bs-theme="dark"] .ksp-bk-btn--ink { background: #fafaf9; color: #1c1917; }
[data-bs-theme="dark"] .ksp-bk-empty--top { border-color: rgba(217, 119, 6, .35); background: rgba(217, 119, 6, .12); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-bk-pro__leave { background: rgba(244, 63, 94, .16); color: #fda4af; }
[data-bs-theme="dark"] .ksp-bk-date.is-leave { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .1); }
[data-bs-theme="dark"] .ksp-bk-date.is-leave .ksp-bk-date__mon { color: #fda4af; }
[data-bs-theme="dark"] .ksp-bk-pro__ico, [data-bs-theme="dark"] .ksp-bk-pro__ava { background: rgba(255, 255, 255, .08); }
[data-bs-theme="dark"] .ksp-bk-pro__ava { color: #e7e5e4; }

/* Telefon: tam ekran; adım şeridinde yalnız etkin adımın adı; uzmanlar tek sütun; saatler 4 sütun */
@media (max-width: 575.98px) {
  .ksp-bk .modal-content { border-radius: 0; }
  .ksp-bk__head { padding: 14px 16px; }
  .ksp-bk-steps { gap: 6px; padding: 10px 16px; }
  .ksp-bk-step:not(.is-active) .ksp-bk-step__label { display: none; }
  .ksp-bk-steps__line { max-width: none; }
  .ksp-bk__body { padding: 20px 16px; }
  .ksp-bk-svcs, .ksp-bk-pros { max-height: none; margin-inline-end: 0; padding-inline-end: 0; overflow: visible; }
  .ksp-bk-pros { grid-template-columns: minmax(0, 1fr); }
  .ksp-bk-pro { min-height: 80px; }
  .ksp-bk-svc { padding: 12px 14px; gap: 12px; }
  .ksp-bk-date { flex-basis: 62px; height: 66px; }
  .ksp-bk-slots { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ksp-bk-slot { height: 40px; }
  .ksp-bk__foot { gap: 10px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); }
  .ksp-bk-next { padding: 0 12px 0 16px; }
  .ksp-bk-done__acts { flex-direction: column; align-self: stretch; }
  .ksp-bk-btn { width: 100%; }
}

/* @salon-randevu: SMS doğrulaması (Services\Booking\BookingOtp) — 4. adımda kod kartı; iletişim alanları gizlenir, özet kalır */
.ksp-bk-fields[hidden], .ksp-bk-otp[hidden], .ksp-bk-otp__dev[hidden] { display: none; }
.ksp-bk-otp { display: flex; gap: 14px; padding: 16px; border: 1px solid #fecdd3; border-radius: 14px; background: #fff5f7; }
.ksp-bk-otp__ico { flex-shrink: 0; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #ec003f; color: #fff; }
.ksp-bk-otp__ico .material-symbols-rounded { font-size: 22px; }
.ksp-bk-otp__body { flex: 1; min-width: 0; }
.ksp-bk-otp__title { display: block; color: #1c1917; font-size: 15px; font-weight: 800; outline: 0; }
.ksp-bk-otp__sent { margin: 3px 0 0; color: #292524; font-size: 12.5px; font-weight: 600; }
.ksp-bk-otp__lead { margin: 2px 0 12px; color: #78716c; font-size: 12px; line-height: 1.5; }
.ksp-bk-code { display: block; width: 100%; max-width: 240px; height: 48px; padding: 0 14px; border: 1px solid #e7e5e4; border-radius: 12px; background: #fff; color: #1c1917; font: inherit; font-size: 22px; font-weight: 800; letter-spacing: .45em; font-variant-numeric: tabular-nums; outline: 0; }
.ksp-bk-code:focus { border-color: #ec003f; box-shadow: 0 0 0 3px rgba(236, 0, 63, .12); }
.ksp-bk-code[aria-invalid="true"] { border-color: #e11d48; }
.ksp-bk-code::placeholder { color: #a8a29e; font-size: 13px; font-weight: 500; letter-spacing: 0; }
.ksp-bk-otp__dev { margin: 8px 0 0; padding: 6px 10px; border-radius: 8px; background: #fef3c7; color: #92400e; font-size: 12px; font-weight: 600; }
.ksp-bk-otp__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin-top: 12px; }
.ksp-bk-link { display: inline-flex; align-items: center; gap: 5px; padding: 4px 0; border: 0; background: none; color: #ec003f; font-size: 12.5px; font-weight: 700; }
.ksp-bk-link .material-symbols-rounded { font-size: 16px; }
.ksp-bk-link:disabled { color: #a8a29e; cursor: not-allowed; }
.ksp-bk-link--muted { color: #57534e; }
.ksp-bk-otp__timer { color: #78716c; font-size: 12px; font-variant-numeric: tabular-nums; }
[data-bs-theme="dark"] .ksp-bk-otp { border-color: rgba(236, 0, 63, .35); background: rgba(236, 0, 63, .1); }
[data-bs-theme="dark"] .ksp-bk-otp__title, [data-bs-theme="dark"] .ksp-bk-otp__sent { color: #fafaf9; }
[data-bs-theme="dark"] .ksp-bk-code { border-color: rgba(255, 255, 255, .12); background: rgba(255, 255, 255, .04); color: #fafaf9; }
[data-bs-theme="dark"] .ksp-bk-link--muted { color: #d6d3d1; }
@media (max-width: 575.98px) {
  .ksp-bk-otp { gap: 12px; padding: 14px; }
  .ksp-bk-otp__ico { width: 36px; height: 36px; }
  .ksp-bk-code { max-width: none; }
}

/* @kokpit-hatirlatma — Salon Kokpiti > Bildirimler: "Otomatik WhatsApp & SMS Hatırlatma Merkezi" (views/panels/tenant/reminders.php +
   partials/reminder-*, app.js "@kokpit-hatirlatma"). Kullanıcı referans tasarımı birebir (2026-09-19). Önek .ksp-rm-; açık / koyu tema.
   ≥ 992 px iki eşit sütun (sol kuyruk + gönderilmiş, sağ şablon düzenleyici); altında tek sütun, önce kuyruk. Dosya sonuna EKLENİR. */
.ksp-rm { --rm-green: #059669; --rm-green-d: #047857; --rm-green-bg: #ecfdf5; --rm-amber: #f59e0b; --rm-rose: #e11d48; --rm-rose-bg: #fff1f2;
  --rm-soft: #fafaf9; --rm-line: #f0eeec; --rm-ink2: #44403c; --rm-ink3: #57534e; --rm-faint: #a8a29e;
  --rm-mono: ui-monospace, SFMono-Regular, "Cascadia Mono", Menlo, Consolas, monospace;
  display: flex; flex-direction: column; gap: 16px; }
[data-bs-theme="dark"] .ksp-rm { --rm-green: #10b981; --rm-green-d: #059669; --rm-green-bg: rgba(16, 185, 129, .14); --rm-rose: #fb7185; --rm-rose-bg: rgba(244, 63, 94, .14);
  --rm-soft: rgba(255, 255, 255, .03); --rm-line: rgba(255, 255, 255, .06); --rm-ink2: #d6d3d1; --rm-ink3: #a8a29e; --rm-faint: #78716c; }
.ksp-rm-card { min-width: 0; padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); box-shadow: 0 1px 2px rgba(28, 25, 23, .03); }
.ksp-rm-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; }
.ksp-rm-col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
/* Referansta iki sütun eşit (ölçüm 397 / 396 px): %45'te kart alt satırı (rozetler + iki düğme) ikiye bölünüyordu */
@media (min-width: 992px) { .ksp-rm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ksp-rm-ico--amber { color: var(--rm-amber); }
.ksp-rm-ico--green { color: var(--rm-green); }
.ksp-rm-ico--rose { color: var(--rm-rose); }
.ksp-rm-fill { font-variation-settings: 'FILL' 1; }
.ksp-rm.is-js [data-rm-nojs] { display: none; }

/* Düğmeler */
.ksp-rm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 32px; padding: 0 11px; border: 1px solid transparent; border-radius: 8px; font-family: inherit; font-size: 12px; font-weight: 700; line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer; transition: background-color .15s, border-color .15s, color .15s, opacity .15s; }
.ksp-rm-btn .material-symbols-rounded { font-size: 16px; }
.ksp-rm-btn .bi { font-size: 12.5px; line-height: 1; }
.ksp-rm-btn--lg { height: 38px; padding: 0 18px; border-radius: 10px; font-size: 13px; }
.ksp-rm-btn--green, .ksp-rm-btn--wa { background: var(--rm-green); color: #fff; }
.ksp-rm-btn--green:hover, .ksp-rm-btn--wa:hover { background: var(--rm-green-d); color: #fff; }
.ksp-rm-btn--ghost { border-color: var(--ksp-border); background: var(--ksp-surface); color: var(--rm-ink2); font-weight: 500; }
.ksp-rm-btn--ghost:hover { border-color: #d6d3d1; color: var(--ksp-text); }
.ksp-rm-btn--ghost.is-done { border-color: #a7f3d0; color: var(--rm-green); }
.ksp-rm-btn--dark { height: 34px; padding: 0 16px; border-radius: 999px; background: #1c1917; color: #fff; }
.ksp-rm-btn--dark:hover { background: #292524; color: #fff; }
[data-bs-theme="dark"] .ksp-rm-btn--dark { background: #fafaf9; color: #1c1917; }
.ksp-rm-btn:disabled { opacity: .5; cursor: not-allowed; }
.ksp-rm-btn.is-busy { cursor: progress; }
.ksp-rm-btn:focus-visible, .ksp-rm-tab:focus-visible, .ksp-rm-var:focus-visible, .ksp-rm-link:focus-visible, .ksp-rm-status__save:focus-visible { outline: 2px solid var(--rm-green); outline-offset: 2px; }
.ksp-rm-btn-wrap { display: inline-flex; }

/* Üst kart: başlık + toplu gönderim + otomatik SMS durum satırı */
.ksp-rm-head { padding: 18px 22px; }
.ksp-rm-head__row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 20px; }
.ksp-rm-head__id { flex: 1 1 360px; min-width: 0; }
.ksp-rm-head__title { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 18px; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; color: var(--ksp-text); }
.ksp-rm-head__title .ksp-rm-head__ico { font-size: 22px; color: var(--rm-green); }
.ksp-rm-head__lead { margin: 4px 0 0; font-size: 12px; line-height: 1.45; color: var(--ksp-muted); }
.ksp-rm-head__act { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; margin: 0; }
.ksp-rm-head__hint { margin: 0; font-size: 11px; color: var(--ksp-muted); }
.ksp-rm-status { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--rm-line); font-size: 12px; color: var(--rm-ink3); }
.ksp-rm-status__item { display: inline-flex; align-items: center; gap: 5px; }
.ksp-rm-status__item .material-symbols-rounded { font-size: 16px; color: var(--rm-faint); }
.ksp-rm-status__state { font-weight: 700; }
.ksp-rm-status__state.is-on { color: var(--rm-green); }
.ksp-rm-status__state.is-off, .ksp-rm-status__state.is-offline { color: var(--rm-faint); }
.ksp-rm-status__sep { color: #d6d3d1; }
.ksp-rm-status__quota { font-variant-numeric: tabular-nums; }
.ksp-rm-status__quota.is-full { color: #c2410c; font-weight: 700; }
.ksp-rm-toggles { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; margin-inline-start: 4px; }
.ksp-rm-toggle { position: relative; display: inline-flex; align-items: center; gap: 6px; margin: 0; color: var(--rm-ink2); font-weight: 600; cursor: pointer; }
.ksp-rm-toggle input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.ksp-rm-toggle__track { position: relative; width: 28px; height: 16px; flex-shrink: 0; border-radius: 999px; background: #d6d3d1; transition: background-color .15s; }
.ksp-rm-toggle__track::after { content: ""; position: absolute; top: 2px; inset-inline-start: 2px; width: 12px; height: 12px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .2); transition: transform .15s; }
.ksp-rm-toggle input:checked + .ksp-rm-toggle__track { background: var(--rm-green); }
.ksp-rm-toggle input:checked + .ksp-rm-toggle__track::after { transform: translateX(12px); }
[dir="rtl"] .ksp-rm-toggle input:checked + .ksp-rm-toggle__track::after { transform: translateX(-12px); }
.ksp-rm-toggle input:focus-visible + .ksp-rm-toggle__track { outline: 2px solid var(--rm-green); outline-offset: 2px; }
.ksp-rm-toggle input:disabled + .ksp-rm-toggle__track { opacity: .6; }
.ksp-rm-status__save { height: 26px; padding: 0 10px; border: 1px solid var(--ksp-border); border-radius: 7px; background: var(--ksp-surface); color: var(--rm-ink2); font-family: inherit; font-size: 11.5px; font-weight: 700; cursor: pointer; }
.ksp-rm-note { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--rm-ink3); font-size: 11.5px; font-weight: 600; line-height: 1.4; }
.ksp-rm-note .material-symbols-rounded { font-size: 15px; }
.ksp-rm-toggles + .ksp-rm-note { margin-inline-start: auto; }
.ksp-rm-note--info { background: #eff6ff; color: #1d4ed8; }
.ksp-rm-note--warn { background: #fff7ed; color: #c2410c; }

/* Kart başlıkları */
.ksp-rm-card__head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px 12px; margin: 0 0 14px; padding-bottom: 12px; border-bottom: 1px solid var(--rm-line); }
.ksp-rm-card__head--plain { margin-bottom: 12px; padding-bottom: 0; border-bottom: 0; }
.ksp-rm-card__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; font-weight: 800; line-height: 1.3; letter-spacing: .02em; text-transform: uppercase; color: var(--ksp-text); }
.ksp-rm-card__title .material-symbols-rounded { font-size: 19px; }
.ksp-rm-card__hint { font-size: 11.5px; color: var(--rm-faint); }

/* Bekleyen kuyruk kartları */
.ksp-rm-queue__list { display: flex; flex-direction: column; gap: 12px; }
.ksp-rm-item { padding: 14px 16px 12px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--rm-soft); }
.ksp-rm-item.is-busy { opacity: .7; }
.ksp-rm-item__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ksp-rm-item__who { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 8px; min-width: 0; margin: 0; font-size: 13.5px; line-height: 1.4; }
.ksp-rm-item__who strong { font-weight: 700; color: var(--ksp-text); overflow-wrap: anywhere; }
.ksp-rm-item__dot { color: #d6d3d1; font-size: 10px; line-height: 1; }
.ksp-rm-item__phone { color: var(--rm-ink3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.ksp-rm-item__total { flex-shrink: 0; font-size: 14px; font-weight: 800; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-rm-item__when { display: flex; align-items: center; flex-wrap: wrap; gap: 3px 5px; margin: 6px 0 0; font-size: 12px; color: var(--rm-ink3); }
.ksp-rm-item__when .material-symbols-rounded { font-size: 15px; color: var(--rm-faint); }
.ksp-rm-item__when strong { font-weight: 700; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-rm-item__when .ksp-rm-item__dot { margin: 0 3px; }
.ksp-rm-item__staff { color: var(--rm-faint); }
.ksp-rm-item__svc { display: flex; align-items: flex-start; gap: 5px; margin: 5px 0 0; font-size: 12px; line-height: 1.45; color: var(--rm-ink2); }
.ksp-rm-item__svc .material-symbols-rounded { margin-top: 1px; font-size: 15px; color: var(--rm-rose); }
.ksp-rm-item__foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--ksp-border); }
.ksp-rm-item__badges { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.ksp-rm-item__acts { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-inline-start: auto; }
.ksp-rm-item__acts form { display: inline-flex; margin: 0; }
.ksp-rm-badge { display: inline-flex; align-items: center; height: 22px; padding: 0 7px; border: 1px solid var(--ksp-border); border-radius: 6px; background: var(--ksp-surface); color: var(--rm-ink3); font-size: 10.5px; font-weight: 600; white-space: nowrap; }
.ksp-rm-badge--wait { border-color: #fcd34d; background: #fffbeb; color: #b45309; }
.ksp-rm-badge--fail { border-color: #fecdd3; background: #fff1f2; color: #be123c; }
/* Müşteri kanalı kendi panelinden kapattı (Profilim > Bildirim Ayarları; KARARLAR §31) */
.ksp-rm-badge--off { border-color: #e7e5e4; background: #fafaf9; color: #78716c; }
.ksp-rm-queue__more { margin: 12px 0 0; color: var(--ksp-muted); font-size: 11.5px; text-align: center; }
.ksp-rm-empty { display: flex; flex-direction: column; align-items: center; padding: 28px 16px; border: 1px dashed var(--ksp-border); border-radius: 14px; background: var(--rm-soft); text-align: center; }
.ksp-rm-empty__ico { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 10px; border-radius: 14px; background: var(--rm-green-bg); color: var(--rm-green); }
.ksp-rm-empty__ico .material-symbols-rounded { font-size: 24px; }
.ksp-rm-empty__title { margin: 0; font-size: 14px; font-weight: 700; color: var(--ksp-text); }
.ksp-rm-empty__text { max-width: 380px; margin: 4px 0 0; font-size: 12px; line-height: 1.5; color: var(--ksp-muted); }

/* Gönderilmiş hatırlatmalar (kaydırılabilir) */
.ksp-rm-sent__list { display: flex; flex-direction: column; gap: 8px; max-height: 196px; margin: 0; padding: 0; padding-inline-end: 4px; list-style: none; overflow-y: auto; scrollbar-width: thin; }
.ksp-rm-sent__row { display: flex; align-items: center; gap: 8px; flex-shrink: 0; min-height: 36px; padding: 6px 12px; border-radius: 8px; background: var(--rm-soft); font-size: 12.5px; }
.ksp-rm-sent__row.is-new { animation: ksp-rm-in .5s ease; }
@keyframes ksp-rm-in { from { opacity: 0; transform: translateY(-6px); background: var(--rm-green-bg); } }
.ksp-rm-sent__dot { width: 6px; height: 6px; flex-shrink: 0; border-radius: 50%; background: #10b981; }
.ksp-rm-sent__name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; color: var(--ksp-text); }
.ksp-rm-sent__slot { flex-shrink: 0; color: var(--rm-faint); white-space: nowrap; font-variant-numeric: tabular-nums; }
.ksp-rm-sent__at { flex-shrink: 0; margin-inline-start: auto; color: var(--rm-green); font-size: 11px; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ksp-rm-sent__ch { display: inline-flex; flex-shrink: 0; color: var(--rm-green); }
.ksp-rm-sent__ch .bi { font-size: 13px; line-height: 1; }
.ksp-rm-sent__ch .material-symbols-rounded { font-size: 15px; }
.ksp-rm-sent__empty { margin: 0; padding: 14px; border-radius: 10px; background: var(--rm-soft); color: var(--ksp-muted); font-size: 12px; text-align: center; }

/* Şablon düzenleyici: sekmeler, değişken çipleri, metin alanı */
.ksp-rm-editor { padding: 20px 22px 22px; }
.ksp-rm-editor__head { align-items: flex-start; }
.ksp-rm-editor__id { min-width: 0; }
.ksp-rm-editor__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--ksp-text); }
.ksp-rm-editor__title .material-symbols-rounded { font-size: 19px; }
.ksp-rm-editor__lead { margin: 2px 0 0; font-size: 12px; color: var(--rm-faint); }
.ksp-rm-tabs { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 12px; padding: 5px; border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-rm-tab { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 9px; color: var(--rm-ink3); font-size: 12px; font-weight: 600; line-height: 1.3; text-decoration: none; }
.ksp-rm-tab:hover { color: var(--ksp-text); }
.ksp-rm-tab.is-active { background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 1px 3px rgba(28, 25, 23, .1); }
.ksp-rm-tab__dot { width: 6px; height: 6px; flex-shrink: 0; border-radius: 50%; background: var(--rm-amber); }
.ksp-rm-vars { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--rm-soft); }
.ksp-rm-vars__label { margin-inline-end: 2px; color: var(--rm-ink2); font-size: 11.5px; font-weight: 700; }
.ksp-rm-var { padding: 2px 6px; border: 1px solid var(--rm-rose); border-radius: 4px; background: var(--ksp-surface); color: var(--rm-rose); font-family: var(--rm-mono); font-size: 11px; line-height: 1.5; cursor: pointer; }
.ksp-rm-var:hover { background: var(--rm-rose-bg); }
.ksp-rm-textarea { display: block; width: 100%; min-height: 210px; padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-family: var(--rm-mono); font-size: 12.5px; line-height: 1.75; resize: vertical; }
.ksp-rm-textarea:focus { outline: 0; border-color: var(--rm-rose); box-shadow: 0 0 0 3px rgba(225, 29, 72, .12); }
.ksp-rm-field.is-invalid .ksp-rm-textarea { border-color: #e11d48; }
.ksp-rm-field__foot { display: flex; align-items: center; gap: 12px; min-height: 20px; margin-top: 6px; }
.ksp-rm-field__err { flex: 1 1 auto; margin: 0; color: #be123c; font-size: 11.5px; font-weight: 600; }
.ksp-rm-link { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: none; color: var(--rm-ink3); font-family: inherit; font-size: 11.5px; font-weight: 600; cursor: pointer; }
.ksp-rm-link .material-symbols-rounded { font-size: 15px; }
.ksp-rm-link:hover:not(:disabled) { color: var(--rm-rose); }
.ksp-rm-link:disabled { opacity: .45; cursor: default; }
.ksp-rm-field__count { color: var(--rm-faint); font-size: 11px; font-variant-numeric: tabular-nums; }
.ksp-rm-field__count.is-over { color: #be123c; font-weight: 700; }

/* Canlı WhatsApp görünümü (telefon maketi) + sabit SMS notu */
.ksp-rm-preview { margin-top: 18px; }
.ksp-rm-preview__title { display: flex; align-items: center; gap: 6px; margin: 0 0 12px; color: var(--rm-ink2); font-size: 12px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.ksp-rm-preview__title .material-symbols-rounded { font-size: 18px; }
.ksp-rm-phone { max-width: 380px; margin: 0 auto; overflow: hidden; border-radius: 20px; background: #e5ddd5; box-shadow: 0 0 0 1px rgba(28, 25, 23, .05), 0 14px 30px -20px rgba(28, 25, 23, .45); }
.ksp-rm-phone__bar { display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: #075e54; color: #fff; }
.ksp-rm-phone__avatar { width: 36px; height: 36px; flex-shrink: 0; display: grid; place-items: center; overflow: hidden; border-radius: 50%; background: #e11d48; color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .02em; }
.ksp-rm-phone__avatar img { width: 100%; height: 100%; object-fit: cover; }
.ksp-rm-phone__who { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.ksp-rm-phone__who strong { overflow: hidden; font-size: 13.5px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.ksp-rm-phone__who small { color: #a7f3d0; font-size: 11px; font-weight: 500; }
.ksp-rm-phone__chat { min-height: 140px; padding: 14px 16px 18px; }
.ksp-rm-bubble { padding: 12px 14px 6px; border-radius: 12px; background: #fff; color: #111b21; box-shadow: 0 1px .5px rgba(11, 20, 26, .13); }
.ksp-rm-bubble__text { margin: 0; font-size: 12.5px; line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
.ksp-rm-bubble__meta { display: flex; align-items: center; justify-content: flex-end; gap: 3px; margin-top: 4px; color: #8696a0; font-size: 10.5px; font-variant-numeric: tabular-nums; }
.ksp-rm-bubble__meta .material-symbols-rounded { font-size: 15px; color: #53bdeb; }
.ksp-rm-smsnote { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 12px 0 0; color: var(--ksp-muted); font-size: 11.5px; text-align: center; }
.ksp-rm-smsnote .material-symbols-rounded { font-size: 15px; color: var(--rm-faint); }
.ksp-rm-smsdemo { max-width: 380px; margin: 4px auto 0; font-size: 11.5px; }
.ksp-rm-smsdemo summary { width: fit-content; margin: 0 auto; color: var(--rm-ink3); font-weight: 600; cursor: pointer; }
.ksp-rm-smsdemo__text { margin: 8px 0 0; padding: 8px 10px; border: 1px solid var(--ksp-border); border-radius: 8px; background: var(--rm-soft); color: var(--rm-ink2); font-family: var(--rm-mono); font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
@media (prefers-reduced-motion: reduce) {
  .ksp-rm-sent__row.is-new { animation: none; }
  .ksp-rm-toggle__track, .ksp-rm-toggle__track::after { transition: none; }
}
/* Koyu tema */
[data-bs-theme="dark"] .ksp-rm-card { box-shadow: none; }
[data-bs-theme="dark"] .ksp-rm-btn--green, [data-bs-theme="dark"] .ksp-rm-btn--wa { background: #059669; }
[data-bs-theme="dark"] .ksp-rm-btn--green:hover, [data-bs-theme="dark"] .ksp-rm-btn--wa:hover { background: #047857; }
[data-bs-theme="dark"] .ksp-rm-badge--wait { border-color: rgba(217, 119, 6, .35); background: rgba(217, 119, 6, .14); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-rm-badge--fail { border-color: rgba(225, 29, 72, .35); background: rgba(225, 29, 72, .14); color: #fda4af; }
[data-bs-theme="dark"] .ksp-rm-badge--off { border-color: rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .06); color: #a8a29e; }
[data-bs-theme="dark"] .ksp-rm-note--info { background: rgba(59, 130, 246, .14); color: #93c5fd; }
[data-bs-theme="dark"] .ksp-rm-note--warn { background: rgba(234, 88, 12, .14); color: #fdba74; }
[data-bs-theme="dark"] .ksp-rm-status__quota.is-full { color: #fdba74; }
[data-bs-theme="dark"] .ksp-rm-status__sep, [data-bs-theme="dark"] .ksp-rm-item__dot { color: #57534e; }
[data-bs-theme="dark"] .ksp-rm-toggle__track { background: #57534e; }
[data-bs-theme="dark"] .ksp-rm-btn--ghost:hover { border-color: #57534e; }
[data-bs-theme="dark"] .ksp-rm-btn--ghost.is-done { border-color: rgba(16, 185, 129, .4); }
[data-bs-theme="dark"] .ksp-rm-field__err, [data-bs-theme="dark"] .ksp-rm-field__count.is-over { color: #fda4af; }
[data-bs-theme="dark"] .ksp-rm-phone { background: #0b141a; box-shadow: 0 0 0 1px rgba(255, 255, 255, .06); }
[data-bs-theme="dark"] .ksp-rm-phone__bar { background: #1f2c34; }
[data-bs-theme="dark"] .ksp-rm-bubble { background: #202c33; color: #e9edef; }
/* Telefon: kartlar kenara yaklaşır, toplu gönderim ve kart düğmeleri tam genişlik, gönderilmiş satırı iki satıra iner */
@media (max-width: 575.98px) {
  .ksp-rm-card, .ksp-rm-head, .ksp-rm-editor { padding: 16px 14px; border-radius: 16px; }
  .ksp-rm-head__title { font-size: 16px; align-items: flex-start; }
  .ksp-rm-head__act { align-items: stretch; width: 100%; }
  .ksp-rm-btn--lg { height: auto; min-height: 40px; padding: 8px 14px; white-space: normal; text-align: center; }
  .ksp-rm-head__hint { text-align: center; }
  .ksp-rm-toggles + .ksp-rm-note { margin-inline-start: 0; }
  .ksp-rm-item { padding: 12px; }
  .ksp-rm-item__acts { width: 100%; }
  .ksp-rm-item__acts > *, .ksp-rm-item__acts .ksp-rm-btn-wrap { flex: 1 1 0; }
  .ksp-rm-item__acts .ksp-rm-btn { width: 100%; }
  .ksp-rm-sent__row { flex-wrap: wrap; row-gap: 2px; }
  .ksp-rm-sent__ch { margin-inline-start: auto; }
  .ksp-rm-sent__at { order: 5; flex-basis: 100%; margin-inline-start: 0; padding-inline-start: 14px; }
  .ksp-rm-tab { flex: 1 1 auto; justify-content: center; text-align: center; }
  .ksp-rm-phone__chat { padding: 12px; }
}

/* ==========================================================================
   @musteri-pin — Kokpit > Müşteriler 4 haneli PIN kilidi (sahip kararları 2026-09-19).
   views/panels/tenant/customer-pin.php (kilit ekranı: aç / sıfırla / kurulum / bilgi) + customer-pin-settings.php
   + partials/pin-*.php; başlık düğmeleri partials/customers-header.php; JS app.js "@musteri-pin".
   Referans 50.png kart dili: beyaz kart, yumuşak kenar, gül vurgu, siyah birincil düğme. Yazılar eğik değil.
   ========================================================================== */
.ksp-pin {
  --pin-rose: #e11d48; --pin-rose-ink: #be123c; --pin-rose-bg: #fff1f2; --pin-rose-line: #fecdd3;
  --pin-ink2: #44403c; --pin-soft: #57534e; --pin-line: #f0efee; --pin-box: #fafaf9;
  --pin-btn: #1c1917; --pin-btn-hover: #292524; --pin-btn-ink: #fff;
  --pin-hero: linear-gradient(180deg, #fff5f7 0%, rgba(255, 245, 247, 0) 100%);
  display: flex; justify-content: center; padding: 28px 0 36px;
}
[data-bs-theme="dark"] .ksp-pin {
  --pin-rose: #fb7185; --pin-rose-ink: #fda4af; --pin-rose-bg: rgba(244, 63, 94, .12); --pin-rose-line: rgba(244, 63, 94, .32);
  --pin-ink2: #e7e5e4; --pin-soft: #d6d3d1; --pin-line: rgba(255, 255, 255, .07); --pin-box: #292524;
  --pin-btn: #fafaf9; --pin-btn-hover: #e7e5e4; --pin-btn-ink: #1c1917;
  --pin-hero: linear-gradient(180deg, rgba(244, 63, 94, .13) 0%, rgba(244, 63, 94, 0) 100%);
}
.ksp-pin [hidden] { display: none !important; }
.ksp-pin-card { position: relative; width: 100%; max-width: 440px; padding: 32px 32px 26px; overflow: hidden; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface) var(--pin-hero) no-repeat; background-size: 100% 150px; box-shadow: 0 18px 40px -26px rgba(28, 25, 23, .35); text-align: center; }
.ksp-pin-card--setup { max-width: 480px; }
.ksp-pin-badge { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto 14px; border-radius: 18px; background: linear-gradient(135deg, #ff2056 0%, #e11d48 100%); color: #fff; box-shadow: 0 14px 26px -14px rgba(225, 29, 72, .85); }
.ksp-pin-badge .material-symbols-rounded { font-size: 30px; }
.ksp-pin-badge--muted { background: var(--ksp-surface-2); color: var(--pin-soft); box-shadow: none; }
.ksp-pin-title { margin: 0; color: var(--ksp-text); font-size: 20px; font-weight: 800; letter-spacing: 0; line-height: 1.3; }
.ksp-pin-lead { max-width: 370px; margin: 6px auto 0; color: var(--ksp-muted); font-size: 13px; line-height: 1.55; }

/* Form, etiket, alan */
.ksp-pin-form { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; text-align: start; }
.ksp-pin-label, .ksp-pin-digits > legend.ksp-pin-label { display: block; float: none; width: auto; margin: 0 0 6px; padding: 0; color: var(--pin-ink2); font-size: 13px; font-weight: 600; line-height: 1.4; }
.ksp-pin-form > .ksp-pin-label { margin-bottom: -4px; }
.ksp-pin-digits { min-width: 0; margin: 0; padding: 0; border: 0; }
.ksp-pin-digits__row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.ksp-pin-digit { width: 100%; height: 56px; padding: 0; border: 1.5px solid var(--ksp-border); border-radius: 14px; background: var(--pin-box); color: var(--ksp-text); caret-color: var(--pin-rose); font-family: inherit; font-size: 26px; font-weight: 800; line-height: 1; text-align: center; -webkit-text-security: disc; transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease; }
.ksp-pin-digit:focus { border-color: #fb7185; outline: 0; background: var(--ksp-surface); box-shadow: 0 0 0 4px rgba(225, 29, 72, .12); }
.ksp-pin-digit:valid { border-color: var(--pin-rose-line); background: var(--pin-rose-bg); } /* dolu kutu (required + tek rakam) */
.ksp-pin-digits.is-invalid .ksp-pin-digit { border-color: var(--pin-rose); }
.ksp-pin-digits.is-shake .ksp-pin-digits__row { animation: ksp-pin-shake .45s cubic-bezier(.36, .07, .19, .97) both; }
@keyframes ksp-pin-shake {
  10%, 90% { transform: translateX(-1px); }
  20%, 80% { transform: translateX(3px); }
  30%, 50%, 70% { transform: translateX(-6px); }
  40%, 60% { transform: translateX(6px); }
}
/* Kilit aç: ortalanmış dar kutu sırası, etiket yalnız ekran okuyucuya */
.ksp-pin-digits[data-pin-auto] .ksp-pin-digits__row { max-width: 272px; margin: 0 auto; gap: 12px; }
.ksp-pin-digits[data-pin-auto] .ksp-pin-digit { height: 64px; font-size: 28px; }
.ksp-pin-digits[data-pin-auto] > legend.ksp-pin-label { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ksp-pin-input { width: 100%; height: 44px; padding: 0 14px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: 15px; }
.ksp-pin-input::placeholder { color: #a8a29e; }
.ksp-pin-input:focus { border-color: #fb7185; outline: 0; box-shadow: 0 0 0 4px rgba(225, 29, 72, .12); }
.ksp-pin-input--code { height: 52px; padding-inline-start: calc(14px + .45em); font-size: 22px; font-weight: 800; letter-spacing: .45em; text-align: center; font-variant-numeric: tabular-nums; }
.ksp-pin-input--code::placeholder { letter-spacing: normal; }
.ksp-pin-input.is-invalid { border-color: var(--pin-rose); }
.ksp-pin-help { margin: 0; color: var(--ksp-muted); font-size: 12px; line-height: 1.5; }
.ksp-pin-msg { margin: 0; color: var(--pin-rose); font-size: 13px; font-weight: 600; line-height: 1.45; text-align: center; }
.ksp-pin-msg:empty { display: none; }
.ksp-pin-wait { margin: 0; padding: 9px 12px; border: 1px solid var(--pin-rose-line); border-radius: 10px; background: var(--pin-rose-bg); color: var(--pin-rose-ink); font-size: 13px; font-weight: 600; line-height: 1.5; text-align: center; }
.ksp-pin-wait .material-symbols-rounded { margin-inline-end: 4px; font-size: 18px; vertical-align: -4px; }
.ksp-pin-wait b { font-variant-numeric: tabular-nums; font-weight: 800; }

/* Düğmeler / bağlantılar */
.ksp-pin-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 100%; height: 46px; margin-top: 4px; padding: 0 18px; border: 0; border-radius: 12px; background: var(--pin-btn); color: var(--pin-btn-ink); font-size: 15px; font-weight: 700; transition: background-color .15s ease; }
.ksp-pin-btn:hover, .ksp-pin-btn:focus-visible { background: var(--pin-btn-hover); color: var(--pin-btn-ink); }
.ksp-pin-btn .material-symbols-rounded { font-size: 19px; }
.ksp-pin-btn:disabled, .ksp-pin-btn.is-busy { opacity: .55; pointer-events: none; }
.ksp-pin-btn--ghost { width: auto; margin: 20px auto 0; border: 1px solid var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); }
.ksp-pin-btn--ghost:hover, .ksp-pin-btn--ghost:focus-visible { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-pin-foot { display: flex; justify-content: center; margin-top: 14px; }
.ksp-pin-foot form { margin: 0; }
.ksp-pin-link { display: inline-flex; align-items: center; gap: 4px; padding: 4px 6px; border: 0; border-radius: 8px; background: none; color: var(--pin-rose); font-size: 13px; font-weight: 700; }
.ksp-pin-link:hover, .ksp-pin-link:focus-visible { color: var(--pin-rose-ink); text-decoration: underline; }
.ksp-pin-link:disabled { color: var(--ksp-muted); text-decoration: none; cursor: default; }
.ksp-pin-link--muted { color: var(--pin-soft); }
.ksp-pin-link .material-symbols-rounded { font-size: 17px; }
.ksp-pin-hint { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 8px 12px; border-radius: 10px; background: var(--ksp-surface-2); color: var(--pin-soft); font-size: 13px; font-weight: 600; text-align: start; }
.ksp-pin-hint .material-symbols-rounded { font-size: 18px; color: var(--pin-rose); }
.ksp-pin-note { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 20px -32px -26px; padding: 12px 20px; border-top: 1px solid var(--pin-line); background: var(--ksp-surface); color: var(--ksp-muted); font-size: 12px; }
.ksp-pin-note .material-symbols-rounded { font-size: 16px; }
.ksp-pin-note--start { align-items: flex-start; justify-content: flex-start; line-height: 1.5; text-align: start; }
.ksp-pin-note--start .material-symbols-rounded { flex-shrink: 0; margin-top: 1px; }
/* SMS sağlayıcısı yapılandırılmamış: kurulum / sıfırlama / numara değişimi yerine "platform desteğine başvurun" */
.ksp-pin-off { display: flex; align-items: flex-start; gap: 8px; margin: 18px 0 0; padding: 10px 12px; border: 1px solid var(--pin-rose-line); border-radius: 10px; background: var(--pin-rose-bg); color: var(--pin-rose-ink); font-size: 13px; font-weight: 600; line-height: 1.5; text-align: start; }
.ksp-pin-off .material-symbols-rounded { flex-shrink: 0; margin-top: 1px; font-size: 18px; }
.ksp-pin-foot .ksp-pin-hint { max-width: 100%; align-items: flex-start; line-height: 1.5; }
.ksp-pin-foot .ksp-pin-hint .material-symbols-rounded { flex-shrink: 0; margin-top: 1px; }
/* SMS'siz kurulum bilgisi (hata değil, yönlendirme): nötr kutu, amber ikon */
.ksp-pin-off--info { border-color: var(--ksp-border); background: var(--ksp-surface-2); color: var(--pin-ink2); font-weight: 500; }
.ksp-pin-off--info .material-symbols-rounded { color: var(--ksp-warning); }
/* "Kurtarma numarası ekleyin" uyarısı (engellemez) — kilit ekranı + PIN Ayarları */
.ksp-pin-warn { display: flex; align-items: flex-start; gap: 8px; margin: 14px 0 0; padding: 10px 12px; border: 1px solid rgba(245, 158, 11, .45); border-radius: 10px; background: #fffbeb; color: #92400e; font-size: 13px; line-height: 1.5; text-align: start; }
.ksp-pin-warn .material-symbols-rounded { flex-shrink: 0; margin-top: 1px; font-size: 18px; color: var(--ksp-warning); }
.ksp-pin-warn b { font-weight: 800; }
.ksp-pin-warn[hidden] { display: none; }
/* Sert kilit (24 saatte 15 yanlış): PIN kutuları yerine açıklama kartı */
.ksp-pin-badge--alert { background: linear-gradient(135deg, #be123c 0%, #881337 100%); }
.ksp-pin-hard { margin: 18px 0 0; padding: 14px 16px; border: 1px solid var(--pin-rose-line); border-radius: 12px; background: var(--pin-rose-bg); color: var(--pin-ink2); font-size: 13.5px; line-height: 1.6; text-align: start; }
.ksp-pin-hard p { margin: 0; }
.ksp-pin-hard .ksp-pin-hard__note { display: flex; align-items: flex-start; gap: 6px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--pin-rose-line); color: var(--pin-rose-ink); font-size: 12.5px; font-weight: 600; }
.ksp-pin-hard__note .material-symbols-rounded { flex-shrink: 0; margin-top: 1px; font-size: 17px; }
.ksp-pin-hard__act { margin-top: 16px; }
.ksp-pin-hard__act form { margin: 0; }
/* İstemci tarafı 30 dk kilit: kilit ekranına gidilirken müşteri verisi hemen gizlenir (app.js "@musteri-pin") */
.ksp-pin-idle #main, .ksp-pin-idle .modal, .ksp-pin-idle .modal-backdrop { visibility: hidden !important; }

/* SMS adımı: gönderildi kutusu (referanstaki formül kutusu dili), yerel test kodu, tekrar gönder / vazgeç */
.ksp-pin-sent { display: flex; align-items: flex-start; gap: 8px; margin: 18px 0 0; padding: 10px 12px; border: 1px solid var(--pin-rose-line); border-radius: 10px; background: var(--pin-rose-bg); color: var(--pin-ink2); font-size: 13px; line-height: 1.5; text-align: start; }
.ksp-pin-sent .material-symbols-rounded { flex-shrink: 0; margin-top: 1px; color: var(--pin-rose); font-size: 18px; }
.ksp-pin-sent b { color: var(--ksp-text); font-weight: 800; white-space: nowrap; }
.ksp-pin-dev { display: flex; align-items: flex-start; gap: 8px; margin: 8px 0 0; padding: 8px 12px; border: 1px dashed #fcd34d; border-radius: 10px; background: #fffbeb; color: #92400e; font-size: 12px; line-height: 1.5; text-align: start; }
.ksp-pin-dev .material-symbols-rounded { flex-shrink: 0; font-size: 16px; }
.ksp-pin-dev b { font-size: 13px; letter-spacing: .12em; }
.ksp-pin-alt { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.ksp-pin-alt form { margin: 0; }

/* Kurulum adım göstergesi */
.ksp-pin-dots { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 20px 0 0; padding: 0; list-style: none; }
.ksp-pin-dots li { display: flex; align-items: center; gap: 6px; color: var(--ksp-muted); font-size: 12px; font-weight: 600; white-space: nowrap; }
.ksp-pin-dots li + li::before { content: ""; width: 18px; height: 2px; margin-inline-end: 2px; border-radius: 2px; background: var(--ksp-border); }
.ksp-pin-dots__n { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--pin-soft); font-size: 12px; font-weight: 800; }
.ksp-pin-dots__ok { display: none; font-size: 16px; }
.ksp-pin-dots li.is-active { color: var(--ksp-text); }
.ksp-pin-dots li.is-active .ksp-pin-dots__n { background: var(--pin-rose); color: #fff; }
.ksp-pin-dots li.is-done .ksp-pin-dots__n { background: var(--ksp-success-50); color: var(--ksp-success); }
.ksp-pin-dots li.is-done .ksp-pin-dots__num { display: none; }
.ksp-pin-dots li.is-done .ksp-pin-dots__ok { display: inline; }

/* PIN Ayarları sayfası */
.ksp-pin--settings { display: block; padding: 0; }
.ksp-pin-head .ksp-pin-lockform, .ksp-cus-lockform, .ksp-cus-exportform { display: contents; } /* Dışa Aktar POST formu: düğme dizisinde bağlantı gibi durur */
.ksp-pin-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 16px; margin-top: 16px; }
.ksp-pin-panel { padding: 22px 24px 24px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-pin-panel__title { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--pin-rose-ink); font-size: 13px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; }
.ksp-pin-panel__title .material-symbols-rounded { font-size: 19px; color: var(--pin-rose); }
.ksp-pin-panel__lead { margin: 6px 0 0; color: var(--ksp-muted); font-size: 12.5px; line-height: 1.5; }
.ksp-pin-panel .ksp-pin-form { max-width: 400px; margin-top: 16px; }
.ksp-pin-panel .ksp-pin-alt, .ksp-pin-panel .ksp-pin-sent, .ksp-pin-panel .ksp-pin-dev, .ksp-pin-panel .ksp-pin-off { max-width: 400px; }
.ksp-pin-current { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 14px; padding: 10px 12px; border-radius: 10px; background: var(--ksp-surface-2); font-size: 13px; }
.ksp-pin-current__label { color: var(--ksp-muted); font-weight: 600; }
.ksp-pin-current__phone { color: var(--ksp-text); font-weight: 800; letter-spacing: .02em; }
.ksp-pin-current__ok { display: inline-flex; align-items: center; gap: 4px; margin-inline-start: auto; color: var(--ksp-success); font-size: 12px; font-weight: 600; }
.ksp-pin-current__ok .material-symbols-rounded { font-size: 16px; }

/* Müşteriler başlığındaki PIN düğmeleri ayrı grupta — geniş masaüstünde (≥1400) en sağda, daha dar ekranda başlık satırında
   (düğme satırı taşmasın). "PIN Ayarları" tablet / masaüstünde metinli (ikon + yazı), telefonda kare ikon; "Kilitle" kare ikon. */
.ksp-cus-add--icon { width: 36px; padding: 0; flex: 0 0 36px; }
.ksp-cus-add--icon .material-symbols-rounded, .ksp-cus-add--pinset .material-symbols-rounded { font-size: 19px; }
.ksp-cus-add--pinset { gap: 6px; }
.ksp-cus-head__acts { order: 1; }
.ksp-cus-head__pin { display: flex; align-items: center; gap: 8px; order: 2; }
@media (min-width: 1400px) {
  .ksp-cus-head__text { flex: 1 1 280px; } /* tek satır: önce açıklama satırı sarar, düğmeler alt satıra inmez */
}
@media (max-width: 1399.98px) {
  .ksp-cus-head__text { flex: 1 1 0; }
  .ksp-cus-head__pin { order: 0; align-self: flex-start; }
  .ksp-cus-head__pin .ksp-cus-add { flex: 0 0 auto; }
}
@media (min-width: 768px) and (max-width: 1399.98px) {
  .ksp-cus-head__acts { width: 100%; justify-content: flex-end; } /* tablet / dar masaüstü: düğmeler ikinci satırda, sağda */
}
@media (max-width: 767.98px) {
  .ksp-cus-head__pin .ksp-cus-add--pinset { width: 36px; padding: 0; flex: 0 0 36px; }
  .ksp-cus-add--pinset .ksp-cus-add__txt { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* Koyu tema */
[data-bs-theme="dark"] .ksp-pin-card { box-shadow: none; }
[data-bs-theme="dark"] .ksp-pin-dev { border-color: rgba(245, 158, 11, .4); background: rgba(245, 158, 11, .12); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-pin-warn { border-color: rgba(245, 158, 11, .4); background: rgba(245, 158, 11, .12); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-pin-input::placeholder { color: #78716c; }

/* Telefon (390 px): kart kenara yaklaşır, kutular biraz küçülür, ayar kartları tek sütun */
@media (max-width: 575.98px) {
  .ksp-pin { padding: 8px 0 20px; }
  .ksp-pin-card { padding: 24px 18px 20px; }
  .ksp-pin-note { margin: 18px -18px -20px; }
  .ksp-pin-title { font-size: 18px; }
  .ksp-pin-digits[data-pin-auto] .ksp-pin-digit { height: 60px; }
  .ksp-pin-dots { gap: 4px; }
  .ksp-pin-dots li:not(.is-active) .ksp-pin-dots__txt { display: none; }
  .ksp-pin-dots li + li::before { width: 14px; }
  .ksp-pin-grid { grid-template-columns: 1fr; }
  .ksp-pin-panel { padding: 18px 16px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .ksp-pin-digits.is-shake .ksp-pin-digits__row { animation: none; }
  .ksp-pin-digit, .ksp-pin-btn { transition: none; }
}

/* ==========================================================================
   @yonetim — Salon Keşfet Süper Admin paneli UI kiti (/yonetim; sahip kararları 2026-09-19, referans 53–56).
   Kabuk: gruplu sol menü (layouts/panel.php 'group' anahtarı), hub sekme şeridi (panels/admin/partials/hub-tabs.php).
   Ortak sınıflar .ksp-adm-*: sayfa başlığı, segment / hap filtreleri, arama, kart, KPI, iş modeli kartları, il karoları,
   tablo (mobilde karta döner), varlık hücresi, tür rozetleri, durum hapları, düğmeler, boş durum, sayfalama,
   onay penceresi (partials/confirm-modal + app.js "@yonetim"), çekmece, form alanları, bilgi notu, anahtar-değer listesi.
   Renkler .ksp-panel--admin token'larında (açık) + [data-bs-theme="dark"] (koyu). Yazılar eğik değil.
   Dalga 1 ajanları KENDİ alt bloklarını bu bloğun SONUNA ekler: @yonetim-isletmeler, @yonetim-basvuru, @yonetim-gelir.
   ========================================================================== */
/* Karne ekranı kokpitte de admin tasarım kiti ile çizilir (KARARLAR §34): token'lar KOPYALANMAZ,
   aynı tanım kümesine kapsam eklenir — admin bloğunun davranışı hiç değişmez. */
.ksp-panel--admin,
.ksp-panel--cockpit .ksp-kar,
.ksp-panel--cockpit .ksp-kan,
.ksp-panel--cockpit .ksp-kit,
.ksp-panel--cockpit .ksp-log,
.ksp-panel--cockpit .ksp-mag,
.ksp-panel--expert .ksp-log,
.ksp-panel--expert .ksp-mag {
  --adm-bg: #f5f5f4;
  --adm-card: #ffffff;
  --adm-card-2: #fafaf9;
  --adm-line: #e7e5e4;
  --adm-line-2: #f0efee;
  --adm-ink: #1c1917;
  --adm-ink-2: #44403c;
  --adm-soft: #57534e;
  --adm-muted: #78716c;
  --adm-faint: #a8a29e;
  --adm-shadow: 0 1px 2px rgba(28, 25, 23, .04), 0 10px 24px -20px rgba(28, 25, 23, .22);
  --adm-radius: 16px;
  --adm-radius-sm: 12px;
  --adm-btn: #1c1917; --adm-btn-hover: #292524; --adm-btn-ink: #ffffff;
  --adm-success: #009966; --adm-success-hover: #007a55;
  --adm-danger: #e11d48; --adm-danger-hover: #be123c;
  --adm-blue: #2563eb; --adm-blue-bg: #eff6ff; --adm-blue-line: #bfdbfe;
  --adm-amber: #e17100; --adm-amber-ink: #b45309; --adm-amber-bg: #fffbeb; --adm-amber-line: #fde68a;
  --adm-green: #009966; --adm-green-ink: #006045; --adm-green-bg: #ecfdf5; --adm-green-line: #a4f4cf;
  --adm-rose: #ec003f; --adm-rose-ink: #c70036; --adm-rose-bg: #fff1f2; --adm-rose-line: #ffccd3;
  --adm-orange: #ea580c;
  --adm-violet: #7c3aed; --adm-violet-bg: #f5f3ff; --adm-violet-line: #ddd6fe;
  --adm-active: #1c1917; --adm-active-ink: #ffffff; --adm-active-icon: #fbbf24;
  background-color: var(--adm-bg);
}
[data-bs-theme="dark"] .ksp-panel--admin,
[data-bs-theme="dark"] .ksp-panel--cockpit .ksp-kar,
[data-bs-theme="dark"] .ksp-panel--cockpit .ksp-kan,
[data-bs-theme="dark"] .ksp-panel--cockpit .ksp-kit,
[data-bs-theme="dark"] .ksp-panel--cockpit .ksp-log,
[data-bs-theme="dark"] .ksp-panel--cockpit .ksp-mag,
[data-bs-theme="dark"] .ksp-panel--expert .ksp-log {
  --adm-bg: #0c0a09;
  --adm-card: #1c1917;
  --adm-card-2: #232020;
  --adm-line: rgba(255, 255, 255, .09);
  --adm-line-2: rgba(255, 255, 255, .06);
  --adm-ink: #fafaf9;
  --adm-ink-2: #e7e5e4;
  --adm-soft: #d6d3d1;
  --adm-muted: #a8a29e;
  --adm-faint: #78716c;
  --adm-shadow: none;
  --adm-btn: #fafaf9; --adm-btn-hover: #e7e5e4; --adm-btn-ink: #1c1917;
  --adm-blue: #60a5fa; --adm-blue-bg: rgba(59, 130, 246, .14); --adm-blue-line: rgba(59, 130, 246, .35);
  --adm-amber: #fbbf24; --adm-amber-ink: #fcd34d; --adm-amber-bg: rgba(245, 158, 11, .09); --adm-amber-line: rgba(245, 158, 11, .3);
  --adm-green: #34d399; --adm-green-ink: #6ee7b7; --adm-green-bg: rgba(16, 185, 129, .1); --adm-green-line: rgba(16, 185, 129, .3);
  --adm-rose: #fb7185; --adm-rose-ink: #fda4af; --adm-rose-bg: rgba(244, 63, 94, .12); --adm-rose-line: rgba(244, 63, 94, .32);
  --adm-orange: #fb923c;
  --adm-violet: #a78bfa; --adm-violet-bg: rgba(139, 92, 246, .14); --adm-violet-line: rgba(139, 92, 246, .35);
  --adm-active: #fafaf9; --adm-active-ink: #1c1917; --adm-active-icon: #d97706;
}

/* Gruplu sol menü (yalnız 'group' anahtarlı panel: Süper Admin) */
.ksp-sidebar__nav--grouped { gap: 1px; padding: .25rem .75rem 1rem; }
.ksp-sidebar__group { padding: .95rem .8rem .35rem; color: var(--adm-faint, #a8a29e); font-size: .64rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.ksp-sidebar__group:first-child { padding-top: .3rem; }
.ksp-sidebar__nav--grouped a { gap: .6rem; padding: .5rem .7rem; border-radius: 10px; font-size: .84rem; }
.ksp-sidebar__nav--grouped a .material-symbols-rounded { font-size: 20px; }
.ksp-sidebar__nav--grouped a > span:not(.material-symbols-rounded):not(.ksp-sidebar__badge):not(.ksp-sidebar__soon) { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-panel--admin .ksp-sidebar__nav a.active { background: var(--adm-active); color: var(--adm-active-ink); box-shadow: 0 8px 18px -12px rgba(28, 25, 23, .7); }
.ksp-panel--admin .ksp-sidebar__nav a.active .material-symbols-rounded { color: var(--adm-active-icon); }
.ksp-sidebar__badge { display: inline-grid; place-items: center; flex-shrink: 0; min-width: 20px; height: 20px; margin-inline-start: auto; padding: 0 6px; border-radius: 999px; background: #ff2056; color: #fff; font-size: .68rem; font-weight: 800; line-height: 1; }
.ksp-sidebar__soon { flex-shrink: 0; margin-inline-start: auto; padding: 0 6px; border: 1px solid var(--adm-line, #e7e5e4); border-radius: 999px; color: var(--adm-faint, #a8a29e); font-size: .56rem; font-weight: 700; line-height: 1.6; white-space: nowrap; }
.ksp-sidebar__nav a.active .ksp-sidebar__soon { border-color: currentColor; color: inherit; opacity: .7; }
.ksp-panel--admin .ksp-sidebar__foot a, .ksp-panel--admin .ksp-sidebar__foot button { gap: .6rem; padding: .5rem .7rem; border-radius: 10px; font-size: .84rem; }
.ksp-panel--admin .ksp-sidebar__foot .material-symbols-rounded { font-size: 20px; }
.ksp-panel--admin .ksp-sidebar__context { padding-bottom: .5rem; }

/* Hub sekme şeridi kaldırıldı (sahip, 2026-09-20): sayfa tam genişlik, bölümler sol menüde */
.ksp-panel--admin .ksp-panel__content { max-width: none; }

/* Sayfa iskeleti */
.ksp-adm { display: flex; flex-direction: column; gap: 24px; color: var(--adm-ink); }
.ksp-adm-head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 12px 20px; }
.ksp-adm-head__text { min-width: 0; }
.ksp-adm-head__title { margin: 0; color: var(--adm-ink); font-size: 1.3rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.25; }
.ksp-adm-head__sub { display: flex; align-items: center; gap: 6px; margin: 4px 0 0; color: var(--adm-muted); font-size: .8rem; font-weight: 500; }
.ksp-adm-head__sub .material-symbols-rounded { font-size: 16px; }
.ksp-adm-head__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ksp-adm-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); align-items: start; gap: 24px; }
.ksp-adm-grid__aside { min-width: 0; }
.ksp-adm-stack { display: flex; flex-direction: column; gap: 24px; min-width: 0; }

/* Segment (dönem seçici) ve hap filtreleri (referans 54: "Tümü (13)" siyah, diğerleri gri) */
.ksp-adm-seg { display: inline-flex; gap: 2px; max-width: 100%; padding: 3px; overflow-x: auto; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card); scrollbar-width: none; }
.ksp-adm-seg::-webkit-scrollbar { display: none; }
.ksp-adm-seg a, .ksp-adm-seg button { flex-shrink: 0; padding: .4rem .78rem; border: 0; border-radius: 9px; background: none; color: var(--adm-muted); font-family: inherit; font-size: .78rem; font-weight: 700; white-space: nowrap; text-align: center; text-decoration: none; }
.ksp-adm-seg a:hover, .ksp-adm-seg button:hover { color: var(--adm-ink); }
.ksp-adm-seg .is-active, .ksp-adm-seg .is-active:hover { background: var(--adm-active); color: var(--adm-active-ink); }

/* Arama + araç çubuğu kartı (referans 54) */

/* Kart */
.ksp-adm-card { position: relative; min-width: 0; padding: 24px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); box-shadow: var(--adm-shadow); }
.ksp-adm-card--flush { padding: 0; overflow: hidden; }
.ksp-adm-card--warn { border-color: var(--adm-amber-line); background: var(--adm-amber-bg); box-shadow: none; }
.ksp-adm-card__head { margin-bottom: 20px; }
.ksp-adm-card__bar { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px 16px; margin-bottom: 20px; }
.ksp-adm-card--flush > .ksp-adm-card__head, .ksp-adm-card--flush > .ksp-adm-card__bar { margin: 0; padding: 20px 20px 16px; }
.ksp-adm-card__title { margin: 0; color: var(--adm-ink); font-size: 1.05rem; font-weight: 800; letter-spacing: -.015em; line-height: 1.3; }
.ksp-adm-card__sub { margin: 4px 0 0; color: var(--adm-muted); font-size: .78rem; line-height: 1.5; }

/* KPI kartları (referans 53 üst sıra) */
.ksp-adm-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.ksp-adm-kpi { display: flex; flex-direction: column; min-width: 0; padding: 20px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); box-shadow: var(--adm-shadow); }
.ksp-adm-kpi__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ksp-adm-kpi__label { margin: 0; color: var(--adm-ink-2); font-size: .71rem; font-weight: 700; letter-spacing: .025em; line-height: 1.35; text-transform: uppercase; }
.ksp-adm-kpi__icon { display: grid; place-items: center; flex-shrink: 0; width: 36px; height: 36px; border-radius: 10px; }
.ksp-adm-kpi__icon .material-symbols-rounded { font-size: 20px; }
.ksp-adm-kpi__value { margin: 12px 0 0; color: var(--adm-ink); font-size: 1.65rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; font-variant-numeric: tabular-nums; }
.ksp-adm-kpi__value small { color: var(--adm-muted); font-size: .8rem; font-weight: 600; letter-spacing: 0; }
.ksp-adm-kpi__value--amber { color: var(--adm-amber); }
.ksp-adm-kpi__value--green { color: var(--adm-green); }
.ksp-adm-kpi__foot { display: flex; align-items: flex-start; gap: 4px; margin: 8px 0 0; color: var(--adm-muted); font-size: .78rem; font-weight: 600; line-height: 1.4; }
.ksp-adm-kpi__foot > .material-symbols-rounded { flex-shrink: 0; margin-top: 1px; }
.ksp-adm-kpi__foot .material-symbols-rounded { font-size: 16px; }

/* Ton yardımcıları: pastel ikon kareleri + renkli metin */
.ksp-adm-tone--blue { background: var(--adm-blue-bg); color: var(--adm-blue); }
.ksp-adm-tone--amber { background: var(--adm-amber-bg); color: var(--adm-amber); }
.ksp-adm-tone--green { background: var(--adm-green-bg); color: var(--adm-green); }
.ksp-adm-tone--rose { background: var(--adm-rose-bg); color: var(--adm-rose); }
.ksp-adm-tone--violet { background: var(--adm-violet-bg); color: var(--adm-violet); }
.ksp-adm-tone--stone { background: var(--adm-card-2); color: var(--adm-soft); }
.ksp-adm-text--rose { color: var(--adm-rose); }
.ksp-adm-text--amber { color: var(--adm-amber); }
.ksp-adm-text--muted { color: var(--adm-muted); }

/* İş modeli kartları: salon (gri) ↔ adrese VIP uzman (nane) — referans 53 dağılım, referans 56 komisyon (__rate) */
.ksp-adm-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }

/* İl karoları (Bölgesel Ağ) */
.ksp-adm-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
.ksp-adm-tile { display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 0; padding: 16px 12px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius-sm); background: var(--adm-card-2); text-align: center; }
.ksp-adm-tile__name { color: var(--adm-ink-2); font-size: .8rem; font-weight: 600; }
.ksp-adm-tile__value { color: var(--adm-ink); font-size: 1.2rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.3; }
.ksp-adm-tile__sub { max-width: 100%; overflow: hidden; font-size: .68rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }

/* İnceleme Bekleyenler (amber kart) */

/* Düğmeler */
.ksp-adm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 38px; padding: 0 16px; border: 1px solid transparent; border-radius: 10px; background: var(--adm-card); color: var(--adm-ink); font-family: inherit; font-size: .8rem; font-weight: 700; line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.ksp-adm-btn .material-symbols-rounded { font-size: 18px; }
.ksp-adm-btn:focus-visible { outline: 2px solid var(--adm-ink); outline-offset: 2px; }
.ksp-adm-btn:disabled, .ksp-adm-btn.is-busy { opacity: .55; pointer-events: none; }
.ksp-adm-btn--dark { background: var(--adm-btn); color: var(--adm-btn-ink); }
.ksp-adm-btn--dark:hover { background: var(--adm-btn-hover); color: var(--adm-btn-ink); }
.ksp-adm-btn--success { background: var(--adm-success); color: #fff; }
.ksp-adm-btn--success:hover { background: var(--adm-success-hover); color: #fff; }
.ksp-adm-btn--danger { border-color: var(--adm-rose-line); background: var(--adm-card); color: var(--adm-rose); }
.ksp-adm-btn--danger:hover { background: var(--adm-rose-bg); color: var(--adm-rose-ink); }
.ksp-adm-btn--danger-solid { background: var(--adm-danger); color: #fff; }
.ksp-adm-btn--danger-solid:hover { background: var(--adm-danger-hover); color: #fff; }
.ksp-adm-btn--ghost { border-color: var(--adm-line); background: var(--adm-card); color: var(--adm-ink); }
.ksp-adm-btn--ghost:hover { background: var(--adm-card-2); color: var(--adm-ink); }
.ksp-adm-btn--soft { border-color: var(--adm-line); background: var(--adm-bg); color: var(--adm-ink-2); }
.ksp-adm-btn--soft:hover { background: var(--adm-line-2); color: var(--adm-ink); }
.ksp-adm-btn--sm { height: 32px; padding: 0 12px; border-radius: 8px; font-size: .76rem; }
.ksp-adm-btn--xs { height: 26px; padding: 0 12px; border-radius: 7px; font-size: .72rem; }
.ksp-adm-btn--block { display: flex; width: 100%; height: 44px; }
.ksp-adm-btn--icon { width: 38px; padding: 0; }

/* Rozetler (tür & kategori), durum hapları, sayı rozeti */
.ksp-adm-badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border: 1px solid var(--adm-line); border-radius: 7px; background: var(--adm-card-2); color: var(--adm-ink-2); font-size: .7rem; font-weight: 800; line-height: 1.3; white-space: nowrap; }
.ksp-adm-badge .material-symbols-rounded { font-size: 14px; }
.ksp-adm-badge--salon .material-symbols-rounded { color: var(--adm-blue); }
.ksp-adm-badge--expert { border-color: var(--adm-green-line); background: var(--adm-green-bg); color: var(--adm-green-ink); }
.ksp-adm-badge--expert .material-symbols-rounded { color: var(--adm-green); }
.ksp-adm-badge--rose { border-color: var(--adm-rose-line); background: var(--adm-rose-bg); color: var(--adm-rose-ink); }
.ksp-adm-badge--amber { border-color: var(--adm-amber-line); background: var(--adm-amber-bg); color: var(--adm-amber-ink); }
.ksp-adm-badge--blue { border-color: var(--adm-blue-line); background: var(--adm-blue-bg); color: var(--adm-blue); }
.ksp-adm-badge--violet { border-color: var(--adm-violet-line); background: var(--adm-violet-bg); color: var(--adm-violet); }
.ksp-adm-status { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border: 1px solid var(--adm-line); border-radius: 999px; background: var(--adm-card-2); color: var(--adm-muted); font-size: .7rem; font-weight: 800; line-height: 1.2; white-space: nowrap; }
.ksp-adm-status .material-symbols-rounded { font-size: 15px; }
.ksp-adm-status--ok { border-color: var(--adm-green-line); background: var(--adm-green-bg); color: var(--adm-green-ink); }
.ksp-adm-status--wait { border-color: var(--adm-amber-line); background: var(--adm-amber-bg); color: var(--adm-amber-ink); }
.ksp-adm-status--off { border-color: var(--adm-rose-line); background: var(--adm-rose-bg); color: var(--adm-rose-ink); }
.ksp-adm-status--info { border-color: var(--adm-blue-line); background: var(--adm-blue-bg); color: var(--adm-blue); }

/* Tablo (referans 54) — .ksp-adm-table--cards: 768 px altında her satır karta döner (td[data-label] etiketleri, .is-main / .is-wide / .is-actions tam satır) */
.ksp-adm-table-wrap { overflow-x: auto; }
.ksp-adm-table { width: 100%; margin: 0; border-collapse: separate; border-spacing: 0; color: var(--adm-ink); font-size: .82rem; }
.ksp-adm-table thead th { padding: 14px 16px; border-bottom: 1px solid var(--adm-line); background: var(--adm-card-2); color: var(--adm-soft); font-size: .7rem; font-weight: 800; letter-spacing: .05em; text-align: start; text-transform: uppercase; white-space: nowrap; }
.ksp-adm-table tbody td { padding: 14px 16px; border-bottom: 1px solid var(--adm-line-2); vertical-align: middle; }
.ksp-adm-table tbody tr:last-child td { border-bottom: 0; }
.ksp-adm-table tbody tr:hover td { background: var(--adm-card-2); }
.ksp-adm-table tr[data-adm-href] { cursor: pointer; }
.ksp-adm-table .is-end { text-align: end; }
.ksp-adm-table .is-num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.ksp-adm-cell__main { display: block; color: var(--adm-ink); font-weight: 700; }
.ksp-adm-cell__sub { display: block; margin-top: 2px; color: var(--adm-muted); font-size: .74rem; }
.ksp-adm-card--flush > .ksp-adm-pager { border-top: 1px solid var(--adm-line); }

/* Boş durum */
.ksp-adm-empty { display: flex; flex-direction: column; align-items: center; padding: 36px 16px; text-align: center; }
.ksp-adm-empty__icon { display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid var(--adm-line); border-radius: 16px; background: var(--adm-card-2); color: var(--adm-faint); }
.ksp-adm-empty__icon .material-symbols-rounded { font-size: 26px; }
.ksp-adm-empty--ok .ksp-adm-empty__icon { border-color: var(--adm-green-line); background: var(--adm-green-bg); color: var(--adm-green); }
.ksp-adm-empty--warn .ksp-adm-empty__icon { border-color: var(--adm-amber-line); background: var(--adm-amber-bg); color: var(--adm-amber); }
.ksp-adm-empty__title { margin: 14px 0 0; color: var(--adm-ink); font-size: .92rem; font-weight: 800; }
.ksp-adm-empty__text { max-width: 380px; margin: 4px 0 0; color: var(--adm-muted); font-size: .8rem; line-height: 1.55; }
.ksp-adm-empty .ksp-adm-btn { margin-top: 16px; }

/* Sayfalama (partials/pager.php) */
.ksp-adm-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; padding: 14px 16px; }
.ksp-adm-pager__info { margin: 0; color: var(--adm-muted); font-size: .78rem; }
.ksp-adm-pager__info strong { color: var(--adm-ink); }
.ksp-adm-pager__nav { display: flex; align-items: center; gap: 4px; }
.ksp-adm-pager__btn { display: inline-grid; place-items: center; min-width: 34px; height: 34px; padding: 0 8px; border: 1px solid var(--adm-line); border-radius: 9px; background: var(--adm-card); color: var(--adm-ink-2); font-size: .78rem; font-weight: 700; text-decoration: none; }
.ksp-adm-pager__btn:hover { background: var(--adm-card-2); color: var(--adm-ink); }
.ksp-adm-pager__btn.is-active { border-color: var(--adm-active); background: var(--adm-active); color: var(--adm-active-ink); }
.ksp-adm-pager__btn.is-disabled { opacity: .4; }
.ksp-adm-pager__btn .material-symbols-rounded { font-size: 18px; }
.ksp-adm-pager__gap { padding: 0 2px; color: var(--adm-faint); }

/* Onay penceresi (partials/confirm-modal.php) ve çekmece (.offcanvas.ksp-adm-drawer) */
.ksp-adm-modal .modal-content { overflow: hidden; border: 1px solid var(--adm-line); border-radius: 18px; background: var(--adm-card); color: var(--adm-ink); box-shadow: 0 30px 60px -24px rgba(28, 25, 23, .45); }
.ksp-adm-modal__body { padding: 26px 26px 18px; }
.ksp-adm-modal__icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--adm-card-2); color: var(--adm-ink); }
.ksp-adm-modal__icon .material-symbols-rounded { font-size: 24px; }
.ksp-adm-modal[data-tone="success"] .ksp-adm-modal__icon { background: var(--adm-green-bg); color: var(--adm-green); }
.ksp-adm-modal[data-tone="danger"] .ksp-adm-modal__icon { background: var(--adm-rose-bg); color: var(--adm-rose); }
.ksp-adm-modal__title { margin: 16px 0 0; color: var(--adm-ink); font-size: 1.08rem; font-weight: 800; }
.ksp-adm-modal__text { margin: 6px 0 0; color: var(--adm-soft); font-size: .84rem; line-height: 1.6; }
.ksp-adm-modal__reason { display: flex; flex-direction: column; gap: 6px; margin-top: 16px; }
.ksp-adm-modal__reason[hidden] { display: none; }
.ksp-adm-modal__foot { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 26px 22px; }

/* Form alanları, bilgi notu, anahtar-değer listesi */
.ksp-adm-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ksp-adm-label { color: var(--adm-ink-2); font-size: .78rem; font-weight: 700; }
.ksp-adm-input, .ksp-adm-select { width: 100%; min-height: 40px; padding: 9px 12px; border: 1px solid var(--adm-line); border-radius: 10px; background: var(--adm-card); color: var(--adm-ink); font-family: inherit; font-size: .84rem; }
.ksp-adm-input::placeholder { color: var(--adm-faint); }
.ksp-adm-input:focus, .ksp-adm-select:focus { border-color: var(--adm-faint); outline: 0; box-shadow: 0 0 0 4px rgba(120, 113, 108, .12); }
textarea.ksp-adm-input { min-height: 88px; line-height: 1.5; resize: vertical; }
.ksp-adm-input.is-invalid, .ksp-adm-select.is-invalid { border-color: var(--adm-rose); }
.ksp-adm-help { margin: 0; color: var(--adm-muted); font-size: .74rem; line-height: 1.5; }
.ksp-adm-help--error { color: var(--adm-rose); font-weight: 600; }
.ksp-adm-help[hidden] { display: none; }
.ksp-adm-note { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border: 1px solid var(--adm-blue-line); border-radius: var(--adm-radius-sm); background: var(--adm-blue-bg); color: var(--adm-ink-2); font-size: .8rem; line-height: 1.55; }
.ksp-adm-note > .material-symbols-rounded { flex-shrink: 0; color: var(--adm-blue); font-size: 19px; }
.ksp-adm-note--warn { border-color: var(--adm-amber-line); background: var(--adm-amber-bg); }
.ksp-adm-note--warn > .material-symbols-rounded { color: var(--adm-amber); }
.ksp-adm-note--danger { border-color: var(--adm-rose-line); background: var(--adm-rose-bg); }
.ksp-adm-note--danger > .material-symbols-rounded { color: var(--adm-rose); }
.ksp-adm-kv { display: grid; grid-template-columns: minmax(110px, 38%) minmax(0, 1fr); gap: 10px 16px; margin: 0; font-size: .82rem; }
.ksp-adm-kv dt { color: var(--adm-muted); font-weight: 600; }
/* @yonetim-kasa-mutabakat — bireysel uzman Kasa & Mutabakat (KARARLAR §63.1) */
.ksp-adm-kv dd { min-width: 0; margin: 0; color: var(--adm-ink); font-weight: 700; overflow-wrap: anywhere; }

/* Duyarlı: 1200 altı tek sütun (aksiyon kartı üstte), 768 altı telefon düzeni (390 px) */
@media (max-width: 1199.98px) {
  .ksp-adm-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-adm-grid { grid-template-columns: minmax(0, 1fr); }
  .ksp-adm-grid__aside { order: -1; }
}
@media (max-width: 767.98px) {
  .ksp-adm, .ksp-adm-grid, .ksp-adm-stack { gap: 16px; }
  .ksp-adm-head { align-items: stretch; }
  .ksp-adm-head__title { font-size: 1.15rem; }
  .ksp-adm-head .ksp-adm-seg { width: 100%; }
  .ksp-adm-head .ksp-adm-seg a, .ksp-adm-head .ksp-adm-seg button { flex: 1 0 auto; padding-inline: .55rem; }
  .ksp-adm-kpis { gap: 10px; }
  .ksp-adm-kpi { padding: 14px; border-radius: 14px; }
  .ksp-adm-kpi__top { align-items: flex-start; gap: 8px; }
  .ksp-adm-kpi__label { font-size: .62rem; letter-spacing: .04em; }
  .ksp-adm-kpi__icon { width: 30px; height: 30px; border-radius: 9px; }
  .ksp-adm-kpi__icon .material-symbols-rounded { font-size: 17px; }
  .ksp-adm-kpi__value { margin-top: 10px; font-size: 1.3rem; }
  .ksp-adm-kpi__value small { font-size: .7rem; }
  .ksp-adm-kpi__foot { font-size: .7rem; }
  .ksp-adm-kpi__foot .material-symbols-rounded { font-size: 14px; }
  .ksp-adm-card { padding: 18px 16px; }
  .ksp-adm-card__head, .ksp-adm-card__bar { margin-bottom: 16px; }
  .ksp-adm-card__title { font-size: .98rem; }
  .ksp-adm-split { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .ksp-adm-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ksp-adm-tile { padding: 14px 10px; }
  .ksp-adm-tile__value { font-size: 1.05rem; }
                       /* tbody td kuralını yenmek için eş özgüllük */
          .ksp-adm-kv { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .ksp-adm-kv dd { margin-bottom: 8px; }
  .ksp-adm-modal__body { padding: 22px 20px 14px; }
  .ksp-adm-modal__foot { padding: 12px 20px 18px; }
  .ksp-adm-modal__foot .ksp-adm-btn { flex: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .ksp-adm-btn { transition: none; }
}
/* @yonetim-son — Dalga 1 alt blokları (@yonetim-isletmeler, @yonetim-basvuru, @yonetim-gelir) bu satırın ALTINA eklenir. */
/* @yonetim-isletmeler — Süper Admin > İşletmeler (views/panels/admin/tenants/**; referans 54) + panele geçiş şeridi
   (partials/impersonation-bar; kokpit / uzman / profil / vitrin kabukları) + hesap bilgi sayfaları (errors/impersonation-blocked,
   errors/tenant-suspended, site/salon-offline). app.js "@yonetim-isletmeler". Mevcut .ksp-adm-* kiti üzerine; yazılar eğik değil. */

/* Liste araç çubuğu: arama solda, durum + tür hapları sağda (referans 54) */

/* Detay: geri bağlantısı + özet başlığı */
.ksp-adm-back { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; margin-bottom: -10px; color: var(--adm-muted); font-size: .8rem; font-weight: 700; text-decoration: none; }
.ksp-adm-back:hover { color: var(--adm-ink); }
.ksp-adm-back .material-symbols-rounded { font-size: 18px; }

/* Son 30 gün + plan kartları */

/* Sahip kartı, durum işlemleri, denetim kayıtları */
.ksp-adm-acts { display: flex; flex-direction: column; gap: 10px; }
.ksp-adm-acts form { margin: 0; }

@media (max-width: 767.98px) {
            .ksp-adm-back { margin-bottom: -4px; }
                          }

/* Yönetici görünümü şeridi: sayfanın en üstünde yapışkan kırmızı şerit; üst bar / sekmeler / kenar çubuğu şerit kadar aşağı kayar */
:root { --ksp-imp-h: 0px; }

/* Hesap bilgi sayfaları (yönetici görünümüne kapalı alan, askıdaki hesap, yayında olmayan salon) */
.ksp-notice__eyebrow { margin: 14px 0 0; color: var(--ksp-muted); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.ksp-notice h1 { margin-top: .4rem; }
.ksp-notice__reason { max-width: 440px; margin: 16px auto 0; padding: 12px 14px; border: 1px solid rgba(var(--ksp-primary-rgb), .25); border-radius: 12px; background: rgba(var(--ksp-primary-rgb), .06); text-align: start; }
.ksp-notice__reason-label { display: inline-flex; align-items: center; gap: 6px; color: var(--ksp-primary); font-size: .72rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.ksp-notice__reason-label .material-symbols-rounded { font-size: 16px; }
.ksp-empty .ksp-notice__reason p { margin: 4px 0 0; color: var(--ksp-text); font-weight: 600; }
.ksp-notice__contact { margin: 16px 0 0; font-size: .88rem; }
.ksp-notice__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 22px; }
.ksp-notice__actions form { margin: 0; }
.ksp-notice__ghost { border: 1px solid var(--ksp-border); }
/* Askı / kapatma formu: ileri tarihli randevu iptali seçenekleri (partials/actions.php) */
.ksp-adm-check { display: flex; align-items: flex-start; gap: 8px; margin: 0; color: var(--adm-ink-2); font-size: .82rem; font-weight: 600; line-height: 1.35; cursor: pointer; }
.ksp-adm-check input { flex: none; width: 16px; height: 16px; margin-top: 1px; accent-color: var(--adm-ink); }
.ksp-adm-check:has(input:disabled) { opacity: .55; cursor: default; }
/* @yonetim-isletmeler-son */
/* @yonetim-basvuru */
/* ==========================================================================
   @yonetim-basvuru — Başvuru & Onay (Ajan B, 2026-09-19).
   1) Herkese açık "İşletmeni Ekle" formu (.ksp-biz-*; views/site/business/{form,verify,thanks}) — site token'ları (--ksp-*).
   2) Süper Admin Onay Merkezi (.ksp-adm-apps*, .ksp-adm-app*; referans 55) — yönetim token'ları (--adm-*), Dalga 0 kiti üzerine.
   Yazılar eğik değil; koyu tema token'larla; 390 px'te tek sütun, kartlar alt alta.
   ========================================================================== */
/* Tür kartları: salon (gül) · Adrese VIP Uzman (nane) */
/* Vergi türü (siyah hap), konum düğmesi, KVKK */
/* Kod ekranı + teşekkür */

/* Süper Admin — Onay Merkezi listesi (referans 55): gri başvuru kartları, sağda yeşil "Vitrini Onayla & Yayınla" + kırmızı çerçeveli "Reddet" */
/* E-posta başka hesaba ait (telefon eşleşmiyor): onay düğmesi yerine not — ApplicationQueue::accountLink */
/* Detay */
.ksp-adm-back { display: inline-flex; align-items: center; gap: 4px; margin-bottom: 6px; color: var(--adm-muted); font-size: .78rem; font-weight: 700; text-decoration: none; }
.ksp-adm-back:hover { color: var(--adm-ink); }
.ksp-adm-back .material-symbols-rounded { font-size: 17px; }
.ksp-adm-kv a { color: var(--adm-ink); text-decoration: underline; text-decoration-color: var(--adm-line); text-underline-offset: 3px; }
/* @yonetim-basvuru-son */
/* @yonetim-sanal-pos — Süper Admin > Gelir > Sanal POS (N Kolay): platformun TEK N Kolay hesabı + platform geneli tahsilat modu
   (views/panels/admin/payments/** , Controllers\Admin\PaymentAccountController; sahip kararı 2026-09-19). Eski uzman "Ödeme
   Ayarları" (@uzman-odeme, .ksp-pay-cfg-*) sayfasının Süper Admin kitine (.ksp-adm-*) uyarlanmış hali; renkler .ksp-panel--admin
   token'larından (açık / koyu). app.js "@yonetim-sanal-pos" (örnek hesap). Yazılar eğik değil. @yonetim-gelir-son satırının ALTINA eklenir. */
.ksp-adm-pos, .ksp-adm-pos * { font-style: normal; }
.ksp-adm-pos-notes { display: flex; flex-direction: column; gap: 10px; }
.ksp-adm-pos-notes .ksp-adm-note strong { color: var(--adm-ink); font-weight: 800; }

/* Kart başlığı (ikonlu) ve N Kolay etiketi */
.ksp-adm-pos-title { display: flex; align-items: center; gap: 8px; }
.ksp-adm-pos-title .material-symbols-rounded { flex-shrink: 0; color: var(--adm-muted); font-size: 20px; }
.ksp-adm-pos-card > .ksp-adm-card__bar { flex-wrap: nowrap; }
.ksp-adm-pos-card > .ksp-adm-card__bar > div { flex: 1 1 auto; min-width: 0; }
.ksp-adm-pos-brand { flex-shrink: 0; padding: 4px 10px; border-radius: 8px; background: var(--adm-btn); color: var(--adm-btn-ink); font-size: .68rem; font-weight: 800; letter-spacing: .04em; white-space: nowrap; }

/* Tahsilat modu radyo kartları */

/* Kapora yüzdesi, örnek hesap, tutma notu */

/* N Kolay alanları */
.ksp-adm-pos-fields { display: flex; flex-direction: column; gap: 16px; }
.ksp-adm-pos-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ksp-adm-pos-label { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ksp-adm-pos-label small { color: var(--adm-muted); font-size: .68rem; font-weight: 600; }
.ksp-adm-pos-saved { display: inline-flex; align-items: center; gap: 3px; color: var(--adm-faint); font-size: .68rem; font-weight: 700; white-space: nowrap; }
.ksp-adm-pos-saved.is-on { color: var(--adm-green); }
.ksp-adm-pos-saved .material-symbols-rounded { font-size: 14px; }
.ksp-adm-pos .ksp-adm-input.is-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .8rem; letter-spacing: .01em; }
.ksp-adm-pos .ksp-adm-input.is-mono::placeholder { font-family: var(--bs-body-font-family); font-size: .8rem; letter-spacing: 0; }
.ksp-adm-pos-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--adm-line); }
.ksp-adm-pos-save { min-width: 140px; }

/* Tahsilat durumu */
.ksp-adm-pos-state { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 18px; padding: 14px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius-sm); background: var(--adm-card-2); }
.ksp-adm-pos-state__ico { display: grid; place-items: center; flex-shrink: 0; width: 40px; height: 40px; border-radius: 12px; background: var(--adm-card); color: var(--adm-soft); box-shadow: inset 0 0 0 1px var(--adm-line); }
.ksp-adm-pos-state__ico .material-symbols-rounded { font-size: 22px; }
.ksp-adm-pos-state strong { display: block; color: var(--adm-ink); font-size: .9rem; font-weight: 800; }
.ksp-adm-pos-state p { margin: 2px 0 0; color: var(--adm-muted); font-size: .78rem; line-height: 1.5; }
.ksp-adm-pos-status--active .ksp-adm-pos-state { border-color: var(--adm-green-line); background: var(--adm-green-bg); }
.ksp-adm-pos-status--active .ksp-adm-pos-state__ico { background: var(--adm-green); color: #fff; box-shadow: none; }
.ksp-adm-pos-status--active .ksp-adm-pos-state strong { color: var(--adm-green-ink); }
.ksp-adm-pos-status--unverified .ksp-adm-pos-state { border-color: var(--adm-amber-line); background: var(--adm-amber-bg); }
.ksp-adm-pos-status--unverified .ksp-adm-pos-state__ico { color: var(--adm-amber); }
.ksp-adm-pos-status--unverified .ksp-adm-pos-state strong { color: var(--adm-amber-ink); }
[data-bs-theme="dark"] .ksp-adm-pos-status--active .ksp-adm-pos-state__ico { color: #064e3b; }
.ksp-adm-pos-kv { margin-bottom: 18px; }
.ksp-adm-pos-error { margin-bottom: 16px; overflow-wrap: anywhere; }
.ksp-adm-pos-verify { margin: 0 0 8px; }
.ksp-adm-pos-verify .ksp-adm-btn:disabled { cursor: not-allowed; }
/* e-Fatura yayın anahtarı (KARARLAR §47): durum kartının içinde ayrı bir bölüm */

/* Kurulum yardımı */
.ksp-adm-pos-steps { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-adm-pos-steps li { display: flex; align-items: flex-start; gap: 10px; color: var(--adm-ink-2); font-size: .8rem; line-height: 1.5; }
.ksp-adm-pos-steps__num { display: grid; place-items: center; flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; background: var(--adm-active); color: var(--adm-active-ink); font-size: .68rem; font-weight: 800; }
.ksp-adm-pos-secure { display: flex; align-items: flex-start; gap: 8px; margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--adm-line); color: var(--adm-muted); font-size: .76rem; line-height: 1.5; }
.ksp-adm-pos-secure .material-symbols-rounded { flex-shrink: 0; color: var(--adm-green); font-size: 17px; }

/* 1200 px altı tek sütun: durum kartı formun üstünde, kurulum yardımı en altta (kitin "aside üstte" kuralı yerine) */
@media (max-width: 1199.98px) {
  .ksp-adm-pos .ksp-adm-grid__aside { display: contents; }
  .ksp-adm-pos .ksp-adm-pos-status { order: -1; }
  .ksp-adm-pos .ksp-adm-pos-help { order: 1; }
}
/* Telefon (390 px): mod kartları satır düzeninde alt alta, alanlar tek sütun, düğmeler tam genişlik */
@media (max-width: 767.98px) {
        .ksp-adm-pos-cols { grid-template-columns: minmax(0, 1fr); }
  .ksp-adm-pos-actions { flex-direction: column-reverse; align-items: stretch; }
  .ksp-adm-pos-actions .ksp-adm-btn { width: 100%; }
  .ksp-adm-pos .ksp-adm-head__actions { width: 100%; }
}
/* @yonetim-sanal-pos-son */

/* @uzman-kalinti — Bireysel uzman paneli stilleri Aşama 4'te kalktı (KARARLAR §82.4). Aşağıdaki dört KAPSAMSIZ ikon kuralı
   bilerek bırakıldı: --uz-* artık hiç tanımlı değil → renk "inherit"; kokpit ikonlarının (cockpit.php is-green/is-amber,
   settings-contact.php is-rose/is-green) bugünkü görünümü buna dayanıyor. Kaldırılıp kaldırılmayacağı Aşama 11 kararı. */
.material-symbols-rounded.is-rose { color: var(--uz-rose); }
.material-symbols-rounded.is-amber { color: var(--uz-amber); }
.material-symbols-rounded.is-blue { color: var(--uz-blue); font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24; }
.material-symbols-rounded.is-green { color: var(--uz-green); }

/* @randevu-kupon-secici — Randevu penceresi kupon seçimi (booking-modal #bkCoupon .ksp-bk-field > select): eski "@uzman-vitrin"
   bloğundan kalan dört kural (Aşama 4, KARARLAR §82.4). Koyu temadaki yazı / seçenek rengi YALNIZ buradan gelir. */
.ksp-bk-field select { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: #1c1917; font: inherit; font-size: 13.5px; }
.ksp-bk-field:has(select[aria-invalid="true"]) { border-color: #e11d48; }
[data-bs-theme="dark"] .ksp-bk-field select { color: #fafaf9; }
[data-bs-theme="dark"] .ksp-bk-field select option { color: #1c1917; }

/* ==========================================================================
   @belgeler — Belgeler & Sözleşmeler (KARARLAR §15, kullanıcı tasarımı 2026-09-20).
   Salon kokpiti ve uzman panelinde aynı ekran; renkler panel token'larından gelir (kokpitte taş, uzmanda lacivert).
   ========================================================================== */
/* @belgeler-son */

/* @sozlesme — Platform sözleşme metni sayfası (/sozlesme/{anahtar}, KARARLAR §15) */
.ksp-legal__back { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 16px; border: 1px solid var(--ksp-border); border-radius: 12px; font-size: .82rem; font-weight: 700; }
/* @sozlesme-son */

/* @yonetim-belgeler-son */

/* ==========================================================================
   @personel-yetki — Personel Yetki & İzin Matrisi (kullanıcı tasarımı 2026-09-20, KARARLAR §16)
   ========================================================================== */
.ksp-stp { display: grid; gap: 16px; }
.ksp-stp-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-stp-head__title { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font-size: 1rem; }
.ksp-stp-head__title .material-symbols-rounded { font-size: 21px; color: var(--ksp-primary); }
.ksp-stp-head__lead { margin: 0; max-width: 86ch; color: var(--ksp-muted); font-size: .8rem; }
.ksp-stp-head__count { padding: 6px 12px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .74rem; font-weight: 700; white-space: nowrap; }
.ksp-stp-empty { display: grid; justify-items: center; gap: 4px; padding: 32px; border: 1px dashed var(--ksp-border); border-radius: 16px; color: var(--ksp-muted); font-size: .82rem; }
.ksp-stp-empty .material-symbols-rounded { font-size: 28px; }
.ksp-stp-card { padding: 16px 18px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-stp-card__head { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 14px; }
.ksp-stp-card__ava { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--ksp-surface-2) center/cover no-repeat; color: var(--ksp-muted); font-size: .84rem; font-weight: 800; }
.ksp-stp-card__who { flex: 1 1 220px; min-width: 0; }
.ksp-stp-card__name { display: flex; align-items: center; gap: 8px; margin: 0; font-size: .95rem; }
.ksp-stp-card__chip { padding: 2px 8px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .68rem; font-weight: 700; }
.ksp-stp-card__chip.is-off { background: rgba(244, 63, 94, .1); color: #e11d48; }
.ksp-stp-card__title { margin: 2px 0 0; color: var(--ksp-muted); font-size: .78rem; }
.ksp-stp-card__acts { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ksp-stp-card__acts form { margin: 0; }
.ksp-stp-card__score { color: var(--ksp-muted); font-size: .74rem; font-weight: 700; }
.ksp-stp-btn { height: 34px; padding: 0 14px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .76rem; font-weight: 700; }
.ksp-stp-btn:hover { background: var(--ksp-surface-2); }
.ksp-stp-btn--all { border-color: rgba(0, 188, 125, .45); color: #00875f; }
.ksp-stp-btn--all:hover { background: var(--ksp-success-50); }
.ksp-stp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.ksp-stp-cell { margin: 0; }
.ksp-stp-cell__btn { display: grid; gap: 3px; width: 100%; height: 100%; padding: 11px 13px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-muted); text-align: start; transition: border-color .15s, background .15s; }
.ksp-stp-cell.is-on .ksp-stp-cell__btn { border-color: rgba(0, 188, 125, .4); background: var(--ksp-success-50); }
.ksp-stp-cell__btn:hover { border-color: var(--ksp-primary); }
.ksp-stp-cell__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ksp-stp-cell__label { display: flex; align-items: center; gap: 6px; color: var(--ksp-text); font-size: .8rem; font-weight: 700; }
.ksp-stp-cell__label .material-symbols-rounded { font-size: 17px; color: var(--ksp-muted); }
.ksp-stp-cell.is-on .ksp-stp-cell__label .material-symbols-rounded { color: #00a06a; }
.ksp-stp-cell__state { flex-shrink: 0; padding: 2px 8px; border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-muted); font-size: .62rem; font-weight: 800; letter-spacing: .03em; }
.ksp-stp-cell.is-on .ksp-stp-cell__state { background: #00a06a; color: #fff; }
.ksp-stp-cell__hint { font-size: .72rem; }
.ksp-stp-cell__soon { color: var(--ksp-faint, var(--ksp-muted)); font-size: .66rem; }
.ksp-stp-foot { display: flex; align-items: flex-start; gap: 7px; margin: 0; padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .76rem; }
.ksp-stp-foot .material-symbols-rounded { font-size: 18px; }
@media (max-width: 575.98px) {
  .ksp-stp-grid { grid-template-columns: 1fr; }
  .ksp-stp-card__acts { width: 100%; }
  .ksp-stp-btn { flex: 1 1 auto; }
}
/* @personel-yetki-son */

/* ==========================================================================
   @uzman-sayfa — Personel tanıtım sayfası /salon/{salon}/uzman/{personel} (kullanıcı tasarımı 2026-09-20, KARARLAR §16).
   Salon sayfasının kabuğunu (.ksp-sp) kullanır; kendi blokları .ksp-stfp-*.
   ========================================================================== */
.ksp-stfp-hero { margin: 16px 0 14px; padding: 20px 22px; border-radius: 20px; background: linear-gradient(135deg, #2b0d16, #1c1917 60%); color: #fafaf9; }
.ksp-stfp-hero__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.ksp-stfp-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px; background: rgba(255, 255, 255, .08); color: #e7e5e4; font-size: .74rem; font-weight: 700; }
.ksp-stfp-chip .material-symbols-rounded { font-size: 16px; }
.ksp-stfp-chip.is-violet { background: rgba(167, 139, 250, .18); color: #ddd6fe; }
.ksp-stfp-chip.is-amber { background: rgba(245, 158, 11, .18); color: #fcd34d; }
.ksp-stfp-chip.is-green { background: rgba(0, 188, 125, .18); color: #6ee7b7; }
.ksp-stfp-hero__row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.ksp-stfp-hero__ok { position: absolute; inset-inline-end: -6px; inset-block-end: -6px; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #00a06a; color: #fff; }
.ksp-stfp-hero__ok .material-symbols-rounded { font-size: 15px; }
.ksp-stfp-hero__text { flex: 1 1 260px; min-width: 0; }
.ksp-stfp-hero__name { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1.5rem; }
.ksp-stfp-hero__sex { padding: 3px 10px; border-radius: 999px; background: rgba(255, 32, 86, .16); color: #ffa2b8; font-size: .68rem; font-weight: 800; }
.ksp-stfp-hero__title { margin: 4px 0 0; color: #ff7a94; font-size: .9rem; font-weight: 700; }
.ksp-stfp-hero__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 8px 0 0; color: #d6d3d1; font-size: .8rem; }
.ksp-stfp-book { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 46px; padding: 0 20px; border: 0; border-radius: 12px; background: var(--ksp-primary); color: #fff; font-size: .86rem; font-weight: 800; }
.ksp-stfp-book:hover { background: var(--ksp-primary-600); color: #fff; }
.ksp-stfp-back { display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 14px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .78rem; font-weight: 700; }
.ksp-stfp-back:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-stfp-back .material-symbols-rounded { font-size: 17px; color: var(--ksp-primary); }
.ksp-stfp-tabs { margin-bottom: 16px; }
.ksp-stfp-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 16px; align-items: start; padding-bottom: 40px; }
.ksp-stfp-main, .ksp-stfp-side { display: grid; gap: 14px; }
.ksp-stfp-panel { display: grid; gap: 14px; }
.ksp-stfp-card { padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-stfp-bio { margin: 10px 0 0; padding: 14px 16px; border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-text); font-size: .86rem; line-height: 1.7; }
.ksp-stfp-empty { margin: 8px 0 0; color: var(--ksp-muted); font-size: .82rem; }
.ksp-stfp-quote { display: flex; gap: 8px; margin: 12px 0 0; padding: 12px 14px; border-inline-start: 3px solid var(--ksp-primary); border-radius: 0 12px 12px 0; background: var(--ksp-primary-50); color: var(--ksp-text); font-size: .84rem; }
.ksp-stfp-quote .material-symbols-rounded { font-size: 18px; color: var(--ksp-primary); }
.ksp-stfp-label { margin: 16px 0 8px; color: var(--ksp-muted); font-size: .68rem; font-weight: 800; letter-spacing: .06em; }
.ksp-stfp-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-stfp-tags li { display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border: 1px solid var(--ksp-border); border-radius: 999px; font-size: .78rem; font-weight: 600; }
.ksp-stfp-tags .material-symbols-rounded { font-size: 15px; color: #00a06a; }
.ksp-stfp-svc { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-stfp-svc li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-stfp-svc__name { margin: 0; font-size: .88rem; font-weight: 700; }
.ksp-stfp-svc__desc { margin: 3px 0 0; color: var(--ksp-muted); font-size: .76rem; }
.ksp-stfp-svc__meta { display: flex; align-items: center; gap: 8px; margin: 6px 0 0; color: var(--ksp-muted); font-size: .78rem; }
.ksp-stfp-svc__meta .material-symbols-rounded { font-size: 16px; }
.ksp-stfp-svc__meta strong { color: var(--ksp-primary); font-size: .84rem; }
.ksp-stfp-svc__dot { width: 4px; height: 4px; border-radius: 50%; background: currentColor; opacity: .5; }
.ksp-stfp-svc__btn { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 14px; border-radius: 10px; background: #1c1917; color: #fafaf9; font-size: .78rem; font-weight: 700; }
.ksp-stfp-svc__btn:hover { background: #292524; color: #fafaf9; }
.ksp-stfp-tech { display: grid; gap: 8px; margin: 8px 0 0; padding: 0; list-style: none; }
.ksp-stfp-tech li { display: flex; align-items: center; gap: 8px; padding: 11px 14px; border: 1px solid var(--ksp-border); border-radius: 12px; font-size: .82rem; }
.ksp-stfp-works { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; margin: 10px 0 0; padding: 0; list-style: none; }
.ksp-stfp-works li { overflow: hidden; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-stfp-works img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.ksp-stfp-works div { padding: 10px 12px; }
.ksp-stfp-works__title { margin: 0; font-size: .82rem; font-weight: 700; }
.ksp-stfp-works__tech { margin: 2px 0 0; color: var(--ksp-muted); font-size: .74rem; }
.ksp-stfp-hours { display: grid; gap: 2px; margin: 10px 0 0; padding: 0; list-style: none; }
.ksp-stfp-hours li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: 10px; font-size: .82rem; }
.ksp-stfp-hours li:nth-child(odd) { background: var(--ksp-surface-2); }
.ksp-stfp-hours li.is-today { background: var(--ksp-primary-50); font-weight: 700; }
.ksp-stfp-hours small { color: var(--ksp-primary); font-size: .68rem; font-weight: 800; }
.ksp-stfp-hours .is-off { color: var(--ksp-muted); }
.ksp-stfp-book-card,
.ksp-stfp-others { padding: 16px 18px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-stfp-mini { display: flex; align-items: center; gap: 10px; }
.ksp-stfp-mini__ava { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: var(--ksp-surface-2) center/cover no-repeat; font-size: .84rem; font-weight: 800; }
.ksp-stfp-mini__name { margin: 0; font-size: .88rem; font-weight: 800; }
.ksp-stfp-mini__title { margin: 1px 0 0; color: var(--ksp-primary); font-size: .76rem; font-weight: 600; }
.ksp-stfp-mini__rate { display: flex; align-items: center; gap: 4px; margin: 3px 0 0; color: var(--ksp-muted); font-size: .76rem; }
.ksp-stfp-mini__rate .material-symbols-rounded { font-size: 15px; color: #f59e0b; }
.ksp-stfp-slot { margin: 12px 0; padding: 12px 14px; border: 1px solid var(--ksp-primary-100); border-radius: 12px; background: var(--ksp-primary-50); }
.ksp-stfp-slot__label { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--ksp-primary); font-size: .74rem; font-weight: 800; }
.ksp-stfp-slot__label .material-symbols-rounded { font-size: 16px; }
.ksp-stfp-slot__value { margin: 4px 0 0; font-size: .82rem; font-weight: 700; }
.ksp-stfp-promise { display: grid; gap: 6px; margin: 12px 0 0; padding: 0; list-style: none; color: var(--ksp-muted); font-size: .76rem; }
.ksp-stfp-promise li { display: flex; align-items: center; gap: 6px; }
.ksp-stfp-promise .material-symbols-rounded { font-size: 16px; color: #00a06a; }
.ksp-stfp-others h2 { display: flex; align-items: center; gap: 7px; margin: 0; font-size: .88rem; }
.ksp-stfp-others h2 .material-symbols-rounded { font-size: 18px; color: var(--ksp-primary); }
.ksp-stfp-others ul { display: grid; gap: 6px; margin: 12px 0 0; padding: 0; list-style: none; }
.ksp-stfp-others a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; color: var(--ksp-text); }
.ksp-stfp-others a:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-stfp-others__ava { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: var(--ksp-surface-2) center/cover no-repeat; font-size: .74rem; font-weight: 800; }
.ksp-stfp-others__text { flex: 1 1 auto; min-width: 0; }
.ksp-stfp-others__text strong { display: block; font-size: .8rem; }
.ksp-stfp-others__text small { color: var(--ksp-muted); font-size: .72rem; }
@media (max-width: 991.98px) {
  .ksp-stfp-grid { grid-template-columns: 1fr; }
  .ksp-stfp-side { order: -1; }
}
@media (max-width: 575.98px) {
  .ksp-stfp-hero { padding: 16px; }
  .ksp-stfp-hero__name { font-size: 1.25rem; }
  }
.ksp-stfp-reviews { display: grid; gap: 10px; margin: 12px 0 0; padding: 0; list-style: none; }
.ksp-stfp-reviews li { padding: 13px 15px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-stfp-reviews__top { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ksp-stfp-reviews__stars { display: inline-flex; gap: 1px; color: #f59e0b; }
.ksp-stfp-reviews__stars .material-symbols-rounded { font-size: 15px; }
.ksp-stfp-reviews__stars .is-empty { color: var(--ksp-border); }
.ksp-stfp-reviews__text { margin: 8px 0 0; color: var(--ksp-text); font-size: .84rem; line-height: 1.6; }
.ksp-stfp-reviews__reply { display: flex; gap: 6px; margin: 8px 0 0; padding: 9px 11px; border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-muted); font-size: .78rem; }
.ksp-stfp-reviews__reply .material-symbols-rounded { font-size: 16px; }
/* @uzman-sayfa-son */

/* @personel-vitrin — Kokpit > Personel > Tanıtım & Portfolyo: vitrin kartları (kullanıcı tasarımı 2026-09-20, KARARLAR §16) */
.ksp-stw { display: grid; gap: 16px; }
.ksp-stw-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-stw-head__title { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font-size: 1rem; }
.ksp-stw-head__title .material-symbols-rounded { font-size: 21px; color: #f59e0b; }
.ksp-stw-head__lead { margin: 0; max-width: 88ch; color: var(--ksp-muted); font-size: .8rem; }
.ksp-stw-head__count { padding: 6px 12px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .74rem; font-weight: 700; white-space: nowrap; }
.ksp-stw-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: 14px; }
.ksp-stw-card { display: grid; gap: 12px; padding: 16px 18px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-stw-card.is-off { opacity: .65; }
.ksp-stw-card__head { display: flex; align-items: flex-start; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--ksp-border); }
.ksp-stw-card__ava { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 14px; background: var(--ksp-surface-2) center/cover no-repeat; font-size: .9rem; font-weight: 800; box-shadow: 0 0 0 2px var(--ksp-primary-50); }
.ksp-stw-card__who { flex: 1 1 auto; min-width: 0; }
.ksp-stw-card__name { display: flex; align-items: center; gap: 6px; margin: 0; font-size: .95rem; font-weight: 800; }
.ksp-stw-card__ok { display: inline-grid; place-items: center; color: #00a06a; }
.ksp-stw-card__ok .material-symbols-rounded { font-size: 17px; }
.ksp-stw-card__title { margin: 2px 0 0; color: var(--ksp-muted); font-size: .8rem; }
.ksp-stw-card__meta { display: flex; align-items: center; gap: 8px; margin: 5px 0 0; color: var(--ksp-muted); font-size: .76rem; }
.ksp-stw-card__rate { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; color: var(--ksp-text); }
.ksp-stw-card__rate .material-symbols-rounded { font-size: 15px; color: #f59e0b; }
.ksp-stw-card__dot { width: 4px; height: 4px; border-radius: 50%; background: currentColor; opacity: .5; }
.ksp-stw-card__chip { padding: 3px 10px; border-radius: 999px; background: var(--ksp-primary-50); color: var(--ksp-primary); font-size: .68rem; font-weight: 800; }
.ksp-stw-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-stw-stats li { display: grid; gap: 2px; justify-items: center; padding: 10px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-stw-stats span { color: var(--ksp-muted); font-size: .72rem; font-weight: 600; }
.ksp-stw-stats strong { font-size: 1.05rem; }
.ksp-stw-stats li.is-amber { background: var(--ksp-amber-50); border-color: rgba(245, 158, 11, .25); }
.ksp-stw-stats li.is-amber strong { color: #b45309; }
.ksp-stw-stats li.is-green { background: var(--ksp-success-50); border-color: rgba(0, 188, 125, .25); }
.ksp-stw-stats li.is-green strong { color: #00875f; }
.ksp-stw-stats li.is-rose { background: var(--ksp-primary-50); border-color: var(--ksp-primary-100); }
.ksp-stw-stats li.is-rose strong { color: var(--ksp-primary); }
.ksp-stw-card__acts { display: flex; align-items: center; gap: 8px; }
.ksp-stw-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 40px; padding: 0 16px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .8rem; font-weight: 700; }
.ksp-stw-btn:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-stw-btn--main { flex: 1 1 auto; border-color: transparent; background: var(--ksp-primary); color: #fff; }
.ksp-stw-btn--main:hover { background: var(--ksp-primary-600); color: #fff; }
@media (max-width: 575.98px) {
  .ksp-stw-grid { grid-template-columns: 1fr; }
  .ksp-stw-card__acts { flex-wrap: wrap; }
}
/* @personel-vitrin-son */

/* @panel-solmenu — Kokpit ve Uzman panelinde gruplu sol menü (sahip isteği 2026-09-20, KARARLAR §17).
   Masaüstünde sol menü + sayfa içi alt sekmeler; kabuğun modül şeridi masaüstünde gizlenir, mobilde kalır. */
@media (min-width: 992px) {
  .ksp-panel--tabs.ksp-panel--side .ksp-sidebar { position: sticky; height: 100dvh; }
  .ksp-panel--side .ksp-ptop__brand, .ksp-panel--side .ksp-ptop__divider { display: none; }
  .ksp-panel--tabs.ksp-panel--side .ksp-ptop__inner,
  .ksp-panel--tabs.ksp-panel--side .ksp-panel__content { max-width: 1320px; }
}
.ksp-panel--side .ksp-sidebar__nav--grouped .ksp-sidebar__group { margin-top: .85rem; }
.ksp-bell.is-muted .ksp-bell__btn::after { content: ""; position: absolute; inset-inline-end: 4px; inset-block-start: 4px; width: 8px; height: 8px; border-radius: 50%; background: #f59e0b; box-shadow: 0 0 0 2px var(--ksp-surface); }
.ksp-bell.is-muted .ksp-bell__btn { position: relative; }
/* @panel-solmenu-son */

/* @panel-solmenu-2 — Sahip istekleri 2026-09-20: içerik tam genişlik, sol menü açılır/kapanır (dar ray),
   bölüm seçici ("Tüm Salon / Kadın / Erkek") sol menü açıkken de görünür (KARARLAR §17). */
@media (min-width: 992px) {
  /* Üst bar ve şerit kenardan kenara; İÇERİK ortalanmış sütunda kalır (sahip, 2026-09-21: "tam sayfa olmadı,
     2. resimdeki gibi olsun" — referans Zincir & Şubeler sayfası, ~1240 px). Genişlik tek yerden: --ksp-panel-w. */
  .ksp-panel--tabs.ksp-panel--side .ksp-ptop__inner,
  .ksp-panel--tabs.ksp-panel--side .ksp-ptabs__inner { max-width: none; }
  .ksp-panel--tabs.ksp-panel--side .ksp-panel__content { max-width: var(--ksp-panel-w, 1240px); }
  /* Şerit: modül sekmeleri sol menüde, burada yalnız bölüm seçici kalır */
  .ksp-panel--side .ksp-ptabs--compact .ksp-ptabs__nav { display: none; }
  .ksp-panel--side .ksp-ptabs--compact .ksp-ptabs__inner { justify-content: flex-end; }
  .ksp-panel--side .ksp-ptabs--compact.ksp-ptabs--nosec { display: none; }
  /* Dar ray (kapalı menü) */
  .ksp-panel--side.is-rail .ksp-sidebar { width: 76px; }
  .ksp-panel--side.is-rail .ksp-sidebar__context,
.ksp-panel--side.is-rail .ksp-sidebar__group,
.ksp-panel--side.is-rail .ksp-sidebar__soon,
/* Yalnız ETİKET metni gizlenir; ikon (.material-symbols-rounded) kalır */
  .ksp-panel--side.is-rail .ksp-sidebar__nav a > span:not([class]),
.ksp-panel--side.is-rail .ksp-sidebar__foot a > span:not([class]),
.ksp-panel--side.is-rail .ksp-sidebar__foot button > span:not([class]),
.ksp-panel--side.is-rail .ksp-brand__body { display: none; }
  .ksp-panel--side.is-rail .ksp-sidebar__head { justify-content: center; }
  .ksp-panel--side.is-rail .ksp-sidebar__nav a,
  .ksp-panel--side.is-rail .ksp-sidebar__foot a,
  .ksp-panel--side.is-rail .ksp-sidebar__foot button { justify-content: center; padding-inline: 0; }
  .ksp-panel--side.is-rail .ksp-sidebar__badge { position: absolute; inset-block-start: 6px; inset-inline-end: 12px; }
  .ksp-panel--side.is-rail .ksp-sidebar__nav a { position: relative; }
}
.ksp-sidebar__toggle { display: none; align-items: center; justify-content: center; width: 34px; height: 34px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-muted); }
.ksp-sidebar__toggle:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-sidebar__toggle .material-symbols-rounded { font-size: 19px; }
@media (min-width: 992px) { .ksp-panel--side .ksp-sidebar__toggle { display: inline-flex; } }
.ksp-panel--side.is-rail .ksp-sidebar__toggle .material-symbols-rounded { transform: scaleX(-1); }
/* @panel-solmenu-2-son */

/* @personel-yetki-2 — Yetkiler kartı personel profil sayfasında + "Yetkilerin" listesi personel portalında (sahip, 2026-09-20) */
.ksp-stp-card--inline { margin: 0; padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: var(--ksp-radius, 16px); background: var(--ksp-surface); }
.ksp-stp-card--inline .ksp-stp-card__head { margin-bottom: 12px; }
.ksp-stp-card--inline .ksp-stp-card__title { margin: 2px 0 0; color: var(--ksp-muted); font-size: .76rem; font-weight: 500; }
.ksp-stp-card--inline .ksp-stp-foot { margin-top: 12px; }
.ksp-stp-card--inline .ksp-stp-foot a { text-decoration: underline; }
.ksp-portal__locked { display: flex; align-items: center; gap: 8px; margin: 16px 0 0; padding: 13px 15px; border: 1px solid rgba(245, 158, 11, .35); border-radius: 12px; background: var(--ksp-amber-50); color: #b45309; font-size: .82rem; }
.ksp-portal__locked .material-symbols-rounded { font-size: 19px; }
/* @personel-yetki-2-son */

/* @uzman-sayfa-2 — Sahip istekleri 2026-09-20: tanıtım şeridinin fonunda salon logosu (logo yoksa salon adı),
   sağ sütunda sosyal medya ikonları, personel portalında profil fotoğrafı kartı. */
.ksp-stfp-hero { position: relative; overflow: hidden; }
.ksp-stfp-hero > * { position: relative; z-index: 1; }
.ksp-stfp-hero__brand { position: absolute; inset-block: 0; inset-inline-end: 0; z-index: 0; display: grid; place-items: center; width: min(46%, 420px); pointer-events: none; }
/* Logolar çoğunlukla şeffaf zeminli ve koyu çizimli; brightness(0) invert(1) hepsini beyaz silüete çevirir (koyu şeritte okunur).
   Yüzdelik yükseklik ızgara alanında çözülmediği için görsel mutlak konumlanır — aksi halde şeridin altından taşıp kırpılıyor. */
.ksp-stfp-hero__brand img { position: absolute; inset: 20px; width: calc(100% - 40px); height: calc(100% - 40px); object-fit: contain; object-position: center right; opacity: .16; filter: grayscale(1) brightness(0) invert(1); }
.ksp-stfp-hero__brandText { padding: 18px 20px; color: rgba(255, 255, 255, .075); font-size: clamp(1.3rem, 3.1vw, 2.35rem); font-weight: 800; line-height: 1.15; text-align: end; letter-spacing: -.02em; }
/* "Bağlı Olduğu Salon" kartının yerini alan sosyal medya kartı (sahip kararı 2026-09-20) */
.ksp-stfp-social-card { margin-top: 14px; padding: 16px 18px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-stfp-social-card h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: .95rem; font-weight: 800; }
.ksp-stfp-social-card h2 .material-symbols-rounded { color: var(--ksp-primary); font-size: 20px; }
.ksp-stfp-social { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.ksp-stfp-social a { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--ksp-border); border-radius: 11px; background: var(--ksp-surface-2); color: var(--ksp-text); font-size: 1rem; transition: background .15s, color .15s, border-color .15s; }
.ksp-stfp-social a:hover { border-color: var(--ksp-primary); background: var(--ksp-primary-50); color: var(--ksp-primary); }
/* Personel portalı: profil fotoğrafı kartı + sosyal alanlar */
.ksp-portal-photo { margin-top: 16px; padding: 16px 18px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-portal-photo__row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 12px; }
.ksp-portal-photo__pic { display: grid; place-items: center; width: 92px; height: 92px; border-radius: 22px; background: var(--ksp-surface-2) center/cover no-repeat; color: var(--ksp-muted); font-size: 1.4rem; font-weight: 800; box-shadow: 0 0 0 2px var(--ksp-primary-50); }
.ksp-portal-photo__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ksp-portal-photo__acts .ksp-sprof-hint { flex-basis: 100%; margin: 0; }
.ksp-portal-photo__form label { cursor: pointer; }
.ksp-sprof-socials { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.ksp-sprof-socials .ksp-cash-label { display: flex; align-items: center; gap: 6px; }
.ksp-sprof-socials .bi { font-size: .9rem; color: var(--ksp-primary); }
/* Salonun web sitesi: otomatik gelir, personel değiştiremez — kilitli satır */
.ksp-sprof-site { display: flex; align-items: center; gap: 10px; margin: 12px 0 0; padding: 10px 14px; border: 1px dashed var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-sprof-site .material-symbols-rounded { color: var(--ksp-muted); font-size: 20px; }
.ksp-sprof-site > span { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: flex-start; gap: 4px 10px; flex: 1 1 auto; min-width: 0; font-size: .82rem; text-align: start; }
.ksp-sprof-site strong { font-weight: 700; }
.ksp-sprof-site a { color: var(--ksp-primary); font-weight: 600; word-break: break-all; }
.ksp-sprof-site em { color: var(--ksp-muted); font-style: normal; }
.ksp-sprof-site b { padding: 3px 8px; border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-muted); font-size: .62rem; font-weight: 800; letter-spacing: .04em; }
/* @uzman-sayfa-2-son */

/* @personel-kokpit — Personel Portalı "Personel Kokpiti" tasarımı (kullanıcı ekran görüntüleri 2026-09-20):
   kimlik şeridi, kısa başlıklı sekme çubuğu, 4 KPI kartı, sekme içerikleri (randevu akışı, haftalık vardiya,
   imza teknikler, sertifikalar, yetki listesi). Açık/koyu tema token'ları üzerinden. */
.ksp-pk { display: flex; flex-direction: column; gap: 14px; }
.ksp-pk-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 18px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-pk-id { display: flex; align-items: center; gap: 14px; min-width: 0; }
.ksp-pk-ava { position: relative; display: grid; place-items: center; flex: 0 0 auto; width: 58px; height: 58px; overflow: hidden; border-radius: 16px; background: var(--staff, #e11d48); color: #fff; font-size: 1.05rem; font-weight: 800; }
.ksp-pk-ava img { width: 100%; height: 100%; object-fit: cover; }
.ksp-pk-id__text { min-width: 0; }
.ksp-pk-id__text h1 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; font-size: 1.2rem; font-weight: 800; }
.ksp-pk-tag { padding: 3px 9px; border-radius: 999px; background: var(--ksp-primary-50); color: var(--ksp-primary); font-size: .64rem; font-weight: 800; letter-spacing: .02em; }
.ksp-pk-tag.is-soft { background: var(--ksp-surface-2); color: var(--ksp-muted); }
.ksp-pk-id__title { margin: 3px 0 0; color: var(--ksp-muted); font-size: .82rem; }
.ksp-pk-id__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 5px 0 0; color: var(--ksp-muted); font-size: .78rem; }
.ksp-pk-id__meta span { display: inline-flex; align-items: center; gap: 5px; }
.ksp-pk-id__meta .material-symbols-rounded { font-size: 17px; }
.ksp-pk-id__rate { color: #b45309; font-weight: 700; }
.ksp-pk-id__rate .material-symbols-rounded { color: #f59e0b; }
.ksp-pk-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ksp-pk-btn--rose { border-color: transparent; background: var(--ksp-primary); color: #fff; }
.ksp-pk-btn--rose:hover { filter: brightness(1.06); color: #fff; }
/* Sekme çubuğu: başlıklar kısa, yatayda kayar */
.ksp-pk-tabs { padding: 6px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
/* Sahip isteği 2026-09-20 "başlıkları kısalt sığsın": 8 sekme masaüstünde tek satıra sığsın diye dar dolgu */
/* min-width:0 şart: sekme çubuğu içerik genişliğinde olduğu için kabuk aksi halde sayfayı yatay kaydırıyor */
.ksp-pk { max-width: 1240px; width: 100%; min-width: 0; margin: 0 auto; }
.ksp-pk > *, .ksp-pk-tabs, .ksp-pk-tabs__list { min-width: 0; }
.ksp-pk-tabs__list { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: thin; }
.ksp-pk-tab { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; padding: 9px 10px; border-radius: 12px; color: var(--ksp-muted); font-size: .8rem; font-weight: 700; white-space: nowrap; }
.ksp-pk-tab .material-symbols-rounded { font-size: 18px; }
.ksp-pk-tab b { padding: 1px 7px; border-radius: 999px; background: var(--ksp-surface-2); font-size: .68rem; font-weight: 800; }
.ksp-pk-tab:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-pk-tab.is-active { background: var(--ksp-text); color: var(--ksp-surface); }
.ksp-pk-tab.is-active b { background: rgba(255, 255, 255, .18); color: inherit; }
/* KPI kartları */
.ksp-pk-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.ksp-pk-kpi { padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-pk-kpi__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0; color: var(--ksp-muted); font-size: .78rem; font-weight: 600; }
.ksp-pk-kpi__head .material-symbols-rounded { color: var(--ksp-primary); font-size: 19px; }
.ksp-pk-kpi strong { display: flex; align-items: baseline; gap: 6px; margin: 8px 0 4px; font-size: 1.6rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-pk-kpi strong small { color: var(--ksp-muted); font-size: .75rem; font-weight: 600; }
.ksp-pk-kpi strong.is-green { color: #0f9d58; }
.ksp-pk-kpi strong.is-amber { color: #d97706; }
.ksp-pk-kpi__foot { display: block; color: var(--ksp-muted); font-size: .72rem; }
.ksp-pk-kpi__foot.is-rose { color: var(--ksp-primary); }
/* Sekme gövdesi */
.ksp-pk-sec { padding: 16px 18px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-pk-sec + .ksp-pk-sec, .ksp-pk-sec + .ksp-sprof-main { margin-top: 14px; }
.ksp-pk-sec__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.ksp-pk-sec__head h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 1.02rem; font-weight: 800; }
.ksp-pk-sec__head h2 .material-symbols-rounded { color: var(--ksp-primary); font-size: 21px; }
.ksp-pk-sec__head p { margin: 4px 0 0; color: var(--ksp-muted); font-size: .78rem; }
.ksp-pk-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .74rem; font-weight: 700; }
.ksp-pk-chip.is-soft { background: var(--ksp-surface-2); color: var(--ksp-muted); }
.ksp-pk-chip.is-green { border-color: rgba(16, 163, 74, .35); background: rgba(16, 163, 74, .1); color: #0f9d58; }
.ksp-pk-chip .material-symbols-rounded { font-size: 17px; }
.ksp-pk-state { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .68rem; font-weight: 800; }
.ksp-pk-state .material-symbols-rounded { font-size: 15px; }
.ksp-pk-state.is-green { background: rgba(16, 163, 74, .12); color: #0f9d58; }
.ksp-pk-state.is-amber { background: rgba(217, 119, 6, .12); color: #b45309; }
.ksp-pk-state.is-blue { background: rgba(37, 99, 235, .12); color: #2563eb; }
.ksp-pk-state.is-rose { background: var(--ksp-primary-50); color: var(--ksp-primary); }
/* Randevu akışı */
.ksp-pk-appts { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-pk-appt { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); }
.ksp-pk-appt.is-other { background: var(--ksp-surface-2); }
.ksp-pk-appt__time { display: grid; place-items: center; flex: 0 0 auto; width: 74px; padding: 8px 0; border-radius: 12px; background: var(--ksp-text); color: var(--ksp-surface); }
.ksp-pk-appt__time strong { font-size: 1rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.ksp-pk-appt__time small { opacity: .65; font-size: .7rem; font-variant-numeric: tabular-nums; }
.ksp-pk-appt__body { flex: 1 1 240px; min-width: 0; }
.ksp-pk-appt__top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; font-size: .92rem; }
.ksp-pk-appt__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 6px 0 0; color: var(--ksp-muted); font-size: .76rem; }
.ksp-pk-appt__meta span { display: inline-flex; align-items: center; gap: 4px; }
.ksp-pk-appt__meta .material-symbols-rounded { font-size: 16px; }
.ksp-pk-appt__svc { padding: 3px 9px; border-radius: 999px; background: var(--ksp-surface-2); }
.ksp-pk-appt__end { margin-inline-start: auto; text-align: end; }
.ksp-pk-appt__end strong { display: block; font-size: 1.02rem; font-weight: 800; }
.ksp-pk-appt__end small { color: var(--ksp-muted); font-size: .72rem; }
/* Raporum ekranı (sahip isteği 2026-09-25; KARARLAR §53) */
.ksp-pk-range { display: flex; align-items: center; gap: 6px; margin: 0; flex-wrap: wrap; }
.ksp-pk-range__sep { color: var(--ksp-muted); }
.ksp-pk-rapor { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: 10px; margin-bottom: 14px; }
.ksp-pk-rapor__card { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px 14px;
  border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); }
.ksp-pk-rapor__card strong { font-size: 1.5rem; font-weight: 800; line-height: 1.1; }
.ksp-pk-rapor__card small { color: var(--ksp-muted); font-size: .76rem; font-weight: 600; }
.ksp-pk-rapor__ico { display: grid; place-items: center; width: 30px; height: 30px; margin-bottom: 4px; border-radius: 9px;
  background: var(--ksp-surface-2); color: var(--ksp-muted); }
.ksp-pk-rapor__ico .material-symbols-rounded { font-size: 18px; }
.ksp-pk-rapor__card.is-green .ksp-pk-rapor__ico { background: color-mix(in srgb, var(--ksp-success) 14%, transparent); color: var(--ksp-success); }
.ksp-pk-rapor__card.is-rose .ksp-pk-rapor__ico { background: color-mix(in srgb, var(--ksp-danger) 12%, transparent); color: var(--ksp-danger); }
.ksp-pk-rapor__card.is-blue .ksp-pk-rapor__ico { background: var(--ksp-primary-50); color: var(--ksp-primary); }
.ksp-pk-rapor__card.is-amber .ksp-pk-rapor__ico { background: color-mix(in srgb, #f59e0b 16%, transparent); color: #b45309; }
.ksp-pk-rapor__money { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; }
.ksp-pk-rapor__money > div { padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-pk-rapor__money small { display: block; color: var(--ksp-muted); font-size: .76rem; font-weight: 700; }
.ksp-pk-rapor__money strong { display: block; margin: 2px 0; font-size: 1.35rem; font-weight: 800; }
.ksp-pk-rapor__money strong.is-green { color: var(--ksp-success); }
.ksp-pk-rapor__money strong.is-rose { color: var(--ksp-danger); }
.ksp-pk-rapor__money span { color: var(--ksp-muted); font-size: .72rem; }
.ksp-pk-gecmis { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-pk-gecmis__item { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; }
.ksp-pk-gecmis__ico { display: grid; place-items: center; flex-shrink: 0; width: 30px; height: 30px; border-radius: 9px;
  background: var(--ksp-surface-2); color: var(--ksp-muted); }
.ksp-pk-gecmis__ico .material-symbols-rounded { font-size: 17px; }
.ksp-pk-gecmis__body { display: flex; flex-direction: column; min-width: 0; gap: 1px; font-size: .84rem; }
.ksp-pk-gecmis__body small { color: var(--ksp-muted); font-size: .75rem; }
.ksp-pk-gecmis__when { font-variant-numeric: tabular-nums; }
.ksp-pk-gecmis__sum { margin-inline-start: auto; font-weight: 800; font-size: .86rem; }
.ksp-pk-gecmis__sum.is-green { color: var(--ksp-success); }
.ksp-pk-gecmis__sum.is-rose { color: var(--ksp-danger); }

/* Gün seçici + yaklaşan randevular (sahip isteği 2026-09-25; KARARLAR §53) */
.ksp-pk-gunsec { display: flex; align-items: center; gap: 6px; margin: 0; }
.ksp-pk-gunsec__nav { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--ksp-border); border-radius: 10px;
  background: var(--ksp-surface); color: var(--ksp-text); text-decoration: none; }
.ksp-pk-gunsec__nav:hover { border-color: var(--ksp-muted); }
.ksp-pk-gunsec__input { height: 34px; padding: 0 8px; border: 1px solid var(--ksp-border); border-radius: 10px;
  background: var(--ksp-surface); color: var(--ksp-text); font-size: .8rem; font-family: inherit; }
.ksp-pk-gunsec__today { display: inline-flex; align-items: center; height: 34px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 10px;
  background: var(--ksp-text); color: var(--ksp-surface); font-size: .76rem; font-weight: 700; text-decoration: none; cursor: pointer; }
.ksp-pk-gunsec__label { display: flex; align-items: center; gap: 6px; margin: 0 0 12px; color: var(--ksp-muted); font-size: .8rem; font-weight: 600; }
.ksp-pk-gunsec__label .material-symbols-rounded { font-size: 17px; }
.ksp-pk-next { display: flex; flex-direction: column; gap: 12px; }
.ksp-pk-next__day { border: 1px solid var(--ksp-border); border-radius: 14px; overflow: hidden; }
.ksp-pk-next__head { display: flex; align-items: center; gap: 8px; padding: 10px 14px; background: var(--ksp-surface-2);
  color: var(--ksp-text); text-decoration: none; font-size: .84rem; }
.ksp-pk-next__head:hover { background: var(--ksp-primary-50); }
.ksp-pk-next__head small { margin-inline-start: auto; color: var(--ksp-muted); font-size: .74rem; }
.ksp-pk-next__list { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.ksp-pk-next__item { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--ksp-border); font-size: .82rem; }
.ksp-pk-next__item.is-other { opacity: .72; }
.ksp-pk-next__time { flex: 0 0 auto; padding: 3px 9px; border-radius: 8px; background: var(--ksp-text); color: var(--ksp-surface);
  font-size: .76rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.ksp-pk-next__who { display: flex; flex-direction: column; min-width: 0; flex: 1 1 160px; }
.ksp-pk-next__who small { overflow: hidden; color: var(--ksp-muted); font-size: .74rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-pk-next__sum { margin-inline-start: auto; font-weight: 800; }

/* Randevu işlemleri (sahip isteği 2026-09-25; KARARLAR §50): satırın altında açılır işlem şeridi.
   Kapalıyken satırın görünümü DEĞİŞMEZ — yalnız küçük bir "İşlem" düğmesi eklenir. */
.ksp-pk-islem { flex: 1 0 100%; margin-top: 10px; border-top: 1px dashed var(--ksp-border); padding-top: 10px; }
.ksp-pk-islem > summary { display: inline-flex; align-items: center; gap: 5px; width: fit-content; padding: 5px 12px; border: 1px solid var(--ksp-border); border-radius: 999px;
  background: var(--ksp-surface-2); color: var(--ksp-text); font-size: .76rem; font-weight: 700; cursor: pointer; list-style: none; }
.ksp-pk-islem > summary::-webkit-details-marker { display: none; }
.ksp-pk-islem > summary:hover { border-color: var(--ksp-muted); }
.ksp-pk-islem > summary .material-symbols-rounded { font-size: 16px; color: var(--ksp-muted); }
.ksp-pk-islem[open] > summary { background: var(--ksp-text); border-color: var(--ksp-text); color: var(--ksp-surface); }
.ksp-pk-islem[open] > summary .material-symbols-rounded { color: inherit; }
.ksp-pk-islem__body { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.ksp-pk-islem__input { flex: 1 1 130px; min-width: 0; height: 34px; padding: 0 10px; border: 1px solid var(--ksp-border); border-radius: 10px;
  background: var(--ksp-surface); color: var(--ksp-text); font-size: .78rem; font-family: inherit; }
.ksp-pk-islem__input:focus { outline: 2px solid var(--ksp-primary); outline-offset: 1px; }
.ksp-pk-islem__btn { display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; height: 34px; padding: 0 14px; border: 1px solid var(--ksp-border); border-radius: 10px;
  background: var(--ksp-surface); color: var(--ksp-text); font-size: .76rem; font-weight: 700; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.ksp-pk-islem__btn .material-symbols-rounded { font-size: 17px; }
.ksp-pk-islem__btn:hover { border-color: var(--ksp-muted); }
.ksp-pk-islem__btn.is-ok { background: var(--ksp-text); border-color: var(--ksp-text); color: var(--ksp-surface); }
.ksp-pk-islem__btn.is-danger { border-color: var(--ksp-danger); color: var(--ksp-danger); }
.ksp-pk-islem__btn.is-danger:hover { background: var(--ksp-danger); color: #fff; }
/* Durum düğmeleri tek satırda (sahip geri bildirimi 2026-09-25): Onayla · Tamamlandı · Gelmedi */
.ksp-pk-islem__ayir { display: flex; align-items: center; gap: 8px; margin: 12px 0 8px; color: var(--ksp-muted);
  font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.ksp-pk-islem__ayir::after { content: ''; flex: 1 1 auto; height: 1px; background: var(--ksp-border); }
/* Alan isteyen işlemler: çipe basınca YALNIZ o işlemin formu açılır (sahip geri bildirimi: "butonlar dağınık") */
.ksp-pk-ops { display: flex; flex-wrap: wrap; gap: 6px; }
.ksp-pk-op { flex: 0 0 auto; }
.ksp-pk-op[open] { flex: 1 1 100%; }
.ksp-pk-op > summary { display: inline-flex; align-items: center; gap: 5px; padding: 0 12px; height: 34px; border: 1px solid var(--ksp-border);
  border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .76rem; font-weight: 700;
  cursor: pointer; list-style: none; transition: background .15s, border-color .15s, color .15s; }
.ksp-pk-op > summary::-webkit-details-marker { display: none; }
.ksp-pk-op > summary:hover { border-color: var(--ksp-muted); }
.ksp-pk-op > summary .material-symbols-rounded { font-size: 17px; color: var(--ksp-muted); }
.ksp-pk-op[open] > summary { background: var(--ksp-text); border-color: var(--ksp-text); color: var(--ksp-surface); }
.ksp-pk-op[open] > summary .material-symbols-rounded { color: inherit; }
.ksp-pk-op__form { display: flex; flex-direction: column; gap: 8px; margin: 8px 0 0; padding: 12px;
  border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-pk-op__lead { margin: 0; color: var(--ksp-muted); font-size: .76rem; line-height: 1.45; }
.ksp-pk-op__lead b { color: var(--ksp-text); }
.ksp-pk-op__lbl { flex: 0 0 auto; color: var(--ksp-muted); font-size: .72rem; font-weight: 700; }
.ksp-pk-op__row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ksp-pk-op__row .ksp-pk-islem__input { flex: 1 1 130px; }
.ksp-pk-op__form > .ksp-pk-islem__input { flex: 0 0 auto; width: 100%; }
.ksp-pk-op__form .ksp-pk-islem__btn { align-self: flex-start; }
@media (max-width: 575.98px) { .ksp-pk-op { flex: 1 1 100%; } .ksp-pk-op > summary { justify-content: center; }
  .ksp-pk-op__form .ksp-pk-islem__btn { align-self: stretch; justify-content: center; } }

.ksp-pk-islem__durum { display: flex; flex-wrap: wrap; gap: 6px; }
.ksp-pk-islem__durum form { margin: 0; }
.ksp-pk-islem__btn.is-done { border-color: var(--ksp-success); color: var(--ksp-success); }
.ksp-pk-islem__btn.is-done:hover { background: var(--ksp-success); color: #fff; }
@media (max-width: 575.98px) { .ksp-pk-islem__durum form { flex: 1 1 100%; } }

@media (max-width: 575.98px) { .ksp-pk-islem__input { flex: 1 1 100%; } .ksp-pk-islem__btn { width: 100%; justify-content: center; } }

/* Haftalık vardiya */
.ksp-pk-week { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.ksp-pk-day { padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); }
.ksp-pk-day.is-off { background: var(--ksp-surface-2); }
.ksp-pk-day.is-today { border-color: var(--ksp-primary); box-shadow: 0 0 0 3px var(--ksp-primary-50); }
.ksp-pk-day__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0; font-size: .88rem; }
.ksp-pk-day__body { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 10px 0 0; color: var(--ksp-muted); font-size: .76rem; }
.ksp-pk-day__body strong { color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-pk-day__off { color: var(--ksp-muted); }
/* Teknik / sertifika listeleri */
.ksp-pk-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-pk-tag-item { display: inline-flex; align-items: center; gap: 4px; padding: 6px 8px 6px 12px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface-2); font-size: .8rem; font-weight: 600; }
.ksp-pk-tag-item > span { display: inline-flex; align-items: center; gap: 5px; }
.ksp-pk-tag-item .material-symbols-rounded { color: #0f9d58; font-size: 17px; }
.ksp-pk-x { display: grid; place-items: center; width: 22px; height: 22px; border: 0; border-radius: 50%; background: transparent; color: var(--ksp-muted); cursor: pointer; }
.ksp-pk-x:hover { background: var(--ksp-primary-50); color: var(--ksp-primary); }
.ksp-pk-x .material-symbols-rounded { font-size: 16px; }
.ksp-pk-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.ksp-pk-col h3 { display: flex; align-items: center; gap: 7px; margin: 0 0 10px; font-size: .88rem; font-weight: 800; }
.ksp-pk-col h3 .material-symbols-rounded { color: var(--ksp-primary); font-size: 19px; }
.ksp-pk-lines { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-pk-lines li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); font-size: .82rem; }
.ksp-pk-lines li > span { display: inline-flex; align-items: center; gap: 7px; min-width: 0; }
.ksp-pk-lines .material-symbols-rounded { color: #0f9d58; font-size: 18px; }
.ksp-pk-add { margin-top: 12px; }
.ksp-pk-add__row { display: flex; flex-wrap: wrap; gap: 8px; }
.ksp-pk-add__row .ksp-cash-input { flex: 1 1 200px; }
/* Yetki listesi (iki sütun) */
.ksp-pk-perms { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-pk-perms li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); }
.ksp-pk-perms li.is-on { border-color: rgba(16, 163, 74, .3); }
.ksp-pk-perms__text { min-width: 0; }
.ksp-pk-perms__text strong { display: block; font-size: .86rem; font-weight: 700; }
.ksp-pk-perms__text small { display: block; margin-top: 2px; color: var(--ksp-muted); font-size: .74rem; }
@media (max-width: 640px) {
    .ksp-pk-head, .ksp-pk-sec { padding: 12px 14px; }
    .ksp-pk-acts { width: 100%; }
    .ksp-pk-appt__end { margin-inline-start: 0; text-align: start; }
    /* Dar ekranda kartlar tek sütun; minmax(210px) iki sütun zorlayıp sayfayı yatay kaydırıyordu */
    .ksp-pk-kpis, .ksp-pk-week, .ksp-pk-perms, .ksp-pk-cols { grid-template-columns: 1fr; }
    .ksp-pk-appt { gap: 10px; }
    .ksp-pk-appt__time { width: 62px; }
    .ksp-pk-appt__svc { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .ksp-pk-id__text h1 { font-size: 1.08rem; }
    /* Sahip isteği 2026-09-20 "menüleri responsive yap": mobilde sekmeler kaymaz, 4'lü ızgarada iki satır olur */
    .ksp-pk-tabs__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; overflow: visible; }
    .ksp-pk-tab { position: relative; flex-direction: column; justify-content: flex-start; gap: 3px; min-height: 62px; padding: 9px 4px 7px; font-size: .62rem; line-height: 1.15; text-align: center; white-space: normal; }
    .ksp-pk-tab > span { display: block; width: 100%; word-break: break-word; }
    .ksp-pk-tab .material-symbols-rounded { font-size: 20px; }
    .ksp-pk-tab b { position: absolute; inset-block-start: 4px; inset-inline-end: 5px; padding: 0 5px; font-size: .56rem; }
}
@media (min-width: 641px) and (max-width: 1120px) {
    /* Tablette şerit kayar: kenarda solma ile "devamı var" hissi */
    .ksp-pk-tabs { position: relative; }
    .ksp-pk-tabs::after { content: ""; position: absolute; inset-block: 6px; inset-inline-end: 6px; width: 28px; border-radius: 0 12px 12px 0; background: linear-gradient(to left, var(--ksp-surface), transparent); pointer-events: none; }
}
/* Personel Kokpiti > Satışlarım (KARARLAR §18) */
.ksp-pk-kpis--inline { margin-bottom: 16px; }
.ksp-pk-sales { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-pk-sales > li { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); }
.ksp-pk-sales__type { display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; padding: 5px 10px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .7rem; font-weight: 800; }
.ksp-pk-sales__type.is-pkg { background: #fde3b5; color: #92400e; }
.ksp-pk-sales__type .material-symbols-rounded { font-size: 16px; }
.ksp-pk-sales__body { flex: 1 1 220px; min-width: 0; }
.ksp-pk-sales__name { margin: 0; font-size: .88rem; font-weight: 700; }
.ksp-pk-sales__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 4px 0 0; color: var(--ksp-muted); font-size: .74rem; }
.ksp-pk-sales__end { margin-inline-start: auto; text-align: end; }
.ksp-pk-sales__end strong { display: block; font-size: .95rem; font-weight: 800; }
.ksp-pk-sales__end small { color: var(--ksp-muted); font-size: .74rem; }
.ksp-pk-sales__end small.is-green { color: #0f9d58; font-weight: 700; }
@media (max-width: 640px) { .ksp-pk-sales__end { margin-inline-start: 0; text-align: start; } }
/* @personel-kokpit-son */

/* @uzman-sayfa-3 — Uzman tanıtım sayfası tasarım revizyonu (sahip görselleri 2026-09-20):
   koyu şeritten salon / tecrübe / doğrulama çipleri kalktı → künye şeridi (.ksp-stfp-stats);
   tüm sekme kartları aynı dile çevrildi: küçük büyük harfli etiket + büyük başlık + ince ayraç + çerçeveli alt kartlar. */
/* Künye TEK bant (sahip görseli 209, 2026-09-23): ayrı kartlar yerine dikey ayraçlı ölçüler + sağda "Randevu Al",
   altında salonun iletişim satırı. Ölçü sayısı değişebilir; sütunlar eşit paylaşır. */
.ksp-stfp-band { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; margin: 0 0 12px; padding: 6px 14px 6px 0; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-stfp-band__cta { flex-shrink: 0; }
.ksp-stfp-stats { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 0; margin: 0; padding: 0; list-style: none; }
.ksp-stfp-stats > li { padding: 12px 18px; text-align: center; border-inline-start: 1px solid var(--ksp-border); }
.ksp-stfp-stats > li:first-child { border-inline-start: 0; }
.ksp-stfp-stats__value { display: flex; align-items: baseline; justify-content: center; gap: 6px; margin: 0; font-size: 1.5rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-stfp-stats__value .material-symbols-rounded { align-self: center; font-size: 22px; }
.ksp-stfp-stats__value small { color: var(--ksp-muted); font-size: .76rem; font-weight: 600; }
.ksp-stfp-stats__value.is-amber .material-symbols-rounded { color: #f59e0b; }
.ksp-stfp-stats__value.is-green { color: #0f9d58; }
.ksp-stfp-stats__value.is-green .material-symbols-rounded { color: #0f9d58; }
.ksp-stfp-stats__value.is-name strong { font-size: 1.05rem; line-height: 1.25; }
.ksp-stfp-stats__note { margin: 4px 0 0; color: var(--ksp-muted); font-size: .66rem; font-weight: 800; letter-spacing: .06em; line-height: 1.4; text-transform: uppercase; }
/* Salonun iletişim satırı (uzmanın kendi numarası değil): dolu olan düğmeler eşit paylaşır */
.ksp-stfp-acts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 0 0 16px; padding: 0; list-style: none; }
.ksp-stfp-acts a { display: flex; align-items: center; justify-content: center; gap: 8px; height: 46px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .84rem; font-weight: 700; text-decoration: none; transition: border-color .15s, background .15s; }
.ksp-stfp-acts a:hover { border-color: var(--ksp-primary); background: var(--ksp-primary-50); color: var(--ksp-primary); }
.ksp-stfp-acts .material-symbols-rounded { font-size: 19px; color: var(--ksp-muted); }
.ksp-stfp-acts a:hover .material-symbols-rounded { color: var(--ksp-primary); }
/* Kart dili */
.ksp-stfp-card { padding: 26px 28px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-stfp-card + .ksp-stfp-card { margin-top: 16px; }
.ksp-stfp-head { padding-bottom: 16px; margin-bottom: 18px; border-bottom: 1px solid var(--ksp-border); }
.ksp-stfp-eyebrow { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin: 0; color: var(--ksp-muted); font-size: .68rem; font-weight: 700; letter-spacing: .09em; }
.ksp-stfp-head__badge { padding: 3px 10px; border-radius: 999px; background: var(--ksp-primary-50); color: var(--ksp-primary); font-size: .66rem; font-weight: 800; letter-spacing: .02em; }
.ksp-stfp-h2 { margin: 8px 0 0; font-size: 1.3rem; font-weight: 800; line-height: 1.3; letter-spacing: -.01em; }
.ksp-stfp-head__lead { margin: 6px 0 0; color: var(--ksp-muted); font-size: .84rem; line-height: 1.55; }
.ksp-stfp-bio { margin: 0; padding: 16px 18px; border-radius: 14px; background: var(--ksp-surface-2); color: var(--ksp-text); font-size: .93rem; line-height: 1.75; }
.ksp-stfp-quote { display: flex; gap: 10px; margin: 14px 0 0; padding: 12px 16px; border: 0; border-inline-start: 3px solid var(--ksp-primary); border-radius: 0 12px 12px 0; background: var(--ksp-primary-50); font-size: .88rem; line-height: 1.6; }
.ksp-stfp-quote .material-symbols-rounded { color: var(--ksp-primary); font-size: 19px; }
/* Bölüm etiketi (kart içinde) */
.ksp-stfp-label { margin: 22px 0 10px; color: var(--ksp-muted); font-size: .68rem; font-weight: 700; letter-spacing: .09em; }
/* İki sütunlu özellik kartları */
.ksp-stfp-feats { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; margin: 18px 0 0; padding: 0; list-style: none; }
.ksp-stfp-feats--list { margin-top: 0; }
.ksp-stfp-feats > li { padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); }
.ksp-stfp-feat__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: .88rem; font-weight: 700; }
.ksp-stfp-feat__title .material-symbols-rounded { color: var(--ksp-primary); font-size: 19px; }
.ksp-stfp-feat__text { margin: 6px 0 0; color: var(--ksp-muted); font-size: .8rem; line-height: 1.55; }
/* Dörtlü mini kart ızgarası (ürünler, teknikler) */
.ksp-stfp-mini { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.ksp-stfp-mini > li { padding: 13px 15px; border: 1px solid var(--ksp-border); border-radius: 13px; background: var(--ksp-surface); }
.ksp-stfp-mini strong { display: block; font-size: .85rem; font-weight: 700; line-height: 1.35; }
.ksp-stfp-mini small { display: block; margin-top: 3px; color: var(--ksp-muted); font-size: .74rem; }
/* Uzmanlık etiketleri */
.ksp-stfp-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-stfp-tags > li { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); font-size: .8rem; font-weight: 600; }
.ksp-stfp-tags .material-symbols-rounded { color: #0f9d58; font-size: 17px; }
/* Hizmet satırları */
.ksp-stfp-svc { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-stfp-svc > li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
/* Çalışma saatleri satırları */
.ksp-stfp-hours { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-stfp-hours > li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 15px; border: 1px solid var(--ksp-border); border-radius: 13px; background: var(--ksp-surface); font-size: .85rem; }
.ksp-stfp-hours > li.is-today { border-color: var(--ksp-primary); box-shadow: 0 0 0 3px var(--ksp-primary-50); }
.ksp-stfp-hours small { color: var(--ksp-primary); font-size: .68rem; font-weight: 800; }
.ksp-stfp-hours bdi { font-variant-numeric: tabular-nums; font-weight: 700; }
.ksp-stfp-hours bdi.is-off { color: var(--ksp-muted); font-weight: 600; }
/* Yorum kartları */
.ksp-stfp-reviews { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.ksp-stfp-reviews > li { padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); }
.ksp-stfp-empty { margin: 0; padding: 18px; border: 1px dashed var(--ksp-border); border-radius: 14px; color: var(--ksp-muted); font-size: .85rem; text-align: center; }
@media (max-width: 640px) {
    .ksp-stfp-card { padding: 18px 16px; }
    .ksp-stfp-h2 { font-size: 1.12rem; }
    /* Dar ekranda bant tek sütun: ölçüler 2×2, düğme tam genişlik */
    .ksp-stfp-band { grid-template-columns: minmax(0, 1fr); padding: 6px 12px 12px; }
    .ksp-stfp-stats { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ksp-stfp-stats > li { padding: 12px 10px; border-inline-start: 0; }
    .ksp-stfp-stats > li:nth-child(n + 3) { border-top: 1px solid var(--ksp-border); }
    .ksp-stfp-stats > li:nth-child(2n) { border-inline-start: 1px solid var(--ksp-border); }
    .ksp-stfp-stats > li:last-child:nth-child(odd) { grid-column: 1 / -1; } /* tek kalan ölçü satırı ortalar */
    .ksp-stfp-stats__value { font-size: 1.22rem; }
    .ksp-stfp-stats__value.is-name strong { font-size: .92rem; }
    .ksp-stfp-stats__note { font-size: .62rem; }
    .ksp-stfp-band__cta { width: 100%; }
    .ksp-stfp-acts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ksp-stfp-mini, .ksp-stfp-feats, .ksp-stfp-hours { grid-template-columns: 1fr; }
}
/* @uzman-sayfa-3-son */

/* Kokpit: kullanılan ürünler kartı (sahip tasarımı 2026-09-20) */
.ksp-sprof-products { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; margin: 12px 0 0; padding: 0; list-style: none; }
.ksp-sprof-products > li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-sprof-products strong { display: block; font-size: .84rem; font-weight: 700; }
.ksp-sprof-products small { display: block; margin-top: 2px; color: var(--ksp-muted); font-size: .74rem; }
.ksp-stfp-hours > li { flex-wrap: wrap; }

/* @bolum-sec — Salon / uzman sayfası sekmeleri mobilde (≤767 px) "Bölüm seçin" düğmesi + alt sayfa olur
   (sahip tasarımı 2026-09-20: yatay kayan şeritte son sekmeler görünmüyordu). Düğme ve liste app.js'te kurulur. */
.ksp-sp-pick { display: none; }
.ksp-sp-sheet { display: none; }
@media (max-width: 767.98px) {
    .ksp-sp-tabs { display: none !important; }
    .ksp-sp-pick { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; margin: 12px 0 14px; padding: 13px 16px; border: 1px solid var(--ksp-border); border-radius: 13px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .92rem; font-weight: 700; text-align: start; }
    .ksp-sp-pick[aria-expanded="true"] { border-color: var(--ksp-primary); box-shadow: 0 0 0 3px var(--ksp-primary-50); }
    .ksp-sp-pick__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .ksp-sp-pick .material-symbols-rounded { flex: 0 0 auto; color: var(--ksp-muted); font-size: 22px; transition: transform .18s ease; }
    .ksp-sp-pick[aria-expanded="true"] .material-symbols-rounded { transform: rotate(180deg); }
    .ksp-sp-sheet { display: block; position: fixed; inset: 0; z-index: 1090; }
    .ksp-sp-sheet[hidden] { display: none; }
    .ksp-sp-sheet__back { position: absolute; inset: 0; background: rgba(28, 25, 23, .5); animation: kspSheetFade .18s ease; }
    .ksp-sp-sheet__box { position: absolute; inset-inline: 0; inset-block-end: 0; max-height: 76vh; overflow-y: auto; padding-bottom: max(10px, env(safe-area-inset-bottom)); border-radius: 22px 22px 0 0; background: var(--ksp-surface); box-shadow: 0 -12px 40px rgba(28, 25, 23, .22); animation: kspSheetUp .22s cubic-bezier(.2, .8, .3, 1); }
    .ksp-sp-sheet__grip { display: block; width: 44px; height: 4px; margin: 9px auto 4px; border-radius: 999px; background: var(--ksp-border); }
    .ksp-sp-sheet__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 18px 12px; }
    .ksp-sp-sheet__head h2 { margin: 0; font-size: .95rem; font-weight: 800; }
    .ksp-sp-sheet__x { display: grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 50%; background: var(--ksp-surface-2); color: var(--ksp-muted); }
    .ksp-sp-sheet__x .material-symbols-rounded { font-size: 19px; }
    .ksp-sp-sheet__list { margin: 0; padding: 0 0 8px; list-style: none; }
    .ksp-sp-sheet__list li + li { border-top: 1px solid var(--ksp-border); }
    .ksp-sp-sheet__list button { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 15px 18px; border: 0; border-radius: 0; background: transparent; color: var(--ksp-text); font-size: .92rem; font-weight: 600; text-align: start; }
    .ksp-sp-sheet__list .material-symbols-rounded { flex: 0 0 auto; font-size: 20px; opacity: 0; }
    .ksp-sp-sheet__list button.is-on { background: var(--ksp-primary-50); color: var(--ksp-primary); font-weight: 800; }
    .ksp-sp-sheet__list button.is-on .material-symbols-rounded { opacity: 1; }
    body.ksp-sp-sheet-open { overflow: hidden; }
}
@keyframes kspSheetUp { from { transform: translateY(14%); opacity: .6; } to { transform: none; opacity: 1; } }
@keyframes kspSheetFade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
    .ksp-sp-sheet__box, .ksp-sp-sheet__back { animation: none; }
}
/* @bolum-sec-son */

/* @uzman-sayfa-4 — Tanıtım şeridi sahip görsellerine göre yenilendi (2026-09-20):
   koyu zemin yerine AÇIK/şeffaf kart, solda büyük portre fotoğraf + koyu künye bandı, sağda ad · doğrulama · unvan.
   Uzmanlık etiketleri ✦ işaretli açık pill'lere döndü. Önceki koyu şerit kuralları burada eziliyor. */
.ksp-stfp-hero { margin: 16px 0 14px; padding: 22px 24px; border: 1px solid var(--ksp-border); border-radius: 22px; background: linear-gradient(135deg, var(--ksp-surface), var(--ksp-surface-2) 70%); color: var(--ksp-text); }
.ksp-stfp-hero__chips { margin-bottom: 18px; }
.ksp-stfp-hero .ksp-stfp-chip { border: 1px solid var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-muted); }
.ksp-stfp-hero .ksp-stfp-chip.is-violet { border-color: rgba(124, 58, 237, .28); background: rgba(124, 58, 237, .1); color: #6d28d9; }
.ksp-stfp-hero .ksp-stfp-chip.is-violet .material-symbols-rounded { color: #6d28d9; }
.ksp-stfp-hero__row { display: flex; flex-wrap: wrap; align-items: center; gap: 26px; }
/* Fotoğraf: büyük portre kart + alt künye bandı */
.ksp-stfp-photo { position: relative; flex: 0 0 auto; width: 258px; margin: 0; padding: 10px; border-radius: 26px; background: var(--ksp-surface); box-shadow: 0 10px 30px rgba(28, 25, 23, .1); }
.ksp-stfp-photo__img { display: grid; place-items: center; width: 100%; aspect-ratio: 4 / 5; border-radius: 18px; background: var(--ksp-surface-2) center/cover no-repeat; color: var(--ksp-muted); font-size: 2rem; font-weight: 800; }
.ksp-stfp-photo__badge { position: absolute; inset-inline: 18px; inset-block-end: 20px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 11px; border-radius: 12px; background: rgba(28, 25, 23, .82); color: #fafaf9; font-size: .66rem; font-weight: 700; white-space: nowrap; backdrop-filter: blur(4px); }
.ksp-stfp-photo__badge span { display: inline-flex; align-items: center; gap: 4px; }
.ksp-stfp-photo__badge .material-symbols-rounded { color: #fbbf24; font-size: 15px; }
.ksp-stfp-photo__badge b { color: #d6d3d1; font-weight: 600; white-space: nowrap; }
/* Ad, doğrulama, unvan */
.ksp-stfp-hero__text { flex: 1 1 280px; min-width: 0; }
.ksp-stfp-hero__name { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0; font-size: clamp(1.7rem, 3.4vw, 2.4rem); font-weight: 800; letter-spacing: -.02em; }
.ksp-stfp-hero__ok { display: inline-flex; position: static; inset: auto; width: auto; height: auto; background: none; box-shadow: none; }
.ksp-stfp-hero__ok .material-symbols-rounded { color: #f5b301; font-size: 26px; }
.ksp-stfp-hero__sex { padding: 4px 11px; border-radius: 999px; background: var(--ksp-primary-50); color: var(--ksp-primary); font-size: .68rem; font-weight: 800; }
.ksp-stfp-hero__title { margin: 8px 0 0; color: var(--ksp-primary); font-size: 1.02rem; font-weight: 700; }
.ksp-stfp-hero__meta { margin: 10px 0 0; color: var(--ksp-muted); font-size: .88rem; }
.ksp-stfp-hero__head { display: inline-flex; align-items: center; gap: 6px; padding: 0; background: none; }
/* Salon logosu filigranı: açık zeminde koyu silüet */
.ksp-stfp-hero__brand img { opacity: .07; filter: grayscale(1) brightness(0); }
.ksp-stfp-hero__brandText { color: rgba(28, 25, 23, .07); }
/* Uzmanlık etiketleri: ✦ işaretli açık pill (sahip görseli) */
.ksp-stfp-tags > li { gap: 8px; padding: 8px 14px; border-radius: 11px; background: var(--ksp-surface-2); font-size: .82rem; }
.ksp-stfp-tags__mark { color: var(--ksp-text); font-size: .8rem; line-height: 1; }
@media (max-width: 767.98px) {
    .ksp-stfp-hero { padding: 16px; border-radius: 18px; }
    .ksp-stfp-hero__row { gap: 16px; }
    .ksp-stfp-photo { width: 158px; padding: 7px; border-radius: 20px; }
    .ksp-stfp-photo__img { border-radius: 14px; font-size: 1.5rem; }
    .ksp-stfp-photo__badge { inset-inline: 13px; inset-block-end: 14px; flex-wrap: wrap; gap: 2px 8px; padding: 6px 9px; font-size: .62rem; }
    .ksp-stfp-hero__name { font-size: 1.45rem; }
}
[data-bs-theme="dark"] .ksp-stfp-hero__brand img { opacity: .1; filter: grayscale(1) brightness(0) invert(1); }
[data-bs-theme="dark"] .ksp-stfp-hero__brandText { color: rgba(255, 255, 255, .08); }
/* @uzman-sayfa-4-son */

/* @uzman-sayfa-5 — İmza Teknikler, Diplomalar ve Müşteri Yorumları bölümleri sahip görsellerine göre (2026-09-20):
   teknik kartı (rozet, süre/kategori/deneyim, protokol aşamaları), doğrulanmış diploma kartları,
   yıldız dağılımı + onaylı randevu rozetli yorum kartları. Şeritte imza teknik çipleri. */
.ksp-stfp-hero__tags { margin-top: 14px; }
.ksp-stfp-hero__tags .is-more { background: var(--ksp-primary-50); color: var(--ksp-primary); font-weight: 800; }
/* İmza teknik kartları */
.ksp-stfp-techs { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; list-style: none; }
.ksp-stfp-tech { padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-stfp-tech__top { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ksp-stfp-tech__name { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin: 0; font-size: 1.02rem; font-weight: 800; }
.ksp-stfp-tech__badge { padding: 4px 9px; border-radius: 7px; background: var(--ksp-text); color: var(--ksp-surface); font-size: .6rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.ksp-stfp-tech__meta { margin: 6px 0 0; color: var(--ksp-primary); font-size: .78rem; font-weight: 600; }
.ksp-stfp-tech__btn { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; padding: 9px 16px; border-radius: 10px; background: var(--ksp-text); color: var(--ksp-surface); font-size: .8rem; font-weight: 700; }
.ksp-stfp-tech__btn:hover { background: var(--ksp-primary); color: #fff; }
.ksp-stfp-tech__text { margin: 12px 0 0; color: var(--ksp-text); font-size: .88rem; line-height: 1.65; }
.ksp-stfp-steps { margin-top: 14px; padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 13px; background: var(--ksp-surface-2); }
.ksp-stfp-steps .ksp-stfp-label { margin: 0 0 10px; }
.ksp-stfp-steps ol { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
/* Başlık ve açıklama alt alta dursun: dış kurallardan gelen flex satırını ez */
.ksp-stfp-steps ol > li { display: block; }
.ksp-stfp-steps__title { margin: 0; font-size: .82rem; font-weight: 700; }
.ksp-stfp-steps__text { margin: 4px 0 0; color: var(--ksp-muted); font-size: .76rem; line-height: 1.5; }
/* Diploma / sertifika kartları */
.ksp-stfp-diplomas { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.ksp-stfp-diplomas > li { padding: 16px 18px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-stfp-diploma__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.ksp-stfp-diploma__ico { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--ksp-text); color: #fbbf24; }
.ksp-stfp-diploma__ico .material-symbols-rounded { font-size: 20px; }
.ksp-stfp-diploma__tag { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border: 1px solid rgba(16, 163, 74, .3); border-radius: 8px; background: rgba(16, 163, 74, .1); color: #0f9d58; font-size: .6rem; font-weight: 800; letter-spacing: .03em; }
.ksp-stfp-diploma__tag .material-symbols-rounded { font-size: 14px; }
.ksp-stfp-diploma__title { margin: 0; font-size: .95rem; font-weight: 800; line-height: 1.35; }
.ksp-stfp-diploma__org { margin: 5px 0 0; color: var(--ksp-muted); font-size: .8rem; font-weight: 600; }
.ksp-stfp-diploma__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin: 12px 0 0; padding-top: 10px; border-top: 1px solid var(--ksp-border); color: var(--ksp-muted); font-size: .72rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
/* Yorum özeti: yıldız dağılımı + doğrulanmış randevu kutusu */
.ksp-stfp-rsum { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; margin-bottom: 16px; padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-stfp-bars { display: flex; flex-direction: column; gap: 7px; margin: 0; padding: 0; list-style: none; }
.ksp-stfp-bars > li { display: flex; align-items: center; gap: 10px; font-size: .74rem; color: var(--ksp-muted); }
.ksp-stfp-bars > li > span:first-child { flex: 0 0 60px; }
.ksp-stfp-bars__track { flex: 1 1 auto; height: 7px; border-radius: 999px; background: var(--ksp-surface); overflow: hidden; }
.ksp-stfp-bars__fill { display: block; height: 100%; border-radius: 999px; background: var(--ksp-text); }
.ksp-stfp-bars b { flex: 0 0 34px; text-align: end; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-stfp-rnote { padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); }
.ksp-stfp-rnote p { display: flex; align-items: center; gap: 7px; margin: 0; color: #0f9d58; font-size: .82rem; font-weight: 700; }
.ksp-stfp-rnote .material-symbols-rounded { font-size: 19px; }
.ksp-stfp-rnote small { display: block; margin-top: 5px; color: var(--ksp-muted); font-size: .75rem; line-height: 1.5; }
/* Yorum kartı */
.ksp-stfp-reviews__top { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ksp-stfp-reviews__ava { display: grid; place-items: center; flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%; background: var(--ksp-text); color: var(--ksp-surface); font-size: .74rem; font-weight: 800; }
.ksp-stfp-reviews__id { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; flex: 1 1 200px; min-width: 0; }
.ksp-stfp-reviews__id strong { font-size: .88rem; font-weight: 700; }
.ksp-stfp-reviews__id small { flex-basis: 100%; color: var(--ksp-muted); font-size: .74rem; }
.ksp-stfp-reviews__ok { display: inline-flex; align-items: center; gap: 3px; padding: 3px 8px; border: 1px solid rgba(16, 163, 74, .3); border-radius: 999px; background: rgba(16, 163, 74, .1); color: #0f9d58; font-size: .64rem; font-weight: 800; }
.ksp-stfp-reviews__ok .material-symbols-rounded { font-size: 13px; }
.ksp-stfp-reviews__stars { margin-inline-start: auto; color: #f59e0b; white-space: nowrap; }
.ksp-stfp-reviews__stars .material-symbols-rounded { font-size: 17px; }
.ksp-stfp-reviews__stars .is-empty { color: var(--ksp-border); }
.ksp-stfp-reviews__text { margin: 10px 0 0; font-size: .88rem; line-height: 1.65; }
.ksp-stfp-reviews__foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 10px 0 0; padding-top: 9px; border-top: 1px solid var(--ksp-border); color: var(--ksp-muted); font-size: .74rem; }
@media (max-width: 640px) {
    .ksp-stfp-tech { padding: 14px 15px; }
    .ksp-stfp-tech__btn { width: 100%; justify-content: center; }
    .ksp-stfp-steps ol, .ksp-stfp-diplomas { grid-template-columns: 1fr; }
    .ksp-stfp-reviews__stars { margin-inline-start: 0; flex-basis: 100%; }
}
/* @uzman-sayfa-5-son */

/* Panel: imza teknik ayrıntısı + belge kartları listeleri (sahip görselleri 2026-09-20) */
.ksp-sprof-techlist, .ksp-sprof-certs { display: flex; flex-direction: column; gap: 8px; margin: 12px 0 16px; padding: 0; list-style: none; }
.ksp-sprof-techlist > li, .ksp-sprof-certs > li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 14px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-sprof-techlist__name, .ksp-sprof-certs__title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; font-size: .86rem; font-weight: 700; }
.ksp-sprof-techlist__name span, .ksp-sprof-certs__title span { padding: 2px 8px; border-radius: 999px; background: var(--ksp-primary-50); color: var(--ksp-primary); font-size: .62rem; font-weight: 800; }
.ksp-sprof-techlist__meta, .ksp-sprof-certs__meta { margin: 4px 0 0; color: var(--ksp-muted); font-size: .74rem; }
.ksp-sprof-techform .ksp-cash-cols { margin-bottom: 4px; }

.ksp-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
/* @sadakat — Salon Kokpiti > Sadakat & Seans Paketleri (/kokpit/sadakat), kullanıcı tasarımı 2026-09-20 (KARARLAR §18):
   koyu amber tanıtım şeridi + 4 KPI, dört sekme, damga kartı ızgarası, paket satış / seans düşme ve win-back listesi. */
.ksp-loy { display: flex; flex-direction: column; gap: 16px; max-width: 1240px; margin: 0 auto; }
.ksp-loy-hero { padding: 22px 26px; border-radius: 20px; background: linear-gradient(120deg, #1c1917 0%, #2a1c0f 45%, #4a2a09 100%); color: #fafaf9; }
.ksp-loy-hero__row { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 16px; }
.ksp-loy-hero__text { flex: 1 1 380px; min-width: 0; }
.ksp-loy-hero__badge { display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px; border-radius: 999px; background: rgba(251, 191, 36, .18); color: #fcd34d; font-size: .66rem; font-weight: 800; letter-spacing: .05em; }
.ksp-loy-hero__badge .material-symbols-rounded { font-size: 16px; }
.ksp-loy-hero h1 { margin: 12px 0 0; font-size: clamp(1.3rem, 2.6vw, 1.75rem); font-weight: 800; letter-spacing: -.02em; }
.ksp-loy-hero p { margin: 8px 0 0; max-width: 620px; color: #d6d3d1; font-size: .84rem; line-height: 1.6; }
.ksp-loy-hero__acts { display: flex; flex-wrap: wrap; gap: 9px; }
.ksp-loy-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 16px; border: 0; border-radius: 11px; font-size: .82rem; font-weight: 700; cursor: pointer; }
.ksp-loy-btn .material-symbols-rounded { font-size: 18px; }
.ksp-loy-btn--amber { background: #f59e0b; color: #1c1917; }
.ksp-loy-btn--amber:hover { background: #fbbf24; color: #1c1917; }
.ksp-loy-btn--amber-soft { background: #fde3b5; color: #92400e; }
.ksp-loy-btn--dark { background: var(--ksp-text); color: var(--ksp-surface); }
.ksp-loy-btn--dark:hover { background: var(--ksp-primary); color: #fff; }
.ksp-loy-hero .ksp-loy-btn--dark { background: rgba(255, 255, 255, .12); color: #fafaf9; }
.ksp-loy-btn--green { background: #0f9d58; color: #fff; }
.ksp-loy-btn--wa { background: #16a34a; color: #fff; }
.ksp-loy-btn--wa:hover { background: #15803d; color: #fff; }
/* KPI şeridi (şeridin içinde) */
.ksp-loy-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin: 20px 0 0; padding: 0; list-style: none; }
.ksp-loy-kpis > li { padding: 13px 15px; border: 1px solid rgba(255, 255, 255, .1); border-radius: 13px; background: rgba(255, 255, 255, .05); }
.ksp-loy-kpis span { display: block; color: #a8a29e; font-size: .72rem; }
.ksp-loy-kpis strong { display: block; margin: 5px 0 3px; font-size: 1.4rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-loy-kpis strong.is-amber { color: #fbbf24; }
.ksp-loy-kpis small { color: #a8a29e; font-size: .72rem; }
.ksp-loy-kpis small.is-amber { color: #fbbf24; }
.ksp-loy-kpis small.is-green { color: #4ade80; }
/* Sekmeler */
.ksp-loy-tabs { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--ksp-border); scrollbar-width: thin; }
.ksp-loy-tab { display: inline-flex; align-items: center; gap: 7px; flex: 0 0 auto; padding: 11px 14px; border-bottom: 2px solid transparent; color: var(--ksp-muted); font-size: .84rem; font-weight: 700; white-space: nowrap; }
.ksp-loy-tab .material-symbols-rounded { font-size: 19px; }
.ksp-loy-tab b { padding: 1px 7px; border-radius: 999px; background: var(--ksp-surface-2); font-size: .68rem; }
.ksp-loy-tab:hover { color: var(--ksp-text); }
.ksp-loy-tab.is-active { border-bottom-color: var(--ksp-text); color: var(--ksp-text); }
.ksp-loy-tab.is-active b { background: #fde3b5; color: #92400e; }
/* Kart kabı */
.ksp-loy-card { padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-loy-card + .ksp-loy-card { margin-top: 16px; }
.ksp-loy-h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; font-size: .95rem; font-weight: 800; }
.ksp-loy-h2 .material-symbols-rounded { color: #b45309; font-size: 20px; }
.ksp-loy-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.ksp-loy-search { position: relative; flex: 1 1 260px; max-width: 340px; }
.ksp-loy-search__ico { position: absolute; inset-inline-start: 12px; inset-block-start: 50%; transform: translateY(-50%); color: var(--ksp-muted); pointer-events: none; }
.ksp-loy-search__ico .material-symbols-rounded { font-size: 18px; }
.ksp-loy-search input { padding-inline-start: 38px; }
.ksp-loy-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ksp-loy-quick select { width: auto; min-width: 250px; max-width: 320px; }
/* Damga kartları */
.ksp-loy-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.ksp-loy-stamp { display: flex; flex-direction: column; padding: 15px 16px; border: 1px solid var(--ksp-border); border-radius: 15px; background: var(--ksp-surface); }
.ksp-loy-stamp.is-ready { border-color: rgba(16, 163, 74, .35); }
.ksp-loy-stamp__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.ksp-loy-stamp__name { margin: 0; font-size: .92rem; font-weight: 800; }
.ksp-loy-stamp__sub { margin: 3px 0 0; color: var(--ksp-muted); font-size: .74rem; }
.ksp-loy-stamp__count { flex: 0 0 auto; padding: 4px 10px; border-radius: 8px; background: #fde3b5; color: #92400e; font-size: .68rem; font-weight: 800; }
.ksp-loy-dots { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 10px; }
.ksp-loy-dot { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--ksp-border); border-radius: 10px; color: var(--ksp-muted); font-size: .82rem; font-weight: 700; }
.ksp-loy-dot .material-symbols-rounded { font-size: 20px; }
.ksp-loy-dot.is-on { border-color: transparent; background: #f59e0b; color: #fff; }
.ksp-loy-dot.is-gift { border-style: dashed; border-color: #f59e0b; background: #fff7ed; color: #b45309; }
.ksp-loy-dot.is-gift.is-on { background: #f59e0b; color: #fff; }
.ksp-loy-stamp__goal { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0; padding-bottom: 12px; border-bottom: 1px solid var(--ksp-border); color: var(--ksp-muted); font-size: .74rem; }
.ksp-loy-stamp__goal strong { color: var(--ksp-primary); font-weight: 700; text-align: end; }
.ksp-loy-ready { margin-top: 12px; padding: 11px 13px; border: 1px solid rgba(16, 163, 74, .3); border-radius: 12px; background: rgba(16, 163, 74, .08); }
.ksp-loy-ready__title { display: flex; align-items: center; gap: 6px; margin: 0 0 8px; color: #0f9d58; font-size: .78rem; font-weight: 800; }
.ksp-loy-ready__title .material-symbols-rounded { font-size: 18px; }
.ksp-loy-ready__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; font-size: .78rem; }
.ksp-loy-ready__row + .ksp-loy-ready__row { margin-top: 8px; }
.ksp-loy-ready__row .ksp-loy-btn { padding: 6px 12px; font-size: .74rem; }
.ksp-loy-stamp__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 12px; color: var(--ksp-muted); font-size: .78rem; }
.ksp-loy-stamp__foot strong { color: var(--ksp-text); font-weight: 800; }
.ksp-loy-stamp__acts { display: flex; align-items: center; gap: 6px; }
.ksp-loy-undo { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--ksp-border); border-radius: 9px; background: var(--ksp-surface); color: var(--ksp-muted); cursor: pointer; }
.ksp-loy-undo:hover { border-color: var(--ksp-primary); color: var(--ksp-primary); }
.ksp-loy-undo .material-symbols-rounded { font-size: 17px; }
/* Satılmış paketler */
.ksp-loy-sold { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.ksp-loy-sold > li { display: flex; flex-wrap: wrap; gap: 16px; padding: 15px 17px; border: 1px solid var(--ksp-border); border-radius: 15px; background: var(--ksp-surface); }
.ksp-loy-sold__main { flex: 1 1 320px; min-width: 0; }
.ksp-loy-sold__who { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; font-size: .9rem; }
.ksp-loy-sold__who small { color: var(--ksp-muted); font-size: .76rem; }
.ksp-loy-price { padding: 3px 9px; border-radius: 7px; background: #fde3b5; color: #92400e; font-size: .72rem; font-weight: 800; }
.ksp-loy-sold__name { margin: 6px 0 0; color: var(--ksp-primary); font-size: .86rem; font-weight: 700; }
.ksp-loy-sold__meta { margin: 4px 0 0; color: var(--ksp-muted); font-size: .74rem; }
.ksp-loy-sold__uses { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 10px 0 0; color: var(--ksp-muted); font-size: .72rem; }
.ksp-loy-sold__uses b { padding: 4px 9px; border: 1px solid var(--ksp-border); border-radius: 8px; background: var(--ksp-surface-2); color: var(--ksp-text); font-weight: 600; }
.ksp-loy-sold__end { flex: 0 1 260px; min-width: 220px; }
.ksp-loy-sold__state { margin: 0; color: var(--ksp-muted); font-size: .76rem; }
.ksp-loy-sold__state strong { color: var(--ksp-text); }
.ksp-loy-prog { display: block; height: 7px; margin: 8px 0 6px; border-radius: 999px; background: var(--ksp-surface-2); overflow: hidden; }
.ksp-loy-prog > span { display: block; height: 100%; border-radius: 999px; background: #f59e0b; }
.ksp-loy-sold__left { margin: 0 0 10px; color: #b45309; font-size: .74rem; font-weight: 600; }
/* Açılır formlar (seans işle, müşteriye sat, yeni paket) */
.ksp-loy-use__acts { display: flex; justify-content: flex-end; margin-top: 12px; }
/* Katalog kartları */
.ksp-loy-cat { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.ksp-loy-cat > li { display: flex; flex-direction: column; padding: 15px 16px; border: 1px solid var(--ksp-border); border-radius: 15px; background: var(--ksp-surface); }
.ksp-loy-cat__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.ksp-loy-cat__tag { padding: 3px 9px; border-radius: 7px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .62rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.ksp-loy-cat__save { color: #0f9d58; font-size: .72rem; font-weight: 800; }
.ksp-loy-cat__name { margin: 0; font-size: .92rem; font-weight: 800; line-height: 1.35; }
.ksp-loy-cat__desc { margin: 6px 0 0; color: var(--ksp-muted); font-size: .76rem; line-height: 1.5; }
.ksp-loy-cat__price { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 12px 0 0; padding-top: 10px; border-top: 1px solid var(--ksp-border); color: var(--ksp-muted); font-size: .76rem; }
.ksp-loy-cat__price del { margin-inline-end: 6px; color: var(--ksp-muted); }
.ksp-loy-cat__price strong { color: var(--ksp-text); font-size: 1rem; font-weight: 800; }
.ksp-loy-cat__acts { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-top: 12px; }
.ksp-loy-del { border: 0; background: none; color: var(--ksp-primary); font-size: .76rem; font-weight: 600; cursor: pointer; }
/* Win-Back */
.ksp-loy-note { display: flex; gap: 12px; padding: 14px 16px; border: 1px solid rgba(245, 158, 11, .35); border-radius: 14px; background: rgba(245, 158, 11, .08); }
.ksp-loy-note__ico { display: grid; place-items: center; flex: 0 0 auto; width: 34px; height: 34px; border-radius: 10px; background: #fde3b5; color: #b45309; }
.ksp-loy-note p { margin: 0; color: #b45309; font-size: .84rem; font-weight: 800; }
.ksp-loy-note small { display: block; margin-top: 4px; color: var(--ksp-muted); font-size: .78rem; line-height: 1.55; }
.ksp-loy-risk { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-loy-risk > li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); }
.ksp-loy-risk__top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; font-size: .88rem; }
.ksp-loy-risk__phone { color: var(--ksp-muted); font-size: .76rem; font-variant-numeric: tabular-nums; }
.ksp-loy-risk__tag { padding: 3px 9px; border-radius: 999px; background: var(--ksp-primary-50); color: var(--ksp-primary); font-size: .68rem; font-weight: 800; }
.ksp-loy-risk__meta { margin: 5px 0 0; color: var(--ksp-muted); font-size: .74rem; }
/* Program kuralları */
.ksp-loy-rules { max-width: 640px; }
.ksp-loy-rules__lead { margin: -8px 0 16px; color: var(--ksp-muted); font-size: .78rem; }
.ksp-loy-rules .ksp-cash-field + .ksp-cash-field { margin-top: 14px; }
@media (max-width: 640px) {
    .ksp-loy-hero { padding: 16px; }
    .ksp-loy-kpis, .ksp-loy-grid, .ksp-loy-cat { grid-template-columns: 1fr; }
    .ksp-loy-hero__acts, .ksp-loy-quick { width: 100%; }
    .ksp-loy-hero__acts .ksp-loy-btn, .ksp-loy-quick select, .ksp-loy-quick .ksp-loy-btn { flex: 1 1 auto; }
    .ksp-loy-sold__end { flex-basis: 100%; min-width: 0; }
    .ksp-loy-risk > li .ksp-loy-btn { width: 100%; }
}
/* Sadakat pencereleri (sahip görselleri 2026-09-20): Müşteriye Paket Tanımla · Seans Uygulandı Olarak İşle */
.ksp-loy-modal .modal-content { padding: 26px 28px; border: 0; border-radius: 20px; background: var(--ksp-surface); box-shadow: 0 24px 60px rgba(28, 25, 23, .28); }
.ksp-loy-modal__head h2 { margin: 0; font-size: 1.15rem; font-weight: 800; letter-spacing: -.01em; }
.ksp-loy-modal__head p { margin: 6px 0 18px; color: var(--ksp-muted); font-size: .82rem; line-height: 1.5; }
.ksp-loy-modal__body { display: flex; flex-direction: column; gap: 14px; }
.ksp-loy-modal__foot { display: flex; align-items: center; justify-content: flex-end; gap: 14px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--ksp-border); }
.ksp-loy-modal__cancel { border: 0; background: none; color: var(--ksp-muted); font-size: .84rem; font-weight: 600; cursor: pointer; }
.ksp-loy-modal__cancel:hover { color: var(--ksp-text); }
.ksp-loy-modal .ksp-cash-input:focus { border-color: #f59e0b; box-shadow: 0 0 0 3px rgba(245, 158, 11, .2); outline: 0; }
/* Sadakat ikinci dalga: otomatik damga anahtarı, süre uyarısı, son mesaj notu (2026-09-20) */
.ksp-loy-switch { display: flex; align-items: flex-start; gap: 10px; margin-top: 16px; padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); cursor: pointer; }
.ksp-loy-switch input { margin-top: 3px; width: 16px; height: 16px; accent-color: #f59e0b; }
.ksp-loy-switch strong { display: block; font-size: .84rem; font-weight: 700; }
.ksp-loy-switch small { display: block; margin-top: 3px; color: var(--ksp-muted); font-size: .74rem; line-height: 1.5; }
.ksp-loy-soon { display: inline-flex; align-items: center; gap: 4px; margin-inline-start: 6px; padding: 2px 8px; border-radius: 999px; background: rgba(245, 158, 11, .14); color: #b45309; font-size: .68rem; font-weight: 800; }
.ksp-loy-soon .material-symbols-rounded { font-size: 14px; }
.ksp-loy-risk__sent { display: inline-flex; align-items: center; gap: 4px; color: #0f9d58; font-weight: 600; }
.ksp-loy-risk__sent .material-symbols-rounded { font-size: 15px; }
/* Paket sekmesi bölüm başlığı + düz düğme (sahip görseli 2026-09-20) */
.ksp-loy-sec { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; padding: 4px 4px 0; }
.ksp-loy-sec h2 { margin: 0; font-size: 1.05rem; font-weight: 800; letter-spacing: -.01em; }
.ksp-loy-sec p { margin: 5px 0 0; color: var(--ksp-muted); font-size: .8rem; }
.ksp-loy-sec__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ksp-loy-btn--plain { background: transparent; color: var(--ksp-text); }
.ksp-loy-btn--plain:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
@media (max-width: 640px) { .ksp-loy-sec__acts { width: 100%; } .ksp-loy-sec__acts .ksp-loy-btn { flex: 1 1 auto; } }
/* Müşteri kartında sadakat özeti (KARARLAR §18) */
.ksp-cus-loy__row { display: flex; flex-wrap: wrap; gap: 8px; }
.ksp-cus-loy__chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface-2); font-size: .76rem; }
.ksp-cus-loy__chip .material-symbols-rounded { font-size: 17px; color: #b45309; }
.ksp-cus-loy__chip.is-ready { border-color: rgba(16, 163, 74, .35); background: rgba(16, 163, 74, .1); color: #0f9d58; font-weight: 700; }
.ksp-cus-loy__chip.is-ready .material-symbols-rounded { color: #0f9d58; }
.ksp-cus-loy__pkgs { display: flex; flex-direction: column; gap: 6px; margin: 10px 0 0; padding: 0; list-style: none; }
.ksp-cus-loy__pkgs > li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; border: 1px solid var(--ksp-border); border-radius: 10px; font-size: .78rem; }
.ksp-cus-loy__pkgs b { color: #b45309; font-weight: 700; }
/* @sadakat-son */

/* @zincir — Salon Kokpiti > Zincir & Şubeler (/kokpit/subeler), sahip tasarımı 2026-09-20 (KARARLAR §19):
   koyu lacivert konsolide şerit + 4 KPI, şube kartları, görevlendirme geçmişi, şubeler arası hakediş, müşteri sorgulama. */
/* Bölümler */
.ksp-chain-tag { display: inline-block; padding: 2px 8px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .62rem; font-weight: 800; vertical-align: middle; }
.ksp-chain-tag.is-violet { background: rgba(109, 40, 217, .12); color: #6d28d9; }
/* Şube kartları */
/* Görevlendirme geçmişi */
/* Şubeler arası hakediş */
/* Sarmalayıcının en-küçük genişliği 0 → 7 sütunlu tablo üst grid/flex'i genişletemez, dar ekranda kendi içinde kayar */
.ksp-pk-chainbox .ksp-cash-tablewrap { width: 0; min-width: 100%; }
.ksp-chain-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.ksp-chain-table th, .ksp-chain-table td { padding: 8px 10px; border-top: 1px solid var(--ksp-border); text-align: start; }
.ksp-chain-table th { color: var(--ksp-muted); font-size: .66rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; border-top: 0; }
.ksp-chain-table .is-num { text-align: end; font-variant-numeric: tabular-nums; }
/* Merkezi müşteri sorgulama */
/* Kurulum kartı */
/* Personel Kokpiti: şubeler arası kazanç kutusu */
.ksp-pk-chainbox { margin-top: 14px; padding: 14px 16px; border: 1px solid rgba(109, 40, 217, .3); border-radius: 14px; background: rgba(109, 40, 217, .06); }
.ksp-pk-chainbox h3 { display: flex; align-items: center; gap: 7px; margin: 0 0 4px; font-size: .9rem; font-weight: 800; }
.ksp-pk-chainbox h3 .material-symbols-rounded { color: #6d28d9; font-size: 19px; }
.ksp-pk-chainbox > p { margin: 0 0 10px; color: var(--ksp-muted); font-size: .76rem; }
@media (max-width: 640px) {
                .ksp-chain-table { min-width: 560px; }
}

.ksp-chain-table tr.is-total td { border-top: 2px solid var(--ksp-border); font-weight: 700; }
/* @zincir-son */

/* @panel-solmenu-3 — Sahip geri bildirimi 2026-09-20: sol menü açıkken bölüm seçici şeridi ("Tüm Salon / Kadın / Erkek")
   koca boş bir bant gibi duruyordu. Masaüstünde bant kalkar: yapışkan değil, zemin/çizgi yok, yalnız küçük hap sağ üstte. */
@media (min-width: 992px) {
  .ksp-panel--side .ksp-ptabs--compact { position: static; background: transparent; border-bottom: 0; backdrop-filter: none; }
  /* Sağ kenar üst bar (.ksp-ptop__inner) ve içerikle (.ksp-panel__content) aynı 2rem hizasında kalır */
  .ksp-panel--side .ksp-ptabs--compact .ksp-ptabs__inner { padding: .55rem 2rem 0; }
  .ksp-panel--side .ksp-ptabs--compact .ksp-ptabs__seg { padding: 2px; border-radius: 9px; }
  .ksp-panel--side .ksp-ptabs--compact .ksp-ptabs__seg a { padding: .2rem .5rem; font-size: .7rem; border-radius: 7px; }
}
/* @panel-solmenu-3-son */

/* @salon-zincir — Konsolide ağ: salon sayfasındaki şube seçici hapı, açılır liste, hero rozeti ve hızlı geçiş
   penceresi (sahip tasarımı 2026-09-20, KARARLAR §19.2). */
/* Açılır liste */
/* Hero rozeti */
/* Hızlı geçiş penceresi */
.ksp-sp-branch__tag { padding: 2px 8px; border-radius: 999px; background: rgba(225, 29, 72, .1); color: #e11d48; font-size: .62rem; font-weight: 800; }
.ksp-sp-branch__tag.is-hq { background: rgba(120, 113, 108, .15); color: #57534e; }
/* @salon-zincir-son */

/* @salon-zincir-2 — "n Şube Ağı & Karşılaştırma" sekmesi (sahip tasarımı 2026-09-20, KARARLAR §19.2):
   koyu tanıtım şeridi + 4 KPI, süzgeç/arama/görünüm çubuğu, kapak görselli şube kartları ve matris tablosu. */
/* Süzgeç + arama + görünüm */
.ksp-sp-net__view { display: inline-flex; padding: 3px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface-2); }
.ksp-sp-net__view button { padding: 5px 13px; border: 0; border-radius: 999px; background: none; color: var(--ksp-muted); font-size: .74rem; font-weight: 700; cursor: pointer; }
.ksp-sp-net__view button.is-active { background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 1px 3px rgba(28, 25, 23, .12); }
/* Şube kartları */
/* Matris tablosu */
.ksp-sp-net__tablewrap { width: 0; min-width: 100%; overflow-x: auto; border: 1px solid var(--ksp-border); border-radius: 16px; }
.ksp-sp-net__table { width: 100%; min-width: 720px; border-collapse: collapse; font-size: .82rem; }
.ksp-sp-net__table th, .ksp-sp-net__table td { padding: 12px 14px; border-top: 1px solid var(--ksp-border); text-align: start; }
.ksp-sp-net__table thead th { border-top: 0; color: var(--ksp-muted); font-size: .66rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.ksp-sp-net__table tbody th { font-weight: 800; }
.ksp-sp-net__table .is-num { text-align: end; font-variant-numeric: tabular-nums; }
.ksp-sp-net__table .is-num b { color: #0f9d58; }
.ksp-sp-net__table .is-num b.is-high { color: #b45309; }
.ksp-sp-net__table .is-num b.is-full { color: #be123c; }
.ksp-sp-net__table .is-act { text-align: end; }
.ksp-sp-net__table .is-act a { color: #e11d48; font-weight: 800; }
/* @salon-zincir-2-son */

/* @zincir-5 — Şubeyi pasife alma (sahip isteği 2026-09-20, KARARLAR §19.4): yayın durur, veriler durur. */
.ksp-chain-tag.is-paused { background: rgba(245, 158, 11, .16); color: #b45309; }

/* @salon-zincir-5 — Şube ağı: randevu düğmeleri (sahip geri bildirimi 2026-09-20). Randevu alamayan şubede
   kartta tek geniş "Şubeyi İncele" kalır; tablo hücresinde iki bağlantı yan yana durur. */
.ksp-sp-net__table .is-act { white-space: nowrap; }
.ksp-sp-net__table .is-act a + a { margin-inline-start: 12px; }
.ksp-sp-net__table .is-act a.is-book { color: var(--ksp-text); }

/* @salon-zincir-6 — Kapak rozetinde "KONSOLİDE AĞ" kapsülü kaldırıldı (sahip isteği 2026-09-20): ikon + "n Şube • şehirler". */
.ksp-sp-net__table .is-act span { color: var(--ksp-muted); font-weight: 700; }

/* @zincir-6 — Hizmeti olmayan şube uyarısı + "merkezden kopyala" (KARARLAR §19.5). */

/* Hizmeti olmayan salon sayfasında "Randevu Al" boşa düşmesin: telefonla randevu yolu (KARARLAR §19.5) */
.ksp-sp-empty__sub { margin: 6px 0 0; color: var(--ksp-muted); font-size: .86rem; }
.ksp-sp-empty__acts { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 14px; }
.ksp-sp-empty__btn { display: inline-flex; align-items: center; gap: 6px; padding: 10px 16px; border-radius: 12px; border: 1px solid var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); font-size: .84rem; font-weight: 700; }
.ksp-sp-empty__btn.is-wa { border-color: transparent; background: #25d366; color: #0b3d20; }
.ksp-sp-empty__btn .material-symbols-rounded { font-size: 18px; }

/* @randevu-paket — Paketle açılan randevu penceresi (sahip, 2026-09-21): seçili paket notu; diğer hizmetler
   gizlidir, "Diğer hizmetleri de ekle" tüm listeyi geri açar. Eğik yazı yok. */
.ksp-bk-pack { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 14px; padding: 11px 14px; border: 1px solid #fecdd3; border-radius: 13px; background: #fff1f2; color: #1c1917; font-size: 12.5px; font-weight: 600; line-height: 1.5; }
.ksp-bk-pack .material-symbols-rounded { flex-shrink: 0; font-size: 19px; color: #ec003f; }
.ksp-bk-pack > span:not(.material-symbols-rounded) { flex: 1; min-width: 150px; }
.ksp-bk-pack__all { flex-shrink: 0; padding: 7px 13px; border: 1px solid #e7e5e4; border-radius: 999px; background: #fff; color: #292524; font-size: 12px; font-weight: 800; cursor: pointer; transition: background .15s, border-color .15s; }
.ksp-bk-pack__all:hover, .ksp-bk-pack__all:focus-visible { background: #fafaf9; border-color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-bk-pack { border-color: rgba(251, 113, 133, .3); background: rgba(251, 113, 133, .1); color: #fafaf9; }
[data-bs-theme="dark"] .ksp-bk-pack .material-symbols-rounded { color: #fb7185; }
[data-bs-theme="dark"] .ksp-bk-pack__all { border-color: rgba(255, 255, 255, .14); background: rgba(255, 255, 255, .05); color: #fafaf9; }

/* @panel-genislik — Sahip, 2026-09-21: "panel tam sayfa olmadı, 2. resimdeki gibi olsun" (referans: Zincir & Şubeler).
   Tüm panellerde (müşteri · uzman · salon) içerik ORTALANMIŞ sütunda; genişlik tek değişkenden. Süper Admin hariç. */
.ksp-panel { --ksp-panel-w: 1240px; }
.ksp-panel--admin { --ksp-panel-w: none; }
.ksp-panel__content { max-width: var(--ksp-panel-w, 1240px); }
.ksp-panel--tabs .ksp-panel__content { max-width: var(--ksp-panel-w, 1240px); }
.ksp-panel--expert .ksp-panel__content { max-width: var(--ksp-panel-w, 1240px); }

/* @panel-solmenu-3 — Sol menü derli toplu: kategori başlığı kendi öğeleriyle bir arada (üstte ince ayraç,
   altında dar boşluk) ve "Siteye dön / Çıkış yap" bloğu küçültüldü — menünün tamamı ekrana sığsın. */
.ksp-panel--side .ksp-sidebar__context { padding-bottom: .5rem; }
.ksp-panel--side .ksp-sidebar__nav--grouped { padding-bottom: .5rem; }
.ksp-panel--side .ksp-sidebar__nav--grouped .ksp-sidebar__group { margin-top: .45rem; padding: .55rem .8rem .2rem; border-top: 1px solid var(--ksp-border); }
.ksp-panel--side .ksp-sidebar__nav--grouped .ksp-sidebar__group:first-child { margin-top: 0; padding-top: .2rem; border-top: 0; }
.ksp-panel--side .ksp-sidebar__nav--grouped a { padding: .42rem .7rem; }
.ksp-panel--side .ksp-sidebar__foot { padding: .4rem .55rem; }
.ksp-panel--side .ksp-sidebar__foot a, .ksp-panel--side .ksp-sidebar__foot button { gap: .6rem; padding: .42rem .7rem; border-radius: 10px; font-size: .84rem; }
.ksp-panel--side .ksp-sidebar__foot .material-symbols-rounded { font-size: 20px; }

/* @personel-kabuk — Personel Kokpiti kabuğu KOKPİTİN AYNISI (sahip, 2026-09-21: "sola al", "açılır kapanır yap",
   "bunun gibi yap"): solda tam boy menü (marka + daralt düğmesi + kimlik + sekmeler + çıkış), sağda üst bar ve
   ortalanmış içerik. Mobilde tek sütuna iner, sekmeler eski 4'lü ızgara şerit olarak kalır.
   Ayrıca sayfa altındaki bilgi notları içeriğe yapışmasın diye ayraçla ayrıldı ("yazılar birleşik, ayır"). */
.ksp-pk-side { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ksp-pk-side__head { display: none; align-items: center; justify-content: space-between; gap: 8px; }
.ksp-pk-side__ctx { display: none; }
.ksp-pk-side__name { margin-top: 7px; font-size: 1rem; font-weight: 800; }
/* Mobilde çıkış düğmesi şeridin altında hap olarak kalır; masaüstünde menünün dibine sabitlenir */
.ksp-pk-side__foot { display: flex; justify-content: flex-end; }
.ksp-pk-side__foot button { display: flex; align-items: center; gap: .6rem; padding: .45rem .9rem; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-muted); font: inherit; font-size: .84rem; font-weight: 600; text-align: start; cursor: pointer; }
.ksp-pk-side__foot button:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-pk-side__foot .material-symbols-rounded { font-size: 20px; }
.ksp-pk-body { display: flex; flex-direction: column; min-width: 0; }
.ksp-pk-main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.ksp-pk-rail { display: none; }
.ksp-pk .ksp-sprof-hint { display: flex; align-items: flex-start; gap: 7px; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--ksp-border); }
.ksp-pk .ksp-sprof-hint .material-symbols-rounded { flex-shrink: 0; margin-top: 1px; font-size: 15px; }
@media (min-width: 992px) {
    /* Kabuk kenardan kenara: paylaşım sayfası sarmalayıcısının sınırı kalkar */
    .ksp-share-page:has(.ksp-pk) .ksp-share-page__main { max-width: none; padding: 0; }
    .ksp-pk { max-width: none; margin: 0; display: grid; grid-template-columns: 264px minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); gap: 0; min-height: 100dvh; }
    .ksp-pk > .ksp-toast-stack { grid-column: 1 / -1; }
    .ksp-pk-side { grid-row: 1 / -1; position: sticky; top: 0; height: 100dvh; padding: 14px 12px; border-inline-end: 1px solid var(--ksp-border); background: var(--ksp-surface); }
    .ksp-pk-side__head, .ksp-pk-side__ctx { display: block; }
    .ksp-pk-side__head { display: flex; }
    .ksp-pk-side__foot { display: block; padding-top: 8px; border-top: 1px solid var(--ksp-border); }
    .ksp-pk-side__foot button { width: 100%; padding: .45rem .7rem; border: 0; background: transparent; }
    .ksp-pk-head { grid-column: 2; padding: 12px 24px; border: 0; border-bottom: 1px solid var(--ksp-border); border-radius: 0; }
    .ksp-pk-body { grid-column: 2; }
    .ksp-pk-main { max-width: 1240px; width: 100%; margin: 0 auto; padding: 20px 24px 40px; }
    .ksp-pk-tabs { flex: 1; min-height: 0; padding: 0; overflow-y: auto; border: 0; background: none; }
    .ksp-pk-tabs__list { flex-direction: column; gap: 2px; overflow: visible; }
    .ksp-pk-tab { width: 100%; justify-content: flex-start; padding: 9px 12px; font-size: .84rem; }
    .ksp-pk-tab > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
    .ksp-pk-tab b { margin-inline-start: auto; }
    .ksp-pk-main .ksp-pk-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    /* Açılır / kapanır dar ray (app.js @personel-solmenu; tercih cihazda saklanır) */
    .ksp-pk-rail { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 32px; height: 32px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-muted); cursor: pointer; }
    .ksp-pk-rail:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
    .ksp-pk-rail .material-symbols-rounded { font-size: 19px; }
    .ksp-pk.is-rail { grid-template-columns: 76px minmax(0, 1fr); }
    .ksp-pk.is-rail .ksp-pk-side { padding: 14px 8px; }
    .ksp-pk.is-rail .ksp-pk-side__head { justify-content: center; }
    .ksp-pk.is-rail .ksp-brand__body, .ksp-pk.is-rail .ksp-pk-side__ctx { display: none; }
    .ksp-pk.is-rail .ksp-pk-rail { transform: rotate(180deg); }
    .ksp-pk.is-rail .ksp-pk-tab { justify-content: center; padding: 9px 0; }
    /* Yalnız ETİKET gizlenir; ikon (.material-symbols-rounded) kalır */
    .ksp-pk.is-rail .ksp-pk-tab > span:not(.material-symbols-rounded), .ksp-pk.is-rail .ksp-pk-tab b { display: none; }
    .ksp-pk.is-rail .ksp-pk-side__foot button { justify-content: center; padding: .45rem 0; }
    .ksp-pk.is-rail .ksp-pk-side__foot button > span:not(.material-symbols-rounded) { display: none; }
}
@media (min-width: 992px) and (max-width: 1279.98px) {
    .ksp-pk-main .ksp-pk-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* @paket-siyah — Sahip, 2026-09-21: paket bölümü siyah zemine alındı; başlık / kart yazıları dağınık durmasın diye
   satır kırılmaları dengelendi ve randevu penceresindeki paket notu tek blok hâlinde toparlandı. */
.ksp-pkg__title { text-wrap: balance; }
.ksp-pkg .ksp-checklist li { text-wrap: pretty; }
/* Randevu penceresi paket notu: ikon solda sabit, metin yanında akar, düğme sağa kayar (dar pencerede alt satıra iner).
   :not(.material-symbols-rounded) şart — ikon da <span>, yoksa esnek kutu alıp metni sağa itiyor. */
.ksp-bk-pack > span:not(.material-symbols-rounded) { flex: 1 1 260px; text-wrap: pretty; }
.ksp-bk-pack__all { margin-inline-start: auto; }

/* Paket kartında eski (üstü çizili) fiyat */
.ksp-pkg__price strong s { margin-inline-start: 7px; color: #a8a29e; font-size: .86rem; font-weight: 600; }

[data-bs-theme="dark"] .ksp-pkg { background: var(--ksp-surface); color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-pkg__title, [data-bs-theme="dark"] .ksp-pkg__price strong, [data-bs-theme="dark"] .ksp-pkg__meta a, [data-bs-theme="dark"] .ksp-pkg__meta .ksp-rate { color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-pkg__foot { border-top-color: var(--ksp-border); }

/* @secim-penceresi — Sitedeki yerel açılır listeler konum seçici gibi PENCEREDE açılır (sahip, 2026-09-21).
   Select DOM'da kalır ama gizlenir; yerine aynı görünümde bir hap düğme basılır (app.js "@secim-penceresi").
   2026-09-29 (KARARLAR §82.22, sahip: "1. resmi 2. resimdeki yap"): Salon Keşfet "Konum Seçin" penceresinin tasarımı (kod alınmadı, yalnız görünüm) —
   arama hapı, yapışkan büyük harf grup başlığı, 38 px ikon / fotoğraf kutusu, rozet, seçili satır gül rengi; telefonda alttan açılır. */
.ksp-sheet-native { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; border: 0 !important; clip: rect(0 0 0 0); clip-path: inset(50%); overflow: hidden !important; white-space: nowrap !important; }
.ksp-sheetbtn { display: inline-flex; align-items: center; gap: 8px; width: 100%; min-width: 0; padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; }
.ksp-sheetbtn:disabled { opacity: .6; cursor: default; }
.ksp-sheetbtn__value { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-sheetbtn__caret { margin-inline-start: auto; font-size: 19px; color: var(--ksp-muted); }

/* Bağlama göre: alanın kendi çerçevesini giyer (hero kutusu beyaz — iki temada da koyu yazı; randevu penceresi; magazin formu) */
.ksp-finder__control .ksp-sheetbtn { height: auto; padding: .15rem 0; color: #1c1917; font-size: .9rem; font-weight: 600; }
.ksp-finder__control .ksp-sheetbtn__caret { color: #57534e; }
.ksp-input--select .ksp-sheetbtn { font-size: inherit; }
.ksp-bk-field .ksp-sheetbtn { flex: 1; height: 100%; color: #1c1917; font-size: 13.5px; }
[data-bs-theme="dark"] .ksp-bk-field .ksp-sheetbtn { color: #fafaf9; } /* eski select'in koyu tema kuralının eşi (randevu penceresi koyu zemin) */
.ksp-mgz-yz .ksp-sheetbtn { padding: 10px 13px; border: 1px solid var(--bs-border-color); border-radius: 11px; background: var(--bs-body-bg); color: var(--bs-body-color); font-size: .84rem; }
.ksp-mgz-yz .ksp-sheetbtn:focus-visible { border-color: #ec003f; outline: none; }

/* Kaydırma kilidi: kaydırma çubuğu yeri korunur (Windows'ta sayfa yana kaymasın — .ksp-cat-modal emsali). Bootstrap penceresi (randevu)
   kilidi zaten tutuyorsa html'e dokunulmaz — yoksa body kendi kaydırma kabı olur, yapışkan başlık yerinden oynar. */
html:has(.ksp-sheet[open]):not(:has(> body.modal-open)) { overflow: hidden; scrollbar-gutter: stable; }
.ksp-sheet { width: min(560px, calc(100% - 2rem)); max-width: none; max-height: min(640px, 80vh); margin: auto; padding: 0; border: 0; border-radius: 24px; overflow: hidden; background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 32px 80px -24px rgba(12, 10, 9, .5), 0 0 0 1px var(--ksp-border); }
.ksp-sheet.has-search { height: min(640px, 80vh); } /* aramada liste kısalınca pencere zıplamasın */
.ksp-sheet[open] { display: flex; flex-direction: column; animation: ksp-sheet-pop .22s cubic-bezier(.2, .8, .2, 1); }
.ksp-sheet::backdrop { background: rgba(12, 10, 9, .56); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.ksp-sheet[open]::backdrop { animation: ksp-sheet-fade .2s ease-out; }
.ksp-sheet__panel { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.ksp-sheet__grip { display: none; flex-shrink: 0; width: 40px; height: 4px; margin: .55rem auto 0; border-radius: 999px; background: var(--ksp-border); }
.ksp-sheet__head { flex-shrink: 0; display: flex; align-items: center; gap: .35rem; padding: .9rem .75rem .35rem; padding-inline-start: 1.25rem; }
.ksp-sheet__title { flex: 1; min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 1.15rem; font-weight: 800; letter-spacing: -.025em; }
.ksp-sheet__close { flex-shrink: 0; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--ksp-text); cursor: pointer; transition: background-color .15s; }
.ksp-sheet__close:hover { background: var(--ksp-surface-2); }
.ksp-sheet__close .material-symbols-rounded { font-size: 22px; vertical-align: 0; }
.ksp-sheet__search { flex-shrink: 0; display: flex; align-items: center; gap: .6rem; height: 52px; margin: .35rem 1rem .5rem; padding-inline: 1rem .75rem; border: 2px solid transparent; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); cursor: text; transition: background-color .15s, border-color .15s, box-shadow .15s; }
.ksp-sheet__search[hidden] { display: none; }
.ksp-sheet__search:focus-within { background: var(--ksp-surface); border-color: var(--ksp-primary); box-shadow: 0 0 0 4px rgba(var(--ksp-primary-rgb), .12); }
.ksp-sheet__search .material-symbols-rounded { font-size: 22px; vertical-align: 0; }
.ksp-sheet__search input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: var(--ksp-text); font: inherit; font-size: 1rem; font-weight: 500; }
.ksp-sheet__search input:focus-visible { outline: 0; }
.ksp-sheet__search input::placeholder { color: var(--ksp-muted); }
.ksp-sheet__body { position: relative; flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: .15rem .5rem .75rem; scrollbar-width: thin; }
.ksp-sheet__list, .ksp-sheet__grp { display: flex; flex-direction: column; gap: 2px; }
.ksp-sheet__grp[hidden], .ksp-sheet__opt[hidden], .ksp-sheet__empty[hidden] { display: none; }
.ksp-sheet__group { position: sticky; top: 0; z-index: 1; padding: .85rem .75rem .35rem; background: var(--ksp-surface); color: var(--ksp-muted); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.ksp-sheet__opt { display: flex; align-items: center; gap: .85rem; width: 100%; min-height: 54px; padding: .45rem .75rem; border: 0; border-radius: 14px; background: transparent; color: var(--ksp-text); font: inherit; text-align: start; cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent; scroll-margin-block: 2.4rem .5rem; transition: background-color .12s; }
.ksp-sheet__opt:hover { background: var(--ksp-surface-2); }
.ksp-sheet__opt:focus-visible { outline: 0; background: rgba(var(--ksp-primary-rgb), .08); box-shadow: inset 0 0 0 2px rgba(var(--ksp-primary-rgb), .4); }
.ksp-sheet__opt:disabled { opacity: .45; cursor: default; }
.ksp-sheet__opt:disabled:hover { background: transparent; }
.ksp-sheet__ico { flex-shrink: 0; display: grid; place-items: center; width: 38px; height: 38px; overflow: hidden; border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .8rem; font-weight: 800; letter-spacing: -.02em; transition: background-color .12s; }
.ksp-sheet__ico .material-symbols-rounded { font-size: 20px; vertical-align: 0; }
.ksp-sheet__ico img { width: 100%; height: 100%; object-fit: cover; }
.ksp-sheet__opt:hover .ksp-sheet__ico { background: var(--ksp-surface); }
.ksp-sheet__txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .05rem; }
.ksp-sheet__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .95rem; font-weight: 600; }
.ksp-sheet__name mark { padding: 0; background: transparent; color: var(--ksp-primary); font-weight: 800; }
.ksp-sheet__sub { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .76rem; line-height: 1.35; color: var(--ksp-muted); }
.ksp-sheet__badge { flex-shrink: 0; padding: .2rem .55rem; border-radius: 999px; background: var(--ksp-primary-50); color: var(--ksp-primary); font-size: .7rem; font-weight: 700; white-space: nowrap; }
.ksp-sheet__badge.is-muted { background: var(--ksp-surface-2); color: var(--ksp-muted); }
.ksp-sheet__end { flex-shrink: 0; font-size: 22px; vertical-align: 0; color: var(--ksp-primary); }
.ksp-sheet__opt[aria-selected="true"] .ksp-sheet__name { color: var(--ksp-primary); font-weight: 700; }
.ksp-sheet__opt[aria-selected="true"] .ksp-sheet__ico { background: rgba(var(--ksp-primary-rgb), .1); color: var(--ksp-primary); }
.ksp-sheet__opt[aria-selected="true"] .ksp-sheet__ico.is-face { outline: 2px solid var(--ksp-primary); outline-offset: 1px; }
.ksp-sheet__empty { display: flex; flex-direction: column; align-items: center; gap: .5rem; margin: 0; padding: 2.5rem 1rem; color: var(--ksp-muted); font-size: .9rem; font-weight: 600; text-align: center; }
.ksp-sheet__empty .material-symbols-rounded { font-size: 34px; vertical-align: 0; }
@keyframes ksp-sheet-pop { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes ksp-sheet-up { from { transform: translateY(100%); } to { transform: none; } }
@keyframes ksp-sheet-fade { from { opacity: 0; } to { opacity: 1; } }

@media (max-width: 575.98px) {
    .ksp-sheet { width: 100%; max-height: 88vh; max-height: 88dvh; margin: auto 0 0; border-radius: 24px 24px 0 0; box-shadow: 0 -18px 50px -20px rgba(12, 10, 9, .5); }
    .ksp-sheet.has-search { height: 88vh; height: 88dvh; }
    .ksp-sheet[open] { animation: ksp-sheet-up .28s cubic-bezier(.2, .8, .2, 1); }
    .ksp-sheet__grip { display: block; }
    .ksp-sheet__head { padding-top: .45rem; }
    .ksp-sheet__body { padding-bottom: calc(.75rem + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
    .ksp-sheet[open], .ksp-sheet[open]::backdrop { animation: none; }
}

/* @google-yorum — Google Yorumları (KARARLAR §22): kokpit kartı + salon sayfasındaki AYRI blok.
   Platform puanıyla karışmasın diye blok ayrı çerçevede ve "Google" rozetiyle işaretli. */
/* Seçime bağlı bölüm (Google): sol menüde amber "Eksik" rozeti basılmaz — bağlantı zorunlu değil */
.ksp-set-nav__item.is-optional .ksp-set-nav__miss { display: none; }
.ksp-gcard { display: flex; flex-direction: column; gap: 14px; }
.ksp-gcard__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ksp-gcard__state { padding: 5px 12px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .72rem; font-weight: 800; }
.ksp-gcard__state.is-active { background: rgba(16, 163, 74, .12); color: #0f9d58; }
.ksp-gcard__state.is-revoked, .ksp-gcard__state.is-error { background: rgba(225, 29, 72, .12); color: #be123c; }
.ksp-gcard__note { display: flex; align-items: flex-start; gap: 7px; margin: 0; padding: 11px 13px; border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .8rem; line-height: 1.5; }
.ksp-gcard__note .material-symbols-rounded { flex-shrink: 0; font-size: 17px; }
.ksp-gcard__warn { display: flex; align-items: center; gap: 7px; margin: 0; color: #be123c; font-size: .82rem; font-weight: 600; }
.ksp-gcard__rows { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin: 0; }
.ksp-gcard__rows > div { padding: 11px 13px; border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-gcard__rows dt { color: var(--ksp-muted); font-size: .72rem; font-weight: 700; }
.ksp-gcard__rows dd { margin: 3px 0 0; font-size: .9rem; font-weight: 700; }
.ksp-gcard__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ksp-gcard__acts form { margin: 0; }
.ksp-gbtn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 38px; padding: 0 14px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-size: 13px; font-weight: 700; white-space: nowrap; transition: background .15s, border-color .15s; }
.ksp-gbtn:hover { background: var(--set-soft-bg); border-color: var(--set-box); color: var(--ksp-text); }
.ksp-gbtn:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(66, 133, 244, .28); }
.ksp-gbtn .material-symbols-rounded { font-size: 18px; color: var(--ksp-muted); }
.ksp-gbtn--primary { border-color: transparent; background: #ec003f; color: #fff; box-shadow: 0 8px 16px -10px rgba(236, 0, 63, .8); }
.ksp-gbtn--primary:hover { background: #c70036; color: #fff; border-color: transparent; }
.ksp-gbtn--primary .material-symbols-rounded { color: #fff; }
.ksp-gbtn--danger { color: var(--set-rose-ink); border-color: var(--set-rose-line); }
.ksp-gbtn--danger:hover { background: var(--set-rose-bg); color: var(--set-rose-ink); }
.ksp-gbtn--danger .material-symbols-rounded { color: var(--set-rose); }
.ksp-gcard__list { display: flex; flex-direction: column; gap: 8px; }
.ksp-gcard__pick { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--ksp-border); border-radius: 13px; cursor: pointer; }
.ksp-gcard__pick:hover { background: var(--ksp-surface-2); }
.ksp-gcard__pick span { display: flex; flex-direction: column; min-width: 0; }
.ksp-gcard__pick small { color: var(--ksp-muted); font-size: .72rem; }

.ksp-sp-greviews { margin-top: 18px; padding: 22px 24px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-sp-greviews__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ksp-sp-greviews__head .ksp-sp-sechead__title { display: flex; align-items: center; gap: 8px; }
.ksp-sp-greviews__head .material-symbols-rounded { font-size: 20px; color: #4285f4; }
.ksp-sp-greviews__score { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-size: .9rem; }
.ksp-sp-greviews__score strong { font-size: 1.15rem; font-weight: 800; }
.ksp-sp-greviews__score small { color: var(--ksp-muted); }
.ksp-sp-greviews__score .material-symbols-rounded { font-size: 19px; color: #f59e0b; }
.ksp-sp-greviews__badge { padding: 3px 10px; border-radius: 999px; background: rgba(66, 133, 244, .12); color: #1a73e8; font-size: .68rem; font-weight: 800; }
.ksp-sp-greviews__list { display: flex; flex-direction: column; gap: 12px; margin: 16px 0 0; padding: 0; list-style: none; }
.ksp-sp-greview { padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-sp-greview__top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.ksp-sp-greview__top strong { font-size: .9rem; font-weight: 800; }
.ksp-sp-greview__top time { margin-inline-start: auto; color: var(--ksp-muted); font-size: .76rem; }
.ksp-sp-greview__stars { display: inline-flex; }
.ksp-sp-greview__stars .material-symbols-rounded { font-size: 16px; color: #f59e0b; }
.ksp-sp-greview__text { margin: 8px 0 0; color: var(--ksp-text); font-size: .88rem; line-height: 1.6; }
.ksp-sp-greview__reply { display: flex; align-items: flex-start; gap: 7px; margin: 10px 0 0; padding-top: 10px; border-top: 1px solid var(--ksp-border); color: var(--ksp-muted); font-size: .82rem; line-height: 1.55; }
.ksp-sp-greview__reply .material-symbols-rounded { flex-shrink: 0; font-size: 16px; }

@media (max-width: 767.98px) {
    .ksp-sp-greviews { padding: 16px; }
    .ksp-sp-greview__top time { margin-inline-start: 0; }
}

/* @yukari-cik — "Sayfanın başına dön" düğmesi (sahip isteği 2026-09-21; çizim referans görsele göre yenilendi).
   At nalı ilerleme halkası (270°, altı açık) + çizgisel fön makinesi + basınca çıkan rüzgar çizgileri.
   Konum: sağ altta; mobilde alt menünün (ve varsa yapışkan CTA'nın) üstünde.
   z-index 1035: yapışkan CTA'nın (1020) üstünde, alt menünün (1040) altında — menüyü asla örtmez. */
.ksp-totop { position: fixed; right: 18px; bottom: 26px; z-index: 1035; display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; padding: 0; border: 0; border-radius: 50%; background: var(--ksp-surface); color: var(--ksp-text); box-shadow: 0 14px 30px -12px rgba(12, 10, 9, .45), 0 0 0 1px var(--ksp-border); opacity: 0; transform: translateY(12px) scale(.9); transition: opacity .2s ease, transform .2s ease, background .15s; }
.ksp-totop[hidden] { display: none; }
.ksp-totop.is-in { opacity: 1; transform: none; }
.ksp-totop:hover { background: var(--ksp-surface-2); }
.ksp-totop:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(var(--ksp-primary-rgb), .35), 0 14px 30px -12px rgba(12, 10, 9, .45); }
.ksp-totop:active { transform: translateY(2px); }

/* At nalı ilerleme halkası: pathLength=100 → stroke-dashoffset doğrudan "100 − yüzde" */
.ksp-totop__ring { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.ksp-totop__track { stroke: var(--ksp-border); }
.ksp-totop__bar { stroke: var(--ksp-primary); transition: stroke-dashoffset .18s linear; }

/* Fön makinesi (çizgisel): namlu sola baksın diye hafif eğik */
.ksp-totop__dryer { width: 30px; height: 30px; transform: rotate(-8deg); transition: transform .25s ease; }
.ksp-totop:hover .ksp-totop__dryer { transform: rotate(-12deg) translateX(1px); }
.ksp-totop.is-blowing .ksp-totop__dryer { animation: ksp-totop-kick .6s cubic-bezier(.22, 1.3, .36, 1); }

/* Rüzgar çizgileri: duruyorken sönük, üflerken akar */
.ksp-totop__wind path { opacity: 0; transform-origin: 8px 14px; }
.ksp-totop:hover .ksp-totop__wind path { animation: ksp-totop-puff 1.6s ease-out infinite; }
.ksp-totop.is-blowing .ksp-totop__wind path { animation: ksp-totop-puff .5s ease-out 2; }
.ksp-totop__wind path:nth-child(2) { animation-delay: .12s !important; }
.ksp-totop__wind path:nth-child(3) { animation-delay: .24s !important; }

@keyframes ksp-totop-puff {
    0% { opacity: 0; transform: translateX(5px) scaleX(.6); }
    30% { opacity: .9; }
    100% { opacity: 0; transform: translateX(-4px) scaleX(1.15); }
}
@keyframes ksp-totop-kick {
    0% { transform: rotate(-8deg); }
    25% { transform: rotate(-2deg) translateX(3px); }   /* geri tepme */
    60% { transform: rotate(-12deg) translateX(-1px); }
    100% { transform: rotate(-8deg); }
}

/* Alt menü (mobil) ve yapışkan CTA şeridinin üstünde kalsın */
@media (max-width: 991.98px) {
    .ksp-totop { right: 14px; bottom: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom) + 14px); width: 50px; height: 50px; }
    .ksp-totop__dryer { width: 27px; height: 27px; }
}
body:has(.ksp-sticky-cta) .ksp-totop { bottom: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom) + 76px); }

/* Tam ekran katmanlar açıkken (harita, yazdırma) düğme görünmez */
body.ksp-pay-printing .ksp-totop { display: none; }
@media print { .ksp-totop { display: none !important; } }

@media (prefers-reduced-motion: reduce) {
    .ksp-totop, .ksp-totop__bar, .ksp-totop__dryer { transition: none; }
    .ksp-totop:hover .ksp-totop__wind path, .ksp-totop.is-blowing .ksp-totop__wind path,
    .ksp-totop.is-blowing .ksp-totop__dryer { animation: none; }
}

/* Takvim üstü günlük özet şeridi (KARARLAR §54) */
.ksp-calsum { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 10px; padding: 8px 10px;
  border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); }
.ksp-calsum__item { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px;
  background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .76rem; }
.ksp-calsum__item b { color: var(--ksp-text); font-size: .86rem; font-weight: 800; }
.ksp-calsum__item .material-symbols-rounded { font-size: 16px; }
.ksp-calsum__item.is-green b { color: var(--ksp-success); }
.ksp-calsum__item.is-rose b { color: var(--ksp-danger); }
.ksp-calsum__item.is-blue b { color: var(--ksp-primary); }
.ksp-calsum__link { display: inline-flex; align-items: center; gap: 5px; margin-inline-start: auto; padding: 5px 12px;
  border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-text); color: var(--ksp-surface);
  font-size: .76rem; font-weight: 700; text-decoration: none; }
.ksp-calsum__link:hover { filter: brightness(1.15); }
/* E-Bilet kodu araması (KARARLAR §82.32): rapor düğmesinin solunda hap kutu */
.ksp-calsum__ticket { display: inline-flex; align-items: center; gap: 4px; margin: 0 0 0 auto; padding: 2px 3px 2px 10px;
  border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); }
.ksp-calsum__ticket:focus-within { border-color: var(--ksp-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ksp-primary) 18%, transparent); }
.ksp-calsum__ticket .material-symbols-rounded { font-size: 17px; }
.ksp-calsum__ticket input { width: 130px; min-width: 0; border: 0; background: transparent; color: var(--ksp-text);
  font-size: .8rem; font-weight: 600; letter-spacing: .02em; outline: 0; }
.ksp-calsum__ticket input::-webkit-search-cancel-button { display: none; }
.ksp-calsum__ticket button { display: inline-grid; place-items: center; width: 28px; height: 28px; border: 0; border-radius: 50%;
  background: var(--ksp-primary); color: #fff; }
.ksp-calsum__ticket + .ksp-calsum__link { margin-inline-start: 0; }
@media (max-width: 575.98px) {
  .ksp-calsum__item--money { order: 9; }
  .ksp-calsum__link { margin-inline-start: 0; width: 100%; justify-content: center; }
  .ksp-calsum__ticket { order: 10; width: 100%; margin: 0; }
  .ksp-calsum__ticket input { flex: 1; width: auto; font-size: 16px; } /* 16px: iOS odakta yakınlaştırmasın */
  .ksp-calsum__link { order: 11; }
}

/* Takvim üstü günlük özet + Randevu Raporu ekranı (sahip isteği 2026-09-25; KARARLAR §54).
   Tasarım (sahip geri bildirimi aynı gün: "çok basit duruyor, renkli ibareler yaz"): her olay türünün
   kendi tonu var; kart, tablo hücresi ve günlük rozeti AYNI tondan beslenir. Tonlar burada tek yerde
   tanımlanır (--rap-*), böylece yeni bir olay eklenince tek satır yazmak yeterlidir. */
.ksp-rap {
  --rap-green: #059669; --rap-green-bg: #ecfdf5;
  --rap-blue: #2563eb;  --rap-blue-bg: #eff6ff;
  --rap-amber: #b45309; --rap-amber-bg: #fffbeb;
  --rap-violet: #7c3aed; --rap-violet-bg: #f5f3ff;
  --rap-orange: #c2410c; --rap-orange-bg: #fff7ed;
  --rap-rose: #e11d48;  --rap-rose-bg: #fff1f2;
  --rap-red: #dc2626;   --rap-red-bg: #fef2f2;
  --rap-slate: #475569; --rap-slate-bg: #f8fafc;
  display: flex; flex-direction: column; gap: 18px;
}
:root[data-theme="dark"] .ksp-rap, :root:not([data-theme="light"]) .ksp-rap {
  --rap-green-bg: rgba(5, 150, 105, .14); --rap-blue-bg: rgba(37, 99, 235, .14);
  --rap-amber-bg: rgba(180, 83, 9, .16); --rap-violet-bg: rgba(124, 58, 237, .16);
  --rap-orange-bg: rgba(194, 65, 12, .16); --rap-rose-bg: rgba(225, 29, 72, .14);
  --rap-red-bg: rgba(220, 38, 38, .14); --rap-slate-bg: rgba(71, 85, 105, .14);
}

/* ---- Başlık ---- */
.ksp-rap__hero { display: flex; flex-wrap: wrap; gap: 16px; padding: 20px 22px; border: 1px solid var(--ksp-border);
  border-radius: 20px; background: linear-gradient(135deg, var(--ksp-surface) 0%, var(--ksp-surface-2) 100%); }
.ksp-rap__heromain { flex: 1 1 320px; min-width: 0; }
.ksp-rap__heroside { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.ksp-rap__badge { display: inline-flex; align-items: center; gap: 5px; padding: 4px 11px; border-radius: 999px;
  background: var(--ksp-text); color: var(--ksp-surface); font-size: .68rem; font-weight: 800;
  letter-spacing: .04em; text-transform: uppercase; }
.ksp-rap__badge .material-symbols-rounded { font-size: 14px; }
.ksp-rap__title { margin: 8px 0 0; font-size: 1.45rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-rap__lead { margin: 5px 0 0; max-width: 64ch; color: var(--ksp-muted); font-size: .85rem; line-height: 1.55; }
.ksp-rap__back { display: inline-flex; align-items: center; gap: 5px; padding: 8px 14px; border: 1px solid var(--ksp-border);
  border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .8rem; font-weight: 700; text-decoration: none; }
.ksp-rap__back:hover { border-color: var(--ksp-muted); }
.ksp-rap__range { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; margin: 0; }
.ksp-rap__rangelbl { display: inline-flex; align-items: center; gap: 4px; color: var(--ksp-muted); font-size: .74rem; font-weight: 700; }
.ksp-rap__rangelbl .material-symbols-rounded { font-size: 16px; }
.ksp-rap__sep { color: var(--ksp-muted); }
.ksp-rap__input { height: 36px; padding: 0 10px; border: 1px solid var(--ksp-border); border-radius: 10px;
  background: var(--ksp-surface); color: var(--ksp-text); font-size: .8rem; font-family: inherit; }
.ksp-rap__btn { display: inline-flex; align-items: center; gap: 5px; height: 36px; padding: 0 15px; border: 0; border-radius: 10px;
  background: var(--ksp-text); color: var(--ksp-surface); font-size: .78rem; font-weight: 700; cursor: pointer; }
.ksp-rap__btn:hover { filter: brightness(1.12); }

/* ---- Özet kartları ---- */
.ksp-rap__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(134px, 1fr)); gap: 10px; }
.ksp-rap__card { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 13px 14px 15px;
  border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); color: var(--ksp-text);
  text-decoration: none; overflow: hidden; transition: border-color .15s, transform .15s, box-shadow .15s; }
.ksp-rap__card::before { content: ''; position: absolute; inset: 0 0 auto; height: 3px; background: var(--rap-tone, var(--ksp-border)); }
.ksp-rap__card:hover { transform: translateY(-2px); box-shadow: var(--ksp-shadow-sm); border-color: var(--rap-tone, var(--ksp-muted)); }
.ksp-rap__card.is-on { border-color: var(--rap-tone); box-shadow: 0 0 0 1px var(--rap-tone) inset; }
.ksp-rap__cardtop { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.ksp-rap__ico { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px;
  background: var(--rap-tone-bg, var(--ksp-surface-2)); color: var(--rap-tone, var(--ksp-muted)); }
.ksp-rap__ico .material-symbols-rounded { font-size: 18px; }
.ksp-rap__pin { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 7px;
  background: var(--rap-tone); color: #fff; }
.ksp-rap__pin .material-symbols-rounded { font-size: 14px; }
.ksp-rap__card strong { font-size: 1.6rem; font-weight: 800; line-height: 1.05; letter-spacing: -.02em; }
.ksp-rap__card small { color: var(--ksp-muted); font-size: .75rem; font-weight: 600; }
.ksp-rap__spark { display: block; height: 4px; margin-top: 9px; border-radius: 999px; background: var(--rap-tone-bg); overflow: hidden; }
.ksp-rap__spark i { display: block; height: 100%; border-radius: 999px; background: var(--rap-tone); }

/* Ton eşlemesi — kart, tablo başlığı, rozet ve hap aynı iki değişkeni kullanır */
.is-green { --rap-tone: var(--rap-green); --rap-tone-bg: var(--rap-green-bg); }
.is-blue { --rap-tone: var(--rap-blue); --rap-tone-bg: var(--rap-blue-bg); }
.is-amber { --rap-tone: var(--rap-amber); --rap-tone-bg: var(--rap-amber-bg); }
.is-violet { --rap-tone: var(--rap-violet); --rap-tone-bg: var(--rap-violet-bg); }
.is-orange { --rap-tone: var(--rap-orange); --rap-tone-bg: var(--rap-orange-bg); }
.is-rose { --rap-tone: var(--rap-rose); --rap-tone-bg: var(--rap-rose-bg); }
.is-red { --rap-tone: var(--rap-red); --rap-tone-bg: var(--rap-red-bg); }
.is-slate { --rap-tone: var(--rap-slate); --rap-tone-bg: var(--rap-slate-bg); }

/* ---- Ciro kartları ---- */
.ksp-rap__money { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 10px; }
.ksp-rap__moneycard { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--ksp-border);
  border-radius: 16px; background: var(--ksp-surface); }
.ksp-rap__moneyico { display: grid; place-items: center; flex-shrink: 0; width: 42px; height: 42px; border-radius: 13px;
  background: var(--rap-tone-bg); color: var(--rap-tone); }
.ksp-rap__moneyico .material-symbols-rounded { font-size: 22px; }
.ksp-rap__moneycard small { display: block; color: var(--ksp-muted); font-size: .74rem; font-weight: 700; }
.ksp-rap__moneycard strong { display: block; margin: 1px 0; font-size: 1.45rem; font-weight: 800; letter-spacing: -.02em; color: var(--rap-tone); }
.ksp-rap__moneycard span { color: var(--ksp-muted); font-size: .72rem; }

/* ---- Bölümler ---- */
.ksp-rap__sec { padding: 18px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-rap__sec h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 14px; font-size: 1.02rem; font-weight: 800; }
.ksp-rap__sec h2 > small { color: var(--ksp-muted); font-size: .74rem; font-weight: 600; }
.ksp-rap__clear { display: inline-flex; align-items: center; gap: 4px; margin-inline-start: auto; padding: 4px 10px;
  border: 1px solid var(--ksp-border); border-radius: 999px; color: var(--ksp-muted); font-size: .72rem; font-weight: 700; text-decoration: none; }
.ksp-rap__clear:hover { color: var(--ksp-text); border-color: var(--ksp-muted); }
.ksp-rap__empty { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--ksp-muted); font-size: .82rem; }

/* ---- Personel tablosu ---- */
.ksp-rap__tablewrap { overflow-x: auto; }
.ksp-rap__table { width: 100%; border-collapse: collapse; font-size: .82rem; }
.ksp-rap__table th { padding: 8px 10px; border-bottom: 2px solid var(--ksp-border); color: var(--ksp-muted);
  font-size: .72rem; font-weight: 800; text-align: start; white-space: nowrap; }
.ksp-rap__table th.is-green, .ksp-rap__table th.is-blue, .ksp-rap__table th.is-amber, .ksp-rap__table th.is-violet,
.ksp-rap__table th.is-orange, .ksp-rap__table th.is-rose, .ksp-rap__table th.is-red { color: var(--rap-tone); }
.ksp-rap__table td { padding: 10px; border-bottom: 1px solid var(--ksp-border); white-space: nowrap; }
.ksp-rap__table tbody tr:hover { background: var(--ksp-surface-2); }
.ksp-rap__person strong { font-weight: 700; }
.ksp-rap__pill { display: inline-grid; place-items: center; min-width: 26px; height: 24px; padding: 0 7px; border-radius: 8px;
  background: var(--rap-tone-bg); color: var(--rap-tone); font-size: .78rem; font-weight: 800; }
.ksp-rap__table td:nth-child(2) { --rap-tone: var(--rap-green); --rap-tone-bg: var(--rap-green-bg); }
.ksp-rap__table td:nth-child(3) { --rap-tone: var(--rap-amber); --rap-tone-bg: var(--rap-amber-bg); }
.ksp-rap__table td:nth-child(4) { --rap-tone: var(--rap-violet); --rap-tone-bg: var(--rap-violet-bg); }
.ksp-rap__table td:nth-child(5) { --rap-tone: var(--rap-orange); --rap-tone-bg: var(--rap-orange-bg); }
.ksp-rap__table td:nth-child(6) { --rap-tone: var(--rap-rose); --rap-tone-bg: var(--rap-rose-bg); }
.ksp-rap__table td:nth-child(7) { --rap-tone: var(--rap-red); --rap-tone-bg: var(--rap-red-bg); }
.ksp-rap__zero { color: var(--ksp-muted); opacity: .55; }
.ksp-rap__num { font-weight: 800; font-variant-numeric: tabular-nums; }
.ksp-rap__num.is-green { color: var(--rap-green); }
.ksp-rap__num.is-rose { color: var(--rap-rose); }

/* ---- İşlem günlüğü ---- */
.ksp-rap__log { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-rap__logitem { position: relative; display: flex; align-items: flex-start; gap: 11px; padding: 12px 14px 12px 16px;
  border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); overflow: hidden; }
.ksp-rap__logitem::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--rap-tone); }
.ksp-rap__logitem:hover { border-color: var(--rap-tone); }
.ksp-rap__logico { display: grid; place-items: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: 11px;
  background: var(--rap-tone-bg); color: var(--rap-tone); }
.ksp-rap__logico .material-symbols-rounded { font-size: 18px; }
.ksp-rap__logbody { display: flex; flex-direction: column; min-width: 0; gap: 3px; }
.ksp-rap__logtop { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; margin: 0; font-size: .9rem; }
.ksp-rap__code { color: var(--ksp-muted); font-size: .73rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.ksp-rap__reason { display: inline-flex; align-items: flex-start; gap: 5px; margin: 0; padding: 5px 9px; border-radius: 9px;
  background: var(--rap-tone-bg); color: var(--ksp-text); font-size: .78rem; line-height: 1.4; }
.ksp-rap__reason .material-symbols-rounded { flex-shrink: 0; font-size: 15px; color: var(--rap-tone); }
.ksp-rap__meta { display: flex; flex-wrap: wrap; gap: 3px 12px; margin: 2px 0 0; color: var(--ksp-muted); font-size: .74rem; }
.ksp-rap__meta span { display: inline-flex; align-items: center; gap: 3px; }
.ksp-rap__meta .material-symbols-rounded { font-size: 14px; }
.ksp-rap__who b { margin-inline-start: 3px; padding: 1px 6px; border-radius: 999px; background: var(--ksp-surface-2);
  color: var(--ksp-text); font-size: .66rem; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; }
.ksp-rap__tagwrap { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; margin-inline-start: auto; }
.ksp-rap__tag { display: inline-flex; align-items: center; gap: 4px; padding: 5px 11px; border-radius: 999px;
  background: var(--rap-tone-bg); color: var(--rap-tone); font-size: .75rem; font-weight: 800; white-space: nowrap; }
.ksp-rap__tag .material-symbols-rounded { font-size: 16px; }
.ksp-rap__logsum { font-weight: 800; font-size: .84rem; font-variant-numeric: tabular-nums; }
.ksp-rap__logsum.is-green { color: var(--rap-green); }
.ksp-rap__logsum.is-rose { color: var(--rap-rose); }

@media (max-width: 767.98px) {
  .ksp-rap__heroside { align-items: stretch; width: 100%; }
  .ksp-rap__range { justify-content: flex-start; }
  .ksp-rap__logitem { flex-wrap: wrap; }
  .ksp-rap__tagwrap { flex-direction: row; align-items: center; width: 100%; margin-inline-start: 0; }
}

/* Randevu detayı işlem panelleri (sahip isteği 2026-09-25; KARARLAR §52): iptal sebebi, erteleme, personel aktarma */
.ksp-cal-noshow { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; padding: 3px 9px; border-radius: 999px;
  background: color-mix(in srgb, var(--ksp-danger) 12%, transparent); color: var(--ksp-danger); font-size: .72rem; font-weight: 700; }
.ksp-cal-noshow .material-symbols-rounded { font-size: 15px; }
.ksp-cal-act--move { border-color: var(--ksp-border); }
.ksp-cal-panel { margin-top: 10px; padding: 14px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-cal-panel__h { display: flex; align-items: center; gap: 6px; margin: 0 0 10px; font-size: .9rem; font-weight: 800; }
.ksp-cal-panel__h .material-symbols-rounded { font-size: 19px; color: var(--ksp-muted); }
.ksp-cal-panel__lbl { display: block; margin-bottom: 4px; color: var(--ksp-muted); font-size: .74rem; font-weight: 700; }
.ksp-cal-panel__input { width: 100%; height: 38px; margin-bottom: 8px; padding: 0 11px; border: 1px solid var(--ksp-border); border-radius: 10px;
  background: var(--ksp-surface); color: var(--ksp-text); font-size: .82rem; font-family: inherit; }
.ksp-cal-panel__input:focus { outline: 2px solid var(--ksp-primary); outline-offset: 1px; }
.ksp-cal-panel__row { display: flex; gap: 8px; }
.ksp-cal-panel__row .ksp-cal-panel__input { flex: 1 1 0; min-width: 0; }
.ksp-cal-panel__hint { display: flex; align-items: flex-start; gap: 5px; margin: 0 0 10px; color: var(--ksp-muted); font-size: .74rem; line-height: 1.4; }
.ksp-cal-panel__hint .material-symbols-rounded { flex-shrink: 0; font-size: 16px; }
.ksp-cal-panel__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ksp-cal-panel__off { padding: 0 12px; height: 36px; border: 0; border-radius: 10px; background: transparent; color: var(--ksp-muted);
  font-size: .78rem; font-weight: 700; cursor: pointer; }
.ksp-cal-panel__off:hover { color: var(--ksp-text); }

/* @kokpit-muzik-serit — Kokpitteki tek satırlık müzik şeridi (sahip isteği 2026-09-25; KARARLAR §26).
   Tam çalar yer kaplamasın diye kokpitte yalnız bu şerit durur: nereye basılırsa mini pencere açılır.
   Aşağıdaki .ksp-mp kuralları artık YALNIZ mini pencerede (/kokpit/muzik/pencere) kullanılır. */
.ksp-mpbar-wrap { margin-bottom: 1.5rem; }
.ksp-mpbar { display: flex; align-items: center; gap: .65rem; width: 100%; height: 52px; padding: 0 .7rem 0 .6rem; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); box-shadow: var(--ksp-shadow-sm); color: var(--ksp-text); text-align: start; text-decoration: none; cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .15s; }
.ksp-mpbar--off { margin-bottom: 1.5rem; }
.ksp-mpbar:hover { border-color: var(--ksp-muted); box-shadow: var(--ksp-shadow-lg); transform: translateY(-1px); }
.ksp-mpbar:focus-visible { outline: 2px solid var(--ksp-primary); outline-offset: 2px; }
.ksp-mpbar__ico { display: grid; place-items: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: 11px; background: var(--ksp-primary-50); color: var(--ksp-primary); }
.ksp-mpbar__ico .material-symbols-rounded { font-size: 20px; }
.ksp-mpbar__label { overflow: hidden; flex: 1 1 auto; min-width: 0; font-size: .88rem; font-weight: 800; letter-spacing: -.01em; text-overflow: ellipsis; white-space: nowrap; }
.ksp-mpbar__acts { display: flex; align-items: center; gap: .3rem; flex-shrink: 0; }
.ksp-mpbar__act { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--ksp-surface-2); color: var(--ksp-muted); transition: background .15s, color .15s; }
.ksp-mpbar__act .material-symbols-rounded { font-size: 19px; }
.ksp-mpbar__act--play { background: var(--ksp-gradient); color: #fff; box-shadow: 0 8px 16px -10px rgba(255, 32, 86, .9); }
.ksp-mpbar:hover .ksp-mpbar__act:not(.ksp-mpbar__act--play) { background: var(--ksp-primary-50); color: var(--ksp-primary); }
.ksp-mpbar__msg { margin: .4rem 0 0; color: var(--ksp-danger); font-size: .78rem; font-weight: 600; }
/* Çalar yalnız masaüstü web (mini pencere hariç) — şerit de aynı kuralı izler */
@media (max-width: 991.98px) { .ksp-mpbar-wrap, .ksp-mpbar--off { display: none; } }
/* @kokpit-muzik — Salon müzik çalar (KARARLAR §26; views/panels/partials/music-player.php, app.js "@kokpit-muzik").
   Kokpitte karşılama kartının altında YATAY çubuk; mini pencerede (.ksp-mp--window) dikey. Vurgu rose (hero ile aynı). */
.ksp-mp { display: flex; flex-direction: column; gap: .85rem; margin-bottom: 1.5rem; padding: 1rem 1.25rem; border: 1px solid var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); box-shadow: var(--ksp-shadow-sm); }
.ksp-mp__head { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; }
.ksp-mp__brand { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.ksp-mp__logo { display: grid; place-items: center; flex-shrink: 0; width: 40px; height: 40px; border-radius: 12px; background: var(--ksp-primary-50); color: var(--ksp-primary); }
.ksp-mp__logo .material-symbols-rounded { font-size: 22px; }
.ksp-mp__brandtext { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.ksp-mp__brandtext strong { font-size: .95rem; font-weight: 800; letter-spacing: -.01em; }
.ksp-mp__brandtext small { display: inline-flex; align-items: center; gap: .25rem; color: var(--ksp-muted); font-size: .74rem; font-weight: 600; }
.ksp-mp__brandtext small .material-symbols-rounded { font-size: 14px; color: var(--ksp-success); }
.ksp-mp__lists { display: flex; flex: 1 1 260px; gap: .45rem; min-width: 0; padding: 2px; overflow-x: auto; scrollbar-width: none; }
.ksp-mp__lists::-webkit-scrollbar { display: none; }
.ksp-mp__chip { flex-shrink: 0; height: 34px; padding: 0 .95rem; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .8rem; font-weight: 700; white-space: nowrap; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.ksp-mp__chip:hover { border-color: var(--ksp-muted); }
.ksp-mp__chip.is-active { border-color: var(--ksp-ink); background: var(--ksp-ink); color: #fff; }
[data-bs-theme="dark"] .ksp-mp__chip.is-active { border-color: #fafaf9; background: #fafaf9; color: #1c1917; }
.ksp-mp__tools { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; margin-inline-start: auto; }
.ksp-mp__auto { display: inline-flex; align-items: center; gap: .45rem; margin: 0; color: var(--ksp-muted); font-size: .78rem; font-weight: 600; cursor: pointer; }
.ksp-mp__auto.form-switch { padding-inline-start: 0; }
.ksp-mp__auto.form-switch .form-check-input { width: 2.2em; height: 1.2em; margin: 0; float: none; flex-shrink: 0; cursor: pointer; }
.ksp-mp__pop { display: inline-flex; align-items: center; gap: .35rem; height: 34px; padding: 0 .85rem; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface-2); color: var(--ksp-text); font-size: .78rem; font-weight: 700; cursor: pointer; }
.ksp-mp__pop:hover { border-color: var(--ksp-muted); }
.ksp-mp__pop .material-symbols-rounded { font-size: 17px; }

.ksp-mp__bar { display: grid; grid-template-columns: minmax(180px, 1.1fr) auto minmax(200px, 2fr) auto; align-items: center; gap: .6rem 1.4rem; padding: .7rem .9rem; border-radius: 16px; color: #fff;
  background: radial-gradient(60% 160% at 100% 50%, rgba(136, 19, 55, .45), transparent 65%), #1c1917; }
.ksp-mp__now { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.ksp-mp__cover { display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; border-radius: 12px; background: var(--ksp-gradient); box-shadow: 0 8px 18px -10px rgba(255, 32, 86, .9); }
.ksp-mp__eq { display: flex; align-items: flex-end; gap: 3px; height: 16px; }
.ksp-mp__eq b { display: block; width: 3px; height: 6px; border-radius: 2px; background: #fff; }
.ksp-mp__eq.is-go b { animation: ksp-mp-eq .8s ease-in-out infinite alternate; }
.ksp-mp__eq.is-go b:nth-child(2) { animation-delay: .2s; }
.ksp-mp__eq.is-go b:nth-child(3) { animation-delay: .4s; }
@keyframes ksp-mp-eq { from { height: 4px; } to { height: 16px; } }
.ksp-mp__meta { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.ksp-mp__meta strong { overflow: hidden; font-size: .9rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.ksp-mp__meta small { overflow: hidden; color: #a8a29e; font-size: .74rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-mp__ctrl { display: flex; align-items: center; gap: .2rem; }
.ksp-mp__btn { display: inline-grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #d6d3d1; cursor: pointer; transition: background .15s, color .15s; }
.ksp-mp__btn:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.ksp-mp__btn .material-symbols-rounded { font-size: 21px; }
.ksp-mp__btn.is-on { color: #ff8fa3; }
.ksp-mp__btn--play, .ksp-mp__btn--play:hover { width: 46px; height: 46px; margin: 0 .2rem; background: #ff2056; color: #fff; box-shadow: 0 10px 20px -10px rgba(255, 32, 86, .9); }
.ksp-mp__btn--play:hover { background: #ec003f; }
.ksp-mp__btn--play .material-symbols-rounded { font-size: 26px; font-variation-settings: "FILL" 1; }
.ksp-mp__ico-pause, .ksp-mp.is-playing .ksp-mp__ico-play { display: none; }
.ksp-mp.is-playing .ksp-mp__ico-pause { display: inline-block; }
.ksp-mp__prog { display: flex; align-items: center; gap: .65rem; min-width: 0; }
.ksp-mp__time { min-width: 34px; color: #a8a29e; font-size: .74rem; font-variant-numeric: tabular-nums; }
.ksp-mp__time--end { text-align: end; }
.ksp-mp__seek { position: relative; flex: 1; height: 18px; cursor: pointer; }
.ksp-mp__seek::before { content: ""; position: absolute; inset: 7px 0; border-radius: 2px; background: rgba(255, 255, 255, .18); }
.ksp-mp__fill { position: absolute; inset-block: 7px; inset-inline-start: 0; width: 0; border-radius: 2px; background: #ff2056; }
.ksp-mp__fill::after { content: ""; position: absolute; inset-inline-end: -6px; top: -4px; width: 12px; height: 12px; border-radius: 50%; background: #fff; opacity: 0; transition: opacity .15s; }
.ksp-mp__seek:hover .ksp-mp__fill::after, .ksp-mp__seek:focus-visible .ksp-mp__fill::after { opacity: 1; }
.ksp-mp__vol { display: flex; align-items: center; gap: .35rem; margin: 0; color: #a8a29e; }
.ksp-mp__vol .material-symbols-rounded { font-size: 19px; }
.ksp-mp__vol input { width: 90px; accent-color: #ff2056; }
.ksp-mp button:focus-visible, .ksp-mp__seek:focus-visible, .ksp-mp input:focus-visible { outline: 2px solid #ff2056; outline-offset: 2px; }
.ksp-mp__msg { margin: 0; color: var(--ksp-muted); font-size: .8rem; font-weight: 600; }
.ksp-mp__msg[hidden] { display: none; }
.ksp-mp__away { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: .6rem .9rem; border: 1px dashed rgba(var(--ksp-primary-rgb), .45); border-radius: 12px; background: var(--ksp-primary-50); color: var(--ksp-primary); font-size: .82rem; font-weight: 700; }
.ksp-mp__away[hidden] { display: none; }
.ksp-mp__away button { margin-inline-start: auto; padding: .25rem .75rem; border: 0; border-radius: 8px; background: var(--ksp-primary); color: #fff; font-size: .76rem; font-weight: 700; cursor: pointer; }
.ksp-mp.is-away .ksp-mp__bar { opacity: .55; }
.ksp-mp__more { padding-top: .6rem; border-top: 1px solid var(--ksp-border); }
.ksp-mp__more summary { display: flex; align-items: center; gap: .45rem; color: var(--ksp-text); font-size: .82rem; font-weight: 700; cursor: pointer; list-style: none; }
.ksp-mp__more summary::-webkit-details-marker { display: none; }
.ksp-mp__more summary .material-symbols-rounded { font-size: 19px; color: var(--ksp-muted); }
.ksp-mp__chev { margin-inline-start: auto; transition: transform .2s; }
.ksp-mp__more[open] .ksp-mp__chev { transform: rotate(180deg); }
.ksp-mp__tracks { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 2px .75rem; margin: .5rem 0 0; padding: 0; list-style: none; }
.ksp-mp__row { display: flex; align-items: center; gap: .65rem; width: 100%; padding: .5rem .6rem; border: 0; border-radius: 10px; background: transparent; color: var(--ksp-text); text-align: start; cursor: pointer; }
.ksp-mp__row:hover { background: var(--ksp-surface-2); }
.ksp-mp__row.is-active { background: var(--ksp-primary-50); }
.ksp-mp__rown { width: 22px; color: var(--ksp-muted); font-size: .74rem; font-weight: 700; text-align: center; font-variant-numeric: tabular-nums; }
.ksp-mp__row.is-active .ksp-mp__rown { color: var(--ksp-primary); }
.ksp-mp__rowt { display: flex; flex: 1; flex-direction: column; min-width: 0; line-height: 1.3; }
.ksp-mp__rowt strong { overflow: hidden; font-size: .84rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.ksp-mp__rowt small { color: var(--ksp-muted); font-size: .72rem; }
.ksp-mp__rowd { color: var(--ksp-muted); font-size: .74rem; font-variant-numeric: tabular-nums; }
.ksp-mp__license { margin: 0; color: var(--ksp-muted); font-size: .72rem; }
.ksp-mp__license a { color: inherit; text-decoration: underline; }
.ksp-mp__empty { display: flex; align-items: center; gap: .5rem; margin: 0; padding: .75rem .9rem; border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .84rem; font-weight: 600; }
/* Üçlü kaynak alanı: Platform | Spotify | YouTube (sahip isteği 2026-09-24; KARARLAR §37).
   Salonun kendi listesi yoksa kutu "Liste bağla" bağlantısıdır; dış kaynak seçiliyken platform çubuğu gizlenir. */
.ksp-mp__srcs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
.ksp-mp__src { display: flex; align-items: center; gap: .6rem; min-width: 0; padding: .55rem .7rem; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); color: var(--ksp-text); text-align: start; text-decoration: none; cursor: pointer; transition: border-color .15s, background .15s, box-shadow .15s; }
.ksp-mp__src:hover { border-color: var(--ksp-muted); }
.ksp-mp__src.is-active { border-color: var(--ksp-ink); background: var(--ksp-surface-2); box-shadow: inset 0 0 0 1px var(--ksp-ink); }
.ksp-mp__src.is-off { opacity: .6; cursor: default; }
a.ksp-mp__src.is-off { cursor: pointer; }
a.ksp-mp__src.is-off:hover { opacity: 1; }
.ksp-mp__src-ico { display: grid; place-items: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px; background: var(--ksp-surface-2); color: var(--ksp-muted); }
.ksp-mp__src-ico .material-symbols-rounded { font-size: 20px; }
.ksp-mp__src-ico.is-platform { background: var(--ksp-primary-50); color: var(--ksp-primary); }
.ksp-mp__src-ico.is-spotify { background: rgba(29, 185, 84, .14); color: #1db954; }
.ksp-mp__src-ico.is-youtube { background: rgba(255, 0, 0, .12); color: #e30000; }
.ksp-mp__src-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.ksp-mp__src-text strong { overflow: hidden; font-size: .84rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.ksp-mp__src-text small { display: inline-flex; align-items: center; gap: .25rem; overflow: hidden; color: var(--ksp-muted); font-size: .72rem; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.ksp-mp__src-text small .material-symbols-rounded { font-size: 14px; flex-shrink: 0; }
.ksp-mp__ext { display: flex; flex-direction: column; gap: .6rem; }
.ksp-mp__ext[hidden] { display: none; }
.ksp-mp__extlists { display: flex; flex-wrap: wrap; gap: .45rem; }
.ksp-mp__extlists:empty, .ksp-mp__extlists .ksp-mp__chip[hidden] { display: none; }
.ksp-mp__frame { overflow: hidden; border-radius: 16px; background: #1c1917; }
.ksp-mp__frame:empty { display: none; }
.ksp-mp__frame iframe { display: block; width: 100%; height: 352px; border: 0; }
.ksp-mp.is-yt .ksp-mp__frame { max-width: 626px; margin-inline: auto; } /* 16:9 çerçeve Spotify ile aynı yüksekliğe (352px) otursun */
.ksp-mp.is-yt .ksp-mp__frame iframe { height: auto; aspect-ratio: 16 / 9; }
.ksp-mp__extnote { display: flex; align-items: flex-start; gap: .4rem; margin: 0; color: var(--ksp-muted); font-size: .74rem; font-weight: 600; }
.ksp-mp__extnote[hidden] { display: none; }
.ksp-mp__extnote .material-symbols-rounded { font-size: 15px; flex-shrink: 0; }
.ksp-mp__extmsg { margin: 0; color: var(--ksp-primary); font-size: .8rem; font-weight: 700; }
.ksp-mp__extmsg[hidden] { display: none; }
.ksp-mp.is-ext .ksp-mp__bar, .ksp-mp.is-ext .ksp-mp__more, .ksp-mp.is-ext .ksp-mp__license,
.ksp-mp.is-ext .ksp-mp__lists, .ksp-mp.is-ext .ksp-mp__away, .ksp-mp.is-ext .ksp-mp__auto { display: none; }
.ksp-mp--window .ksp-mp__srcs { grid-template-columns: 1fr; }
/* Mini pencere artık dış kaynağı da çalıyor (sahip kararı 2026-09-24): Spotify listesi kompakt
   moda düşmesin diye tam yükseklikte kalır; pencere bu yüzden daha uzun açılır. */
.ksp-mp--window .ksp-mp__frame iframe { height: 352px; }
/* YouTube müzik kutusu (sahip isteği 2026-09-24): video değil, kapak + kendi kontrollerimiz.
   Oynatıcı YouTube şartları gereği görünür kalır; 240×240 kare kapak olarak durur. */
.ksp-mp__yt { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 1.1rem; padding: 1rem; border-radius: 16px; color: #fff;
  background: radial-gradient(60% 160% at 100% 50%, rgba(136, 19, 55, .35), transparent 65%), #1c1917; }
.ksp-mp__yt[hidden] { display: none; }
.ksp-mp__yt-art { overflow: hidden; width: 240px; height: 240px; border-radius: 12px; background: #000; }
.ksp-mp__yt-art iframe { display: block; width: 240px; height: 240px; border: 0; }
.ksp-mp__yt-main { display: flex; flex-direction: column; justify-content: center; gap: .3rem; min-width: 0; max-width: 100%; }
.ksp-mp__yt-title { overflow: hidden; font-size: 1.2rem; font-weight: 800; letter-spacing: -.01em; text-overflow: ellipsis; white-space: nowrap; }
.ksp-mp__yt-sub { overflow: hidden; color: #a8a29e; font-size: .84rem; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.ksp-mp__yt-ctrl { display: flex; align-items: center; gap: .2rem; margin-top: .5rem; }
.ksp-mp__yt .ksp-mp__btn[hidden] { display: none; }
.ksp-mp__yico-pause, .ksp-mp__yt.is-playing .ksp-mp__yico-play { display: none; }
.ksp-mp__yt.is-playing .ksp-mp__yico-pause { display: inline-block; }
/* Sanatçı / kanal adresi: gömülemez, kendi uygulamasında açılır */
.ksp-mp__chan { display: flex; align-items: center; gap: .9rem; padding: 1rem; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface-2); }
.ksp-mp__chan[hidden] { display: none; }
.ksp-mp__chan-ico { display: grid; place-items: center; flex-shrink: 0; width: 48px; height: 48px; border-radius: 14px; background: rgba(255, 0, 0, .12); color: #e30000; }
.ksp-mp__chan-ico .material-symbols-rounded { font-size: 26px; }
.ksp-mp__chan-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.ksp-mp__chan-text strong { overflow: hidden; font-size: .95rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.ksp-mp__chan-text small { color: var(--ksp-muted); font-size: .76rem; font-weight: 600; }
.ksp-mp__chan-btn { display: inline-flex; align-items: center; gap: .35rem; flex-shrink: 0; margin-inline-start: auto; padding: .55rem .95rem; border-radius: 10px; background: var(--ksp-ink); color: #fff; font-size: .8rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.ksp-mp__chan-btn:hover { color: #fff; opacity: .9; }
[data-bs-theme="dark"] .ksp-mp__chan-btn { background: #fafaf9; color: #1c1917; }
[data-bs-theme="dark"] .ksp-mp__chan-btn:hover { color: #1c1917; }
@media (max-width: 991.98px) {
    .ksp-mp__yt { grid-template-columns: 1fr; justify-items: center; text-align: center; }
    /* Dar düzende sütun içeriğe göre daralmasın: başlık ellipsis ile kesilsin, taşmasın */
    .ksp-mp__yt-main { width: 100%; }
    .ksp-mp__yt-ctrl { justify-content: center; }
    .ksp-mp__chan { flex-wrap: wrap; }
    .ksp-mp__chan-btn { margin-inline-start: 0; }
}
.ksp-mp--window .ksp-mp__yt { grid-template-columns: 1fr; justify-items: center; text-align: center; }
.ksp-mp--window .ksp-mp__yt-main { width: 100%; }
.ksp-mp--window .ksp-mp__yt-ctrl { justify-content: center; }
@media (max-width: 1199.98px) {
    .ksp-mp__bar { grid-template-columns: minmax(0, 1fr) auto; }
    .ksp-mp__prog { grid-column: 1 / -1; order: 3; }
    .ksp-mp__vol { display: none; }
}
@media (max-width: 575.98px) {
    .ksp-mp { padding: .9rem; }
    .ksp-mp__tools { margin-inline-start: 0; }
    .ksp-mp__bar { grid-template-columns: minmax(0, 1fr); }
    .ksp-mp__ctrl { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { .ksp-mp__eq.is-go b { animation: none; height: 12px; } }
/* Sahip kararı 2026-09-21: çalar yalnız masaüstü web; mobil / tablet panel düzeninde (alt menü, < 992 px) gizli.
   app.js "@kokpit-muzik" görünmezken otomatik çalmaz, mobile geçilirse durdurur. Mini pencere (--window) etkilenmez. */
@media (max-width: 991.98px) { .ksp-mp:not(.ksp-mp--window) { display: none; } }

/* Mini pencere ("Ayrı pencerede çal"): dikey düzen */
.ksp-mwin { min-height: 100vh; background: var(--ksp-bg); }
.ksp-mwin__main { display: flex; flex-direction: column; gap: .75rem; max-width: 560px; margin: 0 auto; padding: .9rem; }
.ksp-mwin__top { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.ksp-mwin__salon { display: inline-flex; align-items: center; gap: .4rem; min-width: 0; overflow: hidden; color: var(--ksp-muted); font-size: .8rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.ksp-mwin__salon .material-symbols-rounded { font-size: 18px; }
.ksp-mp--window { margin: 0; }
.ksp-mp--window .ksp-mp__lists { flex-basis: 100%; }
.ksp-mp--window .ksp-mp__tools { margin-inline-start: 0; }
.ksp-mp--window .ksp-mp__bar { grid-template-columns: minmax(0, 1fr); padding: 1rem; }
.ksp-mp--window .ksp-mp__ctrl { justify-content: center; }
.ksp-mp--window .ksp-mp__prog { grid-column: auto; order: 0; }
.ksp-mp--window .ksp-mp__vol { display: flex; justify-content: center; }
.ksp-mp--window .ksp-mp__vol input { width: 60%; }
.ksp-mp--window .ksp-mp__tracks { grid-template-columns: minmax(0, 1fr); }

/* @yonetim-muzik — Süper Admin > Müzik Yönetimi (views/panels/admin/music/**) */
.ksp-adm-music-count { display: inline-grid; place-items: center; min-width: 24px; height: 20px; margin-inline-start: 6px; padding: 0 7px; border-radius: 999px; background: var(--adm-card-2); color: var(--adm-ink-2); font-size: .7rem; font-weight: 800; vertical-align: 2px; }
.ksp-adm-music-filter { display: flex; flex-wrap: wrap; gap: 8px; }
.ksp-adm-music-filter .ksp-adm-input { width: 220px; }
.ksp-adm-music-filter .ksp-adm-select { width: 150px; }
.ksp-adm-music-table .ksp-adm-cell__sub a { color: inherit; text-decoration: underline; }
.ksp-adm-music-table [data-status="processing"] .ksp-adm-badge .material-symbols-rounded { animation: ksp-adm-spin 1.2s linear infinite; }
@keyframes ksp-adm-spin { to { transform: rotate(360deg); } }
.ksp-adm-music-acts { display: inline-flex; align-items: center; gap: 6px; }
.ksp-adm-music-acts form { margin: 0; }
.ksp-adm-music-acts [data-adm-music-play].is-playing { background: var(--adm-rose-bg); color: var(--adm-rose); }
.ksp-adm-music-editform { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr) auto; align-items: end; gap: 12px; }
.ksp-adm-music-editform__acts { display: flex; gap: 6px; }
.ksp-adm-music-form__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.ksp-adm-music-form input[type="file"] { padding: 7px 10px; }
.ksp-adm-music-listrows { display: flex; flex-direction: column; gap: 6px; margin: 0 0 16px; padding: 0; list-style: none; }
.ksp-adm-music-listrow { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--adm-line); border-radius: 12px; }
.ksp-adm-music-listrow.is-off { background: var(--adm-card-2); }
.ksp-adm-music-listrow__main { display: flex; flex: 1; align-items: center; gap: 10px; min-width: 0; color: var(--adm-ink); text-decoration: none; }
.ksp-adm-music-listrow__ico { display: grid; place-items: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px; background: var(--adm-violet-bg); color: var(--adm-violet); }
.ksp-adm-music-listrow__text { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.ksp-adm-music-listrow__text strong { overflow: hidden; font-size: .84rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-adm-music-listrow__text small { color: var(--adm-muted); font-size: .72rem; }
.ksp-adm-music-newlist { display: flex; flex-direction: column; gap: 8px; padding-top: 16px; border-top: 1px solid var(--adm-line); }
.ksp-adm-music-newlist .ksp-adm-label { margin: 0; }
.ksp-adm-music-items { display: flex; flex-direction: column; margin: 0; padding: 0 12px; list-style: none; }
.ksp-adm-music-item { display: flex; align-items: center; gap: 12px; padding: 10px 8px; border-bottom: 1px solid var(--adm-line); }
.ksp-adm-music-item.is-off { opacity: .6; }
.ksp-adm-music-item__num { width: 24px; color: var(--adm-muted); font-size: .76rem; font-weight: 800; text-align: center; font-variant-numeric: tabular-nums; }
.ksp-adm-music-item__text { display: flex; flex: 1; flex-direction: column; min-width: 0; line-height: 1.3; }
.ksp-adm-music-item__text strong { overflow: hidden; font-size: .85rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-adm-music-item__text small { color: var(--adm-muted); font-size: .72rem; }
.ksp-adm-music-item__acts { display: inline-flex; gap: 4px; }
.ksp-adm-music-item__acts form { margin: 0; }
.ksp-adm-music-add { display: flex; flex-wrap: wrap; gap: 8px; padding: 16px 20px 20px; }
.ksp-adm-music-add .ksp-adm-select { flex: 1 1 240px; }
@media (max-width: 991.98px) {
    .ksp-adm-music-editform { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575.98px) {
    .ksp-adm-music-form__row { grid-template-columns: minmax(0, 1fr); }
    .ksp-adm-music-filter .ksp-adm-input, .ksp-adm-music-filter .ksp-adm-select { width: 100%; }
}

/* @yonetim-kadro — Yönetim kadrosu + yeni uzman kadrosu tasarımı (sahip isteği 2026-09-21, KARARLAR §27).
   Site: views/site/salon/{management,team-grid}.php, views/site/staff/manager.php · Kokpit: panels/partials/staff-{list,header,detail,manager-*}.php
   Renk: kurucu altın (amber), ortak kurucu mor, salon müdürü mavi; ekip kartları nötr, vurgu rose. */

.ksp-tm-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 20px; margin-bottom: 16px; }
.ksp-tm-head__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 1.2rem; font-weight: 800; letter-spacing: -.01em; color: var(--ksp-text); }
.ksp-tm-dot { width: 9px; height: 9px; flex-shrink: 0; border-radius: 50%; background: #f97316; box-shadow: 0 0 0 4px rgba(249, 115, 22, .16); }
.ksp-tm-head__lead { margin: 4px 0 0; font-size: .84rem; color: var(--ksp-muted); }
.ksp-tm-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.ksp-tm-filter { height: 34px; padding: 0 14px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .78rem; font-weight: 700; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.ksp-tm-filter:hover { border-color: var(--ksp-muted); }
.ksp-tm-filter.is-active { border-color: #1c1917; background: #1c1917; color: #fff; }
.ksp-tm-filter:focus-visible { outline: 2px solid var(--ksp-primary); outline-offset: 2px; }
.ksp-tm-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.1rem; margin: 0; padding: 0; list-style: none; }
/* Kart = ana sayfa usta kartı (.ksp-expert, sahip isteği 2026-09-21): durum noktası, ad bağlantısı, izin / tanıtım satırı */
.ksp-tm-grid > .ksp-expert[hidden] { display: none; }
.ksp-tm-x .ksp-online.is-off { background: #f59e0b; }
.ksp-tm-x .ksp-online.is-closed { background: #a8a29e; }
.ksp-tm-x__name { color: inherit; text-decoration: none; }
.ksp-tm-x__name:hover, .ksp-tm-x__name:focus-visible { color: var(--ksp-primary); }
.ksp-tm-x .ksp-expert__title { display: flex; align-items: center; gap: .25rem; min-width: 0; }
.ksp-tm-x .ksp-expert__title > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-tm-x .ksp-expert__title .material-symbols-rounded { flex-shrink: 0; font-size: 15px; }
.ksp-tm-x .ksp-expert__title.is-leave { color: #b45309; }
.ksp-tm-x .ksp-expert__title.is-next { color: var(--ksp-muted); }
[data-bs-theme="dark"] .ksp-tm-x .ksp-expert__title.is-leave { color: #fcd34d; }
[data-bs-theme="dark"] .ksp-tm-x .ksp-btn-ink { background: #fafaf9; color: #1c1917; }
[data-bs-theme="dark"] .ksp-tm-x .ksp-btn-ink:hover { background: #e7e5e4; color: #1c1917; }
.ksp-tm-none { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; padding: 14px; border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .85rem; }
.ksp-tm-none[hidden] { display: none; }

.ksp-stf-head__acts { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; margin-inline-start: auto; }
.ksp-stf-head__acts .ksp-stf-add { margin-inline-start: 0; }
.ksp-stf-add.ksp-stf-add--mgmt { border: 1px solid #fcd34d; background: #fffbeb; color: #92400e; }
.ksp-stf-add.ksp-stf-add--mgmt:hover { background: #fef3c7; color: #78350f; }
.ksp-stf-add--mgmt .material-symbols-rounded { color: #d97706; font-variation-settings: "FILL" 1; }
.ksp-stf-label--mgmt { display: flex; align-items: center; gap: 5px; color: #b45309; }
.ksp-stf-label--mgmt .material-symbols-rounded { font-size: 16px; font-variation-settings: "FILL" 1; }
.ksp-stf-items--mgmt { margin-bottom: 18px; }
.ksp-stf-card.ksp-stf-card--mgmt { border-color: #fde68a; background: linear-gradient(135deg, #fffbeb 0%, var(--ksp-surface) 70%); }
.ksp-stf-card.ksp-stf-card--mgmt.is-cofounder { border-color: #ddd6fe; background: linear-gradient(135deg, #f5f3ff 0%, var(--ksp-surface) 70%); }
.ksp-stf-card.ksp-stf-card--mgmt.is-manager { border-color: #bfdbfe; background: linear-gradient(135deg, #eff6ff 0%, var(--ksp-surface) 70%); }
.ksp-stf-card.ksp-stf-card--mgmt.is-selected { border-color: #f59e0b; box-shadow: 0 6px 16px -10px rgba(245, 158, 11, .6); }
.ksp-stf-role { display: inline-flex; align-items: center; gap: 3px; height: 20px; padding: 0 7px; border: 1px solid #fcd34d; border-radius: 6px; background: #fef3c7; color: #92400e; font-size: 11px; font-weight: 800; line-height: 1; white-space: nowrap; }
.ksp-stf-role .material-symbols-rounded { font-size: 14px; font-variation-settings: "FILL" 1; }
.ksp-stf-role.is-cofounder { border-color: #c4b5fd; background: #ede9fe; color: #5b21b6; }
.ksp-stf-role.is-manager { border-color: #93c5fd; background: #dbeafe; color: #1e40af; }
.ksp-stf-dhead__line .ksp-stf-role { height: 24px; padding: 0 9px; font-size: 12px; }
.ksp-stf-editbtn.ksp-stf-editbtn--mgmt { border-color: #fcd34d; background: #fffbeb; color: #92400e; }
.ksp-stf-editbtn.ksp-stf-editbtn--mgmt:hover { background: #fef3c7; }
.ksp-stf-editbtn--mgmt .material-symbols-rounded { color: #d97706; font-variation-settings: "FILL" 1; }
.ksp-mgd-note { display: flex; gap: 8px; margin: 16px 20px 0; padding: 12px 14px; border: 1px solid #fde68a; border-radius: 12px; background: #fffbeb; color: #78350f; font-size: 12.5px; line-height: 1.55; }
.ksp-mgd-note .material-symbols-rounded { flex-shrink: 0; font-size: 18px; color: #d97706; }
.ksp-mgd-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 14px 20px 0; }
.ksp-mgd-card { padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); }
.ksp-mgd-card .ksp-stf-title { margin: 0 0 6px; }
.ksp-mgd-card p { margin: 0; font-size: 12.5px; line-height: 1.55; color: var(--ksp-muted); }
.ksp-mgd-links { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.ksp-mgd .ksp-stf-svcs { margin-top: 14px; }
.ksp-mgd-foot { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 16px; padding: 14px 20px 18px; border-top: 1px solid var(--ksp-border); }
.ksp-mgd-back { display: inline-flex; align-items: center; gap: 5px; height: 34px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-muted); font-size: 12.5px; font-weight: 700; }
.ksp-mgd-back:hover { color: var(--ksp-text); border-color: #a8a29e; }
.ksp-mgd-back .material-symbols-rounded { font-size: 17px; }
.ksp-mgm-badge { background: #fef3c7 !important; color: #b45309 !important; }
.ksp-mgm-note { display: flex; gap: 8px; margin: 0 0 14px; padding: 10px 12px; border-radius: 10px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: 12.5px; line-height: 1.5; }
.ksp-mgm-note .material-symbols-rounded { flex-shrink: 0; font-size: 18px; color: #d97706; }
.ksp-mgm-svcs { margin-top: 12px; }
.ksp-mgm-svcs[hidden] { display: none; }
.ksp-mgm-svclist { display: flex; flex-wrap: wrap; gap: 6px; max-height: 180px; overflow-y: auto; }
.ksp-mgm-svc { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); font-size: 12.5px; font-weight: 600; cursor: pointer; }
.ksp-mgm-svc input { accent-color: #d97706; }
.ksp-mgm-svc:has(input:checked) { border-color: #fcd34d; background: #fffbeb; color: #92400e; }
.ksp-mgm-save .material-symbols-rounded { font-size: 18px; color: #fbbf24; font-variation-settings: "FILL" 1; }

@media (max-width: 1199.98px) { .ksp-tm-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991.98px) { .ksp-tm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .ksp-tm-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767.98px) {
    .ksp-mgd-grid { grid-template-columns: minmax(0, 1fr); }
    .ksp-mgd-note, .ksp-mgd-grid { margin-inline: 14px; }
}

[data-bs-theme="dark"] .ksp-stf-role.is-cofounder { border-color: rgba(196, 181, 253, .4); background: rgba(139, 92, 246, .16); color: #c4b5fd; }
[data-bs-theme="dark"] .ksp-stf-role.is-manager { border-color: rgba(147, 197, 253, .4); background: rgba(59, 130, 246, .16); color: #93c5fd; }
[data-bs-theme="dark"] .ksp-tm-filter.is-active { background: #fafaf9; color: #1c1917; border-color: #fafaf9; }
[data-bs-theme="dark"] .ksp-stf-add.ksp-stf-add--mgmt, [data-bs-theme="dark"] .ksp-stf-editbtn.ksp-stf-editbtn--mgmt, [data-bs-theme="dark"] .ksp-mgd-note { border-color: rgba(252, 211, 77, .35); background: rgba(245, 158, 11, .12); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-stf-card.ksp-stf-card--mgmt { border-color: rgba(252, 211, 77, .3); background: linear-gradient(135deg, rgba(245, 158, 11, .10) 0%, var(--ksp-surface) 70%); }
[data-bs-theme="dark"] .ksp-stf-card.ksp-stf-card--mgmt.is-cofounder { border-color: rgba(196, 181, 253, .3); background: linear-gradient(135deg, rgba(139, 92, 246, .10) 0%, var(--ksp-surface) 70%); }
[data-bs-theme="dark"] .ksp-stf-card.ksp-stf-card--mgmt.is-manager { border-color: rgba(147, 197, 253, .3); background: linear-gradient(135deg, rgba(59, 130, 246, .10) 0%, var(--ksp-surface) 70%); }
[data-bs-theme="dark"] .ksp-stf-role { border-color: rgba(252, 211, 77, .4); background: rgba(245, 158, 11, .16); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-mgm-svc:has(input:checked) { border-color: rgba(252, 211, 77, .4); background: rgba(245, 158, 11, .14); color: #fcd34d; }

/* @yonetim-kadro-foto — Yönetim penceresi profil fotoğrafı (staff-manager-modal.php; sahip geri bildirimi 2026-09-21 "resim yükleme alanı yok") */
.ksp-mgm-photo { display: flex; align-items: center; gap: 14px; margin: 0 0 16px; padding: 12px; border: 1px dashed #fcd34d; border-radius: 14px; background: #fffbeb; }
.ksp-mgm-photo__ava { position: relative; display: grid; place-items: center; flex-shrink: 0; width: 76px; height: 76px; margin: 0; overflow: hidden; border-radius: 50%; background: var(--ksp-surface); box-shadow: 0 0 0 3px var(--ksp-surface), 0 0 0 5px #f59e0b; cursor: pointer; }
.ksp-mgm-photo__ava img { width: 100%; height: 100%; object-fit: cover; }
.ksp-mgm-photo__ava img[hidden], .ksp-mgm-photo__ini[hidden] { display: none; }
.ksp-mgm-photo__ini { color: #d97706; }
.ksp-mgm-photo__ini .material-symbols-rounded { font-size: 34px; }
.ksp-mgm-photo__over { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(28, 25, 23, .45); color: #fff; opacity: 0; transition: opacity .15s; }
.ksp-mgm-photo__ava:hover .ksp-mgm-photo__over, .ksp-mgm-photo__ava:focus-within .ksp-mgm-photo__over, #mg_fotograf:focus-visible + .ksp-mgm-photo__ava .ksp-mgm-photo__over { opacity: 1; }
#mg_fotograf:focus-visible + .ksp-mgm-photo__ava { outline: 2px solid #d97706; outline-offset: 4px; }
.ksp-mgm-photo__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ksp-mgm-photo__text strong { font-size: 13px; font-weight: 800; color: var(--ksp-text); }
.ksp-mgm-photo__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 6px; }
.ksp-mgm-photo__del { display: inline-flex; align-items: center; gap: 5px; margin: 0; color: var(--ksp-muted); font-size: 12.5px; font-weight: 700; cursor: pointer; }
.ksp-mgm-photo__del[hidden] { display: none; }
.ksp-mgm-photo__del input { accent-color: #e11d48; }
.ksp-mgm-photo .ksp-stf-ferr:empty { display: none; }
[data-bs-theme="dark"] .ksp-mgm-photo { border-color: rgba(252, 211, 77, .35); background: rgba(245, 158, 11, .08); }

/* @yonetim-kadro-2 — Kurucu / yönetim kartı + yönetici profil sayfası (sahip geri bildirimi 2026-09-21, 2. tur:
   "uzman kartlarının renklerine uyumlu olsun, imzalı hizmetleri küçült"). Uzman kartı dili: beyaz yüzey + ince çerçeve,
   gül vurgu satırı, siyah (ink) randevu düğmesi, taş gri çipler; yalnız tema token'ları (koyu temaya kendiliğinden uyar).
   Kurucu kartı kadrodan ayrışsın diye sağ üstte hafif gül ışıma + rozet; imzalı hizmetler tek satırlık kompakt kutular. */
.ksp-mg { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; margin-bottom: 28px; }
.ksp-mg-card { --mg-a: var(--ksp-primary); --mg-a-50: var(--ksp-primary-50); --mg-a-line: rgba(var(--ksp-primary-rgb), .22);
  position: relative; display: flex; flex-direction: column; gap: 16px; min-width: 0; padding: 18px; border: 1px solid var(--ksp-border); border-radius: 16px;
  background: radial-gradient(38% 120% at 100% 0%, var(--mg-a-50), transparent 72%), var(--ksp-surface); transition: box-shadow .2s; }
.ksp-mg-card:hover { box-shadow: var(--ksp-shadow); }
.ksp-mg-card.is-cofounder { --mg-a: #7c3aed; --mg-a-50: rgba(124, 58, 237, .08); --mg-a-line: rgba(124, 58, 237, .24); }
.ksp-mg-card.is-manager { --mg-a: #2563eb; --mg-a-50: rgba(37, 99, 235, .08); --mg-a-line: rgba(37, 99, 235, .24); }
.ksp-mg-card.is-lead { grid-column: 1 / -1; padding: 22px 24px; }
/* Sahip isteği 2026-09-23: kurucu kartındaki iki düğme kalktı, imzalı hizmetler boşalan sağ alana 2×2 taşındı (is-split).
   Hizmeti olmayan kurucuda kart tek sütun kalır (is-split sınıfı hiç basılmaz). */
.ksp-mg-card.is-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 540px); align-items: center; gap: 18px 24px; }
.ksp-mg-card.is-split .ksp-mg-card__main { grid-template-columns: auto minmax(0, 1fr); }
.ksp-mg-card.is-split .ksp-mg-sig { padding-top: 0; padding-inline-start: 24px; border-top: 0; border-inline-start: 1px solid var(--ksp-border); }
.ksp-mg-card.is-split .ksp-mg-sig__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Dar kutuda süre · fiyat kırpılmasın: metin bloğu daralabilir, ölçü satırı daralmaz */
.ksp-mg-card.is-split .ksp-mg-svc { padding: 8px 8px 8px 10px; }
.ksp-mg-card.is-split .ksp-mg-svc__meta { flex-shrink: 0; }
.ksp-mg-card.is-split .ksp-mg-svc__go { padding: 0 9px; }
.ksp-mg-name a { color: inherit; text-decoration: none; }
.ksp-mg-name a:hover { color: var(--mg-a); text-decoration: underline; }
.ksp-mg-card__main { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 18px; }
.ksp-mg-photo { position: relative; display: grid; place-items: center; flex-shrink: 0; width: 64px; height: 64px; border-radius: 16px; background: var(--mg-a-50); box-shadow: 0 0 0 1px var(--mg-a-line); }
.ksp-mg-card.is-lead .ksp-mg-photo { width: 92px; height: 92px; border-radius: 20px; }
.ksp-mg-photo img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.ksp-mg-ini { font-size: 22px; font-weight: 800; letter-spacing: .02em; color: var(--mg-a); }
.ksp-mg-card.is-lead .ksp-mg-ini { font-size: 30px; }
.ksp-mg-crown { position: absolute; right: -6px; bottom: -6px; display: grid; place-items: center; width: 26px; height: 26px; border: 2px solid var(--ksp-surface); border-radius: 50%; background: linear-gradient(135deg, #fbbf24, #f59e0b); color: #1c1917; }
.ksp-mg-card:not(.is-founder) .ksp-mg-crown { background: var(--mg-a); color: #fff; }
.ksp-mg-crown .material-symbols-rounded { font-size: 15px; font-variation-settings: "FILL" 1; }
.ksp-mg-id { min-width: 0; }
.ksp-mg-namerow { display: flex; flex-direction: column-reverse; align-items: flex-start; gap: 6px; }
.ksp-mg-name { margin: 0; font-size: 1.05rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; color: var(--ksp-text); }
.ksp-mg-card.is-lead .ksp-mg-name { font-size: 1.4rem; letter-spacing: -.025em; }
.ksp-mg-badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px 3px 6px; border: 1px solid var(--mg-a-line, rgba(var(--ksp-primary-rgb), .22)); border-radius: 999px; background: var(--mg-a-50, var(--ksp-primary-50)); color: var(--mg-a, var(--ksp-primary)); font-size: .68rem; font-weight: 800; line-height: 1.35; white-space: nowrap; }
.ksp-mg-badge .material-symbols-rounded { font-size: 14px; color: #f59e0b; font-variation-settings: "FILL" 1; }
.ksp-mg-badge.is-cofounder { border-color: rgba(124, 58, 237, .24); background: rgba(124, 58, 237, .08); color: #7c3aed; }
.ksp-mg-badge.is-cofounder .material-symbols-rounded { color: #7c3aed; }
.ksp-mg-badge.is-manager { border-color: rgba(37, 99, 235, .24); background: rgba(37, 99, 235, .08); color: #2563eb; }
.ksp-mg-badge.is-manager .material-symbols-rounded { color: #2563eb; }
.ksp-mg-title { margin: 4px 0 0; font-size: .78rem; font-weight: 700; color: var(--mg-a); }
.ksp-mg-quote { position: relative; margin: 10px 0 0; padding: 0 0 0 12px; }
.ksp-mg-quote::before { content: ""; position: absolute; left: 0; top: 2px; bottom: 2px; width: 3px; border-radius: 3px; background: var(--mg-a); }
.ksp-mg-quote p { margin: 0; font-size: .88rem; font-weight: 500; line-height: 1.55; color: var(--ksp-text); }
.ksp-mg-quote p::before { content: "\201C"; } .ksp-mg-quote p::after { content: "\201D"; }
.ksp-mg-intro { margin: 8px 0 0; font-size: .84rem; line-height: 1.6; color: var(--ksp-muted); }
.ksp-mg-acts { display: flex; flex-direction: column; align-items: stretch; gap: 8px; min-width: 190px; }
/* Yan kartlar (ortak kurucu / müdür; ızgarada ~320-480 px): düğmeler ad bloğunun ALTINDA yan yana — üç sütunda ad iki satıra
   kırılıyor, rol rozeti düğmenin altında kalıyordu (sahip ekran görüntüsü 2026-09-21, "salon yöneticide hata") */
.ksp-mg-card:not(.is-lead) .ksp-mg-card__main { grid-template-columns: auto minmax(0, 1fr); }
.ksp-mg-card:not(.is-lead) .ksp-mg-acts { grid-column: 1 / -1; flex-direction: row; min-width: 0; }
.ksp-mg-card:not(.is-lead) .ksp-mg-acts .ksp-mg-btn { flex: 1 1 0; min-width: 0; padding: 0 12px; }
.ksp-mg-btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; height: 40px; padding: 0 16px; border-radius: var(--ksp-radius-sm); font-size: .84rem; font-weight: 700; white-space: nowrap; text-decoration: none; transition: background .15s, border-color .15s, color .15s; }
.ksp-mg-btn .material-symbols-rounded { font-size: 18px; }
.ksp-mg-btn--line { border: 1px solid var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); }
.ksp-mg-btn--line:hover { border-color: var(--ksp-text); color: var(--ksp-text); }
.ksp-mg-btn--ink { border: 0; background: var(--ksp-ink); color: #fff; }
.ksp-mg-btn--ink:hover { background: var(--ksp-ink-800); color: #fff; }
.ksp-mg-btn--ink .material-symbols-rounded { color: #fbbf24; font-variation-settings: "FILL" 1; }
[data-bs-theme="dark"] .ksp-mg-btn--ink { background: #fafaf9; color: #1c1917; }
[data-bs-theme="dark"] .ksp-mg-btn--ink:hover { background: #e7e5e4; color: #1c1917; }
[data-bs-theme="dark"] .ksp-mg-btn--ink .material-symbols-rounded { color: #d97706; }

/* İmzalı hizmetler: kompakt satır — ad + süre · fiyat solda, küçük "Randevu Al" sağda */
.ksp-mg-sig { padding-top: 14px; border-top: 1px solid var(--ksp-border); }
.ksp-mg-sig__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 10px; margin-bottom: 8px; }
.ksp-mg-sig__label { display: inline-flex; align-items: center; gap: 6px; font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-mg-sig__label::before { content: ""; width: 14px; height: 2px; border-radius: 2px; background: var(--mg-a, var(--ksp-primary)); }
.ksp-mg-sig__head small { font-size: .7rem; font-weight: 600; color: var(--ksp-muted); }
.ksp-mg-sig__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-mg-svc { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; padding: 8px 8px 8px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); transition: border-color .15s; }
.ksp-mg-svc:hover { border-color: var(--mg-a-line, rgba(var(--ksp-primary-rgb), .3)); }
.ksp-mg-svc__text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.ksp-mg-svc__text strong { overflow: hidden; font-size: .8rem; font-weight: 700; line-height: 1.3; color: var(--ksp-text); text-overflow: ellipsis; white-space: nowrap; }
.ksp-mg-svc__meta { display: inline-flex; align-items: center; gap: 3px; font-size: .68rem; font-weight: 600; color: var(--ksp-muted); white-space: nowrap; }
.ksp-mg-svc__meta .material-symbols-rounded { font-size: 13px; }
.ksp-mg-svc__meta b { margin-left: 6px; font-size: .74rem; font-weight: 800; color: var(--ksp-text); font-variant-numeric: tabular-nums; }
.ksp-mg-svc__go { flex-shrink: 0; display: inline-flex; align-items: center; height: 28px; padding: 0 11px; border-radius: 8px; background: var(--ksp-ink); color: #fff; font-size: .7rem; font-weight: 700; text-decoration: none; white-space: nowrap; transition: background .15s; }
.ksp-mg-svc__go:hover { background: var(--ksp-ink-800); color: #fff; }
[data-bs-theme="dark"] .ksp-mg-svc__go { background: #fafaf9; color: #1c1917; }
[data-bs-theme="dark"] .ksp-mg-svc__go:hover { background: #e7e5e4; color: #1c1917; }
.ksp-mg-btn:focus-visible, .ksp-mg-svc__go:focus-visible { outline: 2px solid var(--ksp-primary); outline-offset: 2px; }

/* Yönetici profil sayfası: aynı açık kart dili, büyük portre */
.ksp-mgp-hero { --mg-a: var(--ksp-primary); --mg-a-50: var(--ksp-primary-50); --mg-a-line: rgba(var(--ksp-primary-rgb), .22);
  display: grid; grid-template-columns: 230px minmax(0, 1fr); align-items: center; gap: 32px; margin: 10px 0 18px; padding: 24px; border: 1px solid var(--ksp-border); border-radius: 20px;
  background: radial-gradient(40% 120% at 100% 0%, var(--mg-a-50), transparent 72%), var(--ksp-surface); }
.ksp-mgp-hero.is-cofounder { --mg-a: #7c3aed; --mg-a-50: rgba(124, 58, 237, .08); --mg-a-line: rgba(124, 58, 237, .24); }
.ksp-mgp-hero.is-manager { --mg-a: #2563eb; --mg-a-50: rgba(37, 99, 235, .08); --mg-a-line: rgba(37, 99, 235, .24); }
.ksp-mgp-photo { position: relative; aspect-ratio: 4 / 5; border-radius: 18px; background: var(--mg-a-50); box-shadow: 0 0 0 1px var(--mg-a-line); }
.ksp-mgp-photo img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.ksp-mgp-ini { display: grid; place-items: center; width: 100%; height: 100%; border-radius: inherit; color: var(--mg-a); font-size: 64px; font-weight: 800; letter-spacing: .02em; }
.ksp-mgp-ribbon { position: absolute; left: 50%; bottom: 12px; display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .7rem; font-weight: 800; white-space: nowrap; transform: translateX(-50%); box-shadow: var(--ksp-shadow); }
.ksp-mgp-ribbon .material-symbols-rounded { font-size: 15px; color: #f59e0b; font-variation-settings: "FILL" 1; }
.ksp-mgp-body { min-width: 0; }
.ksp-mgp-eyebrow { display: flex; align-items: center; gap: 5px; margin: 0 0 8px; font-size: .76rem; font-weight: 700; color: var(--ksp-muted); }
.ksp-mgp-eyebrow .material-symbols-rounded { font-size: 16px; color: var(--mg-a); }
.ksp-mgp-name { margin: 0; font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.1; color: var(--ksp-text); }
.ksp-mgp-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; }
.ksp-mgp-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-text); font-size: .68rem; font-weight: 700; }
.ksp-mgp-chip .material-symbols-rounded { font-size: 14px; color: #f59e0b; }
.ksp-mgp-title { margin: 10px 0 0; font-size: .86rem; font-weight: 700; color: var(--mg-a); }
.ksp-mgp-quote { margin-top: 12px; }
.ksp-mgp-quote p { font-size: .95rem; }
.ksp-mgp-bio { max-width: 680px; margin: 12px 0 0; font-size: .88rem; line-height: 1.7; color: var(--ksp-muted); }
.ksp-mgp-bio p { margin: 0; }
.ksp-mgp-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 18px; }
.ksp-mgp-social { display: flex; gap: 6px; margin: 0 0 0 4px; padding: 0; list-style: none; }
.ksp-mgp-social a { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--ksp-border); border-radius: var(--ksp-radius-sm); background: var(--ksp-surface); color: var(--ksp-text); font-size: 16px; transition: border-color .15s, color .15s; }
.ksp-mgp-social a:hover { border-color: var(--ksp-primary); color: var(--ksp-primary); }
/* Profil sayfasında imzalı hizmetler kartın DIŞINDA: aynı açık yüzey, ayrı blok */
.ksp-mg-sig.ksp-mgp-sig { --mg-a: var(--ksp-primary); margin: 0 0 28px; padding: 16px 18px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-mgp-team { margin-bottom: 40px; }

@media (max-width: 991.98px) {
    .ksp-mgp-hero { grid-template-columns: 200px minmax(0, 1fr); gap: 22px; padding: 20px; }
    .ksp-mg-sig__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    /* Dar ekranda kurucu kartı yine tek sütun: hizmetler kimliğin ALTINA iner */
    .ksp-mg-card.is-split { grid-template-columns: minmax(0, 1fr); }
    .ksp-mg-card.is-split .ksp-mg-sig { padding-top: 14px; padding-inline-start: 0; border-top: 1px solid var(--ksp-border); border-inline-start: 0; }
}
@media (max-width: 767.98px) {
    .ksp-mg-card, .ksp-mg-card.is-lead { padding: 16px; }
    .ksp-mg-card__main { grid-template-columns: auto minmax(0, 1fr); gap: 14px; }
    .ksp-mg-card.is-lead .ksp-mg-photo { width: 72px; height: 72px; border-radius: 18px; }
    .ksp-mg-acts { grid-column: 1 / -1; flex-direction: row; min-width: 0; }
    .ksp-mg-acts .ksp-mg-btn { flex: 1; padding: 0 10px; }
    .ksp-mgp-hero { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 16px; }
    .ksp-mgp-photo { width: min(220px, 70%); margin: 0 auto; }
}
@media (max-width: 575.98px) { .ksp-mg-sig__list { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 420px) { .ksp-mg-acts { flex-direction: column; } }
@media (prefers-reduced-motion: reduce) { .ksp-mg-card, .ksp-mg-btn, .ksp-mg-svc, .ksp-mg-svc__go { transition: none; } }

/* @bordro-sigdir — Bordro sayfası dar ekranda sığsın (sahip geri bildirimi 2026-09-21: "alanlar sığmıyor, biraz genişlet";
   1280 px ekranda tablo kartı ~940 px, 10 sütun taşıyordu, KPI tutarları ortadan bölünüyordu).
   KPI: ikon köşede (tutar kartın tüm genişliğini kullanır), tutar kart genişliğine göre ölçeklenir ve bölünmez (container query).
   Tablo kartı < 1360 px (tam düzenin doğal genişliği ~1336 px): "Çalışma & Prim Modeli" rozeti ad altına, "İşlem Adedi" ciro altına taşınır (iki sütun gizlenir),
   düğmeler 2×2 ızgara, unvan / mutabakat notu satır kırar. Yine sığmazsa (tablet) yatay kaydırma + personel sütunu sabit. */
.ksp-pay-kpi { position: relative; container-type: inline-size; }
.ksp-pay-kpi .ksp-cash-kpi__text { flex: 1 1 auto; }
.ksp-pay-kpi .ksp-cash-kpi__label { min-height: 28px; padding-inline-end: 40px; }
.ksp-pay-kpi .ksp-cash-kpi__ico { position: absolute; top: 14px; inset-inline-end: 14px; width: 34px; height: 34px; border-radius: 10px; }
.ksp-pay-kpi .ksp-cash-kpi__ico .material-symbols-rounded { font-size: 18px; }
.ksp-pay-kpi .ksp-cash-kpi__value { font-size: clamp(16px, 14cqi, 24px); white-space: nowrap; overflow-wrap: normal; }

.ksp-pay-card { container: paytable / inline-size; }
.ksp-pay-badge--inline, .ksp-pay-sub { display: none; }
.ksp-pay-sub { margin-top: 2px; font-size: 11px; font-weight: 600; color: var(--ksp-muted); }
@container paytable (max-width: 1359.98px) {
  .ksp-pay-table .is-model, .ksp-pay-table .is-qty { display: none; }
  .ksp-pay-table td, .ksp-pay-table th, .ksp-pay-table th.is-amount { padding-inline: 7px; }
  .ksp-pay-table th:first-child, .ksp-pay-table td:first-child { padding-inline-start: 16px; }
  .ksp-pay-table td:last-child, .ksp-pay-table th:last-child { padding-inline-end: 14px; }
  .ksp-pay-badge--inline { display: inline-flex; align-self: flex-start; margin-top: 5px; padding: 2px 8px; font-size: 10.5px; }
  .ksp-pay-sub { display: block; }
  .ksp-pay-who__text small { max-width: 150px; white-space: normal; line-height: 1.35; }
  .ksp-pay-table .ksp-pay-settle { max-width: 112px; margin-inline-start: auto; white-space: normal; text-align: end; line-height: 1.25; }
  .ksp-pay-acts { display: inline-grid; grid-template-columns: auto auto; }
  .ksp-pay-acts:has(> :nth-child(3)) { grid-template-rows: auto auto; grid-auto-flow: column; }
  .ksp-pay-acts .ksp-pay-act { width: 100%; justify-content: center; }
}
@container paytable (max-width: 899.98px) {
  .ksp-pay-table th:first-child, .ksp-pay-table td:first-child { position: sticky; inset-inline-start: 0; z-index: 1; background: var(--ksp-surface); box-shadow: 1px 0 0 var(--ksp-border); }
  .ksp-pay-table thead th:first-child { background: var(--ksp-surface-2); }
  .ksp-pay-table tbody tr:hover td:first-child { background: linear-gradient(rgba(250, 250, 249, .7), rgba(250, 250, 249, .7)), var(--ksp-surface); }
  [data-bs-theme="dark"] .ksp-pay-table tbody tr:hover td:first-child { background: linear-gradient(rgba(255, 255, 255, .02), rgba(255, 255, 255, .02)), var(--ksp-surface); }
}

/* Personel Portalı linki (dar sağ kart): link kutusu tam genişlik, "Kopyala" sığmazsa alt satıra tam genişlik iner */
.ksp-sprof-link { flex-direction: row; flex-wrap: wrap; } /* mobil "column" kuralını ezer: sütunda flex-basis yükseklik olurdu */
.ksp-sprof-link .ksp-cash-input { flex: 999 1 240px; }
.ksp-sprof-link .ksp-cash-btn { flex: 1 0 auto; }
/* Personel bölümü (sekmeli sayfalar: bordro, vardiya, yetki, tanıtım — ortak .ksp-pay-tabs) geniş ekranda 1320 → 1560 px
   ("biraz genişlet"; tam bordro tablosu ~1336 px ister). Yalnız içerik: üst bar @panel-solmenu-2 kararıyla kenardan kenara kalır. */
@media (min-width: 992px) {
  .ksp-panel--tabs.ksp-panel--side:has(.ksp-pay-tabs) .ksp-panel__content { max-width: 1560px; }
}

/* @personel-zil — Personel Kokpiti zili (KARARLAR §28.1) + oturum kapandı uyarısı (denetim bulguları 2026-09-21) */
/* Yoklama 401/403/419 alınca durur: zil sessizce susmasın — amber nokta (is-muted ile aynı), menüde "sayfayı yenileyin" notu */
.ksp-bell.is-stopped .ksp-bell__btn { position: relative; }
.ksp-bell.is-stopped .ksp-bell__btn::after { content: ""; position: absolute; inset-inline-end: 4px; inset-block-start: 4px; width: 9px; height: 9px; border-radius: 50%; background: #f59e0b; box-shadow: 0 0 0 2px var(--ksp-surface); }
.ksp-bell__unlock[data-bell-stopped] .material-symbols-rounded { flex-shrink: 0; }
/* Telefon: genel kural menüyü kokpit üst barının altına (70px) sabitliyor; portalda üst bar yok, zil başlık kartının içinde —
   menü zil düğmesini örtmesin (auto-close="outside": düğme kapanınca kapatılamazdı). Menü başlık kartının hemen altında açılır. */
@media (max-width: 575.98px) {
  .ksp-pk-head { position: relative; }
  .ksp-pk-head .ksp-bell { position: static; }
  .ksp-pk-head .ksp-bell__menu.show { position: absolute !important; inset: calc(100% + 8px) 0 auto 0 !important; transform: none !important; width: auto; z-index: 1030; }
}

/* @panel-olcek — Geniş ekranda paneller ORANTILI büyür (sahip isteği 2026-09-21: "tüm admin panelini orantılı büyütelim";
   seçim: yazı + düğme + kart + boşluk birlikte, tüm paneller). Tasarım ~1600 px düzen içindir (272 menü + 1320 içerik);
   daha geniş ekranda body `zoom` = ekran / ~1600 (kademeli) → iki yandaki boşluk kalkar, oranlar korunur. < 1700 px, tablet ve
   telefon DEĞİŞMEZ. Kapsam: Salon Kokpiti, Uzman Paneli, Süper Admin, Müşteri paneli (body.ksp-panel) + Personel Kokpiti.
   zoom vh / dvh birimlerini de çarpar: tam ekran yükseklikleri --ksp-z'ye bölünür (aşağıda). JS konum hesapları ekran px'ini
   CSS px'e çevirir (app.js takvim sürükle-bırak, bildirim yığını). Harita / grafik kütüphanesi panellerde yok. */
body.ksp-panel, body.ksp-share-page:has(.ksp-pk) { --ksp-z: 1; }
/* Kademe = ekran genişliği / ~1600 (272 menü + 1320 içerik): 1920 px ekranda 1,19 → kartlar menüden ekran kenarına kadar */
@media (min-width: 1700px) { body.ksp-panel, body.ksp-share-page:has(.ksp-pk) { --ksp-z: 1.06; zoom: var(--ksp-z); } }
@media (min-width: 1800px) { body.ksp-panel, body.ksp-share-page:has(.ksp-pk) { --ksp-z: 1.12; } }
@media (min-width: 1900px) { body.ksp-panel, body.ksp-share-page:has(.ksp-pk) { --ksp-z: 1.19; } }
@media (min-width: 2100px) { body.ksp-panel, body.ksp-share-page:has(.ksp-pk) { --ksp-z: 1.3; } }
@media (min-width: 2300px) { body.ksp-panel, body.ksp-share-page:has(.ksp-pk) { --ksp-z: 1.42; } }
@media (min-width: 2500px) { body.ksp-panel, body.ksp-share-page:has(.ksp-pk) { --ksp-z: 1.58; } }
@media (min-width: 3000px) { body.ksp-panel, body.ksp-share-page:has(.ksp-pk) { --ksp-z: 1.9; } }
@media (min-width: 3600px) { body.ksp-panel, body.ksp-share-page:has(.ksp-pk) { --ksp-z: 2.35; } }
@media (min-width: 1700px) {
  /* Tam ekran yükseklikleri: 100dvh × zoom ekranı aşmasın (sol menü altı "Çıkış yap" görünür kalsın) */
  body.ksp-panel .ksp-panel__shell { min-height: calc(100dvh / var(--ksp-z)); }
  /* Sol menü BÜYÜMEZ (sahip, 2026-09-21: "bu alanı küçült, gene büyüttün"): ters zoom → gerçek boyut 272 px, tam ekran boy;
     yalnız içerik alanı orantılı büyür. Menünün kendi ölçeği 1 olduğundan yükseklik yine 100dvh. */
  body.ksp-panel .ksp-panel__shell .ksp-sidebar { zoom: calc(1 / var(--ksp-z)); height: 100dvh; }
    body.ksp-panel .ksp-cus-list { max-height: max(360px, calc(100vh / var(--ksp-z) - 212px)); }
  body.ksp-share-page:has(.ksp-pk) { min-height: calc(100vh / var(--ksp-z)); }
  body.ksp-share-page .ksp-pk { min-height: calc(100dvh / var(--ksp-z)); }
  /* Personel Kokpiti yan menüsü de büyümez: ızgara sütunu zoom'a bölünür, menü ters zoom (gerçek 264 px, tam ekran boy) */
  body.ksp-share-page .ksp-pk { grid-template-columns: calc(264px / var(--ksp-z)) minmax(0, 1fr); }
  body.ksp-share-page .ksp-pk.is-rail { grid-template-columns: calc(76px / var(--ksp-z)) minmax(0, 1fr); }
  body.ksp-share-page .ksp-pk .ksp-pk-side { zoom: calc(1 / var(--ksp-z)); height: 100dvh; }
}

/* @bildirim-sms — zil menüsünde "SMS bildirim numaram" bağlantısı (KARARLAR §30): test düğmesinin altında ikincil görünüm */
.ksp-bell__test.ksp-bell__test--line { margin-top: -.4rem; border: 1px solid var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); text-decoration: none; }
.ksp-bell__test.ksp-bell__test--line:hover { border-color: var(--ksp-primary); color: var(--ksp-primary); }

/* @musteri-panel — Müşteri Profilim (sahip tasarımı 2026-09-22; KARARLAR §31): sol menü yok; üst başlık şeridi, 7 sekme,
   profil özet kartı + 4 gösterge, randevu biletleri (kart: başlık / 3 kutu / eylemler), E-Bilet QR penceresi.
   Yalnız tema token'ları (koyu tema kendiliğinden). Tonlar: rose (birincil), amber (puan), green (onay), violet (hafıza), blue (bilgi). */
.ksp-cust { background: var(--ksp-bg); color: var(--ksp-text); padding-bottom: 84px; }
.ksp-cust-wrap { width: min(1320px, 100% - 32px); margin: 0 auto; }
.ksp-cust-top { background: var(--ksp-surface); border-bottom: 1px solid var(--ksp-border); }
.ksp-cust-top__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; }
.ksp-cust-brand { display: flex; align-items: center; gap: 12px; min-width: 0; }
.ksp-cust-brand__ico { display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; background: var(--ksp-ink); color: #fff; }
.ksp-cust-brand__ico .material-symbols-rounded { font-size: 26px; }
.ksp-cust-brand__text h1 { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0; font-size: 1.15rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-cust-brand__text p { margin: 2px 0 0; font-size: .8rem; color: var(--ksp-muted); }
.ksp-cust-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .68rem; font-weight: 700; letter-spacing: 0; white-space: nowrap; vertical-align: middle; }
.ksp-cust-chip .material-symbols-rounded { font-size: 14px; }
.ksp-cust-chip--blue { background: #eff6ff; color: #1d4ed8; }
[data-bs-theme="dark"] .ksp-cust-chip--blue { background: rgba(59, 130, 246, .16); color: #93c5fd; }
.ksp-cust-top__acts { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.ksp-cust-btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; height: 40px; padding: 0 16px; border: 1px solid transparent; border-radius: 999px; font-size: .84rem; font-weight: 700; white-space: nowrap; text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.ksp-cust-btn .material-symbols-rounded { font-size: 18px; }
.ksp-cust-btn--line { border-color: var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); }
.ksp-cust-btn--line:hover { border-color: var(--ksp-text); color: var(--ksp-text); }
.ksp-cust-btn--muted { color: var(--ksp-muted); }
.ksp-cust-btn--rose { background: var(--ksp-primary); color: #fff; box-shadow: 0 10px 22px -12px rgba(var(--ksp-primary-rgb), .9); }
.ksp-cust-btn--rose:hover { background: var(--ksp-primary-600); color: #fff; }
.ksp-cust-btn--rose-line { border-color: rgba(var(--ksp-primary-rgb), .35); background: var(--ksp-primary-50); color: var(--ksp-primary); }
.ksp-cust-btn--rose-line:hover { background: var(--ksp-primary-100); color: var(--ksp-primary-600); }
.ksp-cust-btn--ink { background: var(--ksp-ink); color: #fff; border-radius: 12px; }
.ksp-cust-btn--ink:hover { background: var(--ksp-ink-800); color: #fff; }
[data-bs-theme="dark"] .ksp-cust-btn--ink { background: #fafaf9; color: #1c1917; }
.ksp-cust-btn--wa { border-color: #a7f3d0; background: #ecfdf5; color: #047857; }
.ksp-cust-btn--wa:hover { background: #d1fae5; color: #065f46; }
[data-bs-theme="dark"] .ksp-cust-btn--wa { border-color: rgba(16, 185, 129, .35); background: rgba(16, 185, 129, .12); color: #6ee7b7; }
.ksp-cust-link { display: inline-flex; align-items: center; gap: 4px; color: var(--ksp-primary); font-weight: 700; text-decoration: none; }
.ksp-cust-link .material-symbols-rounded { font-size: 16px; }
/* Rol menüsü (sağ üst) */
.ksp-cust-role__btn { display: flex; align-items: center; gap: 10px; height: 46px; padding: 0 12px 0 8px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; text-align: start; cursor: pointer; }
.ksp-cust-role__ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-cust-role__ico .material-symbols-rounded { font-size: 18px; }
.ksp-cust-role__text { display: flex; flex-direction: column; line-height: 1.15; }
.ksp-cust-role__text small { font-size: .6rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-cust-role__text strong { display: flex; align-items: center; gap: 6px; font-size: .82rem; font-weight: 800; }
.ksp-cust-role__menu { min-width: 260px; padding: 8px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); box-shadow: var(--ksp-shadow-lg); }
.ksp-cust-role__menu .dropdown-item { display: flex; align-items: center; gap: 8px; border-radius: 10px; padding: 8px 10px; font-size: .84rem; font-weight: 600; color: var(--ksp-text); }
.ksp-cust-role__menu .dropdown-item .material-symbols-rounded { font-size: 18px; color: var(--ksp-muted); }
.ksp-cust-role__menu .dropdown-item:hover { background: var(--ksp-surface-2); }
.ksp-cust-role__who { display: flex; flex-direction: column; padding: 8px 10px 10px; border-bottom: 1px solid var(--ksp-border); margin-bottom: 6px; }
.ksp-cust-role__who small { color: var(--ksp-muted); font-size: .76rem; }
/* Sekmeler */
.ksp-cust-tabs { position: sticky; top: 0; z-index: 1020; background: var(--ksp-surface); border-bottom: 1px solid var(--ksp-border); }
.ksp-cust-tabs__inner { display: flex; gap: 6px; padding: 8px 0; overflow-x: auto; scrollbar-width: none; }
.ksp-cust-tabs__inner::-webkit-scrollbar { display: none; }
.ksp-cust-tab { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; height: 36px; padding: 0 14px; border-radius: 999px; color: var(--ksp-text); font-size: .82rem; font-weight: 700; text-decoration: none; white-space: nowrap; transition: background .15s; }
.ksp-cust-tab .material-symbols-rounded { font-size: 18px; color: var(--ksp-primary); }
.ksp-cust-tab--amber .material-symbols-rounded { color: #f59e0b; } .ksp-cust-tab--green .material-symbols-rounded { color: #059669; }
.ksp-cust-tab--violet .material-symbols-rounded { color: #7c3aed; } .ksp-cust-tab--blue .material-symbols-rounded { color: #2563eb; }
.ksp-cust-tab:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-cust-tab.is-active { background: var(--ksp-ink); color: #fff; }
.ksp-cust-tab.is-active .material-symbols-rounded { color: #fff; }
[data-bs-theme="dark"] .ksp-cust-tab.is-active { background: #fafaf9; color: #1c1917; }
[data-bs-theme="dark"] .ksp-cust-tab.is-active .material-symbols-rounded { color: #1c1917; }
.ksp-cust-tab__n { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--ksp-primary); color: #fff; font-size: .66rem; font-weight: 800; }
/* İçerik + özet kartı */
.ksp-cust-main { padding: 22px 0 40px; }
.ksp-cust-sum { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 28px; padding: 20px 24px; margin-bottom: 20px; border: 1px solid var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); }
.ksp-cust-sum__id { display: flex; align-items: center; gap: 18px; min-width: 0; }
.ksp-cust-ava { display: grid; place-items: center; flex-shrink: 0; width: 80px; height: 80px; border-radius: 22px; background: var(--ksp-ink); color: #fff; font-size: 1.6rem; font-weight: 800; letter-spacing: .02em; }
[data-bs-theme="dark"] .ksp-cust-ava { background: #fafaf9; color: #1c1917; }
.ksp-cust-sum__text h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0; font-size: 1.5rem; font-weight: 800; letter-spacing: -.03em; }
.ksp-cust-tier { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border: 1px solid transparent; border-radius: 999px; font-size: .7rem; font-weight: 800; }
.ksp-cust-tier .material-symbols-rounded { font-size: 14px; font-variation-settings: "FILL" 1; }
.ksp-cust-tier.is-amber { border-color: #fde68a; background: #fffbeb; color: #b45309; }
.ksp-cust-tier.is-violet { border-color: #ddd6fe; background: #f5f3ff; color: #6d28d9; }
.ksp-cust-tier.is-slate { border-color: #e7e5e4; background: #f5f5f4; color: #44403c; }
.ksp-cust-tier.is-gray { border-color: var(--ksp-border); background: var(--ksp-surface-2); color: var(--ksp-muted); }
[data-bs-theme="dark"] .ksp-cust-tier.is-amber { border-color: rgba(245, 158, 11, .4); background: rgba(245, 158, 11, .12); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-cust-tier.is-violet { border-color: rgba(139, 92, 246, .4); background: rgba(139, 92, 246, .14); color: #c4b5fd; }
[data-bs-theme="dark"] .ksp-cust-tier.is-slate { border-color: rgba(255, 255, 255, .12); background: rgba(255, 255, 255, .06); color: #d6d3d1; }
.ksp-cust-sum__meta { margin: 4px 0 0; font-size: .86rem; color: var(--ksp-muted); }
.ksp-cust-sum__tags { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 6px 0 0; font-size: .74rem; color: var(--ksp-muted); }
.ksp-cust-sum__tags b { color: #1d4ed8; font-weight: 700; }
[data-bs-theme="dark"] .ksp-cust-sum__tags b { color: #93c5fd; }
.ksp-cust-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.ksp-cust-kpi { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-width: 112px; padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); text-align: center; }
.ksp-cust-kpi__label { font-size: .62rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--ksp-muted); white-space: nowrap; }
.ksp-cust-kpi strong { font-size: 1.15rem; font-weight: 800; letter-spacing: -.02em; white-space: nowrap; }
.ksp-cust-kpi small { font-size: .66rem; color: var(--ksp-muted); }
.ksp-cust-kpi.is-amber strong { color: #d97706; } .ksp-cust-kpi.is-rose strong { color: var(--ksp-primary); }
.ksp-cust-kpi.is-violet strong { color: #7c3aed; } .ksp-cust-kpi.is-ink strong { color: var(--ksp-text); }
/* Süzgeç hapları + boş durum + sayfalama */
.ksp-cust-filter { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 16px; }
.ksp-cust-pills { display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px; background: var(--ksp-surface-2); max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.ksp-cust-pill { display: inline-flex; align-items: center; height: 34px; padding: 0 16px; border-radius: 999px; color: var(--ksp-muted); font-size: .82rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.ksp-cust-pill:hover { color: var(--ksp-text); }
.ksp-cust-pill.is-active { background: var(--ksp-surface); color: var(--ksp-text); box-shadow: var(--ksp-shadow-sm); }
.ksp-cust-filter__n { font-size: .78rem; color: var(--ksp-muted); }
.ksp-cust-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 48px 24px; border: 1px dashed var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); text-align: center; }
.ksp-cust-empty .material-symbols-rounded { font-size: 40px; color: var(--ksp-muted); }
.ksp-cust-empty strong { font-size: 1.05rem; } .ksp-cust-empty p { margin: 0 0 8px; color: var(--ksp-muted); font-size: .88rem; }
.ksp-cust-pager { display: flex; justify-content: center; gap: 6px; margin-top: 16px; }
.ksp-cust-pager__n { display: grid; place-items: center; min-width: 36px; height: 36px; padding: 0 10px; border: 1px solid var(--ksp-border); border-radius: 10px; color: var(--ksp-text); font-size: .84rem; font-weight: 700; text-decoration: none; }
.ksp-cust-pager__n.is-active { background: var(--ksp-ink); border-color: var(--ksp-ink); color: #fff; }
/* Bilet kartı */
.ksp-cust-tickets { display: flex; flex-direction: column; gap: 14px; }
.ksp-tkt { padding: 20px 24px; border: 1px solid var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); }
.ksp-tkt.is-past { opacity: .88; }
.ksp-tkt__head { display: flex; align-items: flex-start; gap: 14px; }
.ksp-tkt__ico { display: grid; place-items: center; flex-shrink: 0; width: 48px; height: 48px; border-radius: 14px; background: var(--ksp-ink); color: #fff; }
[data-bs-theme="dark"] .ksp-tkt__ico { background: #fafaf9; color: #1c1917; }
.ksp-tkt__ico .material-symbols-rounded { font-size: 24px; }
.ksp-tkt__title { flex: 1; min-width: 0; }
.ksp-tkt__title h3 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; font-size: 1.05rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-tkt__title h3 a { color: inherit; text-decoration: none; } .ksp-tkt__title h3 a:hover { color: var(--ksp-primary); }
.ksp-tkt__title p { margin: 4px 0 0; font-size: .82rem; color: var(--ksp-muted); } .ksp-tkt__title p b { color: var(--ksp-text); }
.ksp-tkt__badges { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.ksp-tkt__status { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border: 1px solid transparent; border-radius: 999px; font-size: .68rem; font-weight: 800; letter-spacing: .04em; }
.ksp-tkt__status i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.ksp-tkt__status.is-green { border-color: #a7f3d0; background: #ecfdf5; color: #047857; }
.ksp-tkt__status.is-amber { border-color: #fde68a; background: #fffbeb; color: #b45309; }
.ksp-tkt__status.is-rose { border-color: #fecdd3; background: #fff1f2; color: #be123c; }
.ksp-tkt__status.is-slate { border-color: var(--ksp-border); background: var(--ksp-surface-2); color: var(--ksp-muted); }
[data-bs-theme="dark"] .ksp-tkt__status.is-green { border-color: rgba(16, 185, 129, .35); background: rgba(16, 185, 129, .12); color: #6ee7b7; }
[data-bs-theme="dark"] .ksp-tkt__status.is-amber { border-color: rgba(245, 158, 11, .35); background: rgba(245, 158, 11, .12); color: #fcd34d; }
[data-bs-theme="dark"] .ksp-tkt__status.is-rose { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .12); color: #fda4af; }
.ksp-tkt__when { display: inline-flex; align-items: center; gap: 4px; padding: 5px 12px; border: 1px solid #fecdd3; border-radius: 999px; background: #fff1f2; color: #be123c; font-size: .72rem; font-weight: 800; }
.ksp-tkt__when .material-symbols-rounded { font-size: 14px; }
[data-bs-theme="dark"] .ksp-tkt__when { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .12); color: #fda4af; }
.ksp-tkt__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }
.ksp-tkt__box { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-bg); }
.ksp-tkt__label { display: inline-flex; align-items: center; gap: 4px; font-size: .74rem; color: var(--ksp-muted); }
.ksp-tkt__label .material-symbols-rounded { font-size: 15px; color: var(--ksp-primary); }
.ksp-tkt__box strong { font-size: .95rem; font-weight: 800; letter-spacing: -.01em; overflow-wrap: anywhere; }
.ksp-tkt__box strong.ksp-tkt__money { font-size: 1.25rem; }
.ksp-tkt__box small { font-size: .74rem; color: var(--ksp-muted); } .ksp-tkt__box small.is-green { color: #047857; font-weight: 700; }
/* İptal / değişim kuralı (KARARLAR §59): tutarın altında, ayırt edilsin diye ince üst çizgi + ikon */
.ksp-tkt__policy { display: flex; align-items: flex-start; gap: 5px; margin-top: 7px; padding-top: 7px; border-top: 1px dashed var(--ksp-border); line-height: 1.45; }
.ksp-tkt__policy .material-symbols-rounded { font-size: 15px; flex-shrink: 0; margin-top: 1px; opacity: .8; }

[data-bs-theme="dark"] .ksp-tkt__box small.is-green { color: #6ee7b7; }
.ksp-tkt__acts { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: 16px; }
.ksp-tkt__acts-l, .ksp-tkt__acts-r { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ksp-tkt__acts form { margin: 0; }
.ksp-tkt__note { font-size: .74rem; color: var(--ksp-muted); cursor: help; }
/* E-Bilet penceresi */
.ksp-tkt-modal .modal-dialog { max-width: 440px; }
.ksp-tkt-modal__box { border: 0; border-radius: 24px; background: var(--ksp-surface); color: var(--ksp-text); box-shadow: var(--ksp-shadow-lg); }
.ksp-tkt-modal__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 20px 22px 0; }
.ksp-tkt-modal__head h2 { margin: 6px 0 0; font-size: 1.1rem; font-weight: 800; }
.ksp-tkt-modal__head p { margin: 2px 0 0; font-size: .8rem; color: var(--ksp-muted); }
.ksp-tkt-modal__qr { display: flex; flex-direction: column; align-items: center; gap: 6px; margin: 18px 22px 0; padding: 18px; border: 1px dashed var(--ksp-border); border-radius: 18px; background: var(--ksp-bg); text-align: center; }
.ksp-tkt-modal__qrbox { display: grid; place-items: center; width: 196px; height: 196px; padding: 10px; border-radius: 14px; background: #fff; }
.ksp-tkt-modal__qrbox img, .ksp-tkt-modal__qrbox svg { width: 176px; height: 176px; image-rendering: pixelated; shape-rendering: crispEdges; }
.ksp-tkt-modal__qrbox .ksp-tkt-modal__wait { font-size: .74rem; color: #78716c; }
.ksp-tkt-modal__code { font-size: 1.5rem; font-weight: 800; letter-spacing: .12em; }
.ksp-tkt-modal__qr small { font-size: .74rem; color: var(--ksp-muted); }
.ksp-tkt-modal__rows { display: flex; flex-direction: column; gap: 0; margin: 14px 22px 0; }
.ksp-tkt-modal__rows > div { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--ksp-border); }
.ksp-tkt-modal__rows > div:last-child { border-bottom: 0; }
.ksp-tkt-modal__rows dt { display: inline-flex; align-items: center; gap: 5px; margin: 0; font-size: .76rem; font-weight: 600; color: var(--ksp-muted); white-space: nowrap; }
.ksp-tkt-modal__rows dt .material-symbols-rounded { font-size: 16px; }
.ksp-tkt-modal__rows dd { margin: 0; font-size: .84rem; font-weight: 700; text-align: end; } .ksp-tkt-modal__rows dd small { display: block; font-weight: 500; color: var(--ksp-muted); }
.ksp-tkt-modal__foot { display: flex; justify-content: flex-end; gap: 8px; padding: 16px 22px 22px; }
@media print {
  body.ksp-cust-printing > :not(.ksp-tkt-modal) { display: none !important; }
  body.ksp-cust-printing .ksp-tkt-modal { position: static !important; display: block !important; opacity: 1 !important; }
  body.ksp-cust-printing .ksp-tkt-modal .modal-dialog { max-width: none; margin: 0; }
  body.ksp-cust-printing .ksp-tkt-modal__box { box-shadow: none; border: 1px solid #ccc; }
  body.ksp-cust-printing .ksp-tkt-modal__foot, body.ksp-cust-printing .btn-close { display: none !important; }
}
@media (max-width: 991.98px) {
  .ksp-cust-top__inner { flex-wrap: wrap; }
  .ksp-cust-top__acts { width: 100%; justify-content: flex-start; }
  .ksp-cust-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .ksp-tkt__grid { grid-template-columns: 1fr; }
}
@media (max-width: 575.98px) {
  .ksp-cust-brand__text h1 { font-size: 1rem; }
  .ksp-cust-brand__text p { display: none; }
  .ksp-cust-top__acts .ksp-cust-btn--line { display: none; }
  .ksp-cust-role__text small { display: none; }
  .ksp-cust-sum { padding: 16px; }
  .ksp-cust-ava { width: 60px; height: 60px; font-size: 1.2rem; border-radius: 16px; }
  .ksp-cust-sum__text h2 { font-size: 1.2rem; }
  .ksp-tkt { padding: 16px; }
  .ksp-tkt__badges { width: 100%; justify-content: flex-start; }
  .ksp-tkt__acts-l, .ksp-tkt__acts-r { width: 100%; } .ksp-tkt__acts-l .ksp-cust-btn, .ksp-tkt__acts-r .ksp-cust-btn { flex: 1 1 auto; }
}

/* @musteri-guzellik-kartim — Profilim > Güzellik & Saç Kartım (sahip tasarımı 2026-09-22; KARARLAR §31;
   views/panels/customer/beauty.php). Koyu tanıtım kutusu (rose rozet), 3 beyaz kart: "Kişisel İletişim & Hitap"
   (4 alan, e-posta/telefon kilitli), "Saç & Cilt Özellikleriniz" (3 grup × 3 sütun), "Salon İçi İkram & Atmosfer
   Tercihi" (içecek 4 sütun + sessiz randevu kutusu + alerji / uzmana not), sağ altta koyu kaydet düğmesi.
   Seçim JS'SİZ: gizli radyo (.ksp-cb-radio) hemen ardından etiket; dolgu ve ✓ yalnız :checked + label ile.
   Tonlar: ink (saç & cilt seçimi, koyu temada ters çevrilir), amber #f59e0b (ikram), green #059669 (sessiz ikonu). */
.ksp-cb-hero { padding: 22px 26px; margin-bottom: 18px; border-radius: 20px; background: var(--ksp-ink); color: #fff; }
[data-bs-theme="dark"] .ksp-cb-hero { background: #0c0a09; border: 1px solid var(--ksp-border); }
.ksp-cb-hero__badge { display: inline-flex; align-items: center; gap: 5px; padding: 4px 12px; border: 1px solid rgba(var(--ksp-primary-rgb), .45); border-radius: 999px; background: rgba(var(--ksp-primary-rgb), .16); color: #fda4af; font-size: .64rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.ksp-cb-hero__badge .material-symbols-rounded { font-size: 14px; }
.ksp-cb-hero h2 { margin: 12px 0 0; font-size: 1.35rem; font-weight: 800; letter-spacing: -.03em; }
.ksp-cb-hero p { max-width: 720px; margin: 8px 0 0; font-size: .82rem; line-height: 1.7; color: rgba(255, 255, 255, .72); }
/* Kart */
.ksp-cb-card { padding: 20px 24px 22px; margin-bottom: 18px; border: 1px solid var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); }
.ksp-cb-card__title { display: flex; align-items: center; gap: 8px; padding-bottom: 14px; margin: 0 0 18px; border-bottom: 1px solid var(--ksp-border); font-size: .95rem; font-weight: 800; letter-spacing: -.01em; }
.ksp-cb-card__title .material-symbols-rounded { font-size: 20px; color: var(--ksp-primary); }
/* Alanlar */
.ksp-cb-fields { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 16px; }
.ksp-cb-fields--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 18px; }
.ksp-cb-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ksp-cb-label { display: inline-flex; align-items: center; gap: 5px; font-size: .74rem; font-weight: 600; color: var(--ksp-muted); }
.ksp-cb-label .material-symbols-rounded { font-size: 15px; }
.ksp-cb-label.is-amber .material-symbols-rounded { color: #d97706; }
.ksp-cb-label.is-rose .material-symbols-rounded { color: var(--ksp-primary); }
.ksp-cb-input { width: 100%; height: 44px; padding: 0 14px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: .84rem; font-weight: 600; transition: border-color .15s, box-shadow .15s; }
.ksp-cb-input::placeholder { color: var(--ksp-muted); font-weight: 500; opacity: .75; }
.ksp-cb-input:focus { outline: 0; border-color: var(--ksp-primary); box-shadow: 0 0 0 3px rgba(var(--ksp-primary-rgb), .16); }
.ksp-cb-input.is-locked { background: var(--ksp-surface-2); color: var(--ksp-muted); cursor: not-allowed; }
.ksp-cb-input.is-bad { border-color: var(--ksp-primary); }
.ksp-cb-input[type="date"] { padding-inline-end: 8px; }
.ksp-cb-hint { display: inline-flex; align-items: center; gap: 4px; font-size: .68rem; line-height: 1.4; color: var(--ksp-muted); }
.ksp-cb-hint .material-symbols-rounded { font-size: 13px; }
.ksp-cb-err { display: block; margin-top: 2px; font-size: .7rem; font-weight: 700; color: var(--ksp-primary); }
/* Seçenek grubu: gizli radyo + etiket (JS yok) */
.ksp-cb-group { min-width: 0; padding: 0; margin: 0 0 18px; border: 0; }
.ksp-cb-group:last-of-type { margin-bottom: 0; }
.ksp-cb-legend { float: none; width: auto; padding: 0; margin: 0 0 8px; font-size: .74rem; font-weight: 600; color: var(--ksp-muted); }
.ksp-cb-opts { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.ksp-cb-opts--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ksp-cb-radio { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.ksp-cb-opt { display: flex; align-items: center; gap: 5px; min-height: 44px; padding: 8px 14px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-bg); color: var(--ksp-text); font-size: .8rem; font-weight: 600; line-height: 1.35; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.ksp-cb-opt:hover { border-color: var(--ksp-text); }
.ksp-cb-opt__tick { display: none; }
.ksp-cb-opt__tick .material-symbols-rounded { font-size: 16px; }
.ksp-cb-radio:checked + .ksp-cb-opt .ksp-cb-opt__tick { display: inline-flex; }
.ksp-cb-radio:focus-visible + .ksp-cb-opt { outline: 2px solid var(--ksp-primary); outline-offset: 2px; }
.ksp-cb-opts.is-ink .ksp-cb-radio:checked + .ksp-cb-opt { border-color: var(--ksp-ink); background: var(--ksp-ink); color: #fff; font-weight: 700; }
[data-bs-theme="dark"] .ksp-cb-opts.is-ink .ksp-cb-radio:checked + .ksp-cb-opt { border-color: #fafaf9; background: #fafaf9; color: #1c1917; }
.ksp-cb-opts.is-amber .ksp-cb-radio:checked + .ksp-cb-opt { border-color: #f59e0b; background: #f59e0b; color: #fff; font-weight: 700; }
[data-bs-theme="dark"] .ksp-cb-opts.is-amber .ksp-cb-radio:checked + .ksp-cb-opt { border-color: #f59e0b; background: #f59e0b; color: #1c1917; }
/* Sessiz randevu kutusu: metin solda, anahtar sağda (dar ekranda alt alta) */
.ksp-cb-silent { position: relative; min-width: 0; padding: 16px 200px 16px 18px; margin: 18px 0 0; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-bg); }
.ksp-cb-silent__title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; float: none; width: auto; padding: 0; margin: 0; font-size: .86rem; font-weight: 800; letter-spacing: -.01em; color: var(--ksp-text); }
.ksp-cb-silent__title .material-symbols-rounded { font-size: 18px; color: #059669; }
.ksp-cb-silent__text { max-width: 640px; margin: 6px 0 0; font-size: .74rem; line-height: 1.55; color: var(--ksp-muted); }
.ksp-cb-switch { position: absolute; inset-inline-end: 18px; top: 50%; display: inline-flex; gap: 2px; padding: 4px; border-radius: 999px; background: var(--ksp-surface-2); transform: translateY(-50%); }
.ksp-cb-switch__opt { display: inline-flex; align-items: center; height: 32px; padding: 0 14px; border-radius: 999px; color: var(--ksp-muted); font-size: .78rem; font-weight: 700; white-space: nowrap; cursor: pointer; transition: background .15s, color .15s; }
.ksp-cb-switch__opt:hover { color: var(--ksp-text); }
.ksp-cb-radio:checked + .ksp-cb-switch__opt { background: var(--ksp-surface); color: var(--ksp-text); box-shadow: var(--ksp-shadow-sm); }
.ksp-cb-radio:focus-visible + .ksp-cb-switch__opt { outline: 2px solid var(--ksp-primary); outline-offset: 2px; }
/* Kaydet */
.ksp-cb-foot { display: flex; justify-content: flex-end; margin-top: 20px; }
.ksp-cb-save { height: 46px; padding: 0 22px; font-size: .86rem; }
.ksp-cb-save .material-symbols-rounded { color: var(--ksp-primary); }
@media (max-width: 991.98px) {
  .ksp-cb-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-cb-opts, .ksp-cb-opts--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .ksp-cb-hero { padding: 18px; }
  .ksp-cb-hero h2 { font-size: 1.1rem; }
  .ksp-cb-card { padding: 16px; }
  .ksp-cb-fields, .ksp-cb-fields--2 { grid-template-columns: 1fr; }
  .ksp-cb-opts, .ksp-cb-opts--4 { grid-template-columns: 1fr; }
  .ksp-cb-silent { padding: 16px; }
  .ksp-cb-switch { position: static; margin-top: 12px; transform: none; }
  .ksp-cb-switch__opt { flex: 1 1 auto; justify-content: center; }
  .ksp-cb-foot .ksp-cb-save { width: 100%; }
}

/* @musteri-bakim-hafizasi — Müşteri Profilim > Boya & Bakım Hafızası (views/panels/customer/formulas.php, formula-card.php,
   formula-modal.php; KARARLAR §31). Sahip tasarımı: başlık kartı (✨ Kişisel Formül Defteri + koyu "Yeni Bakım / Formül Notu
   Ekle" hapı), 2 sütunlu kartlar (kategori rozeti + tarih, başlık, "Uygulayan: … • …", gri "UYGULANAN TEKNİK FORMÜL" kutusu
   monospace metinle, "Etki Süresi" + çöp kutusu, sarı zeminli italik "Not: …"), salon kayıtlarında silme yerine
   "salon tarafından kaydedildi". Yalnız .ksp-fm-* öneki; renkler tema token'larından, koyu tema kuralları dahil.
   app.css'in SONUNA (@musteri-panel bloğunun ardına) eklenir; mevcut hiçbir kural değiştirilmez. */

/* Başlık kartı */
.ksp-fm-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; padding: 18px 22px; margin-bottom: 18px; border: 1px solid var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); }
.ksp-fm-head__text { min-width: 0; flex: 1 1 420px; }
.ksp-fm-head__text h2 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1.05rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-fm-head__ico { display: inline-flex; color: var(--ksp-primary); }
.ksp-fm-head__ico .material-symbols-rounded { font-size: 22px; font-variation-settings: "FILL" 1; }
.ksp-fm-head__text p { max-width: 76ch; margin: 6px 0 0; font-size: .8rem; line-height: 1.65; color: var(--ksp-muted); }
.ksp-fm-head__add { flex-shrink: 0; height: 42px; padding: 0 20px; border-radius: 999px; }

/* Doğrulama uyarısı (JS kapalıyken de formu açan şerit) */
.ksp-fm-alert { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 12px 16px; margin-bottom: 16px; border: 1px solid #fecdd3; border-radius: 14px; background: #fff1f2; color: #be123c; font-size: .84rem; font-weight: 700; }
.ksp-fm-alert > span { flex: 1 1 auto; min-width: 0; }
.ksp-fm-alert .material-symbols-rounded { font-size: 20px; }
[data-bs-theme="dark"] .ksp-fm-alert { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .12); color: #fda4af; }

/* Kart ızgarası (tasarım: 2 sütun) */
.ksp-fm-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.ksp-fm-card { display: flex; flex-direction: column; padding: 20px 22px; border: 1px solid var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); }
.ksp-fm-card__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ksp-fm-card__date { flex-shrink: 0; font-size: .78rem; color: var(--ksp-muted); }
.ksp-fm-card__title { margin: 12px 0 0; font-size: 1.02rem; font-weight: 800; letter-spacing: -.02em; overflow-wrap: anywhere; }
.ksp-fm-card__by { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin: 4px 0 0; font-size: .82rem; color: var(--ksp-muted); }
.ksp-fm-card__by b { color: var(--ksp-text); font-weight: 700; }
.ksp-fm-card__by a { color: inherit; text-decoration: none; }
.ksp-fm-card__by a:hover { color: var(--ksp-primary); }

/* Kategori rozeti — ton config customer.formula_categories'ten gelir */
.ksp-fm-badge { display: inline-flex; align-items: center; gap: 5px; padding: 4px 12px; border: 1px solid transparent; border-radius: 999px; font-size: .68rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.ksp-fm-badge .material-symbols-rounded { font-size: 14px; }
.ksp-fm-badge.is-blue { border-color: #dbeafe; background: #eff6ff; color: #1d4ed8; }
.ksp-fm-badge.is-rose { border-color: #fecdd3; background: #fff1f2; color: #be123c; }
.ksp-fm-badge.is-violet { border-color: #ddd6fe; background: #f5f3ff; color: #6d28d9; }
.ksp-fm-badge.is-green { border-color: #a7f3d0; background: #ecfdf5; color: #047857; }
.ksp-fm-badge.is-amber { border-color: #fde68a; background: #fffbeb; color: #b45309; }
.ksp-fm-badge.is-gray, .ksp-fm-badge.is-salon { border-color: var(--ksp-border); background: var(--ksp-surface-2); color: var(--ksp-muted); }
.ksp-fm-badge.is-salon { text-transform: none; letter-spacing: 0; color: var(--ksp-text); }
[data-bs-theme="dark"] .ksp-fm-badge.is-blue { border-color: rgba(59, 130, 246, .35); background: rgba(59, 130, 246, .14); color: #93c5fd; }
[data-bs-theme="dark"] .ksp-fm-badge.is-rose { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .12); color: #fda4af; }
[data-bs-theme="dark"] .ksp-fm-badge.is-violet { border-color: rgba(139, 92, 246, .4); background: rgba(139, 92, 246, .14); color: #c4b5fd; }
[data-bs-theme="dark"] .ksp-fm-badge.is-green { border-color: rgba(16, 185, 129, .35); background: rgba(16, 185, 129, .12); color: #6ee7b7; }
[data-bs-theme="dark"] .ksp-fm-badge.is-amber { border-color: rgba(245, 158, 11, .35); background: rgba(245, 158, 11, .12); color: #fcd34d; }

/* "UYGULANAN TEKNİK FORMÜL:" kutusu */
.ksp-fm-formula { margin-top: 14px; padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-bg); }
.ksp-fm-formula__label { display: block; font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ksp-muted); }
.ksp-fm-formula__code { margin: 8px 0 0; font-family: ui-monospace, SFMono-Regular, "Cascadia Mono", Menlo, Consolas, monospace; font-size: .8rem; font-weight: 700; line-height: 1.7; color: var(--ksp-text); white-space: pre-line; overflow-wrap: anywhere; }

/* Etki süresi + silme / salon rozeti */
.ksp-fm-card__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 14px; }
.ksp-fm-card__foot:empty { display: none; }
.ksp-fm-lasts { display: inline-flex; align-items: center; gap: 5px; font-size: .8rem; color: var(--ksp-muted); }
.ksp-fm-lasts .material-symbols-rounded { font-size: 16px; }
.ksp-fm-lasts b { color: var(--ksp-text); font-weight: 800; }
.ksp-fm-del { margin: 0 0 0 auto; }
.ksp-fm-del__btn { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 9px; background: transparent; color: var(--ksp-muted); cursor: pointer; transition: background .15s, color .15s; }
.ksp-fm-del__btn .material-symbols-rounded { font-size: 18px; }
.ksp-fm-del__btn:hover { background: var(--ksp-primary-50); color: var(--ksp-primary); }
.ksp-fm-salon-note { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; font-size: .72rem; color: var(--ksp-muted); cursor: help; }
.ksp-fm-salon-note .material-symbols-rounded { font-size: 14px; }

/* Sarı zeminli italik not */
.ksp-fm-note { margin: 14px 0 0; padding: 10px 14px; border: 1px solid #fde68a; border-radius: 12px; background: #fffbeb; font-size: .78rem; font-style: italic; line-height: 1.6; color: #57534e; white-space: pre-line; overflow-wrap: anywhere; }
[data-bs-theme="dark"] .ksp-fm-note { border-color: rgba(245, 158, 11, .28); background: rgba(245, 158, 11, .08); color: #d6d3d1; }

/* Ekleme penceresi */
.ksp-fm-modal__box { border: 0; border-radius: 24px; background: var(--ksp-surface); color: var(--ksp-text); box-shadow: var(--ksp-shadow-lg); }
.ksp-fm-modal__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 20px 22px 0; }
.ksp-fm-modal__head h2 { margin: 8px 0 0; font-size: 1.1rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-fm-modal__head p { margin: 2px 0 0; font-size: .8rem; color: var(--ksp-muted); }
.ksp-fm-modal__body { padding: 16px 22px 4px; }
.ksp-fm-modal__full { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 10px 14px; border: 1px solid #fde68a; border-radius: 12px; background: #fffbeb; color: #b45309; font-size: .8rem; font-weight: 700; }
.ksp-fm-modal__full .material-symbols-rounded { font-size: 18px; }
[data-bs-theme="dark"] .ksp-fm-modal__full { border-color: rgba(245, 158, 11, .35); background: rgba(245, 158, 11, .12); color: #fcd34d; }
.ksp-fm-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ksp-fm-field { min-width: 0; }
.ksp-fm-field.is-wide { grid-column: 1 / -1; }
.ksp-fm-field .form-label { margin-bottom: 5px; font-size: .78rem; font-weight: 700; color: var(--ksp-muted); }
.ksp-fm-field .form-label b { color: var(--ksp-primary); }
.ksp-fm-field .form-control, .ksp-fm-field .form-select { border-radius: 12px; border-color: var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); font-size: .86rem; }
.ksp-fm-field .form-control::placeholder { color: var(--ksp-muted); opacity: .75; }
.ksp-fm-field .form-control:focus, .ksp-fm-field .form-select:focus { border-color: var(--ksp-primary); box-shadow: 0 0 0 3px var(--ksp-primary-50); }
.ksp-fm-field .invalid-feedback { font-size: .74rem; font-weight: 600; }
.ksp-fm-mono { font-family: ui-monospace, SFMono-Regular, "Cascadia Mono", Menlo, Consolas, monospace; font-size: .82rem; line-height: 1.6; }
.ksp-fm-count { display: block; margin-top: 4px; text-align: end; font-size: .7rem; color: var(--ksp-muted); }
.ksp-fm-modal__foot { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; padding: 16px 22px 22px; }

@media (max-width: 991.98px) {
  .ksp-fm-grid { grid-template-columns: 1fr; }
  .ksp-fm-fields { grid-template-columns: 1fr; }
}
@media (max-width: 575.98px) {
  .ksp-fm-head { padding: 16px; }
  .ksp-fm-head__add { width: 100%; }
  .ksp-fm-card { padding: 16px; }
  .ksp-fm-card__top { flex-wrap: wrap; }
  .ksp-fm-modal__foot .ksp-cust-btn { flex: 1 1 auto; }
}

/* @musteri-favoriler — Profilim > Favorilerim (sahip tasarımı 2026-09-22; KARARLAR §31; views/panels/customer/favorites.php).
   Başlık kartı (pembe dolu kalp + açıklama + sağda "Tümü / Salonlar / Uzmanlar" segmenti — segment ORTAK .ksp-cust-pills),
   "Favori Salonlarım" 3 sütun kart (kapak 20/9, sol altta koyu ⭐ puan rozeti, sağ üstte beyaz daire içinde pembe kalp,
   ad / slogan / ilçe, ince çizgi, tam genişlik koyu "Salona Git & Randevu Al →") ve "Güvendiğim Uzmanlar & Kuaförler"
   3 sütun küçük kartı (56 px pembe kare avatar + baş harfler, ad, gri unvan, pembe salon adı, açık gri "Randevu" hapı).
   Tasarımda uzman kartında kalp YOK: favoriden çıkarma düğmesi (heart_minus) karta gelinince / odakta belirir, "Randevu"
   düğmesinin tam üstünde durur (çakışmaz); dokunmatik cihazda her zaman görünür. Yalnız tema token'ları + koyu tema kuralları. */
.ksp-fv-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 14px 24px; padding: 20px 24px; margin-bottom: 22px; border: 1px solid var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); }
.ksp-fv-head__text { min-width: 0; }
.ksp-fv-head__title { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1.02rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-fv-head__title .material-symbols-rounded { font-size: 21px; color: var(--ksp-primary); }
.ksp-fv-head__text p { max-width: 620px; margin: 8px 0 0; font-size: .79rem; line-height: 1.7; color: var(--ksp-muted); }
.ksp-fv-head .ksp-cust-pills { flex-shrink: 0; }
/* Bölüm başlığı: "Favori Salonlarım (3)" — sayı gri */
.ksp-fv-sec { margin-bottom: 26px; }
.ksp-fv-sec:last-child { margin-bottom: 0; }
.ksp-fv-sec__title { margin: 0 0 12px; font-size: .88rem; font-weight: 800; letter-spacing: -.01em; color: var(--ksp-text); }
.ksp-fv-sec__title span { margin-inline-start: 5px; font-size: .8rem; font-weight: 600; color: var(--ksp-muted); }
.ksp-fv-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.ksp-fv-grid--sm { gap: 16px; }
/* Salon kartı */
.ksp-fv-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); }
.ksp-fv-card__img { position: relative; aspect-ratio: 20 / 9; background: var(--ksp-surface-2) center / cover no-repeat; }
.ksp-fv-card__link { position: absolute; inset: 0; }
.ksp-fv-rate { position: absolute; inset-inline-start: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 4px; padding: 5px 10px; border-radius: 999px; background: rgba(28, 25, 23, .86); color: #fff; font-size: .72rem; font-weight: 800; }
.ksp-fv-rate .material-symbols-rounded { font-size: 14px; color: #fbbf24; }
.ksp-fv-heart__form { position: absolute; top: 12px; inset-inline-end: 12px; margin: 0; }
.ksp-fv-heart { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: #fff; color: var(--ksp-primary); box-shadow: 0 4px 12px -4px rgba(28, 25, 23, .35); cursor: pointer; transition: transform .15s, color .15s; }
.ksp-fv-heart .material-symbols-rounded { font-size: 19px; }
.ksp-fv-heart:hover { transform: scale(1.07); color: var(--ksp-primary-600); }
.ksp-fv-heart:focus-visible { outline: 2px solid var(--ksp-primary); outline-offset: 2px; }
[data-bs-theme="dark"] .ksp-fv-heart { background: rgba(28, 25, 23, .92); color: #fb7185; }
.ksp-fv-card__body { display: flex; flex-direction: column; flex: 1; padding: 15px 18px 18px; }
.ksp-fv-card__name { font-size: .95rem; font-weight: 800; letter-spacing: -.01em; }
.ksp-fv-card__name a { color: inherit; text-decoration: none; }
.ksp-fv-card__name a:hover { color: var(--ksp-primary); }
.ksp-fv-card__tag { margin: 6px 0 0; font-size: .78rem; line-height: 1.45; color: var(--ksp-muted); overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.ksp-fv-card__place { display: flex; align-items: center; gap: 6px; margin: 9px 0 0; font-size: .78rem; font-weight: 600; color: var(--ksp-muted); }
.ksp-fv-card__place .material-symbols-rounded { font-size: 16px; color: var(--ksp-primary); }
/* Koyu düğme: üstünde ince ayraç (::before) — kartlar eşit yükseklikte kalsın diye margin-top: auto */
.ksp-fv-card__cta { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; height: 42px; margin-top: auto; padding: 0 14px; border-radius: 12px; background: var(--ksp-ink); color: #fff; font-size: .82rem; font-weight: 800; text-decoration: none; transition: background .15s; }
.ksp-fv-card__cta::before { content: ""; position: absolute; inset-inline: 0; top: -13px; height: 1px; background: var(--ksp-border); }
.ksp-fv-card__cta .material-symbols-rounded { font-size: 17px; }
.ksp-fv-card__cta:hover { background: var(--ksp-ink-800); color: #fff; }
[data-bs-theme="dark"] .ksp-fv-card__cta { background: #fafaf9; color: #1c1917; }
[data-bs-theme="dark"] .ksp-fv-card__cta:hover { background: #e7e5e4; color: #1c1917; }
/* Uzman kartı */
.ksp-fv-exp { position: relative; display: flex; align-items: center; gap: 14px; padding: 9px 12px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-fv-exp__ava { display: grid; place-items: center; flex-shrink: 0; width: 56px; height: 56px; border-radius: 16px; background: var(--ksp-primary) center / cover no-repeat; color: #fff; font-size: .95rem; font-weight: 800; letter-spacing: .02em; }
.ksp-fv-exp__ava.is-photo > span { display: none; }
.ksp-fv-exp__text { display: flex; flex-direction: column; flex: 1; min-width: 0; gap: 1px; }
.ksp-fv-exp__text strong { font-size: .86rem; font-weight: 800; letter-spacing: -.01em; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ksp-fv-exp__role { font-size: .76rem; color: var(--ksp-muted); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ksp-fv-exp__salon { font-size: .74rem; font-weight: 600; color: var(--ksp-primary); text-decoration: none; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ksp-fv-exp__salon:hover { color: var(--ksp-primary-600); text-decoration: underline; }
.ksp-fv-exp__cta { display: inline-flex; align-items: center; flex-shrink: 0; height: 30px; padding: 0 15px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-text); font-size: .78rem; font-weight: 800; text-decoration: none; transition: background .15s; }
.ksp-fv-exp__cta:hover { background: var(--ksp-primary-50); color: var(--ksp-primary); }
/* Favoriden çıkar: "Randevu" hapının tam üstü (2 + 20 = 22 px, hap 30 px ve dikey ortalı → çakışma yok) */
.ksp-fv-exp__drop { position: absolute; top: 2px; inset-inline-end: 2px; margin: 0; opacity: 0; transition: opacity .15s; }
.ksp-fv-exp__drop button { display: grid; place-items: center; width: 20px; height: 20px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--ksp-muted); cursor: pointer; }
.ksp-fv-exp__drop button .material-symbols-rounded { font-size: 15px; }
.ksp-fv-exp__drop button:hover { color: var(--ksp-primary); }
.ksp-fv-exp:hover .ksp-fv-exp__drop, .ksp-fv-exp__drop:focus-within { opacity: 1; }
.ksp-fv-exp__drop button:focus-visible { outline: 2px solid var(--ksp-primary); outline-offset: 1px; }
@media (hover: none) { .ksp-fv-exp__drop { opacity: 1; } }
/* Dar ekran: 3 → 2 → 1 sütun; başlık kartı alt alta */
@media (max-width: 1200px) { .ksp-fv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
    .ksp-fv-head { padding: 18px; }
    .ksp-fv-head .ksp-cust-pills { width: 100%; }
    .ksp-fv-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .ksp-fv-card__cta { height: 44px; }
}

/* @musteri-bildirimler — Profilim > Bildirim Ayarları (sahip tasarımı 2026-09-22; KARARLAR §31; views/panels/customer/preferences.php).
   Başlık kartı (rose zil) + 4 satırlık tercih kartı: renkli ikon kutusu, kalın başlık, gri açıklama, sağda anahtar.
   Anahtar JS'siz: gerçek checkbox (opaklık 0, izi kaplar) + CSS izi; açık renk satır tonundan (--np-c), kapalı gri.
   Tonlar (Tailwind v4 ölçüsü, görüntüden ölçüldü): green #009966, blue #155dfc, violet #9810fa, amber #e17100. */
.ksp-np-card { border: 1px solid var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); box-shadow: var(--ksp-shadow-sm); }
.ksp-np-head { padding: 22px 24px; margin-bottom: 20px; }
.ksp-np-head__title { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1.05rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-np-head__title .material-symbols-rounded { font-size: 22px; color: var(--ksp-primary); }
.ksp-np-head__text { max-width: 640px; margin: 8px 0 0; font-size: .8rem; line-height: 1.65; color: var(--ksp-muted); }
.ksp-np-form { margin: 0; }
.ksp-np-list { margin: 0; padding: 4px 24px; list-style: none; }
.ksp-np-item + .ksp-np-item { border-top: 1px solid var(--ksp-border); }
.ksp-np-row { --np-c: #009966; --np-bg: #ecfdf5; display: flex; align-items: center; gap: 16px; margin: 0; padding: 18px 0; cursor: pointer; }
.ksp-np-row.is-blue { --np-c: #155dfc; --np-bg: #eff6ff; }
.ksp-np-row.is-violet { --np-c: #9810fa; --np-bg: #faf5ff; }
.ksp-np-row.is-amber { --np-c: #e17100; --np-bg: #fffbeb; }
.ksp-np-ico { display: grid; place-items: center; flex-shrink: 0; width: 40px; height: 40px; border-radius: 12px; background: var(--np-bg); color: var(--np-c); }
.ksp-np-ico .material-symbols-rounded { font-size: 22px; }
.ksp-np-text { display: flex; flex: 1; flex-direction: column; gap: 3px; min-width: 0; }
.ksp-np-title { font-size: .86rem; font-weight: 800; letter-spacing: -.01em; color: var(--ksp-text); }
.ksp-np-desc { font-size: .76rem; line-height: 1.5; color: var(--ksp-muted); }
.ksp-np-note { display: inline-flex; align-items: flex-start; gap: 5px; margin-top: 2px; font-size: .72rem; font-weight: 600; line-height: 1.45; color: var(--ksp-text); opacity: .78; }
.ksp-np-note .material-symbols-rounded { flex-shrink: 0; font-size: 14px; margin-top: 1px; color: var(--np-c); }
/* Anahtar: 44 × 24 iz, 18 px düğme */
.ksp-np-switch { position: relative; display: inline-flex; flex-shrink: 0; width: 44px; height: 24px; }
.ksp-np-switch__input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.ksp-np-switch__track { position: relative; width: 100%; height: 100%; border-radius: 999px; background: #e7e5e4; transition: background .18s; }
.ksp-np-switch__track::after { content: ""; position: absolute; top: 3px; inset-inline-start: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(28, 25, 23, .25); transition: transform .18s; }
.ksp-np-switch__input:checked + .ksp-np-switch__track { background: var(--np-c); }
.ksp-np-switch__input:checked + .ksp-np-switch__track::after { transform: translateX(20px); }
[dir="rtl"] .ksp-np-switch__input:checked + .ksp-np-switch__track::after { transform: translateX(-20px); }
.ksp-np-switch__input:focus-visible + .ksp-np-switch__track { outline: 2px solid var(--np-c); outline-offset: 2px; }
.ksp-np-row:hover .ksp-np-switch__input:not(:checked) + .ksp-np-switch__track { background: #d6d3d1; }
/* Alt çubuk + hata */
.ksp-np-foot { display: flex; justify-content: flex-end; margin-top: 20px; }
.ksp-np-save { height: 44px; padding: 0 20px; }
.ksp-np-save .material-symbols-rounded { color: #ff637e; }
.ksp-np-alert { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 12px 16px; border: 1px solid #fecdd3; border-radius: 14px; background: #fff1f2; color: #be123c; font-size: .82rem; font-weight: 700; }
.ksp-np-alert .material-symbols-rounded { font-size: 18px; }
/* Koyu tema */
[data-bs-theme="dark"] .ksp-np-row { --np-c: #00bc7d; --np-bg: rgba(0, 188, 125, .14); }
[data-bs-theme="dark"] .ksp-np-row.is-blue { --np-c: #2b7fff; --np-bg: rgba(43, 127, 255, .16); }
[data-bs-theme="dark"] .ksp-np-row.is-violet { --np-c: #ad46ff; --np-bg: rgba(173, 70, 255, .16); }
[data-bs-theme="dark"] .ksp-np-row.is-amber { --np-c: #fe9a00; --np-bg: rgba(254, 154, 0, .14); }
[data-bs-theme="dark"] .ksp-np-switch__track { background: rgba(255, 255, 255, .16); }
[data-bs-theme="dark"] .ksp-np-row:hover .ksp-np-switch__input:not(:checked) + .ksp-np-switch__track { background: rgba(255, 255, 255, .24); }
[data-bs-theme="dark"] .ksp-np-switch__track::after { box-shadow: 0 1px 3px rgba(0, 0, 0, .5); }
[data-bs-theme="dark"] .ksp-np-save .material-symbols-rounded { color: var(--ksp-primary); }
[data-bs-theme="dark"] .ksp-np-alert { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .12); color: #fda4af; }
@media (prefers-reduced-motion: reduce) {
  .ksp-np-switch__track, .ksp-np-switch__track::after { transition: none; }
}
@media (max-width: 575.98px) {
  .ksp-np-head { padding: 18px 16px; }
  .ksp-np-list { padding: 2px 16px; }
  .ksp-np-row { gap: 12px; padding: 16px 0; }
  .ksp-np-ico { width: 36px; height: 36px; border-radius: 10px; }
  .ksp-np-ico .material-symbols-rounded { font-size: 20px; }
  .ksp-np-foot .ksp-np-save { width: 100%; }
}

/* @salon-favori — salon sayfası + uzman kartı kalp düğmesi (Müşteri Profilim > Favorilerim, KARARLAR §31).
   Girişsiz ziyaretçide aynı görünümde bağlantıdır (/giris). Dolu kalp: .is-on + ikonun .fill sınıfı. */
.ksp-sp-btn-fav { display: inline-grid; place-items: center; width: 46px; height: 46px; padding: 0; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); color: var(--ksp-muted); text-decoration: none; cursor: pointer; transition: color .15s ease, border-color .15s ease, background .15s ease; }
.ksp-sp-btn-fav:hover, .ksp-sp-btn-fav:focus-visible { border-color: var(--ksp-primary); color: var(--ksp-primary); }
.ksp-sp-btn-fav.is-on { border-color: color-mix(in srgb, var(--ksp-primary) 35%, transparent); background: color-mix(in srgb, var(--ksp-primary) 8%, var(--ksp-surface)); color: var(--ksp-primary); }
.ksp-sp-info__actions form { margin: 0; }

.ksp-tm-x__fav-form { position: absolute; top: 10px; inset-inline-end: 10px; z-index: 2; margin: 0; }
.ksp-tm-x__fav { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .92); color: #78716c; text-decoration: none; cursor: pointer; box-shadow: 0 2px 8px rgba(28, 25, 23, .16); transition: color .15s ease, transform .15s ease; }
a.ksp-tm-x__fav { position: absolute; top: 10px; inset-inline-end: 10px; z-index: 2; }
.ksp-tm-x__fav:hover, .ksp-tm-x__fav:focus-visible { color: var(--ksp-primary); transform: scale(1.06); }
.ksp-tm-x__fav.is-on { color: var(--ksp-primary); }
.ksp-tm-x__fav .material-symbols-rounded { font-size: 20px; }
[data-bs-theme="dark"] .ksp-tm-x__fav { background: rgba(41, 37, 36, .92); color: #d6d3d1; }
.ksp-tm-x { position: relative; }
@media (prefers-reduced-motion: reduce) { .ksp-tm-x__fav { transition: none; } }

/* @panel-guzellik-ozet — takvim randevu detayında müşterinin Güzellik & Saç Kartı özeti (KARARLAR §31) */
.ksp-cal-beauty { display: flex; gap: 6px; margin: 0 0 10px; padding: 9px 12px; border: 1px solid color-mix(in srgb, var(--ksp-primary) 18%, transparent); border-radius: 12px; background: color-mix(in srgb, var(--ksp-primary) 5%, var(--ksp-surface)); font-size: .78rem; font-weight: 600; line-height: 1.5; color: var(--ksp-text); }
/* Müşterinin uzmana yazdığı özel not — tercih özetinden ayrı okunsun diye mavi ton */
.ksp-cal-beauty--note { border-color: color-mix(in srgb, var(--ksp-info) 20%, transparent); background: color-mix(in srgb, var(--ksp-info) 6%, var(--ksp-surface)); }

/* @musteri-favoriler — yayından kalkmış favori uyarısı (denetim 2026-09-23) */
.ksp-fv-stale { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 16px; padding: 14px 18px; border: 1px solid #fde68a; border-radius: 16px; background: #fffbeb; }
.ksp-fv-stale p { display: flex; align-items: center; gap: 8px; margin: 0; font-size: .82rem; font-weight: 600; color: #92400e; }
.ksp-fv-stale form { margin: 0; }
[data-bs-theme="dark"] .ksp-fv-stale { border-color: rgba(245, 158, 11, .35); background: rgba(245, 158, 11, .12); }
[data-bs-theme="dark"] .ksp-fv-stale p { color: #fcd34d; }

/* @musteri-sadakat — Profilim > Sadakat & Kuponlarım (Faz H, sahip tasarımı 211; views/panels/customer/loyalty.php).
   Koyu puan şeridi (kademe rozeti + büyük puan + sağda ilerleme kutusu), promosyon kodu kartı, 2 sütunlu kupon kartları.
   Kademe tonu şeridin vurgu rengini belirler (--ly-a); tema token'larıyla koyu temaya kendiliğinden uyar. */
.ksp-ly-hero { --ly-a: #f59e0b; --ly-a2: #fbbf24; display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 400px); align-items: center; gap: 18px 28px; margin: 0 0 14px; padding: 26px 28px; border-radius: 20px; background: linear-gradient(120deg, #1c1917 0%, #292524 58%, #1c1917 100%); color: #fafaf9; }
.ksp-ly-hero.is-slate { --ly-a: #94a3b8; --ly-a2: #cbd5e1; }
.ksp-ly-hero.is-violet { --ly-a: #8b5cf6; --ly-a2: #c4b5fd; }
.ksp-ly-hero.is-gray { --ly-a: #a8a29e; --ly-a2: #d6d3d1; }
.ksp-ly-hero__top { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 0 0 12px; }
.ksp-ly-hero__top small { color: rgba(250, 250, 249, .62); font-size: .72rem; font-weight: 700; }
.ksp-ly-crown { display: inline-flex; align-items: center; gap: 6px; padding: 5px 13px; border-radius: 999px; background: linear-gradient(135deg, var(--ly-a2), var(--ly-a)); color: #1c1917; font-size: .68rem; font-weight: 800; letter-spacing: .05em; }
.ksp-ly-crown .material-symbols-rounded { font-size: 15px; }
.ksp-ly-hero__points { margin: 0; font-size: clamp(1.5rem, 3.2vw, 2.1rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.15; }
.ksp-ly-hero__note { margin: 10px 0 0; max-width: 60ch; color: rgba(250, 250, 249, .72); font-size: .8rem; line-height: 1.6; }
.ksp-ly-next { padding: 16px 18px; border: 1px solid rgba(250, 250, 249, .14); border-radius: 16px; background: rgba(250, 250, 249, .06); }
.ksp-ly-next__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 0 0 10px; font-size: .78rem; font-weight: 700; color: rgba(250, 250, 249, .78); }
.ksp-ly-next__head b { color: var(--ly-a2); font-size: .84rem; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ksp-ly-bar { height: 9px; border-radius: 999px; background: rgba(250, 250, 249, .14); overflow: hidden; }
.ksp-ly-bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--ly-a), var(--ly-a2)); }
.ksp-ly-next__note { margin: 10px 0 0; color: rgba(250, 250, 249, .6); font-size: .7rem; line-height: 1.5; }
/* "Nerede geçerli": puan salon bazlı olduğu için toplamın altında döküm (sahip kararı 2026-09-23) */
.ksp-ly-where { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 18px; padding: 0 4px; color: var(--ksp-muted); font-size: .76rem; font-weight: 600; }
.ksp-ly-where .material-symbols-rounded { font-size: 17px; }
.ksp-ly-where a { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-text); text-decoration: none; }
.ksp-ly-where a:hover { border-color: var(--ksp-primary); color: var(--ksp-primary); }
.ksp-ly-where a b { color: var(--ksp-primary); font-variant-numeric: tabular-nums; }
/* Promosyon kodu kartı */
.ksp-ly-add { margin: 0 0 22px; padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-ly-add__title { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: .92rem; font-weight: 800; color: var(--ksp-text); }
.ksp-ly-add__title .material-symbols-rounded { font-size: 19px; color: var(--ksp-primary); }
.ksp-ly-add__form { display: flex; flex-wrap: wrap; gap: 10px; }
.ksp-ly-add__input { flex: 1 1 260px; min-width: 0; height: 46px; padding: 0 16px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-bg); color: var(--ksp-text); font-size: .84rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.ksp-ly-add__input::placeholder { color: var(--ksp-muted); font-weight: 500; letter-spacing: .02em; }
.ksp-ly-add__input:focus { border-color: var(--ksp-primary); outline: 2px solid var(--ksp-primary-50); }
.ksp-ly-add__form .ksp-cust-btn { height: 46px; }
/* Kupon listesi */
.ksp-ly-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; margin: 0 0 12px; padding: 0 4px; }
.ksp-ly-head h3 { margin: 0; font-size: .95rem; font-weight: 800; color: var(--ksp-text); }
.ksp-ly-head small { color: var(--ksp-muted); font-size: .74rem; font-weight: 600; }
.ksp-ly-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ksp-ly-card { --ly-c: #f59e0b; --ly-c-bg: #fffbeb; display: flex; flex-direction: column; gap: 8px; padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: 18px; background: linear-gradient(145deg, var(--ly-c-bg), var(--ksp-surface) 62%); }
.ksp-ly-card.is-violet { --ly-c: #8b5cf6; --ly-c-bg: #f5f3ff; }
.ksp-ly-card.is-green { --ly-c: #0f9d58; --ly-c-bg: #ecfdf5; }
.ksp-ly-card.is-blue { --ly-c: #2563eb; --ly-c-bg: #eff6ff; }
.ksp-ly-card.is-rose { --ly-c: var(--ksp-primary); --ly-c-bg: var(--ksp-primary-50); }
.ksp-ly-card__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; }
.ksp-ly-card__top small { color: var(--ksp-muted); font-size: .72rem; font-weight: 700; }
.ksp-ly-badge { display: inline-flex; align-items: center; padding: 4px 11px; border: 1px solid color-mix(in srgb, var(--ly-c) 30%, transparent); border-radius: 999px; background: color-mix(in srgb, var(--ly-c) 12%, var(--ksp-surface)); color: var(--ly-c); font-size: .63rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.ksp-ly-card__title { margin: 2px 0 0; font-size: 1.35rem; font-weight: 800; letter-spacing: -.02em; color: var(--ksp-text); }
.ksp-ly-card__note { margin: 0; color: var(--ksp-muted); font-size: .76rem; line-height: 1.55; }
.ksp-ly-card__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: 6px; }
.ksp-ly-code { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px 5px 12px; border: 1px dashed color-mix(in srgb, var(--ly-c) 45%, transparent); border-radius: 10px; background: var(--ksp-surface); }
.ksp-ly-code b { font-size: .76rem; font-weight: 800; letter-spacing: .06em; color: var(--ksp-text); }
.ksp-ly-copy { display: inline-flex; align-items: center; padding: 2px; border: 0; border-radius: 6px; background: none; color: var(--ksp-muted); }
.ksp-ly-copy:hover { color: var(--ksp-primary); }
.ksp-ly-copy .material-symbols-rounded { font-size: 16px; }
.ksp-ly-copy.is-done { color: #0f9d58; }
.ksp-ly-use { height: 38px; font-size: .78rem; }
.ksp-ly-use .material-symbols-rounded { font-size: 17px; }
.ksp-ly-limit { margin: 12px 0 0; padding: 0 4px; color: var(--ksp-muted); font-size: .72rem; }
[data-bs-theme="dark"] .ksp-ly-card { --ly-c-bg: rgba(245, 158, 11, .1); }
[data-bs-theme="dark"] .ksp-ly-card.is-violet { --ly-c-bg: rgba(139, 92, 246, .12); }
[data-bs-theme="dark"] .ksp-ly-card.is-green { --ly-c-bg: rgba(15, 157, 88, .12); }
[data-bs-theme="dark"] .ksp-ly-card.is-blue { --ly-c-bg: rgba(37, 99, 235, .12); }
@media (max-width: 991.98px) {
    .ksp-ly-hero { grid-template-columns: minmax(0, 1fr); padding: 22px 20px; }
    .ksp-ly-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575.98px) {
    .ksp-ly-add__form .ksp-cust-btn { flex: 1 1 100%; justify-content: center; }
    .ksp-ly-card__foot { flex-direction: column; align-items: stretch; }
    .ksp-ly-use { justify-content: center; }
}
/* @musteri-sadakat-son */

/* @sadakat-kupon — Kokpit > Sadakat > İndirim Kuponları (Faz H; views/panels/tenant/loyalty/kupon.php).
   Mevcut @sadakat dili (beyaz kart + amber vurgu) korunur; yalnız yeni sınıflar eklenir. */
.ksp-loy-empty { display: flex; align-items: center; gap: 8px; margin: 0; padding: 22px; border: 1px dashed var(--ksp-border); border-radius: 14px; color: var(--ksp-muted); font-size: .85rem; }
.ksp-loy-coupons { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.ksp-loy-coupon { --cp-a: #f59e0b; display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; border: 1px solid var(--ksp-border); border-inline-start: 4px solid var(--cp-a); border-radius: 14px; background: var(--ksp-surface); }
.ksp-loy-coupon.is-violet { --cp-a: #8b5cf6; }
.ksp-loy-coupon.is-green { --cp-a: #0f9d58; }
.ksp-loy-coupon.is-blue { --cp-a: #2563eb; }
.ksp-loy-coupon.is-rose { --cp-a: var(--ksp-primary); }
.ksp-loy-coupon.is-off { opacity: .62; }
.ksp-loy-coupon p { margin: 0; }
.ksp-loy-coupon__top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.ksp-loy-coupon__top code { padding: 3px 9px; border: 1px dashed color-mix(in srgb, var(--cp-a) 45%, transparent); border-radius: 8px; background: color-mix(in srgb, var(--cp-a) 8%, var(--ksp-surface)); color: var(--ksp-text); font-size: .78rem; font-weight: 800; letter-spacing: .05em; }
.ksp-loy-coupon__badge { font-size: .64rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--cp-a); }
.ksp-loy-coupon__state { margin-inline-start: auto; font-size: .68rem; font-weight: 800; }
.ksp-loy-coupon__state.is-green { color: #0f9d58; }
.ksp-loy-coupon__state.is-amber { color: #b45309; }
.ksp-loy-coupon__state.is-muted { color: var(--ksp-muted); }
.ksp-loy-coupon__value { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.ksp-loy-coupon__value strong { font-size: 1.05rem; font-weight: 800; color: var(--ksp-text); }
.ksp-loy-coupon__value small, .ksp-loy-coupon__note { color: var(--ksp-muted); font-size: .74rem; }
.ksp-loy-coupon__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; color: var(--ksp-muted); font-size: .7rem; font-weight: 600; }
.ksp-loy-coupon__meta span { display: inline-flex; align-items: center; gap: 4px; }
.ksp-loy-coupon__meta .material-symbols-rounded { font-size: 14px; }
.ksp-loy-coupon__acts { display: flex; flex-wrap: wrap; gap: 8px; }
.ksp-loy-coupon__acts form { margin: 0; }
.ksp-loy-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 0 16px; }
/* @sadakat-kupon-son */

/* @yonetim-abonelik — Gelir > Abonelikler & Tahsilat (views/panels/admin/subscriptions/index.php; KARARLAR §20.1).
   Satır içi işlem kutusu JS'siz <details> ile açılır; mevcut @yonetim token'ları kullanılır. */
.ksp-adm-rowform { position: relative; }
.ksp-adm-rowform > summary { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border: 1px solid var(--adm-line); border-radius: 9px; background: var(--adm-card); color: var(--adm-ink-2); font-size: .76rem; font-weight: 700; cursor: pointer; list-style: none; }
.ksp-adm-rowform > summary::-webkit-details-marker { display: none; }
.ksp-adm-rowform > summary:hover { border-color: var(--adm-ink-2); color: var(--adm-ink); }
.ksp-adm-rowform > summary .material-symbols-rounded { font-size: 16px; color: var(--adm-muted); }
.ksp-adm-rowform[open] > summary { border-color: var(--adm-ink-2); background: var(--adm-bg); }
.ksp-adm-rowform__body { display: flex; flex-direction: column; gap: 14px; margin-top: 10px; padding: 14px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius-sm, 12px); background: var(--adm-bg); white-space: normal; }
.ksp-adm-rowform__body form { margin: 0; }
.ksp-adm-input--xs { flex: 0 0 74px !important; width: 74px; text-align: center; }
.ksp-adm-rowform .ksp-adm-help { margin-top: 6px; }
@media (max-width: 767.98px) {
    .ksp-adm-rowform__body { padding: 12px; }
    }
/* @yonetim-abonelik-son */

/* @yonetim-sistem — Sistem grubu ekranları (Denetim Kaydı · Sistem Sağlığı · SMS & Bildirimler; KARARLAR §12.1).
   Hepsi salt okuma; mevcut @yonetim token'ları kullanılır, yeni renk tanımlanmaz. */
/* Entegrasyon listesi: durum rozeti + ad + açıklama */
.ksp-adm-intlist { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-adm-intlist > li { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 2px 10px; padding: 10px 12px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius-sm); background: var(--adm-card-2); }
.ksp-adm-intlist .ksp-adm-status { grid-row: span 2; }
.ksp-adm-intlist .ksp-adm-cell__sub { grid-column: 2; }
/* SMS aylık eğilim şeridi (yalnız gerçek veriden; boş ayda blok hiç basılmaz) */
.ksp-adm-sms-trend { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); align-items: end; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-adm-sms-trend > li { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; }
.ksp-adm-sms-trend__bar { display: flex; align-items: flex-end; justify-content: center; width: 100%; height: 78px; border-radius: 8px; background: var(--adm-bg); }
.ksp-adm-sms-trend__bar b { width: 60%; min-height: 4px; border-radius: 6px; background: var(--adm-line-2); }
.ksp-adm-sms-trend > li.is-active .ksp-adm-sms-trend__bar b { background: var(--adm-blue); }
.ksp-adm-sms-trend__n { font-size: .8rem; font-weight: 800; color: var(--adm-ink); font-variant-numeric: tabular-nums; }
.ksp-adm-sms-trend__m { font-size: .66rem; font-weight: 700; color: var(--adm-muted); text-align: center; }
@media (max-width: 767.98px) {
        .ksp-adm-sms-trend { grid-auto-flow: row; grid-auto-columns: auto; }
    .ksp-adm-sms-trend > li { flex-direction: row; justify-content: space-between; }
    .ksp-adm-sms-trend__bar { width: 45%; height: 18px; }
    .ksp-adm-sms-trend__bar b { width: auto; height: 100%; min-width: 4px; }
}
/* @yonetim-sistem-son */

/* @yorumlar — Yorum döngüsü (KARARLAR §28): süper admin moderasyonu, kokpit gelen kutusu, müşteri değerlendirmesi.
   Her panel kendi diline uyar: @yonetim token'ları, kokpit yüzeyleri, müşteri kabuğu. */
/* Süper Admin > Yorum Moderasyonu */
/* Kokpit > Yorumlar */
.ksp-rev { display: flex; flex-direction: column; gap: 16px; }
.ksp-rev-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-rev-head h1 { margin: 0; font-size: 1.15rem; font-weight: 800; color: var(--ksp-text); }
.ksp-rev-head p { margin: 6px 0 0; max-width: 62ch; color: var(--ksp-muted); font-size: .82rem; line-height: 1.55; }
.ksp-rev-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 20px; margin: 0; }
.ksp-rev-stats dt { color: var(--ksp-muted); font-size: .68rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.ksp-rev-stats dd { margin: 2px 0 0; font-size: 1.05rem; font-weight: 800; color: var(--ksp-text); }
.ksp-rev-stats dd.is-amber { color: #b45309; }
.ksp-rev-stats dd.is-rose { color: var(--ksp-primary); }
.ksp-rev-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.ksp-rev-tab { padding: 8px 14px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-muted); font-size: .8rem; font-weight: 700; text-decoration: none; }
.ksp-rev-tab.is-active { border-color: var(--ksp-ink); background: var(--ksp-ink); color: #fff; }
.ksp-rev-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 46px 22px; border: 1px dashed var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); text-align: center; color: var(--ksp-muted); }
.ksp-rev-empty .material-symbols-rounded { font-size: 30px; }
.ksp-rev-empty strong { color: var(--ksp-text); font-size: .95rem; }
.ksp-rev-empty p { margin: 0; font-size: .82rem; }
.ksp-rev-list { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.ksp-rev-card { display: flex; flex-direction: column; gap: 10px; padding: 16px 18px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-rev-card.is-low { border-inline-start: 4px solid var(--ksp-primary); }
.ksp-rev-card p { margin: 0; }
.ksp-rev-card__head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.ksp-rev-card__stars { color: #f59e0b; letter-spacing: .06em; }
.ksp-rev-card__meta { display: inline-flex; align-items: center; gap: 4px; color: var(--ksp-muted); font-size: .74rem; }
.ksp-rev-card__meta .material-symbols-rounded { font-size: 14px; }
.ksp-rev-card__text { font-size: .88rem; line-height: 1.6; color: var(--ksp-text); overflow-wrap: anywhere; }
.ksp-rev-card__text.is-empty { color: var(--ksp-muted); }
.ksp-rev-reply { display: flex; flex-direction: column; gap: 6px; padding-top: 10px; border-top: 1px solid var(--ksp-border); }
.ksp-rev-reply__label { display: flex; align-items: center; gap: 6px; font-size: .76rem; font-weight: 700; color: var(--ksp-muted); }
.ksp-rev-reply__label .material-symbols-rounded { font-size: 16px; }
.ksp-rev-reply__text { width: 100%; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-bg); color: var(--ksp-text); font: inherit; font-size: .84rem; resize: vertical; }
.ksp-rev-reply__text:focus { border-color: var(--ksp-primary); outline: 2px solid var(--ksp-primary-50); }
.ksp-rev-reply__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.ksp-rev-reply__foot small { color: var(--ksp-muted); font-size: .7rem; }
.ksp-rev-btn { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border: 0; border-radius: 10px; background: var(--ksp-ink); color: #fff; font-size: .78rem; font-weight: 700; }
.ksp-rev-btn:hover { background: var(--ksp-ink-800); }
.ksp-rev-btn .material-symbols-rounded { font-size: 17px; }
.ksp-rev-pager { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; color: var(--ksp-muted); font-size: .78rem; }
.ksp-rev-pager a { color: var(--ksp-text); font-weight: 700; }
[data-bs-theme="dark"] .ksp-rev-btn { background: #fafaf9; color: #1c1917; }
/* Yorumu gizle / geri al (Color Lounge Soru 3-a, KARARLAR §82.9b) — yanıt düğmesinden ikincil */
.ksp-rev-mod { display: flex; justify-content: flex-end; margin-top: 8px; }
.ksp-rev-btn--ghost { border: 1px solid var(--ksp-border, #e7e5e4); background: transparent; color: var(--ksp-text); }
.ksp-rev-btn--ghost:hover { background: var(--ksp-surface-2, #f5f5f4); }
[data-bs-theme="dark"] .ksp-rev-btn--ghost { border-color: rgba(255, 255, 255, .16); background: transparent; color: #fafaf9; }/* Müşteri > Yorumlarım */
.ksp-cr-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 18px; padding: 18px 22px; border: 1px solid var(--ksp-border); border-radius: 20px; background: var(--ksp-surface); }
.ksp-cr-head h2 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1.05rem; font-weight: 800; color: var(--ksp-text); }
.ksp-cr-head__ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 10px; background: var(--ksp-primary-50); color: var(--ksp-primary); }
.ksp-cr-head p { margin: 8px 0 0; max-width: 72ch; color: var(--ksp-muted); font-size: .82rem; line-height: 1.6; }
.ksp-cr-title { display: flex; align-items: center; gap: 8px; margin: 22px 0 12px; font-size: .92rem; font-weight: 800; color: var(--ksp-text); }
.ksp-cr-title .material-symbols-rounded { font-size: 19px; color: var(--ksp-primary); }
.ksp-cr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.ksp-cr-new { display: flex; flex-direction: column; gap: 10px; padding: 16px 18px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-cr-new__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px; }
.ksp-cr-new__head strong { font-size: .92rem; font-weight: 800; color: var(--ksp-text); }
.ksp-cr-new__head small, .ksp-cr-new__svc { color: var(--ksp-muted); font-size: .74rem; }
.ksp-cr-new__svc { margin: 0; }
.ksp-cr-new__text { width: 100%; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-bg); color: var(--ksp-text); font: inherit; font-size: .84rem; resize: vertical; }
.ksp-cr-new__text:focus { border-color: var(--ksp-primary); outline: 2px solid var(--ksp-primary-50); }
/* Yıldız seçimi: ters sıralı radyo + kardeş seçici (JS yok) */
.ksp-cr-stars { display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: 2px; margin: 0; padding: 0; border: 0; }
.ksp-cr-stars legend { float: left; width: 100%; margin: 0 0 4px; color: var(--ksp-muted); font-size: .72rem; font-weight: 700; }
.ksp-cr-stars input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.ksp-cr-stars label { color: var(--ksp-border); font-size: 1.6rem; line-height: 1; cursor: pointer; transition: color .12s; }
.ksp-cr-stars input:checked ~ label, .ksp-cr-stars label:hover, .ksp-cr-stars label:hover ~ label { color: #f59e0b; }
.ksp-cr-stars input:focus-visible + label { outline: 2px solid var(--ksp-primary); outline-offset: 2px; }
.ksp-cr-list { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.ksp-cr-item { display: flex; flex-direction: column; gap: 8px; padding: 16px 18px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-cr-item.is-hidden { border-style: dashed; opacity: .7; }
.ksp-cr-item p { margin: 0; }
.ksp-cr-item__head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.ksp-cr-item__stars { color: #f59e0b; letter-spacing: .06em; }
.ksp-cr-item__head a { font-size: .9rem; font-weight: 800; color: var(--ksp-text); text-decoration: none; }
.ksp-cr-item__head a:hover { color: var(--ksp-primary); }
.ksp-cr-item__head small { color: var(--ksp-muted); font-size: .74rem; }
.ksp-cr-item__flag { padding: 2px 9px; border-radius: 999px; background: var(--ksp-primary-50); color: var(--ksp-primary); font-size: .66rem; font-weight: 800; }
.ksp-cr-item__text { font-size: .88rem; line-height: 1.6; color: var(--ksp-text); overflow-wrap: anywhere; }
.ksp-cr-item__reply { display: flex; gap: 8px; padding: 10px 12px; border-radius: 12px; background: var(--ksp-bg); font-size: .82rem; line-height: 1.55; color: var(--ksp-muted); }
.ksp-cr-item__reply .material-symbols-rounded { flex-shrink: 0; font-size: 17px; }
.ksp-cr-del { align-self: flex-start; display: inline-flex; align-items: center; gap: 5px; padding: 0; border: 0; background: none; color: var(--ksp-muted); font-size: .74rem; font-weight: 700; }
.ksp-cr-del:hover { color: var(--ksp-primary); }
.ksp-cr-del .material-symbols-rounded { font-size: 16px; }
@media (max-width: 767.98px) {
    .ksp-rev-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }
/* @yorumlar-son */

/* @yonetim-kategori — Katalog > Kategoriler "Kategori & Hizmet Taksonomisi Yönetimi" (sahip tasarımı 213–221;
   views/panels/admin/categories/*; KARARLAR §29). Amber vurgulu koyu şerit + beyaz kartlar; 4 adımlı pencere
   gizli radyo + kardeş seçiciyle çalışır (JS kapalıyken de gezilir). */
/* Sargı adı `.ksp-cat` DEĞİL: vitrindeki kategori kartı (app.css ~762 / ~984) aynı adı kullanıyor ve
   oradan `position: relative`, `overflow: hidden`, `isolation: isolate`, `color: #fff`, arka plan ve
   `:hover { transform: translateY(-4px) }` sızıyordu. Sonuç: fare gezdikçe TÜM SAYFA oynuyor (titreme),
   transform yüzünden position:fixed pencere sargıya göre konumlanıp kayıyor, overflow onu kırpıyordu.
   (sahip bildirimi 2026-09-24). Katalog sayfası artık kendi adını kullanır. */
.ksp-katalog { display: flex; flex-direction: column; gap: 16px; }
/* Koyu tanıtım şeridi */
.ksp-cat-hero { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; padding: 22px 26px; border-radius: 18px; background: linear-gradient(115deg, #1c1917 0%, #292524 60%, #1c1917 100%); color: #fafaf9; }
.ksp-cat-hero h1 { display: flex; align-items: center; gap: 9px; margin: 0; font-size: 1.05rem; font-weight: 800; }
.ksp-cat-hero h1 .material-symbols-rounded { font-size: 20px; color: #fbbf24; }
.ksp-cat-hero p { margin: 8px 0 0; max-width: 78ch; color: rgba(250, 250, 249, .62); font-size: .78rem; line-height: 1.6; }
.ksp-cat-hero__acts { display: flex; flex-wrap: wrap; gap: 10px; }
.ksp-cat-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 40px; padding: 0 16px; border: 1px solid transparent; border-radius: 10px; font-family: inherit; font-size: .82rem; font-weight: 700; white-space: nowrap; text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.ksp-cat-btn .material-symbols-rounded { font-size: 18px; }
.ksp-cat-btn--amber { background: #fbbf24; color: #1c1917; }
.ksp-cat-btn--amber:hover { background: #f59e0b; color: #1c1917; }
.ksp-cat-btn--line { border-color: rgba(250, 250, 249, .22); background: transparent; color: #fafaf9; }
.ksp-cat-btn--line:hover { border-color: #fbbf24; color: #fbbf24; }
.ksp-cat-btn--dark { background: var(--adm-ink, #1c1917); color: #fff; }
.ksp-cat-btn--dark:hover { background: #000; color: #fff; }
.ksp-cat-btn--soft { border-color: var(--adm-line); background: var(--adm-card); color: var(--adm-ink-2); }
.ksp-cat-btn--soft:hover { border-color: var(--adm-ink-2); color: var(--adm-ink); }
.ksp-cat-btn--sm { height: 34px; padding: 0 12px; font-size: .76rem; }
.ksp-cat-btn[disabled] { opacity: .5; cursor: not-allowed; }
/* Göstergeler */
.ksp-cat-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.ksp-cat-kpi { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 18px; border: 1px solid var(--adm-line); border-radius: 16px; background: var(--adm-card); }
.ksp-cat-kpi p { margin: 0; }
.ksp-cat-kpi__label { color: var(--adm-muted); font-size: .68rem; font-weight: 800; letter-spacing: .05em; }
.ksp-cat-kpi__value { display: flex; align-items: center; gap: 8px; margin-top: 4px !important; font-size: 1.6rem; font-weight: 800; letter-spacing: -.02em; color: var(--adm-ink); }
.ksp-cat-kpi__value.is-green { color: #0f9d58; }
.ksp-cat-kpi__badge { padding: 2px 8px; border-radius: 999px; background: rgba(15, 157, 88, .12); color: #0f9d58; font-size: .6rem; font-weight: 800; }
.ksp-cat-kpi__note { margin-top: 4px !important; color: var(--adm-muted); font-size: .68rem; font-weight: 600; }
.ksp-cat-kpi__note.is-rose { color: var(--adm-rose); }
.ksp-cat-kpi__note.is-violet { color: #8b5cf6; }
.ksp-cat-kpi__note.is-amber { color: #b45309; }
.ksp-cat-kpi__note.is-green { color: #0f9d58; }
.ksp-cat-kpi__ico { display: grid; place-items: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: 11px; }
.ksp-cat-kpi__ico .material-symbols-rounded { font-size: 19px; }
.ksp-cat-kpi__ico.is-rose { background: var(--adm-rose-bg); color: var(--adm-rose); }
.ksp-cat-kpi__ico.is-violet { background: rgba(139, 92, 246, .12); color: #8b5cf6; }
.ksp-cat-kpi__ico.is-amber { background: var(--adm-amber-bg); color: #b45309; }
.ksp-cat-kpi__ico.is-green { background: var(--adm-green-bg); color: #0f9d58; }
/* Sekme şeridi */
.ksp-cat-tabs { display: flex; flex-wrap: wrap; gap: 4px 18px; border-bottom: 1px solid var(--adm-line); }
.ksp-cat-tab { display: inline-flex; align-items: center; gap: 7px; padding: 12px 2px; border-bottom: 2px solid transparent; color: var(--adm-muted); font-size: .82rem; font-weight: 700; text-decoration: none; }
.ksp-cat-tab .material-symbols-rounded { font-size: 18px; }
.ksp-cat-tab:hover { color: var(--adm-ink-2); }
.ksp-cat-tab.is-active { border-bottom-color: var(--adm-ink); color: var(--adm-ink); }
.ksp-cat-tab__new { padding: 1px 7px; border-radius: 999px; background: var(--adm-amber-bg); color: #b45309; font-size: .6rem; font-weight: 800; }
/* Süzgeç satırı */
.ksp-cat-filters { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border: 1px solid var(--adm-line); border-radius: 14px; background: var(--adm-card); }
.ksp-cat-filters form { margin: 0; flex: 1 1 280px; }
.ksp-cat-search { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; border: 1px solid var(--adm-line); border-radius: 10px; background: var(--adm-bg); }
.ksp-cat-search .material-symbols-rounded { font-size: 18px; color: var(--adm-muted); }
.ksp-cat-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--adm-ink); font: inherit; font-size: .82rem; }
.ksp-cat-gender { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ksp-cat-gender > span { color: var(--adm-muted); font-size: .76rem; font-weight: 600; }
.ksp-cat-gender__pill { padding: 6px 13px; border: 1px solid var(--adm-line); border-radius: 8px; background: var(--adm-card); color: var(--adm-ink-2); font-size: .76rem; font-weight: 700; text-decoration: none; }
.ksp-cat-gender__pill.is-active { border-color: var(--adm-ink); background: var(--adm-ink); color: #fff; }
/* Kategori kartları */
.ksp-cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 16px; }
.ksp-cat-card { display: flex; flex-direction: column; border: 1px solid var(--adm-line); border-radius: 16px; background: var(--adm-card); overflow: hidden; }
.ksp-cat-card.is-off { opacity: .66; }
.ksp-cat-card__cover { position: relative; height: 118px; background: linear-gradient(135deg, #292524, #57534e); background-size: cover; background-position: center; }
.ksp-cat-card__icon { position: absolute; top: 10px; left: 10px; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: rgba(250, 250, 249, .92); color: #1c1917; }
.ksp-cat-card__icon .material-symbols-rounded { font-size: 18px; }
.ksp-cat-card__flags { position: absolute; top: 10px; right: 10px; display: flex; gap: 6px; }
.ksp-cat-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 7px; font-size: .62rem; font-weight: 800; }
.ksp-cat-chip .material-symbols-rounded { font-size: 13px; }
.ksp-cat-chip.is-seo { background: #0f9d58; color: #fff; }
.ksp-cat-chip.is-seo.is-mid { background: #b45309; }
.ksp-cat-chip.is-seo.is-low { background: #be123c; }
.ksp-cat-chip.is-pop { background: #fbbf24; color: #1c1917; }
.ksp-cat-card__alt { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: 5px; margin: 0; padding: 6px 10px; background: linear-gradient(transparent, rgba(0, 0, 0, .72)); color: rgba(255, 255, 255, .9); font-size: .64rem; font-weight: 600; }
.ksp-cat-card__alt .material-symbols-rounded { font-size: 13px; color: #fbbf24; }
.ksp-cat-card__alt.is-missing { color: #fca5a5; }
.ksp-cat-card__body { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; }
.ksp-cat-card__body p { margin: 0; }
.ksp-cat-card__title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ksp-cat-card__title h3 { margin: 0; font-size: .92rem; font-weight: 800; color: var(--adm-ink); }
.ksp-cat-card__order { flex-shrink: 0; padding: 2px 8px; border: 1px solid var(--adm-line); border-radius: 7px; color: var(--adm-muted); font-size: .64rem; font-weight: 700; }
.ksp-cat-card__slug { color: var(--adm-muted); font-family: ui-monospace, monospace; font-size: .68rem; }
.ksp-cat-card__desc { color: var(--adm-rose); font-size: .74rem; line-height: 1.5; }
.ksp-cat-card__tags { display: flex; flex-wrap: wrap; gap: 5px; margin: 4px 0 0; padding: 0; list-style: none; }
.ksp-cat-card__tags li { padding: 3px 8px; border: 1px solid var(--adm-line); border-radius: 7px; color: var(--adm-ink-2); font-size: .64rem; font-weight: 700; }
.ksp-cat-card__tags li.is-more { border-style: dashed; color: var(--adm-rose); }
.ksp-cat-card__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 6px !important; padding-top: 10px; border-top: 1px solid var(--adm-line-2); color: var(--adm-muted); font-size: .7rem; font-weight: 600; }
.ksp-cat-card__meta span { display: inline-flex; align-items: center; gap: 4px; }
.ksp-cat-card__meta .material-symbols-rounded { font-size: 14px; }
.ksp-cat-card__meta .is-green, .ksp-cat-card__meta span.is-green { color: #0f9d58; }
.ksp-cat-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding: 12px 16px; border-top: 1px solid var(--adm-line); background: var(--adm-bg); }
.ksp-cat-card__foot form { margin: 0; }
.ksp-cat-card__acts { display: flex; align-items: center; gap: 8px; }
.ksp-cat-del { display: inline-flex; align-items: center; padding: 4px; border: 0; border-radius: 7px; background: none; color: var(--adm-muted); cursor: pointer; }
.ksp-cat-del:hover { color: var(--adm-rose); }
.ksp-cat-del .material-symbols-rounded { font-size: 17px; }
.ksp-cat-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 44px 22px; border: 1px dashed var(--adm-line); border-radius: 16px; background: var(--adm-card); text-align: center; color: var(--adm-muted); }
.ksp-cat-empty .material-symbols-rounded { font-size: 30px; }
.ksp-cat-empty strong { color: var(--adm-ink); font-size: .92rem; }
.ksp-cat-empty p { margin: 0; font-size: .8rem; }
/* Sekme 2 — alt kategoriler */
.ksp-cat-subs { display: grid; grid-template-columns: minmax(230px, 300px) minmax(0, 1fr); gap: 16px; }
.ksp-cat-subs__side { padding: 14px 16px; border: 1px solid var(--adm-line); border-radius: 16px; background: var(--adm-card); }
.ksp-cat-subs__title { display: flex; align-items: center; gap: 7px; margin: 0 0 10px; font-size: .78rem; font-weight: 800; color: var(--adm-ink); }
.ksp-cat-subs__title .material-symbols-rounded { font-size: 17px; color: #b45309; }
.ksp-cat-subs__side ul { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; }
.ksp-cat-subs__item { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 12px; border-radius: 10px; color: var(--adm-ink-2); font-size: .78rem; font-weight: 700; text-decoration: none; }
.ksp-cat-subs__item:hover { background: var(--adm-bg); color: var(--adm-ink); }
.ksp-cat-subs__item b { flex-shrink: 0; padding: 2px 8px; border-radius: 7px; background: var(--adm-bg); color: var(--adm-muted); font-size: .62rem; font-weight: 800; }
.ksp-cat-subs__item.is-active { background: var(--adm-ink); color: #fff; }
.ksp-cat-subs__item.is-active b { background: #fbbf24; color: #1c1917; }
.ksp-cat-subs__main { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; border: 1px solid var(--adm-line); border-radius: 16px; background: var(--adm-card); }
.ksp-cat-subs__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.ksp-cat-subs__head h2 { display: flex; align-items: center; gap: 7px; margin: 0; font-size: .98rem; font-weight: 800; color: var(--adm-ink); }
.ksp-cat-subs__head h2 .material-symbols-rounded { font-size: 18px; color: #b45309; }
.ksp-cat-subs__head p { margin: 5px 0 0; color: var(--adm-muted); font-size: .76rem; }
.ksp-cat-subs__label { margin: 0; color: var(--adm-muted); font-size: .66rem; font-weight: 800; letter-spacing: .05em; }
.ksp-cat-subgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.ksp-cat-sub { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border: 1px solid var(--adm-line); border-radius: 14px; background: var(--adm-card-2); }
.ksp-cat-sub.is-off { opacity: .6; border-style: dashed; }
.ksp-cat-sub p { margin: 0; }
.ksp-cat-sub__top { display: flex; align-items: center; gap: 10px; }
.ksp-cat-sub__thumb { display: grid; place-items: center; flex-shrink: 0; width: 38px; height: 38px; border-radius: 10px; background: var(--adm-bg) center/cover; color: var(--adm-muted); }
.ksp-cat-sub__id { flex: 1; min-width: 0; }
.ksp-cat-sub__id h3 { margin: 0; font-size: .82rem; font-weight: 800; color: var(--adm-ink); }
.ksp-cat-sub__id p { color: var(--adm-muted); font-family: ui-monospace, monospace; font-size: .64rem; }
.ksp-cat-sub__seo { padding: 9px 11px; border: 1px solid var(--adm-line); border-radius: 10px; background: var(--adm-card); }
.ksp-cat-sub__meta-title { color: #1a56db; font-size: .76rem; font-weight: 700; }
.ksp-cat-sub__meta-desc { margin-top: 3px !important; color: var(--adm-muted); font-size: .68rem; line-height: 1.5; }
.ksp-cat-sub__alt { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--adm-muted); font-size: .66rem; }
.ksp-cat-sub__alt span { display: inline-flex; align-items: center; gap: 4px; }
.ksp-cat-sub__alt .material-symbols-rounded { font-size: 13px; color: #0f9d58; }
.ksp-cat-sub__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding-top: 8px; border-top: 1px solid var(--adm-line); }
.ksp-cat-sub__state { color: #0f9d58; font-size: .68rem; font-weight: 700; }
.ksp-cat-sub__state.is-off { color: var(--adm-muted); }
/* Sekme 3 — denetim */
.ksp-cat-kpis--audit .ksp-cat-kpi { display: block; }
.ksp-cat-audit__tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.ksp-cat-audit__tools small { color: var(--adm-muted); font-size: .68rem; }
.ksp-cat-audit { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-cat-audit__row { display: flex; align-items: center; gap: 14px; padding: 12px 16px; border: 1px solid var(--adm-line); border-radius: 14px; background: var(--adm-card); }
.ksp-cat-audit__thumb { display: grid; place-items: center; flex-shrink: 0; width: 42px; height: 42px; border-radius: 10px; background: var(--adm-bg) center/cover; color: var(--adm-muted); }
.ksp-cat-audit__main { flex: 1; min-width: 0; }
.ksp-cat-audit__main p { margin: 0; }
.ksp-cat-audit__name { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: .86rem; font-weight: 800; color: var(--adm-ink); }
.ksp-cat-audit__name code { padding: 1px 7px; border-radius: 6px; background: var(--adm-bg); color: var(--adm-muted); font-size: .64rem; }
.ksp-cat-audit__title { margin-top: 2px !important; color: var(--adm-muted); font-size: .74rem; }
.ksp-cat-audit__chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px !important; }
.ksp-cat-audit__chips span { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 7px; background: var(--adm-bg); color: var(--adm-ink-2); font-size: .64rem; font-weight: 700; }
.ksp-cat-audit__chips .material-symbols-rounded { font-size: 13px; color: #0f9d58; }
.ksp-cat-audit__chips span.is-bad { background: var(--adm-rose-bg); color: var(--adm-rose); }
.ksp-cat-audit__chips span.is-bad .material-symbols-rounded { color: var(--adm-rose); }
.ksp-cat-audit__end { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
.ksp-cat-audit__score { margin: 0; text-align: right; }
.ksp-cat-audit__score small { display: block; color: var(--adm-muted); font-size: .62rem; font-weight: 700; }
.ksp-cat-audit__score b { font-size: .92rem; font-weight: 800; }
.ksp-cat-audit__score b.is-good { color: #0f9d58; }
.ksp-cat-audit__score b.is-mid { color: #b45309; }
.ksp-cat-audit__score b.is-low { color: var(--adm-rose); }
/* Sekme 4 — şablonlar */
/* Sekme 5 — vitrin önizleme */
.ksp-cat-preview { display: flex; flex-direction: column; gap: 14px; padding: 20px 22px; border-radius: 18px; background: linear-gradient(115deg, #1c1917, #292524); color: #fafaf9; }
.ksp-cat-preview__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.ksp-cat-preview__head h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: .95rem; font-weight: 800; }
.ksp-cat-preview__head h2 .material-symbols-rounded { font-size: 19px; color: #fbbf24; }
.ksp-cat-preview__head p { margin: 6px 0 0; color: rgba(250, 250, 249, .6); font-size: .78rem; }
.ksp-cat-preview__live { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; background: rgba(15, 157, 88, .16); color: #6ee7b7; font-size: .68rem; font-weight: 800; }
.ksp-cat-preview__empty { margin: 0; color: rgba(250, 250, 249, .6); font-size: .8rem; }
.ksp-cat-preview__row { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-cat-preview__chip { display: inline-flex; align-items: center; gap: 10px; padding: 10px 14px; border: 1px solid rgba(250, 250, 249, .14); border-radius: 12px; background: rgba(250, 250, 249, .05); color: #fafaf9; text-decoration: none; }
.ksp-cat-preview__chip:hover { border-color: #fbbf24; color: #fafaf9; }
.ksp-cat-preview__ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: #fbbf24; color: #1c1917; }
.ksp-cat-preview__ico .material-symbols-rounded { font-size: 17px; }
.ksp-cat-preview__text { display: flex; flex-direction: column; }
.ksp-cat-preview__text strong { font-size: .78rem; font-weight: 800; }
.ksp-cat-preview__text small { color: rgba(250, 250, 249, .55); font-size: .66rem; }
/* ---------------- Düzenleme penceresi (4 adım) */
/* Panel ölçeği tuzağı (@panel-olcek): geniş ekranda body'ye `zoom` uygulanır ve bu, position:fixed öğenin
   viewport birimlerini de çarpar → pencere ekranı aşar. Görünür alan --ksp-z'ye BÖLÜNÜR (sol menüdeki ters
   zoom ile aynı mantık). --ksp-z tanımsız / 1 olduğunda kural hiçbir şeyi değiştirmez. */
/* "safe center": pencere ekrandan uzunsa ortalama YERİNE başa yaslanır — yoksa başlık yukarı taşar ve
   kaydırarak ulaşılamaz (grid/flex ortalama taşma tuzağı). */
.ksp-cat-modal { position: fixed; top: 0; inset-inline-start: 0; z-index: 1075; display: grid; place-items: safe center;
  width: calc(100vw / var(--ksp-z, 1)); height: calc(100dvh / var(--ksp-z, 1)); padding: 24px 16px; overflow: auto; overscroll-behavior: contain; }
/* Pencere açıkken SAYFA KAYMAZ (sahip bildirimi 2026-09-24: "mouse kaydıkça ekran titriyor"). Arkadaki sayfa
   kaydıkça body'ye uygulanan zoom, position:fixed pencerenin konumunu her karede kesirli yuvarlar → titreme.
   Tek kaydırma alanı pencerenin kendi gövdesidir. `scrollbar-gutter` kaydırma çubuğunun yerini korur; yoksa
   pencere açılınca çubuk kaybolup arkadaki içerik ~15px sağa sıçrar. */
html:has(.ksp-cat-modal) { overflow: hidden; scrollbar-gutter: stable; }
.ksp-cat-modal__back { position: fixed; top: 0; inset-inline-start: 0; width: calc(100vw / var(--ksp-z, 1)); height: calc(100dvh / var(--ksp-z, 1)); background: rgba(28, 25, 23, .55); }
.ksp-cat-modal__box { position: relative; display: flex; flex-direction: column; width: min(920px, 100%); max-height: calc(100dvh / var(--ksp-z, 1) - 48px); border-radius: 18px; background: var(--adm-card); box-shadow: 0 24px 60px rgba(0, 0, 0, .28); overflow: hidden; }
.ksp-cat-modal__head { display: flex; align-items: flex-start; gap: 12px; padding: 20px 22px 14px; border-bottom: 1px solid var(--adm-line); }
.ksp-cat-modal__ico { display: grid; place-items: center; flex-shrink: 0; width: 36px; height: 36px; border-radius: 11px; background: #fbbf24; color: #1c1917; }
.ksp-cat-modal__head h2 { margin: 0; font-size: 1rem; font-weight: 800; color: var(--adm-ink); }
.ksp-cat-modal__head p { margin: 4px 0 0; color: var(--adm-muted); font-size: .74rem; }
.ksp-cat-modal__close { margin-left: auto; color: var(--adm-muted); }
.ksp-cat-modal__close:hover { color: var(--adm-ink); }
/* Daralma zinciri: kutu → form → adım gövdesi. Her halkada min-height:0 olmazsa gövde kısalmaz,
   pencere içeriği kadar uzar ve başlık / alt çubuk ekran dışına taşar. */
.ksp-cat-form { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
.ksp-cat-steps { flex: 1 1 auto; display: flex; flex-wrap: wrap; align-content: flex-start; gap: 8px; min-height: 0; padding: 16px 22px; overflow-y: auto; }
.ksp-cat-steps__radio { position: absolute; width: 1px; height: 1px; opacity: 0; }
.ksp-cat-steps__tab { display: inline-flex; align-items: center; gap: 7px; padding: 9px 13px; border: 1px solid var(--adm-line); border-radius: 11px; color: var(--adm-muted); font-size: .76rem; font-weight: 700; cursor: pointer; }
.ksp-cat-steps__tab .material-symbols-rounded { font-size: 16px; }
.ksp-cat-steps__flag { padding: 1px 7px; border-radius: 999px; background: var(--adm-bg); color: var(--adm-muted); font-size: .6rem; font-weight: 800; }
.ksp-cat-steps__flag.is-good { background: var(--adm-green-bg); color: #0f9d58; }
.ksp-cat-steps__radio:checked + .ksp-cat-steps__tab { border-color: var(--adm-ink); color: var(--adm-ink); box-shadow: inset 0 0 0 1px var(--adm-ink); }
.ksp-cat-step { display: none; flex-direction: column; gap: 14px; width: 100%; margin-top: 6px; }
.ksp-cat-steps__radio:nth-of-type(1):checked ~ .ksp-cat-step[data-step="0"],
.ksp-cat-steps__radio:nth-of-type(2):checked ~ .ksp-cat-step[data-step="1"],
.ksp-cat-steps__radio:nth-of-type(3):checked ~ .ksp-cat-step[data-step="2"],
.ksp-cat-steps__radio:nth-of-type(4):checked ~ .ksp-cat-step[data-step="3"] { display: flex; }
.ksp-cat-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ksp-cat-row--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ksp-cat-row--end { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; }
.ksp-cat-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ksp-cat-field--xs { flex: 0 0 130px; }
.ksp-cat-field > label { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; color: var(--adm-ink-2); font-size: .76rem; font-weight: 700; }
.ksp-cat-input { width: 100%; min-height: 40px; padding: 9px 12px; border: 1px solid var(--adm-line); border-radius: 10px; background: var(--adm-bg); color: var(--adm-ink); font: inherit; font-size: .82rem; }
.ksp-cat-input:focus { border-color: var(--adm-ink-2); outline: 2px solid var(--adm-line-2); }
.ksp-cat-input.is-mono { font-family: ui-monospace, monospace; font-size: .76rem; }
.ksp-cat-field.is-bad .ksp-cat-input { border-color: var(--adm-rose); }
.ksp-cat-err:empty { display: none; }
.ksp-cat-err { margin: 0; color: var(--adm-rose); font-size: .7rem; font-weight: 600; }
.ksp-cat-hint { margin: 0; color: var(--adm-muted); font-size: .68rem; line-height: 1.5; }
.ksp-cat-count { color: var(--adm-muted); font-size: .66rem; font-weight: 700; }
.ksp-cat-count.is-over { color: var(--adm-rose); }
.ksp-cat-count.is-good { color: #0f9d58; }
.ksp-cat-check { display: inline-flex; align-items: center; gap: 8px; color: var(--adm-ink-2); font-size: .78rem; font-weight: 600; cursor: pointer; }
.ksp-cat-check input { width: 16px; height: 16px; accent-color: #1a56db; }
/* İkon seçici */
.ksp-cat-icons { display: grid; grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)); gap: 8px; }
.ksp-cat-icon input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.ksp-cat-icon > span { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 6px; border: 1px solid var(--adm-line); border-radius: 11px; color: var(--adm-muted); cursor: pointer; }
.ksp-cat-icon > span .material-symbols-rounded { font-size: 20px; }
.ksp-cat-icon > span small { font-size: .64rem; font-weight: 700; }
.ksp-cat-icon input:checked + span { border-color: #f59e0b; background: #fbbf24; color: #1c1917; }
.ksp-cat-icon input:focus-visible + span { outline: 2px solid var(--adm-ink); outline-offset: 2px; }
/* Alt dallar */
.ksp-cat-branches { padding: 13px 15px; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-bg); }
.ksp-cat-branches__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0 0 9px; }
.ksp-cat-branches__head span { display: inline-flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 800; color: var(--adm-ink); }
.ksp-cat-branches__head .material-symbols-rounded { font-size: 16px; color: #b45309; }
.ksp-cat-branches__head small { color: var(--adm-muted); font-size: .64rem; }
.ksp-cat-branches__add { display: flex; gap: 8px; }
.ksp-cat-branches__list { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; padding: 0; list-style: none; }
.ksp-cat-branches__list li { display: inline-flex; align-items: center; gap: 4px; padding: 5px 6px 5px 11px; border: 1px solid var(--adm-line); border-radius: 8px; background: var(--adm-card); font-size: .72rem; font-weight: 700; color: var(--adm-ink-2); }
.ksp-cat-branches__list button { display: inline-flex; padding: 0; border: 0; background: none; color: var(--adm-muted); cursor: pointer; }
.ksp-cat-branches__list button:hover { color: var(--adm-rose); }
.ksp-cat-branches__list .material-symbols-rounded { font-size: 15px; }
/* Görsel kutuları */
.ksp-cat-box { display: flex; flex-direction: column; gap: 9px; padding: 14px 16px; border: 1px solid var(--adm-line); border-radius: 12px; }
.ksp-cat-box__head { display: flex; align-items: center; gap: 7px; margin: 0; font-size: .8rem; font-weight: 800; color: var(--adm-ink); }
.ksp-cat-box__head .material-symbols-rounded { font-size: 17px; color: var(--adm-rose); }
.ksp-cat-box__note { margin: 0; color: var(--adm-muted); font-size: .7rem; line-height: 1.5; }
/* Kategori görsel yükleme (sahip, 2026-09-26: "manuel yükleme olsun, URL değil") + hata özeti. Pencere z-index 1075: bildirim
   (toast, 1080) artık pencerenin ÖNÜNDE — eskiden aynı katmandaydı, "kaydedildi / hata" mesajı pencerenin arkasında kalıyordu. */
.ksp-cat-upload__row { display: flex; align-items: flex-start; gap: 14px; }
.ksp-cat-upload__preview { position: relative; display: grid; flex-shrink: 0; place-items: center; overflow: hidden; border: 1px dashed var(--adm-line); border-radius: 10px; background: var(--adm-card-2); }
.ksp-cat-upload__preview.is-cover { width: 240px; aspect-ratio: 1200 / 630; }
.ksp-cat-upload__preview.is-square { width: 96px; aspect-ratio: 1 / 1; }
.ksp-cat-upload__preview img { width: 100%; height: 100%; object-fit: cover; }
.ksp-cat-upload__preview img[hidden], .ksp-cat-upload__empty[hidden] { display: none; }
.ksp-cat-upload__empty { display: grid; justify-items: center; gap: 2px; color: var(--adm-muted); font-size: .7rem; font-weight: 700; }
.ksp-cat-upload__body { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.ksp-cat-upload__pick { cursor: pointer; }
.ksp-cat-upload__file { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ksp-cat-upload__body:focus-within .ksp-cat-upload__pick { outline: 2px solid var(--adm-active); outline-offset: 2px; }
.ksp-cat-upload__name { color: var(--adm-ink-2); font-size: .74rem; font-weight: 700; overflow-wrap: anywhere; }
.ksp-cat-upload__name:empty { display: none; }
.ksp-cat-upload .ksp-cat-hint { margin: 0; }
.ksp-cat-upload.is-bad .ksp-cat-upload__preview { border-color: var(--adm-rose); }
.ksp-cat-default-submit { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); border: 0; padding: 0; }
.ksp-cat-alert { display: flex; gap: 10px; margin: 14px 22px 0; padding: 10px 12px; border: 1px solid var(--adm-rose-line); border-radius: 10px; background: var(--adm-rose-bg); color: var(--adm-rose-ink); font-size: .78rem; }
.ksp-cat-alert ul { margin: 4px 0 0; padding-inline-start: 18px; }
@media (max-width: 575.98px) { .ksp-cat-upload__row { flex-direction: column; } .ksp-cat-upload__preview.is-cover { width: 100%; } }
@media (max-width: 767.98px) { .ksp-cat-alert { margin-inline: 14px; } }
/* SEO sihirbazı + karne */
.ksp-cat-wizard { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; border: 1px solid #fde68a; border-radius: 12px; background: var(--adm-amber-bg); }
.ksp-cat-wizard p { display: flex; align-items: center; gap: 7px; margin: 0; font-size: .8rem; color: #78350f; }
.ksp-cat-wizard .material-symbols-rounded { font-size: 17px; color: #b45309; }
.ksp-cat-wizard small { display: block; margin-top: 4px; max-width: 64ch; color: #92400e; font-size: .68rem; line-height: 1.5; }
.ksp-cat-words { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; padding: 0; list-style: none; }
.ksp-cat-words li { padding: 4px 10px; border: 1px solid rgba(139, 92, 246, .28); border-radius: 8px; background: rgba(139, 92, 246, .1); color: #7c3aed; font-size: .7rem; font-weight: 700; }
.ksp-cat-health { padding: 13px 15px; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-bg); }
.ksp-cat-health__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 0 0 8px; font-size: .8rem; color: var(--adm-ink); }
.ksp-cat-health__head b { color: #0f9d58; font-weight: 800; }
.ksp-cat-health__bar { display: block; height: 7px; border-radius: 999px; background: var(--adm-line-2); overflow: hidden; }
.ksp-cat-health__bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #34d399, #0f9d58); }
.ksp-cat-health ul { display: flex; flex-direction: column; gap: 5px; margin: 10px 0 0; padding: 0; list-style: none; }
.ksp-cat-health li { font-size: .72rem; line-height: 1.5; color: var(--adm-ink-2); }
.ksp-cat-health li.is-ok { color: #0f9d58; }
.ksp-cat-health li.is-no { color: var(--adm-rose); }
.ksp-cat-health small { display: block; margin-top: 8px; color: var(--adm-muted); font-size: .66rem; }
/* Google önizleme */
.ksp-cat-serp { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; border: 1px solid var(--adm-line); border-radius: 12px; }
.ksp-cat-serp__head { display: flex; align-items: center; gap: 7px; margin: 0; font-size: .8rem; font-weight: 800; color: var(--adm-ink); }
.ksp-cat-serp__head .material-symbols-rounded { font-size: 17px; color: #1a56db; }
.ksp-cat-serp__card { padding: 14px 16px; border: 1px solid var(--adm-line); border-radius: 10px; background: var(--adm-card); }
.ksp-cat-serp__card p { margin: 0; }
.ksp-cat-serp__site { display: flex; align-items: center; gap: 7px; font-size: .74rem; font-weight: 700; color: var(--adm-ink-2); }
.ksp-cat-serp__site span { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--adm-rose); color: #fff; font-size: .56rem; font-weight: 800; }
.ksp-cat-serp__url { margin-top: 2px !important; color: var(--adm-muted); font-size: .7rem; }
.ksp-cat-serp__title { margin-top: 7px !important; color: #1a0dab; font-size: 1.02rem; font-weight: 600; line-height: 1.3; }
.ksp-cat-serp__rich { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin-top: 5px !important; font-size: .74rem; color: var(--adm-ink-2); }
.ksp-cat-serp__stars { color: #f59e0b; letter-spacing: -.02em; }
.ksp-cat-serp__desc { margin-top: 6px !important; color: var(--adm-ink-2); font-size: .8rem; line-height: 1.55; }
.ksp-cat-serp__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin: 0; color: var(--adm-muted); font-size: .66rem; }
.ksp-cat-serp__note { margin: 0; color: var(--adm-muted); font-size: .7rem; }
.ksp-cat-modal__foot { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 14px 22px; border-top: 1px solid var(--adm-line); background: var(--adm-bg); }
@media (max-width: 991.98px) {
    .ksp-cat-subs { grid-template-columns: minmax(0, 1fr); }
    .ksp-cat-row, .ksp-cat-row--3 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767.98px) {
    .ksp-cat-hero { padding: 18px; }
    .ksp-cat-audit__row { flex-wrap: wrap; }
    .ksp-cat-audit__end { width: 100%; justify-content: space-between; }
    .ksp-cat-modal { padding: 12px 8px; }
    .ksp-cat-steps { padding: 12px 14px; }
    .ksp-cat-modal__head, .ksp-cat-modal__foot { padding-inline: 14px; }
}
/* @yonetim-kategori-son */

/* ---------- @yonetim-yoneticiler — Sistem > Yöneticiler & İzinler (KARARLAR §30) ----------
   Sınıf adları kullanılmadan önce app.css'te arandı (2026-09-24 `.ksp-cat` çakışma dersi).
   Ekran ksp-adm-* kitini kullanır; buradakiler yalnız hesap satırındaki katlanır yetki kutusu. */
/* Bu ekranda islem dugmeleri yan yana: paylasilan .ksp-adm-acts dikey, kural EZILMEZ, yalniz burada kapsanir. */
.ksp-adm-check__n { margin-inline-start: 6px; color: var(--adm-muted); font-size: .68rem; font-weight: 700; }
/* @yonetim-yoneticiler-son */

/* ---------- @yonetim-seo — Büyüme > SEO & GEO (KARARLAR §31) ----------
   Sınıf adları kullanılmadan önce app.css'te arandı (2026-09-24 `.ksp-cat` çakışma dersi). */
.ksp-adm-seo-todo__list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-adm-seo-todo__list li { display: flex; align-items: flex-start; gap: 8px; color: var(--adm-ink-2); }
.ksp-adm-seo-todo__list .material-symbols-rounded { flex: none; margin-top: 1px; font-size: 18px; color: var(--adm-amber, #b45309); }
.ksp-adm-seo-todo__list span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ksp-adm-seo-todo__list b { font-size: .82rem; font-weight: 700; }
.ksp-adm-seo-todo__list i { color: var(--adm-muted); font-size: .74rem; font-style: normal; line-height: 1.5; }
/* Google sonuç kartı önizlemesi */
.ksp-adm-serp { padding: 14px 16px; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card-2); }
.ksp-adm-serp__url { margin: 0; color: var(--adm-muted); font-size: .72rem; }
.ksp-adm-serp__title { margin: 4px 0 2px; color: #1a0dab; font-size: .96rem; font-weight: 600; line-height: 1.3; }
.ksp-adm-serp__desc { margin: 0; color: var(--adm-ink-2); font-size: .78rem; line-height: 1.5; }
:root[data-bs-theme="dark"] .ksp-adm-serp__title { color: #8ab4f8; }
/* Paylaşım (OG) kartı önizlemesi */
.ksp-adm-og { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--adm-line); border-radius: 12px; }
.ksp-adm-og__img { display: block; aspect-ratio: 1200 / 630; background: var(--adm-bg) center / cover no-repeat; }
.ksp-adm-og__text { display: flex; flex-direction: column; gap: 3px; padding: 10px 12px; background: var(--adm-card-2); }
.ksp-adm-og__text b { font-size: .82rem; font-weight: 700; }
.ksp-adm-og__text i { color: var(--adm-muted); font-size: .74rem; font-style: normal; line-height: 1.45; }
/* Bot listesi ve SSS satırları */
.ksp-adm-seo-bots { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px 20px; }
.ksp-adm-seo-faq { display: grid; gap: 14px; }
.ksp-adm-seo-faq__row { display: grid; gap: 6px; padding: 12px; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card-2); }
.ksp-adm-seo-pre { max-height: 320px; margin: 0; padding: 12px 14px; overflow: auto; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card-2); color: var(--adm-ink-2); font-size: .72rem; line-height: 1.6; white-space: pre-wrap; word-break: break-word; }
/* @yonetim-seo-son */

/* ---------- @yonetim-ai — Büyüme > AI Merkezi (KARARLAR §32) ----------
   Sınıf adları kullanılmadan önce app.css'te arandı (2026-09-24 `.ksp-cat` çakışma dersi). */
/* @yonetim-ai-son */

/* ---------- @yonetim-ayarlar — Sistem > Ayarlar (KARARLAR §33) ----------
   Sınıf adları kullanılmadan önce app.css'te arandı (2026-09-24 `.ksp-cat` çakışma dersi). */
.ksp-adm-set-list { display: grid; gap: 4px; }
.ksp-adm-set-row { display: flex; align-items: flex-start; gap: 16px; padding: 14px 0; border-top: 1px solid var(--adm-line); }
.ksp-adm-set-row:first-child { border-top: 0; padding-top: 4px; }
.ksp-adm-set-row__text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.ksp-adm-set-row__text .ksp-adm-check span { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ksp-adm-set-row__field { flex: none; width: 120px; }
.ksp-adm-set-row__field--wide { width: min(320px, 100%); }
.ksp-adm-set-row.is-switch .ksp-adm-set-row__text .ksp-adm-help { padding-inline-start: 24px; }
@media (max-width: 640px) {
  .ksp-adm-set-row { flex-direction: column; gap: 8px; }
  .ksp-adm-set-row__field, .ksp-adm-set-row__field--wide { width: 100%; }
}
/* @yonetim-ayarlar-son */
/* Kaydet düğmesi yığının tam genişliğine yayılmasın (yalnız bu üç ekran: ayarlar, SEO, AI) */
.ksp-adm-set .ksp-adm-stack > .ksp-adm-btn,
.ksp-adm-seo .ksp-adm-stack > .ksp-adm-btn { align-self: flex-start; }

/* ---------- @karne — Salon Sağlık Karnesi & Performans Raporlama (KARARLAR §34) ----------
   Sahip tasarımı 225–227 birebir. Sınıf öneki `ksp-kar-` önce app.css içinde arandı, boştu
   (2026-09-24 `.ksp-cat` çakışma dersi). Süper Admin listesi + pencere ve kokpit karnesi aynı parçaları paylaşır. */
.ksp-kar { display: flex; flex-direction: column; gap: 16px; }

/* Tanıtım şeridi */
.ksp-kar-hero { display: flex; align-items: flex-start; gap: 14px; padding: 18px 22px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); }
.ksp-kar-hero__ico { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 12px; background: #f59e0b; color: #1c1917; }
.ksp-kar-hero__ico .material-symbols-rounded { font-size: 21px; }
.ksp-kar-hero__text { flex: 1 1 auto; min-width: 0; }
.ksp-kar-hero__text h1 { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 4px; color: var(--adm-ink); font-size: 1.02rem; font-weight: 800; }
.ksp-kar-hero__live { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 999px; background: var(--adm-green-bg); color: #0f9d58; font-size: .68rem; font-weight: 800; }
.ksp-kar-hero__live .material-symbols-rounded { font-size: 14px; }
.ksp-kar-hero__text p { margin: 0; max-width: 78ch; color: var(--adm-muted); font-size: .78rem; line-height: 1.6; }
.ksp-kar-hero__text p b { color: var(--adm-ink-2); font-weight: 700; }

/* Düğmeler */

/* Gösterge kutuları */
.ksp-kar-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.ksp-kar-kpi { position: relative; padding: 18px 20px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); }
.ksp-kar-kpi__ico { position: absolute; top: 16px; inset-inline-end: 16px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; }
.ksp-kar-kpi__ico .material-symbols-rounded { font-size: 17px; }
.ksp-kar-kpi__ico.is-amber { background: var(--adm-amber-bg); color: var(--adm-amber); }
.ksp-kar-kpi__ico.is-green { background: var(--adm-green-bg); color: #0f9d58; }
.ksp-kar-kpi__ico.is-blue { background: var(--adm-blue-bg); color: var(--adm-blue); }
.ksp-kar-kpi__ico.is-violet { background: var(--adm-blue-bg); color: #8b5cf6; }
.ksp-kar-kpi__label { margin: 0 34px 8px 0; color: var(--adm-muted); font-size: .66rem; font-weight: 800; letter-spacing: .06em; }
.ksp-kar-kpi__value { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin: 0; color: var(--adm-ink); font-size: 1.6rem; font-weight: 800; letter-spacing: -.03em; }
.ksp-kar-kpi__value i { color: var(--adm-muted); font-size: .74rem; font-weight: 600; font-style: normal; letter-spacing: 0; }
.ksp-kar-kpi__pill { padding: 3px 9px; border-radius: 999px; background: var(--adm-green-bg); color: #0f9d58; font-size: .64rem; font-weight: 800; letter-spacing: 0; }
.ksp-kar-kpi__foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; margin: 10px 0 0; color: var(--adm-muted); font-size: .7rem; font-weight: 600; }
.ksp-kar-kpi__foot .is-up { color: #0f9d58; }
.ksp-kar-kpi__foot .is-down { color: var(--adm-rose); }
.ksp-kar-kpi__foot .is-rose { color: var(--adm-rose); }
.ksp-kar-dist { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-kar-dist li { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 4px; border-radius: 10px; }
.ksp-kar-dist li span { font-size: .64rem; font-weight: 700; }
.ksp-kar-dist li b { font-size: 1.05rem; font-weight: 800; }
.ksp-kar-dist .is-green { background: var(--adm-green-bg); color: #0f9d58; }
.ksp-kar-dist .is-blue { background: var(--adm-blue-bg); color: var(--adm-blue); }
.ksp-kar-dist .is-rose { background: var(--adm-rose-bg); color: var(--adm-rose); }

/* Araç çubuğu */

/* Karne kartı */
.ksp-kar-bars { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-kar-bars li { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ksp-kar-bars__track { display: block; height: 5px; overflow: hidden; border-radius: 999px; background: var(--adm-bg); }
.ksp-kar-bars__track i { display: block; height: 100%; border-radius: 999px; }
.ksp-kar-bars__track .is-amber { background: #f59e0b; }
.ksp-kar-bars__track .is-blue { background: #3b82f6; }
.ksp-kar-bars__track .is-green { background: #10b981; }
.ksp-kar-bars__track .is-violet { background: #8b5cf6; }
.ksp-kar-bars__track .is-teal { background: #14b8a6; }
.ksp-kar-bars__label { overflow: hidden; color: var(--adm-muted); font-size: .63rem; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; }
.ksp-kar-bars--own { gap: 14px; padding: 16px 18px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); }

/* Karne gövdesi (pencere + kokpit ortak) */
.ksp-kar-body { display: flex; flex-direction: column; gap: 16px; }
.ksp-kar-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.ksp-kar-stats li { padding: 12px 14px; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card); }
.ksp-kar-stats__label { margin: 0 0 4px; color: var(--adm-muted); font-size: .68rem; font-weight: 600; }
.ksp-kar-stats__value { margin: 0; color: var(--adm-ink); font-size: 1.22rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-kar-stats__value small { color: var(--adm-muted); font-size: .7rem; font-weight: 600; }
.ksp-kar-stats__sub { margin: 3px 0 0; color: var(--adm-muted); font-size: .68rem; font-weight: 600; }
.ksp-kar-stats__sub.is-up { color: #0f9d58; }
.ksp-kar-stats__sub.is-down { color: var(--adm-rose); }

/* Eğilim grafiği */
.ksp-kar-trend { padding: 14px 16px; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card); }
.ksp-kar-trend__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 14px; }
.ksp-kar-trend__head h3 { display: flex; align-items: center; gap: 7px; margin: 0; color: var(--adm-ink); font-size: .82rem; font-weight: 800; }
.ksp-kar-trend__head h3 .material-symbols-rounded { font-size: 17px; color: var(--adm-amber); }
.ksp-kar-trend__head p { margin: 0; color: var(--adm-muted); font-size: .7rem; font-weight: 600; }
.ksp-kar-trend__chart { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); align-items: end; gap: 10px; height: 170px; margin: 0; padding: 0; list-style: none; }
.ksp-kar-trend__chart li { display: grid; grid-template-rows: auto 1fr auto; gap: 6px; height: 100%; min-width: 0; }
.ksp-kar-trend__num { text-align: center; color: var(--adm-ink-2); font-size: .64rem; font-weight: 700; }
.ksp-kar-trend__bar { align-self: end; width: 100%; border-radius: 8px 8px 0 0; background: #f59e0b; }
.ksp-kar-trend__ay { text-align: center; color: var(--adm-muted); font-size: .66rem; font-weight: 600; }

/* Kriter kartları */
.ksp-kar-crit__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px; }
.ksp-kar-crit__head h3 { margin: 0; color: var(--adm-ink); font-size: .86rem; font-weight: 800; }
.ksp-kar-crit__head h3 span { color: var(--adm-muted); font-size: .72rem; font-weight: 600; }
.ksp-kar-crit__head p { margin: 0; color: var(--adm-muted); font-size: .7rem; font-weight: 600; }
.ksp-kar-crit { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card); }
.ksp-kar-crit__top { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px; }
.ksp-kar-crit__top h4 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 3px; color: var(--adm-ink); font-size: .82rem; font-weight: 800; }
.ksp-kar-crit__top p { margin: 0; max-width: 70ch; color: var(--adm-muted); font-size: .7rem; line-height: 1.55; }
.ksp-kar-crit__score { flex: none; margin: 0; color: var(--adm-muted); font-size: .72rem; font-weight: 600; }
.ksp-kar-crit__score b { color: var(--adm-ink); font-size: 1.02rem; font-weight: 800; }
.ksp-kar-pct { padding: 2px 8px; border-radius: 999px; font-size: .64rem; font-weight: 800; }
.ksp-kar-pct.is-ok { background: var(--adm-green-bg); color: #0f9d58; }
.ksp-kar-pct.is-warn { background: var(--adm-amber-bg); color: var(--adm-amber); }
.ksp-kar-pct.is-low { background: var(--adm-rose-bg); color: var(--adm-rose); }
.ksp-kar-crit__bar { height: 7px; overflow: hidden; border-radius: 999px; background: var(--adm-bg); }
.ksp-kar-crit__bar span { display: block; height: 100%; border-radius: 999px; background: #10b981; }
.ksp-kar-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-kar-chips li { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border: 1px solid var(--adm-line); border-radius: 10px; background: var(--adm-card-2); font-size: .68rem; }
.ksp-kar-chips li span { color: var(--adm-muted); font-weight: 600; }
.ksp-kar-chips li b { color: var(--adm-ink); font-weight: 700; }
.ksp-kar-chips li.is-empty { opacity: .6; }

/* Güçlü yönler / öneriler */
.ksp-kar-advice { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; }
.ksp-kar-advice__box { padding: 14px 16px; border: 1px solid var(--adm-line); border-radius: 12px; }
.ksp-kar-advice__box h4 { display: flex; align-items: center; gap: 7px; margin: 0 0 10px; font-size: .8rem; font-weight: 800; }
.ksp-kar-advice__box h4 .material-symbols-rounded { font-size: 17px; }
.ksp-kar-advice__box ul { display: grid; gap: 8px; margin: 0; padding-inline-start: 18px; }
.ksp-kar-advice__box li { color: var(--adm-ink-2); font-size: .72rem; line-height: 1.6; }
.ksp-kar-advice__box.is-ok { border-color: var(--adm-green-line); background: var(--adm-green-bg); }
.ksp-kar-advice__box.is-ok h4 { color: #0f9d58; }
.ksp-kar-advice__box.is-warn { border-color: var(--adm-amber-line); background: var(--adm-amber-bg); }
.ksp-kar-advice__box.is-warn h4 { color: var(--adm-amber); }

/* Karne penceresi — @panel-olcek tuzağı: görünür alan --ksp-z'ye BÖLÜNÜR, safe center, min-height:0 zinciri */

@media (max-width: 900px) {
  .ksp-kar-hero { flex-wrap: wrap; }
      .ksp-kar-bars { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .ksp-kar-trend__chart { height: 140px; }
  .ksp-kar-trend__num { font-size: .58rem; }
}
/* @karne-son */
.ksp-kar-trend__bar.is-empty { background: var(--adm-line); }
/* Kokpit karnesi: ay ay gezinme + şube bölümü (sahip isteği 2026-09-24) */
.ksp-kar-month { display: inline-flex; flex: none; align-items: center; gap: 4px; padding: 4px; border: 1px solid var(--adm-line); border-radius: 11px; background: var(--adm-card-2); }
.ksp-kar-month a, .ksp-kar-month span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; color: var(--adm-muted); }
.ksp-kar-month a:hover { background: var(--adm-card); color: var(--adm-ink); }
.ksp-kar-month .is-off { opacity: .35; cursor: not-allowed; }
.ksp-kar-month b { padding: 0 8px; color: var(--adm-ink); font-size: .78rem; font-weight: 800; white-space: nowrap; }

/* ---------- @gunluk — Denetim Günlüğü / Audit Logs (sahip tasarımı 228; KARARLAR §35) ----------
   Üç panel de aynı parçayı kullanır (Süper Admin · salon kokpiti · uzman paneli).
   Sınıf öneki `ksp-log-` app.css içinde arandı, boştu (2026-09-24 `.ksp-cat` çakışma dersi). */
.ksp-log { display: flex; flex-direction: column; gap: 16px; }
.ksp-panel--cockpit .ksp-log, .ksp-panel--expert .ksp-log { color: var(--adm-ink-2); }

/* Koyu tanıtım şeridi */
.ksp-log-hero { display: flex; align-items: flex-start; gap: 14px; padding: 20px 24px; border-radius: var(--adm-radius); background: linear-gradient(120deg, #1c1917 0%, #262220 100%); color: #fff; }
.ksp-log-hero__ico { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 11px; background: rgba(245, 158, 11, .16); color: #f59e0b; }
.ksp-log-hero__ico .material-symbols-rounded { font-size: 20px; }
.ksp-log-hero h1 { margin: 0 0 5px; font-size: 1.02rem; font-weight: 800; }
.ksp-log-hero p { margin: 0; max-width: 92ch; color: rgba(255, 255, 255, .72); font-size: .78rem; line-height: 1.6; }

/* Araç çubuğu */
.ksp-log-tools { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); }
.ksp-log-tools__row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.ksp-log-search { display: flex; flex: 1 1 320px; align-items: center; gap: 8px; min-width: 0; padding: 10px 14px; border: 1px solid var(--adm-line); border-radius: 11px; background: var(--adm-card-2); color: var(--adm-muted); }
.ksp-log-search input { flex: 1 1 auto; min-width: 0; border: 0; background: none; color: var(--adm-ink); font: inherit; font-size: .8rem; outline: none; }
.ksp-log-select { flex: 0 1 260px; }
.ksp-log-tools__more { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.ksp-log-tools__more label { display: flex; flex-direction: column; gap: 5px; }
.ksp-log-tools__more label > span { color: var(--adm-muted); font-size: .68rem; font-weight: 700; }
.ksp-log-tools__more .ksp-adm-check { flex-direction: row; align-items: center; }

/* Tablo */
.ksp-log-table td { vertical-align: top; }
.ksp-log-when { color: var(--adm-muted); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .72rem; white-space: nowrap; }
.ksp-log-actor { display: block; color: var(--adm-ink); font-size: .8rem; font-weight: 700; }
.ksp-log-desc { display: block; color: var(--adm-ink-2); font-size: .78rem; line-height: 1.5; }
.ksp-log-chip { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; font-size: .68rem; font-weight: 700; white-space: nowrap; }
.ksp-log-chip .material-symbols-rounded { font-size: 14px; }
.ksp-log-chip.is-rose { background: var(--adm-rose-bg); color: var(--adm-rose); }
.ksp-log-chip.is-green { background: var(--adm-green-bg); color: #0f9d58; }
.ksp-log-chip.is-blue { background: var(--adm-blue-bg); color: var(--adm-blue); }
.ksp-log-chip.is-amber { background: var(--adm-amber-bg); color: var(--adm-amber); }
.ksp-log-chip.is-violet { background: var(--adm-blue-bg); color: #8b5cf6; }
.ksp-log-chip.is-teal { background: var(--adm-green-bg); color: #0d9488; }
.ksp-log-chip.is-stone { background: var(--adm-bg); color: var(--adm-muted); }

@media (max-width: 720px) {
  .ksp-log-hero { flex-wrap: wrap; padding: 16px; }
  .ksp-log-select { flex: 1 1 100%; }
}
/* @gunluk-son */
.ksp-log-date { width: 172px; }
.ksp-log-tools__more .ksp-adm-select { min-width: 200px; }

/* ---------- @magazin — Magazin & Basın Haberleri (sahip tasarımı 229–235; KARARLAR §36) ----------
   Sınıf öneki `ksp-mag-` app.css içinde arandı, boştu (2026-09-24 `.ksp-cat` çakışma dersi).
   Yönetim ekranı + kokpit yükleme + vitrin listesi/detayı aynı kiti paylaşır. */
.ksp-mag { display: flex; flex-direction: column; gap: 16px; }
.ksp-panel--cockpit .ksp-mag { color: var(--adm-ink-2); }

/* Başlık şeridi */
.ksp-mag-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 18px 22px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); }
.ksp-mag-head__text h1 { display: flex; align-items: center; gap: 9px; margin: 0 0 4px; color: var(--adm-ink); font-size: 1.02rem; font-weight: 800; }
.ksp-mag-head__text h1 .material-symbols-rounded { font-size: 21px; color: var(--adm-rose); }
.ksp-mag-head__text p { margin: 0; max-width: 80ch; color: var(--adm-muted); font-size: .78rem; line-height: 1.6; }
.ksp-mag-head__acts { display: flex; flex-wrap: wrap; gap: 10px; }

/* Düğmeler */
.ksp-mag-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 9px 16px; border: 1px solid transparent; border-radius: 11px; font-size: .78rem; font-weight: 700; text-decoration: none; white-space: nowrap; cursor: pointer; }
.ksp-mag-btn .material-symbols-rounded { font-size: 17px; }
.ksp-mag-btn--brand { background: #ec003f; color: #fff; }
.ksp-mag-btn--brand:hover { background: #c70036; color: #fff; }
.ksp-mag-btn--line { border-color: var(--adm-line); background: var(--adm-card); color: var(--adm-ink-2); }
.ksp-mag-btn--line:hover { border-color: var(--adm-ink); color: var(--adm-ink); }
.ksp-mag-btn--ghost { color: var(--adm-muted); }
.ksp-mag-btn--ghost:hover { color: var(--adm-ink); }

/* Göstergeler */
.ksp-mag-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.ksp-mag-kpi { padding: 16px 18px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); }
.ksp-mag-kpi.is-amber { border-color: var(--adm-amber-line); background: var(--adm-amber-bg); }
.ksp-mag-kpi.is-green { border-color: var(--adm-green-line); background: var(--adm-green-bg); }
.ksp-mag-kpi__label { display: flex; align-items: center; gap: 5px; margin: 0 0 6px; color: var(--adm-muted); font-size: .64rem; font-weight: 800; letter-spacing: .05em; }
.ksp-mag-kpi__label .material-symbols-rounded { font-size: 15px; }
.ksp-mag-kpi.is-amber .ksp-mag-kpi__label { color: var(--adm-amber); }
.ksp-mag-kpi.is-green .ksp-mag-kpi__label { color: #0f9d58; }
.ksp-mag-kpi__value { margin: 0; color: var(--adm-ink); font-size: 1.55rem; font-weight: 800; letter-spacing: -.03em; }
.ksp-mag-kpi__foot { margin: 4px 0 0; color: var(--adm-muted); font-size: .68rem; }

/* Süzgeç şeridi */
.ksp-mag-tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); }
.ksp-mag-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.ksp-mag-pills a { display: inline-flex; align-items: center; gap: 5px; padding: 7px 14px; border: 1px solid var(--adm-line); border-radius: 999px; color: var(--adm-muted); font-size: .74rem; font-weight: 700; text-decoration: none; }
.ksp-mag-pills a:hover { color: var(--adm-ink); }
.ksp-mag-pills a.is-dark.is-active { border-color: #1c1917; background: #1c1917; color: #fff; }
.ksp-mag-pills a.is-amber { border-color: var(--adm-amber-line); color: var(--adm-amber); }
.ksp-mag-pills a.is-amber.is-active { background: var(--adm-amber-bg); }
.ksp-mag-pills a.is-green { border-color: var(--adm-green-line); color: #0f9d58; }
.ksp-mag-pills a.is-green.is-active { background: var(--adm-green-bg); }
.ksp-mag-pills a.is-rose { border-color: var(--adm-rose-line); color: var(--adm-rose); }
.ksp-mag-pills a.is-rose.is-active { background: var(--adm-rose-bg); }
.ksp-mag-tools__right { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ksp-mag-search { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 8px 14px; border: 1px solid var(--adm-line); border-radius: 11px; background: var(--adm-card-2); color: var(--adm-muted); }
.ksp-mag-search input { min-width: 0; width: 200px; border: 0; background: none; color: var(--adm-ink); font: inherit; font-size: .78rem; outline: none; }

/* Haber satırı */
.ksp-mag-list { display: flex; flex-direction: column; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); overflow: hidden; }
.ksp-mag-row { display: flex; align-items: flex-start; gap: 16px; padding: 16px 20px; border-top: 1px solid var(--adm-line); }
.ksp-mag-row:first-child { border-top: 0; }
.ksp-mag-row__img { display: block; flex: none; width: 74px; height: 58px; border-radius: 10px; background: var(--adm-bg) center / cover no-repeat; }
.ksp-mag-row__img--none { display: grid; place-items: center; color: var(--adm-muted); }
.ksp-mag-row__main { flex: 1 1 auto; min-width: 0; }
.ksp-mag-row__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 6px; }
.ksp-mag-row__title { margin: 0 0 5px; color: var(--adm-ink); font-size: .92rem; font-weight: 800; line-height: 1.35; }
.ksp-mag-row__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0; color: var(--adm-muted); font-size: .72rem; }
.ksp-mag-row__meta span { display: inline-flex; align-items: center; gap: 4px; }
.ksp-mag-row__meta .material-symbols-rounded { font-size: 14px; }
.ksp-mag-row__meta .is-star { color: var(--adm-amber); font-weight: 700; }
.ksp-mag-row__reject { margin: 6px 0 0; color: var(--adm-rose); font-size: .72rem; font-weight: 600; }
.ksp-mag-row__acts { display: flex; flex: none; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; max-width: 460px; }
.ksp-mag-row__acts form { margin: 0; }

.ksp-mag-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px; font-size: .65rem; font-weight: 700; white-space: nowrap; }
.ksp-mag-chip .material-symbols-rounded { font-size: 13px; }
.ksp-mag-chip.is-amber { background: var(--adm-amber-bg); color: var(--adm-amber); }
.ksp-mag-chip.is-green, .ksp-mag-chip.is-ok { background: var(--adm-green-bg); color: #0f9d58; }
.ksp-mag-chip.is-rose, .ksp-mag-chip.is-off { background: var(--adm-rose-bg); color: var(--adm-rose); }
.ksp-mag-chip.is-wait { background: var(--adm-amber-bg); color: var(--adm-amber); }
.ksp-mag-chip.is-blue { background: var(--adm-blue-bg); color: var(--adm-blue); }
.ksp-mag-chip.is-violet { background: var(--adm-blue-bg); color: #8b5cf6; }
.ksp-mag-chip.is-orange { background: #fff1e6; color: #c2410c; }
.ksp-mag-chip.is-stone { background: var(--adm-bg); color: var(--adm-muted); }

.ksp-mag-act { display: inline-flex; align-items: center; gap: 5px; padding: 7px 12px; border: 1px solid var(--adm-line); border-radius: 9px; background: var(--adm-card); color: var(--adm-ink-2); font-size: .72rem; font-weight: 700; text-decoration: none; white-space: nowrap; cursor: pointer; }
.ksp-mag-act .material-symbols-rounded { font-size: 15px; }
.ksp-mag-act:hover { border-color: var(--adm-ink); color: var(--adm-ink); }
.ksp-mag-act.is-on { border-color: var(--adm-rose-line); background: var(--adm-rose-bg); color: var(--adm-rose); }
.ksp-mag-act.is-approve { border-color: transparent; background: #16a34a; color: #fff; }
.ksp-mag-act.is-approve:hover { background: #15803d; color: #fff; }
.ksp-mag-act.is-reject { border-color: var(--adm-rose-line); color: var(--adm-rose); list-style: none; }
.ksp-mag-act.is-reject::-webkit-details-marker { display: none; }
.ksp-mag-icon { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--adm-line); border-radius: 9px; background: var(--adm-card); color: var(--adm-muted); cursor: pointer; }
.ksp-mag-icon:hover { border-color: var(--adm-ink); color: var(--adm-ink); }
.ksp-mag-reject { position: relative; }
.ksp-mag-reject form { position: absolute; inset-inline-end: 0; top: calc(100% + 6px); z-index: 5; display: flex; gap: 6px; width: 320px; padding: 10px; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card); box-shadow: var(--adm-shadow); }

/* Pencere — @panel-olcek tuzağı: görünür alan --ksp-z'ye BÖLÜNÜR, safe center, min-height:0 zinciri */
.ksp-mag-modal { position: fixed; top: 0; inset-inline-start: 0; z-index: 1080; display: grid; place-items: safe center;
  width: calc(100vw / var(--ksp-z, 1)); height: calc(100dvh / var(--ksp-z, 1)); padding: 24px 16px; overflow: auto; overscroll-behavior: contain; }
.ksp-mag-modal__back { position: fixed; top: 0; inset-inline-start: 0; width: calc(100vw / var(--ksp-z, 1)); height: calc(100dvh / var(--ksp-z, 1)); background: rgba(28, 25, 23, .55); }
.ksp-mag-modal__box { position: relative; display: flex; flex-direction: column; width: min(760px, 100%); max-height: calc(100dvh / var(--ksp-z, 1) - 48px); overflow: hidden; border-radius: 18px; background: var(--adm-card); box-shadow: 0 24px 60px rgba(0, 0, 0, .28); }
.ksp-mag-modal__head { display: flex; align-items: flex-start; gap: 12px; padding: 18px 22px 14px; border-bottom: 1px solid var(--adm-line); }
.ksp-mag-modal__ico { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 11px; background: var(--adm-rose-bg); color: var(--adm-rose); }
.ksp-mag-modal__head h2 { margin: 0 0 3px; color: var(--adm-ink); font-size: 1rem; font-weight: 800; }
.ksp-mag-modal__head p { margin: 0; color: var(--adm-muted); font-size: .72rem; }
.ksp-mag-modal__close { margin-inline-start: auto; color: var(--adm-muted); }
.ksp-mag-modal__close:hover { color: var(--adm-ink); }
.ksp-mag-form { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
.ksp-mag-form__body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 6px; min-height: 0; padding: 16px 22px; overflow-y: auto; }
.ksp-mag-form__body .ksp-adm-label { margin-top: 8px; }
.ksp-mag-form__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.ksp-mag-form__row > span { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ksp-mag-modal__foot { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 14px 22px; border-top: 1px solid var(--adm-line); background: var(--adm-bg); }

/* Kapak yükleme (adres değil dosya) */
.ksp-mag-upload { display: flex; align-items: flex-start; gap: 12px; }
.ksp-mag-upload__prev { display: block; flex: none; width: 96px; height: 64px; border: 1px solid var(--adm-line); border-radius: 10px; background: var(--adm-card-2) center / cover no-repeat; }
.ksp-mag-upload__prev--none { display: grid; place-items: center; color: var(--adm-muted); }
.ksp-mag-upload__field { flex: 1 1 auto; display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ksp-mag-upload__field input[type="file"] { padding: 8px 10px; font-size: .76rem; }

/* ---- Kokpit tarafı (tasarım 231–232): koyu başlık şeridi, boş durum daveti, hazır başlık çipleri ---- */
.ksp-mag-hero { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 20px 24px; border-radius: var(--adm-radius); background: linear-gradient(120deg, #1c1917 0%, #262220 100%); color: #fff; }
.ksp-mag-hero__ico { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 11px; background: rgba(236, 0, 63, .18); color: #ff6b8b; }
.ksp-mag-hero__ico .material-symbols-rounded { font-size: 20px; }
.ksp-mag-hero__text { flex: 1 1 320px; min-width: 0; }
.ksp-mag-hero h1 { margin: 0 0 5px; font-size: 1.02rem; font-weight: 800; }
.ksp-mag-hero p { margin: 0; max-width: 92ch; color: rgba(255, 255, 255, .72); font-size: .78rem; line-height: 1.6; }
.ksp-mag-hero p b { color: #fff; }
.ksp-mag-hero .ksp-mag-btn { flex: none; }

.ksp-mag-row__wait { display: flex; align-items: center; gap: 5px; margin: 6px 0 0; color: var(--adm-amber); font-size: .72rem; font-weight: 600; }
.ksp-mag-row__wait .material-symbols-rounded, .ksp-mag-row__reject .material-symbols-rounded { font-size: 15px; }
.ksp-mag-row__reject { display: flex; align-items: center; gap: 5px; }

.ksp-mag-blank { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 44px 24px; border: 1px dashed var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); text-align: center; }
.ksp-mag-blank__ico { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: var(--adm-rose-bg); color: var(--adm-rose); }
.ksp-mag-blank__ico .material-symbols-rounded { font-size: 26px; }
.ksp-mag-blank h2 { margin: 0; color: var(--adm-ink); font-size: .96rem; font-weight: 800; }
.ksp-mag-blank p { margin: 0; max-width: 62ch; color: var(--adm-muted); font-size: .78rem; line-height: 1.6; }
.ksp-mag-blank .ksp-mag-btn { margin-top: 4px; }

.ksp-mag-samples { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 4px; }
.ksp-mag-samples__label { display: inline-flex; align-items: center; gap: 4px; color: var(--adm-muted); font-size: .68rem; font-weight: 700; }
.ksp-mag-samples__label .material-symbols-rounded { font-size: 14px; color: var(--adm-amber); }
.ksp-mag-sample { max-width: 100%; padding: 5px 11px; border: 1px solid var(--adm-line); border-radius: 999px; background: var(--adm-card-2); color: var(--adm-soft); font: inherit; font-size: .68rem; font-weight: 600; text-align: start; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.ksp-mag-sample:hover { border-color: var(--adm-rose-line); background: var(--adm-rose-bg); color: var(--adm-rose); }

/* Çoklu fotoğraf galerisi — pencere içindeki kare ızgarası (#1, #2 … rozetleri) */
.ksp-mag-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; margin: 2px 0 6px; padding: 0; list-style: none; }
.ksp-mag-grid__it { position: relative; aspect-ratio: 4 / 3; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card-2) center / cover no-repeat; overflow: hidden; }
.ksp-mag-grid__no { position: absolute; top: 6px; inset-inline-start: 6px; padding: 2px 7px; border-radius: 999px; background: rgba(28, 25, 23, .72); color: #fff; font-size: .64rem; font-weight: 800; }
.ksp-mag-grid__x, .ksp-mag-grid__zoom { position: absolute; top: 6px; display: grid; place-items: center; width: 24px; height: 24px; border: 0; border-radius: 8px; background: rgba(28, 25, 23, .72); color: #fff; cursor: pointer; }
.ksp-mag-grid__x { inset-inline-end: 6px; }
.ksp-mag-grid__zoom { inset-inline-end: 34px; }
.ksp-mag-grid__x:hover { background: var(--adm-rose); }
.ksp-mag-grid__zoom:hover { background: var(--adm-ink); color: #fff; }
.ksp-mag-grid .material-symbols-rounded { font-size: 15px; }

.ksp-mag-owner { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0 0 4px; padding: 9px 13px; border: 1px solid var(--adm-line); border-radius: 11px; background: var(--adm-card-2); color: var(--adm-soft); font-size: .74rem; }
.ksp-mag-owner .material-symbols-rounded { font-size: 16px; color: var(--adm-muted); }
.ksp-mag-owner b { color: var(--adm-ink); }
.ksp-mag-owner a { display: inline-flex; align-items: center; gap: 4px; margin-inline-start: auto; color: var(--adm-rose); font-weight: 700; text-decoration: none; }

/* Görünür doğrulama (sahip hatası 2026-09-24: tarayıcının kendi uyarı balonu bu pencerede çizilmiyordu) */
.ksp-mag-alert { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 6px; padding: 12px 14px; border: 1px solid var(--adm-rose-line); border-radius: 12px; background: var(--adm-rose-bg); color: var(--adm-rose-ink); font-size: .78rem; }
.ksp-mag-alert[hidden] { display: none; }
.ksp-mag-alert .material-symbols-rounded { flex: none; font-size: 19px; color: var(--adm-rose); }
.ksp-mag-alert b { display: block; margin-bottom: 4px; color: var(--adm-rose); }
.ksp-mag-alert ul { margin: 0; padding-inline-start: 18px; }
.ksp-mag-alert li { margin: 2px 0; }
.ksp-mag-form .is-error { border-color: var(--adm-rose) !important; background: var(--adm-rose-bg); }
.ksp-mag-upload__name { display: block; color: var(--adm-green-ink); font-size: .74rem; font-weight: 700; }
.ksp-mag-upload__name:empty { display: none; }
.ksp-mag-btn.is-busy { opacity: .72; pointer-events: none; }

.ksp-mag-modal__foot--own { flex-wrap: wrap; justify-content: flex-end; }
.ksp-mag-modal__hint { display: flex; align-items: center; gap: 5px; margin: 0 auto 0 0; color: var(--adm-muted); font-size: .7rem; }
.ksp-mag-modal__hint .material-symbols-rounded { font-size: 15px; color: var(--adm-amber); }

@media (max-width: 760px) {
  .ksp-mag-hero { padding: 16px; }
  .ksp-mag-hero .ksp-mag-btn { width: 100%; }
  .ksp-mag-row { flex-wrap: wrap; }
  .ksp-mag-row__acts { max-width: none; width: 100%; justify-content: flex-start; }
  .ksp-mag-sample { max-width: 100%; }
}
/* @magazin-son */

/* ---------- @magazin-vitrin — /magazin listesi ve detayı (sahip tasarımı 233–235; KARARLAR §36) ----------
   Sınıf öneki `ksp-mgz-` app.css içinde arandı, boştu (2026-09-24 `.ksp-cat` çakışma dersi).
   Panel kiti (.ksp-mag-) AYRIDIR: bu blok site temasının token'larını kullanır. */
.ksp-mgz { padding: 28px 0 56px; }
.ksp-mgz-hero { max-width: 72ch; margin: 0 0 22px; }
.ksp-mgz-hero__eyebrow { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 8px; color: var(--ksp-brand, #ec003f); font-size: .72rem; font-weight: 800; letter-spacing: .08em; }
.ksp-mgz-hero__eyebrow .material-symbols-rounded { font-size: 16px; }
.ksp-mgz-hero h1 { margin: 0 0 10px; font-size: clamp(1.5rem, 3.4vw, 2.3rem); font-weight: 800; letter-spacing: -.02em; }
.ksp-mgz-hero__lead { margin: 0; color: var(--bs-secondary-color); font-size: .94rem; line-height: 1.7; }

/* Kategori hapları */
.ksp-mgz-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.ksp-mgz-pills a { display: inline-flex; align-items: center; gap: 6px; padding: 8px 15px; border: 1px solid var(--bs-border-color); border-radius: 999px; color: var(--bs-secondary-color); font-size: .8rem; font-weight: 700; text-decoration: none; }
.ksp-mgz-pills a .material-symbols-rounded { font-size: 17px; }
.ksp-mgz-pills a b { color: var(--bs-tertiary-color); font-weight: 700; }
.ksp-mgz-pills a:hover { border-color: var(--bs-emphasis-color); color: var(--bs-emphasis-color); }
.ksp-mgz-pills a.is-active { border-color: transparent; background: var(--bs-emphasis-color); color: var(--bs-body-bg); }
.ksp-mgz-pills a.is-active b { color: rgba(255, 255, 255, .7); }

/* Günün manşeti */
.ksp-mgz-top { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 0; margin-bottom: 34px; border: 1px solid var(--bs-border-color); border-radius: 22px; background: var(--bs-body-bg); overflow: hidden; }
.ksp-mgz-top__img { display: block; min-height: 300px; background: var(--bs-tertiary-bg) center / cover no-repeat; }
.ksp-mgz-top__img--none { background-image: none; }
.ksp-mgz-top__body { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 28px 30px; }
.ksp-mgz-top__flag { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 5px 12px; border-radius: 999px; background: #fff1e6; color: #c2410c; font-size: .66rem; font-weight: 800; letter-spacing: .06em; }
.ksp-mgz-top__flag .material-symbols-rounded { font-size: 15px; }
.ksp-mgz-top h2 { margin: 0; font-size: clamp(1.15rem, 2.2vw, 1.6rem); font-weight: 800; line-height: 1.3; }
.ksp-mgz-top h2 a { color: inherit; text-decoration: none; }
.ksp-mgz-top h2 a:hover { color: var(--ksp-brand, #ec003f); }
.ksp-mgz-top__excerpt { margin: 0; color: var(--bs-secondary-color); font-size: .88rem; line-height: 1.65; }
.ksp-mgz-top__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0; color: var(--bs-tertiary-color); font-size: .78rem; }
.ksp-mgz-top__meta a, .ksp-mgz-top__meta span { display: inline-flex; align-items: center; gap: 5px; color: inherit; text-decoration: none; }
.ksp-mgz-top__meta a:hover { color: var(--bs-emphasis-color); }
.ksp-mgz-top__meta .material-symbols-rounded { font-size: 16px; }
.ksp-mgz-top__meta .is-star { color: #e17100; font-weight: 700; }

/* Düğmeler */
.ksp-mgz-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 11px 20px; border: 1px solid transparent; border-radius: 12px; background: var(--ksp-brand, #ec003f); color: #fff; font-size: .84rem; font-weight: 700; text-decoration: none; cursor: pointer; }
.ksp-mgz-btn:hover { background: #c70036; color: #fff; }
.ksp-mgz-btn .material-symbols-rounded { font-size: 18px; }
.ksp-mgz-btn--line { border-color: var(--bs-border-color); background: none; color: var(--bs-body-color); }
.ksp-mgz-btn--line:hover { border-color: var(--bs-emphasis-color); background: none; color: var(--bs-emphasis-color); }
.ksp-mgz-btn--full { width: 100%; }

/* Bölüm başlığı + ızgara */
.ksp-mgz-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 16px; }
.ksp-mgz-head h2 { margin: 0; font-size: 1.12rem; font-weight: 800; }
.ksp-mgz-head p { margin: 0; color: var(--bs-tertiary-color); font-size: .8rem; }
.ksp-mgz-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }

.ksp-mgz-card { display: flex; flex-direction: column; border: 1px solid var(--bs-border-color); border-radius: 18px; background: var(--bs-body-bg); overflow: hidden; }
.ksp-mgz-card__img { position: relative; display: block; aspect-ratio: 3 / 2; background: var(--bs-tertiary-bg) center / cover no-repeat; }
.ksp-mgz-card__cat { position: absolute; top: 10px; inset-inline-start: 10px; display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 999px; background: rgba(255, 255, 255, .94); color: #1c1917; font-size: .64rem; font-weight: 800; }
.ksp-mgz-card__cat .material-symbols-rounded { font-size: 14px; }
.ksp-mgz-card__cat.is-amber { color: #b45309; } .ksp-mgz-card__cat.is-rose { color: #ec003f; }
.ksp-mgz-card__cat.is-violet { color: #7c3aed; } .ksp-mgz-card__cat.is-orange { color: #c2410c; }
.ksp-mgz-card__cat.is-blue { color: #2563eb; }
.ksp-mgz-card__shots { position: absolute; top: 10px; inset-inline-end: 10px; display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: 999px; background: rgba(28, 25, 23, .68); color: #fff; font-size: .64rem; font-weight: 800; }
.ksp-mgz-card__shots .material-symbols-rounded { font-size: 14px; }
.ksp-mgz-card__body { display: flex; flex-direction: column; gap: 7px; padding: 16px 18px 18px; }
.ksp-mgz-card__celeb { display: flex; align-items: center; gap: 5px; margin: 0; color: #e17100; font-size: .74rem; font-weight: 700; }
.ksp-mgz-card__celeb .material-symbols-rounded { font-size: 15px; }
.ksp-mgz-card__celeb span { color: var(--bs-tertiary-color); font-weight: 500; }
.ksp-mgz-card__title { margin: 0; font-size: .96rem; font-weight: 800; line-height: 1.38; }
.ksp-mgz-card__title a { color: inherit; text-decoration: none; }
.ksp-mgz-card__title a:hover { color: var(--ksp-brand, #ec003f); }
.ksp-mgz-card__excerpt { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; margin: 0; overflow: hidden; color: var(--bs-secondary-color); font-size: .82rem; line-height: 1.6; }
.ksp-mgz-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin: 4px 0 0; color: var(--bs-tertiary-color); font-size: .74rem; }
.ksp-mgz-card__meta a, .ksp-mgz-card__meta span { display: inline-flex; align-items: center; gap: 4px; color: inherit; text-decoration: none; }
.ksp-mgz-card__meta a:hover { color: var(--bs-emphasis-color); }
.ksp-mgz-card__meta .material-symbols-rounded { font-size: 15px; }

.ksp-mgz-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 52px 20px; border: 1px dashed var(--bs-border-color); border-radius: 18px; text-align: center; }
.ksp-mgz-empty > span { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; background: var(--bs-tertiary-bg); color: var(--bs-tertiary-color); }
.ksp-mgz-empty h3 { margin: 0; font-size: 1rem; font-weight: 800; }
.ksp-mgz-empty p { margin: 0; max-width: 56ch; color: var(--bs-secondary-color); font-size: .85rem; }

.ksp-mgz-pager { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 26px; color: var(--bs-tertiary-color); font-size: .82rem; }
.ksp-mgz-pager a { display: inline-flex; align-items: center; gap: 5px; padding: 9px 16px; border: 1px solid var(--bs-border-color); border-radius: 11px; color: var(--bs-body-color); font-weight: 700; text-decoration: none; }
.ksp-mgz-pager a:hover { border-color: var(--bs-emphasis-color); }

.ksp-mgz-chip { display: inline-flex; align-items: center; gap: 5px; padding: 5px 12px; border-radius: 999px; background: var(--bs-tertiary-bg); color: var(--bs-secondary-color); font-size: .7rem; font-weight: 800; }
.ksp-mgz-chip .material-symbols-rounded { font-size: 15px; }
.ksp-mgz-chip.is-amber { background: #fffbeb; color: #b45309; } .ksp-mgz-chip.is-rose { background: #fff1f2; color: #ec003f; }
.ksp-mgz-chip.is-violet { background: #f5f3ff; color: #7c3aed; } .ksp-mgz-chip.is-orange { background: #fff1e6; color: #c2410c; }
.ksp-mgz-chip.is-blue { background: #eff6ff; color: #2563eb; }

/* ---- Detay ---- */
.ksp-mgz-detay { padding: 22px 0 56px; }
.ksp-mgz-detay__yol { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; color: var(--bs-tertiary-color); font-size: .8rem; }
.ksp-mgz-detay__yol a { display: inline-flex; align-items: center; gap: 5px; color: inherit; font-weight: 700; text-decoration: none; }
.ksp-mgz-detay__yol a:hover { color: var(--bs-emphasis-color); }
.ksp-mgz-detay__yol .material-symbols-rounded { font-size: 17px; }
.ksp-mgz-detay__head { max-width: 78ch; margin-bottom: 20px; }
.ksp-mgz-detay__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.ksp-mgz-detay__head h1 { margin: 0 0 12px; font-size: clamp(1.45rem, 3.2vw, 2.15rem); font-weight: 800; line-height: 1.25; letter-spacing: -.02em; }
.ksp-mgz-detay__spot { margin: 0 0 12px; color: var(--bs-secondary-color); font-size: 1rem; line-height: 1.7; }
.ksp-mgz-detay__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 0; color: var(--bs-tertiary-color); font-size: .8rem; }
.ksp-mgz-detay__meta a, .ksp-mgz-detay__meta span { display: inline-flex; align-items: center; gap: 5px; color: inherit; text-decoration: none; }
.ksp-mgz-detay__meta a { font-weight: 700; }
.ksp-mgz-detay__meta a:hover { color: var(--bs-emphasis-color); }
.ksp-mgz-detay__meta .material-symbols-rounded { font-size: 16px; }
.ksp-mgz-detay__kapak { margin: 0 0 26px; border-radius: 22px; overflow: hidden; }
.ksp-mgz-detay__kapak img { display: block; width: 100%; height: auto; }
.ksp-mgz-detay__govde { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 32px; align-items: start; }
.ksp-mgz-detay__metin p { margin: 0 0 16px; font-size: .96rem; line-height: 1.85; }

.ksp-mgz-kunye { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; margin: 0 0 24px; padding: 18px 20px; border: 1px solid var(--bs-border-color); border-radius: 16px; background: var(--bs-tertiary-bg); list-style: none; }
.ksp-mgz-kunye li { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ksp-mgz-kunye span { display: inline-flex; align-items: center; gap: 5px; color: var(--bs-tertiary-color); font-size: .7rem; font-weight: 700; letter-spacing: .03em; }
.ksp-mgz-kunye span .material-symbols-rounded { font-size: 15px; }
.ksp-mgz-kunye b { font-size: .86rem; font-weight: 700; }

/* Çoklu Fotoğraf Galerisi & Özel Kareler (sahip görseli 2026-09-24) */
.ksp-mgz-gal { margin: 28px 0; padding: 20px 22px; border: 1px solid #ffccd3; border-radius: 20px; background: linear-gradient(180deg, #fff7f8 0%, var(--bs-body-bg) 60%); }
.ksp-mgz-gal__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.ksp-mgz-gal__head h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; color: #ec003f; font-size: .92rem; font-weight: 800; letter-spacing: .01em; }
.ksp-mgz-gal__head h2 .material-symbols-rounded { font-size: 19px; }
.ksp-mgz-gal__head p { margin: 0; color: #b0638a; font-size: .76rem; }
.ksp-mgz-gal__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ksp-mgz-gal__count { display: inline-flex; align-items: center; gap: 5px; padding: 7px 13px; border: 1px solid var(--bs-border-color); border-radius: 10px; background: var(--bs-body-bg); color: var(--bs-secondary-color); font-size: .75rem; font-weight: 700; }
.ksp-mgz-gal__count .material-symbols-rounded { font-size: 16px; }
.ksp-mgz-gal__all { display: inline-flex; align-items: center; gap: 6px; padding: 8px 15px; border: 0; border-radius: 10px; background: #ec003f; color: #fff; font: inherit; font-size: .75rem; font-weight: 700; cursor: pointer; }
.ksp-mgz-gal__all:hover { background: #c70036; }
.ksp-mgz-gal__all .material-symbols-rounded { font-size: 16px; }
.ksp-mgz-gal__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.ksp-mgz-gal__it { position: relative; display: block; width: 100%; padding: 0; border: 0; border-radius: 14px; background: var(--bs-tertiary-bg); overflow: hidden; cursor: zoom-in; }
.ksp-mgz-gal__it img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.ksp-mgz-gal__it b { position: absolute; top: 8px; inset-inline-start: 8px; padding: 3px 9px; border-radius: 999px; background: rgba(255, 255, 255, .92); color: #1c1917; font-size: .66rem; font-weight: 800; }
/* Sahip isteği 2026-09-24: bu iki not YATIK OLMASIN (dik dursun) ve rengi daha belirgin olsun */
.ksp-mgz-gal__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #ffe0e5; color: var(--bs-secondary-color); font-size: .75rem; font-style: normal; font-weight: 600; }
.ksp-mgz-gal__foot span:last-child { color: #ec003f; }

/* Tam ekran galeri (app.js "@magazin-galeri") */
.ksp-mgz-lb { position: fixed; inset: 0; z-index: 1090; display: grid; grid-template-rows: auto 1fr auto; background: rgba(12, 10, 9, .94); }
.ksp-mgz-lb__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; color: rgba(255, 255, 255, .8); font-size: .8rem; font-weight: 700; }
.ksp-mgz-lb__stage { display: grid; place-items: center; min-height: 0; padding: 0 14px; }
.ksp-mgz-lb__stage img { max-width: 100%; max-height: 100%; border-radius: 12px; object-fit: contain; }
.ksp-mgz-lb__nav { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 16px; }
.ksp-mgz-lb button { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 12px; background: rgba(255, 255, 255, .14); color: #fff; cursor: pointer; }
.ksp-mgz-lb button:hover { background: rgba(255, 255, 255, .26); }
.ksp-mgz-lb button[disabled] { opacity: .35; cursor: default; }

/* Etiketler + salon kartı */
.ksp-mgz-etiket { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 0; padding: 0; list-style: none; }
.ksp-mgz-etiket li { display: inline-flex; align-items: center; gap: 4px; padding: 6px 13px; border: 1px solid var(--bs-border-color); border-radius: 999px; color: var(--bs-secondary-color); font-size: .75rem; font-weight: 600; }
.ksp-mgz-etiket .material-symbols-rounded { font-size: 15px; }

.ksp-mgz-salon { position: sticky; top: 90px; display: flex; flex-direction: column; align-items: flex-start; gap: 9px; padding: 22px; border: 1px solid var(--bs-border-color); border-radius: 20px; background: var(--bs-body-bg); }
.ksp-mgz-salon__flag { display: inline-flex; align-items: center; gap: 5px; margin: 0; color: var(--ksp-brand, #ec003f); font-size: .65rem; font-weight: 800; letter-spacing: .06em; }
.ksp-mgz-salon__flag .material-symbols-rounded { font-size: 15px; }
.ksp-mgz-salon__logo { width: 54px; height: 54px; border-radius: 15px; }
.ksp-mgz-salon h2 { margin: 0; font-size: 1.02rem; font-weight: 800; }
.ksp-mgz-salon h2 a { color: inherit; text-decoration: none; }
.ksp-mgz-salon h2 a:hover { color: var(--ksp-brand, #ec003f); }
.ksp-mgz-salon__yer, .ksp-mgz-salon__puan { display: flex; align-items: center; gap: 5px; margin: 0; color: var(--bs-tertiary-color); font-size: .8rem; }
.ksp-mgz-salon__puan .material-symbols-rounded { color: #e17100; font-size: 17px; }
.ksp-mgz-salon__puan b { color: var(--bs-body-color); }
.ksp-mgz-salon__yer .material-symbols-rounded { font-size: 16px; }
.ksp-mgz-salon .ksp-mgz-btn { margin-top: 4px; }

.ksp-mgz-ilgili { margin-top: 44px; }
.ksp-mgz-ilgili h2 { margin: 0 0 16px; font-size: 1.12rem; font-weight: 800; }

@media (max-width: 991px) {
  .ksp-mgz-detay__govde { grid-template-columns: minmax(0, 1fr); }
  .ksp-mgz-salon { position: static; width: 100%; }
  .ksp-mgz-top { grid-template-columns: minmax(0, 1fr); }
  .ksp-mgz-top__img { min-height: 220px; }
}
@media (max-width: 575px) {
  .ksp-mgz-gal { padding: 16px; }
  .ksp-mgz-gal__acts { width: 100%; }
  .ksp-mgz-gal__all { flex: 1 1 auto; justify-content: center; }
}
/* @magazin-vitrin-son */

/* ---------- @magazin-serit — ana sayfanın EN ALTINDAKİ magazin bölümü (sahip tasarımı 233; KARARLAR §36) ---------- */
.ksp-mgz-strip { padding: 56px 0; background: linear-gradient(160deg, #1c1917 0%, #2a2422 100%); color: #fff; }
.ksp-mgz-strip__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 26px; }
.ksp-mgz-strip__eyebrow { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 8px; color: #ff6b8b; font-size: .72rem; font-weight: 800; letter-spacing: .08em; }
.ksp-mgz-strip__eyebrow .material-symbols-rounded { font-size: 16px; }
.ksp-mgz-strip h2 { margin: 0 0 8px; font-size: clamp(1.3rem, 2.8vw, 1.95rem); font-weight: 800; letter-spacing: -.02em; }
.ksp-mgz-strip__lead { margin: 0; max-width: 62ch; color: rgba(255, 255, 255, .68); font-size: .88rem; line-height: 1.65; }
.ksp-mgz-strip__all { display: inline-flex; align-items: center; gap: 7px; padding: 11px 20px; border: 1px solid rgba(255, 255, 255, .24); border-radius: 12px; color: #fff; font-size: .82rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.ksp-mgz-strip__all:hover { border-color: #fff; background: #fff; color: #1c1917; }
.ksp-mgz-strip__all .material-symbols-rounded { font-size: 18px; }

.ksp-mgz-strip__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.ksp-mgz-strip__card { display: flex; flex-direction: column; border: 1px solid rgba(255, 255, 255, .12); border-radius: 18px; background: rgba(255, 255, 255, .04); overflow: hidden; }
.ksp-mgz-strip__card:hover { border-color: rgba(255, 255, 255, .28); }
.ksp-mgz-strip__img { position: relative; display: block; aspect-ratio: 3 / 2; background: rgba(255, 255, 255, .08) center / cover no-repeat; }
.ksp-mgz-strip__cat { position: absolute; top: 10px; inset-inline-start: 10px; display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 999px; background: rgba(28, 25, 23, .78); color: #fff; font-size: .64rem; font-weight: 800; }
.ksp-mgz-strip__cat .material-symbols-rounded { font-size: 14px; color: #ffb703; }
.ksp-mgz-strip__body { display: flex; flex-direction: column; gap: 7px; padding: 16px 18px 18px; }
.ksp-mgz-strip__celeb { display: flex; align-items: center; gap: 5px; margin: 0; color: #ffb703; font-size: .74rem; font-weight: 700; }
.ksp-mgz-strip__celeb .material-symbols-rounded { font-size: 15px; }
.ksp-mgz-strip__body h3 { margin: 0; font-size: .96rem; font-weight: 800; line-height: 1.38; }
.ksp-mgz-strip__body h3 a { color: #fff; text-decoration: none; }
.ksp-mgz-strip__body h3 a:hover { color: #ff6b8b; }
.ksp-mgz-strip__excerpt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin: 0; overflow: hidden; color: rgba(255, 255, 255, .64); font-size: .81rem; line-height: 1.6; }
.ksp-mgz-strip__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 4px 0 0; color: rgba(255, 255, 255, .5); font-size: .74rem; }
.ksp-mgz-strip__meta .material-symbols-rounded { font-size: 15px; }

@media (max-width: 575px) {
  .ksp-mgz-strip { padding: 40px 0; }
  .ksp-mgz-strip__all { width: 100%; justify-content: center; }
}
/* @magazin-serit-son */

/* ---------- @magazin-tepki — Okur Tepkileri + Okur Yorumları (sahip tasarımı 236; KARARLAR §36.7) ---------- */
.ksp-mgz-oy { margin: 28px 0; padding: 20px 22px; border: 1px solid var(--bs-border-color); border-radius: 20px; background: var(--bs-tertiary-bg); }
.ksp-mgz-oy__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.ksp-mgz-oy__head h2 { margin: 0 0 3px; font-size: .82rem; font-weight: 800; letter-spacing: .04em; }
.ksp-mgz-oy__head p { margin: 0; color: var(--bs-tertiary-color); font-size: .76rem; }
.ksp-mgz-oy__total { flex: none; padding: 7px 14px; border: 1px solid var(--bs-border-color); border-radius: 10px; background: var(--bs-body-bg); color: var(--bs-secondary-color); font-size: .73rem; font-weight: 700; }
.ksp-mgz-oy__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
.ksp-mgz-oy__it { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; border: 1px solid var(--bs-border-color); border-radius: 14px; background: var(--bs-body-bg); }
.ksp-mgz-oy__it.is-mine { border-color: #ffccd3; box-shadow: 0 0 0 3px rgba(236, 0, 63, .08); }
.ksp-mgz-oy__top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0; }
.ksp-mgz-oy__top b { font-size: .86rem; font-weight: 800; }
.ksp-mgz-oy__top span { color: var(--bs-tertiary-color); font-size: .76rem; font-weight: 700; }
.ksp-mgz-oy__sub { margin: 0; color: var(--bs-tertiary-color); font-size: .7rem; }
.ksp-mgz-oy__bar { display: block; height: 5px; border-radius: 999px; background: var(--bs-secondary-bg); overflow: hidden; }
.ksp-mgz-oy__bar i { display: block; height: 100%; border-radius: 999px; background: #ec003f; }
.ksp-mgz-oy__foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 2px 0 0; color: var(--bs-tertiary-color); font-size: .72rem; }
.ksp-mgz-oy__btn { padding: 4px 10px; border: 1px solid var(--bs-border-color); border-radius: 8px; background: var(--bs-body-bg); color: var(--bs-secondary-color); font: inherit; font-size: .7rem; font-weight: 700; cursor: pointer; }
.ksp-mgz-oy__btn:hover { border-color: #ec003f; color: #ec003f; }
.ksp-mgz-oy__it.is-mine .ksp-mgz-oy__btn { border-color: #ec003f; background: #fff1f2; color: #ec003f; }
.ksp-mgz-oy__note { display: flex; align-items: center; gap: 6px; margin: 12px 0 0; color: var(--bs-tertiary-color); font-size: .74rem; }
.ksp-mgz-oy__note .material-symbols-rounded { font-size: 16px; }

.ksp-mgz-yorum { margin: 28px 0; padding-top: 24px; border-top: 1px solid var(--bs-border-color); }
.ksp-mgz-yorum__head { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 16px; }
.ksp-mgz-yorum__ico { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 12px; background: #fff1f2; color: #ec003f; }
.ksp-mgz-yorum__head > div { flex: 1 1 260px; min-width: 0; }
.ksp-mgz-yorum__head h2 { margin: 0 0 3px; font-size: 1.05rem; font-weight: 800; }
.ksp-mgz-yorum__head p { margin: 0; color: var(--bs-tertiary-color); font-size: .78rem; }
.ksp-mgz-yorum__count { flex: none; padding: 6px 13px; border: 1px solid var(--bs-border-color); border-radius: 999px; color: var(--bs-secondary-color); font-size: .72rem; font-weight: 700; }

.ksp-mgz-yz { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px; border: 1px solid #ffdbe1; border-radius: 18px; background: var(--bs-body-bg); }
.ksp-mgz-yz__flag { display: flex; align-items: center; gap: 6px; margin: 0 0 4px; color: #ec003f; font-size: .78rem; font-weight: 800; }
.ksp-mgz-yz__flag .material-symbols-rounded { font-size: 16px; }
.ksp-mgz-yz__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.ksp-mgz-yz__row > span { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ksp-mgz-yz label { color: var(--bs-secondary-color); font-size: .74rem; font-weight: 700; }
.ksp-mgz-yz input, .ksp-mgz-yz select, .ksp-mgz-yz textarea { width: 100%; padding: 10px 13px; border: 1px solid var(--bs-border-color); border-radius: 11px; background: var(--bs-body-bg); color: var(--bs-body-color); font: inherit; font-size: .84rem; }
.ksp-mgz-yz textarea { min-height: 96px; resize: vertical; }
.ksp-mgz-yz input:focus, .ksp-mgz-yz select:focus, .ksp-mgz-yz textarea:focus { border-color: #ec003f; outline: none; }
.ksp-mgz-yz__err { color: #ec003f; font-size: .74rem; font-weight: 700; }
.ksp-mgz-yz__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; color: var(--bs-tertiary-color); font-size: .72rem; }
.ksp-mgz-yz__len { flex: none; font-weight: 700; }
.ksp-mgz-yz__send { align-self: flex-end; display: inline-flex; align-items: center; gap: 7px; padding: 10px 20px; border: 0; border-radius: 12px; background: #ec003f; color: #fff; font: inherit; font-size: .82rem; font-weight: 700; cursor: pointer; }
.ksp-mgz-yz__send:hover { background: #c70036; }
.ksp-mgz-yz__send .material-symbols-rounded { font-size: 17px; }

.ksp-mgz-yorum__bos { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-top: 16px; padding: 38px 20px; border: 1px dashed var(--bs-border-color); border-radius: 18px; text-align: center; }
.ksp-mgz-yorum__bos > span { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--bs-tertiary-bg); color: var(--bs-tertiary-color); }
.ksp-mgz-yorum__bos h3 { margin: 0; color: #ec003f; font-size: .95rem; font-weight: 800; }
.ksp-mgz-yorum__bos p { margin: 0; color: var(--bs-tertiary-color); font-size: .8rem; line-height: 1.65; }

.ksp-mgz-yorum__list { display: flex; flex-direction: column; gap: 14px; margin: 18px 0 0; padding: 0; list-style: none; }
.ksp-mgz-yorum__it { display: flex; gap: 12px; padding: 14px 16px; border: 1px solid var(--bs-border-color); border-radius: 16px; background: var(--bs-body-bg); }
.ksp-mgz-yorum__ava { flex: none; width: 40px; height: 40px; border-radius: 12px; }
.ksp-mgz-yorum__kim { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 5px; }
.ksp-mgz-yorum__kim b { font-size: .86rem; font-weight: 800; }
.ksp-mgz-yorum__kim i { color: var(--bs-tertiary-color); font-size: .72rem; font-style: normal; }
.ksp-mgz-yorum__rol { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px; background: var(--bs-tertiary-bg); color: var(--bs-secondary-color); font-size: .66rem; font-weight: 700; }
.ksp-mgz-yorum__rol.is-ok { background: #ecfdf5; color: #006045; }
.ksp-mgz-yorum__rol .material-symbols-rounded { font-size: 13px; }
.ksp-mgz-yorum__metin { margin: 0; color: var(--bs-secondary-color); font-size: .84rem; line-height: 1.7; }

/* Liste kartının altı: "İlgili Salon" künyesi + Haberi Oku / Randevu Al (sahip görseli) */
.ksp-mgz-card__salon { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 10px; margin: 8px 0 0; padding-top: 10px; border-top: 1px solid var(--bs-border-color); color: var(--bs-tertiary-color); font-size: .72rem; }
.ksp-mgz-card__salon b { display: block; color: var(--bs-body-color); font-size: .8rem; font-weight: 800; }
.ksp-mgz-card__salon i { font-style: normal; }
.ksp-mgz-card__acts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.ksp-mgz-card__read, .ksp-mgz-card__book { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 9px 12px; border: 1px solid var(--bs-border-color); border-radius: 10px; color: var(--bs-body-color); font-size: .78rem; font-weight: 700; text-decoration: none; }
.ksp-mgz-card__read:hover { border-color: var(--bs-emphasis-color); color: var(--bs-emphasis-color); }
.ksp-mgz-card__book { border-color: transparent; background: #ec003f; color: #fff; }
.ksp-mgz-card__book:hover { background: #c70036; color: #fff; }
.ksp-mgz-card__book .material-symbols-rounded { font-size: 16px; }

@media (max-width: 575px) {
  .ksp-mgz-oy { padding: 16px; }
  .ksp-mgz-yz__send { align-self: stretch; justify-content: center; }
}
/* @magazin-tepki-son */

/* Yönetim penceresindeki okur yorumu denetimi (KARARLAR §36.7) */
.ksp-mag-yorum { display: flex; flex-direction: column; gap: 8px; margin: 2px 0 6px; padding: 0; list-style: none; }
.ksp-mag-yorum__it { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 10px 13px; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card-2); }
.ksp-mag-yorum__it.is-hidden { opacity: .62; }
.ksp-mag-yorum__kim { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 9px; margin: 0 0 3px; font-size: .72rem; }
.ksp-mag-yorum__kim b { color: var(--adm-ink); font-weight: 800; }
.ksp-mag-yorum__kim span { padding: 1px 8px; border-radius: 999px; background: var(--adm-bg); color: var(--adm-muted); font-size: .64rem; font-weight: 700; }
.ksp-mag-yorum__kim i { color: var(--adm-faint); font-style: normal; }
.ksp-mag-yorum__kim em { color: var(--adm-rose); font-style: normal; font-weight: 700; }
.ksp-mag-yorum__metin { margin: 0; color: var(--adm-soft); font-size: .76rem; line-height: 1.6; }
/* @magazin-yorum-denetim-son */

/* ---------- @magazin-kunye — /magazin koyu künye şeridi + manşet kartı (sahip tasarımları 237–238) ----------
   237'deki sağ "Salon sahibi misiniz?" kartı SAHİP İSTEĞİYLE eklenmedi.
   Bu blok, daha önce yazılan @magazin-vitrin kurallarının ÜZERİNE biner (sonra geldiği için kazanır). */
.ksp-mgz { padding: 0 0 56px; }
.ksp-mgz__body { padding-top: 26px; }

.ksp-mgz-hero { margin: 0 0 4px; padding: 0; max-width: none; background: radial-gradient(120% 160% at 78% 50%, #4a0d22 0%, #26060f 42%, #120407 100%); color: #fff; }
.ksp-mgz-hero__in { padding-top: 46px; padding-bottom: 46px; }
.ksp-mgz-hero__eyebrow { display: inline-flex; align-items: center; gap: 7px; margin: 0 0 16px; padding: 6px 14px; border: 1px solid rgba(255, 92, 128, .45); border-radius: 999px; background: rgba(236, 0, 63, .14); color: #ff90a9; font-size: .68rem; font-weight: 800; letter-spacing: .09em; }
.ksp-mgz-hero__eyebrow .material-symbols-rounded { font-size: 15px; }
.ksp-mgz-hero h1 { margin: 0 0 14px; max-width: 20ch; color: #fff; font-size: clamp(1.75rem, 4.2vw, 3rem); font-weight: 800; line-height: 1.12; letter-spacing: -.025em; }
.ksp-mgz-hero h1 b { color: #ff2d62; font-weight: 800; }
.ksp-mgz-hero__lead { margin: 0; max-width: 62ch; color: rgba(255, 255, 255, .7); font-size: .92rem; line-height: 1.7; }
/* Künyenin sağındaki dergi kapağı (sahip isteği 2026-09-24, referans görsel 276) + "Tüm Salonlara Dön".
   Kapak tamamen SVG (views/site/press-cover.php), yalnız süslemedir; dar ekranda basılmaz. */
.ksp-mgz-hero__in { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 40px; }
.ksp-mgz-hero__text { min-width: 0; }
.ksp-mgz-cover { flex-shrink: 0; width: 246px; height: auto; border-radius: 6px; transform: rotate(3.2deg); transform-origin: center;
  box-shadow: 0 30px 60px -22px rgba(0, 0, 0, .85), 0 0 0 1px rgba(255, 255, 255, .08); }
.ksp-mgz-back { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 14px; color: var(--ksp-muted); font-size: .86rem; font-weight: 600; text-decoration: none; }
.ksp-mgz-back .material-symbols-rounded { font-size: 18px; }
.ksp-mgz-back:hover { color: #ec003f; }
@media (max-width: 1199.98px) { .ksp-mgz-cover { width: 208px; } }
@media (max-width: 991.98px) {
    .ksp-mgz-hero__in { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .ksp-mgz-cover { display: none; }
}

/* Günün manşeti (238): görselde rozet, sağda kategori + tarih satırı, altta salon künyesi ve "Haberi Oku →" */
.ksp-mgz-top { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); border-radius: 20px; }
.ksp-mgz-top__img { position: relative; min-height: 320px; }
.ksp-mgz-top__flag { position: absolute; top: 14px; inset-inline-start: 14px; display: inline-flex; align-items: center; gap: 5px; margin: 0; padding: 6px 13px; border-radius: 999px; background: #ec003f; color: #fff; font-size: .64rem; font-weight: 800; letter-spacing: .05em; }
.ksp-mgz-top__flag .material-symbols-rounded { font-size: 15px; }
.ksp-mgz-top__body { gap: 12px; padding: 26px 28px; }
.ksp-mgz-top__line { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin: 0; color: var(--bs-tertiary-color); font-size: .74rem; font-weight: 700; }
.ksp-mgz-top__line span { color: #ec003f; }
.ksp-mgz-top__line span.is-amber { color: #b45309; } .ksp-mgz-top__line span.is-violet { color: #7c3aed; }
.ksp-mgz-top__line span.is-orange { color: #c2410c; } .ksp-mgz-top__line span.is-blue { color: #2563eb; }
.ksp-mgz-top__line i { font-style: normal; opacity: .55; }
.ksp-mgz-top__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; width: 100%; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--bs-border-color); }
.ksp-mgz-top__salon { display: inline-flex; align-items: center; gap: 9px; color: inherit; text-decoration: none; }
.ksp-mgz-top__logo { width: 34px; height: 34px; border-radius: 10px; font-size: .7rem; }
.ksp-mgz-top__salon span { display: flex; flex-direction: column; line-height: 1.3; }
.ksp-mgz-top__salon b { color: #ec003f; font-size: .8rem; font-weight: 800; }
.ksp-mgz-top__salon i { color: var(--bs-tertiary-color); font-size: .72rem; font-style: normal; }
.ksp-mgz-top__read { display: inline-flex; align-items: center; gap: 5px; color: #ec003f; font-size: .8rem; font-weight: 800; text-decoration: none; }
.ksp-mgz-top__read:hover { color: #c70036; }
.ksp-mgz-top__read .material-symbols-rounded { font-size: 17px; }

/* Bölüm başlığı: pembe makas + "N haber listeleniyor" (238) */
.ksp-mgz-head h2 { display: flex; align-items: center; gap: 8px; }
.ksp-mgz-head h2 .material-symbols-rounded { font-size: 19px; color: #ec003f; }

/* Kart: ünlü rozeti görselin ALT köşesinde (238) */
.ksp-mgz-card__celeb { position: absolute; inset-inline-start: 10px; bottom: 10px; display: inline-flex; align-items: center; gap: 4px; margin: 0; max-width: calc(100% - 20px); padding: 4px 10px; border-radius: 999px; background: rgba(28, 25, 23, .74); color: #ffd166; font-size: .68rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-mgz-card__celeb .material-symbols-rounded { font-size: 14px; }
.ksp-mgz-card__celeb i { color: rgba(255, 255, 255, .72); font-style: normal; font-weight: 500; }

@media (max-width: 991px) {
  .ksp-mgz-hero__in { padding-top: 34px; padding-bottom: 34px; }
  .ksp-mgz-top__img { min-height: 220px; }
  .ksp-mgz-top__body { padding: 20px; }
}
/* @magazin-kunye-son */

/* Kart yükseklikleri eşitlensin: künye ve düğmeler her kartta aynı hizada bitsin (tasarım 238) */
.ksp-mgz-card__body { flex: 1 1 auto; }
.ksp-mgz-card__salon { margin-top: auto; }
/* @magazin-kart-hiza-son */

/* ---------- @magazin-serit-akis — ana sayfadaki magazin şeridi akar hale geldi (sahip isteği 2026-09-24:
   "Geleneksel Kuaför Aramaya Son" bölümünün üstüne al, biraz küçült, sağdan sola slowmotion aksın).
   Tasarım (233/241) KORUNUR; yalnız ölçüler küçülür ve ızgara akan şeride döner.
   Döngü matematiği: kartlar arası boşluk `gap` ile DEĞİL kartın `margin-inline-end`'i ile verilir —
   böylece iki kopyanın toplam genişliği tam iki katıdır ve translateX(-50%) kusursuz bağlanır. ---------- */
.ksp-mgz-strip { padding: 42px 0; }
.ksp-mgz-strip__head { margin-bottom: 20px; }
.ksp-mgz-strip__eyebrow { margin-bottom: 6px; font-size: .66rem; }
.ksp-mgz-strip h2 { margin-bottom: 6px; font-size: clamp(1.15rem, 2.3vw, 1.6rem); }
.ksp-mgz-strip__lead { font-size: .82rem; }
.ksp-mgz-strip__all { padding: 9px 17px; font-size: .78rem; }

/* Kaydırma penceresi: tam genişlik, taşan kartlar kırpılır */
.ksp-mgz-strip__vp { overflow: hidden; }
.ksp-mgz-strip__track { display: flex; gap: 0; width: max-content; will-change: transform; }

/* Izgara → akan sıra */
.ksp-mgz-strip__grid { display: flex; gap: 0; grid-template-columns: none; }
.ksp-mgz-strip__card { flex: none; width: 300px; margin-inline-end: 18px; }
.ksp-mgz-strip__img { aspect-ratio: 16 / 10; }
.ksp-mgz-strip__body { gap: 6px; padding: 13px 15px 15px; }
.ksp-mgz-strip__body h3 { font-size: .88rem; }
.ksp-mgz-strip__excerpt { font-size: .78rem; }
.ksp-mgz-strip__celeb { font-size: .7rem; }
.ksp-mgz-strip__meta { font-size: .7rem; }

/* Akış (2026-09-29, sahip: "hareketli olsun kayar"): CSS animasyonu (52 sn'de bir tur, parmakla kaydırılamıyordu) yerine
   pencere KAYDIRILABİLİR; kendiliğinden kayma app.js "@kaydirma-seridi"de (sağdan sola, belirgin hız, üzerine gelince / odakta /
   dokununca durur, kopya bitince başa sarar). Döngü matematiği aynı: iki kopya, kart boşluğu margin ile. */
.ksp-mgz-strip__vp { overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
.ksp-mgz-strip__vp::-webkit-scrollbar { display: none; }

/* Tek haber varsa akış yok: şerit ortalanır */
.ksp-mgz-strip__vp:not(.is-akar) .ksp-mgz-strip__track { width: 100%; justify-content: center; }
.ksp-mgz-strip__vp:not(.is-akar) .ksp-mgz-strip__card { margin-inline-end: 0; }

/* Hareket azaltma tercihi: animasyon durur, ikinci kopya gizlenir, şerit elle kaydırılır */
@media (prefers-reduced-motion: reduce) {
  .ksp-mgz-strip__vp.is-akar .ksp-mgz-strip__track { animation: none; width: 100%; }
  .ksp-mgz-strip__grid[aria-hidden="true"] { display: none; }
  .ksp-mgz-strip__vp { overflow-x: auto; scrollbar-width: thin; }
}

@media (max-width: 575px) {
  .ksp-mgz-strip { padding: 32px 0; }
  .ksp-mgz-strip__card { width: 260px; margin-inline-end: 14px; }
}
/* @magazin-serit-akis-son */

/* ---------- @magazin-ustbar — haber detayı üst barı ve sesli okuma paneli (sahip tasarımları 243–244) ---------- */
.ksp-mgz-bar { position: sticky; top: 0; z-index: 30; padding: 10px 0; background: color-mix(in srgb, var(--bs-body-bg) 92%, transparent); backdrop-filter: blur(10px); }
.ksp-mgz-bar__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding-top: 8px; padding-bottom: 8px; border: 1px solid var(--bs-border-color); border-radius: 16px; background: var(--bs-body-bg); box-shadow: 0 1px 2px rgba(28, 25, 23, .04); }
.ksp-mgz-bar__left, .ksp-mgz-bar__right { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }

.ksp-mgz-bar__back { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border: 1px solid var(--bs-border-color); border-radius: 10px; color: var(--bs-body-color); font-size: .78rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.ksp-mgz-bar__back:hover { border-color: var(--bs-emphasis-color); color: var(--bs-emphasis-color); }
.ksp-mgz-bar__back .material-symbols-rounded { font-size: 17px; }

.ksp-mgz-bar__cat { display: inline-flex; align-items: center; gap: 5px; padding: 6px 13px; border: 1px solid #ffd8a8; border-radius: 999px; background: #fff7ed; color: #c2410c; font-size: .74rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.ksp-mgz-bar__cat.is-amber { border-color: #fde68a; background: #fffbeb; color: #b45309; }
.ksp-mgz-bar__cat.is-rose { border-color: #ffccd3; background: #fff1f2; color: #ec003f; }
.ksp-mgz-bar__cat.is-violet { border-color: #ddd6fe; background: #f5f3ff; color: #7c3aed; }
.ksp-mgz-bar__cat.is-blue { border-color: #bfdbfe; background: #eff6ff; color: #2563eb; }
.ksp-mgz-bar__cat .material-symbols-rounded { font-size: 15px; }

.ksp-mgz-bar__sure { display: inline-flex; align-items: center; gap: 5px; color: var(--bs-tertiary-color); font-size: .76rem; font-weight: 600; white-space: nowrap; }
.ksp-mgz-bar__sure .material-symbols-rounded { font-size: 16px; }
.ksp-mgz-bar__canli { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid #a4f4cf; border-radius: 999px; background: #ecfdf5; color: #006045; font-size: .74rem; font-weight: 700; white-space: nowrap; }
.ksp-mgz-bar__canli i { width: 7px; height: 7px; border-radius: 50%; background: #00b074; animation: ksp-mgz-nabiz 2s ease-in-out infinite; }
@keyframes ksp-mgz-nabiz { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }

.ksp-mgz-bar__boy { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border: 1px solid var(--bs-border-color); border-radius: 10px; background: var(--bs-tertiary-bg); }
.ksp-mgz-bar__boy button { padding: 4px 10px; border: 0; border-radius: 8px; background: none; color: var(--bs-secondary-color); font: inherit; font-weight: 700; line-height: 1.1; cursor: pointer; }
.ksp-mgz-bar__boy button:nth-child(1) { font-size: .74rem; } .ksp-mgz-bar__boy button:nth-child(2) { font-size: .84rem; }
.ksp-mgz-bar__boy button:nth-child(3) { font-size: .94rem; }
.ksp-mgz-bar__boy button.is-on { background: var(--bs-body-bg); color: var(--bs-emphasis-color); box-shadow: 0 1px 2px rgba(28, 25, 23, .1); }

.ksp-mgz-bar__ses, .ksp-mgz-bar__paylas, .ksp-mgz-bar__kaydet { display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--bs-border-color); border-radius: 10px; background: var(--bs-body-bg); color: var(--bs-body-color); font: inherit; font-size: .78rem; font-weight: 700; cursor: pointer; white-space: nowrap; }
.ksp-mgz-bar__ses, .ksp-mgz-bar__paylas { padding: 8px 14px; }
.ksp-mgz-bar__kaydet { width: 36px; height: 36px; color: var(--bs-tertiary-color); }
.ksp-mgz-bar__ses .material-symbols-rounded, .ksp-mgz-bar__paylas .material-symbols-rounded, .ksp-mgz-bar__kaydet .material-symbols-rounded { font-size: 17px; }
.ksp-mgz-bar__ses:hover, .ksp-mgz-bar__kaydet:hover { border-color: #ec003f; color: #ec003f; }
.ksp-mgz-bar__ses.is-on { border-color: transparent; background: #ec003f; color: #fff; }
.ksp-mgz-bar__kaydet[aria-pressed="true"] { border-color: #ec003f; background: #fff1f2; color: #ec003f; }
.ksp-mgz-bar__kaydet[aria-pressed="true"] .material-symbols-rounded { font-variation-settings: 'FILL' 1; }
.ksp-mgz-bar__paylas { border-color: transparent; background: #1c1917; color: #fff; }
.ksp-mgz-bar__paylas:hover { background: #000; color: #fff; }

/* Sesli okuma paneli (244) */
.ksp-mgz-oyn { display: flex; align-items: center; gap: 14px; margin-top: 10px; padding: 14px 16px; border-radius: 16px; background: linear-gradient(110deg, #1c1917 0%, #3a1220 62%, #4a0d22 100%); color: #fff; }
.ksp-mgz-oyn[hidden] { display: none; }
.ksp-mgz-oyn__ico { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 12px; background: #ec003f; color: #fff; }
.ksp-mgz-oyn__main { flex: 1 1 auto; min-width: 0; }
.ksp-mgz-oyn__ust { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 3px; }
.ksp-mgz-oyn__ust b { padding: 2px 9px; border-radius: 999px; background: rgba(236, 0, 63, .22); color: #ff90a9; font-size: .6rem; font-weight: 800; letter-spacing: .08em; }
.ksp-mgz-oyn__ust span { color: rgba(255, 255, 255, .62); font-size: .72rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.ksp-mgz-oyn__baslik { margin: 0 0 7px; color: #fff; font-size: .84rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksp-mgz-oyn__dalga { display: flex; align-items: flex-end; gap: 2px; height: 22px; }
.ksp-mgz-oyn__dalga i { display: block; width: 3px; border-radius: 2px; background: rgba(255, 255, 255, .26); }
.ksp-mgz-oyn__dalga i.is-gecti { background: #ec003f; }
.ksp-mgz-oyn__hiz { display: inline-flex; flex: none; gap: 3px; padding: 3px; border-radius: 10px; background: rgba(255, 255, 255, .1); }
.ksp-mgz-oyn__hiz button { padding: 5px 11px; border: 0; border-radius: 8px; background: none; color: rgba(255, 255, 255, .7); font: inherit; font-size: .7rem; font-weight: 800; cursor: pointer; }
.ksp-mgz-oyn__hiz button.is-on { background: #ec003f; color: #fff; }
.ksp-mgz-oyn__kapat { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border: 0; border-radius: 9px; background: rgba(255, 255, 255, .12); color: #fff; cursor: pointer; }
.ksp-mgz-oyn__kapat:hover { background: rgba(255, 255, 255, .24); }

/* Yazı boyu seçimi: gövde metni ve spot büyür (üst bar A / A+ / A++) */
.ksp-mgz-detay.is-boy1 .ksp-mgz-detay__metin p { font-size: 1.04rem; }
.ksp-mgz-detay.is-boy2 .ksp-mgz-detay__metin p { font-size: 1.14rem; line-height: 1.95; }
.ksp-mgz-detay.is-boy1 .ksp-mgz-detay__spot { font-size: 1.06rem; }
.ksp-mgz-detay.is-boy2 .ksp-mgz-detay__spot { font-size: 1.14rem; }

@media (max-width: 767px) {
  .ksp-mgz-bar { position: static; }
  .ksp-mgz-bar__in { justify-content: flex-start; }
  .ksp-mgz-bar__back span, .ksp-mgz-bar__sure { font-size: .74rem; }
  .ksp-mgz-oyn { flex-wrap: wrap; gap: 10px; }
  .ksp-mgz-oyn__main { flex: 1 1 100%; order: 3; }
}
/* @magazin-ustbar-son */

/* ---------- @magazin-serit-acik — ana sayfa magazin şeridi SİTENİN ZEMİNİNE alındı (sahip isteği 2026-09-24:
   "arkaplanını sitenin rengine uyarla, kısalt, tam sayfa yapma ve kaybolan yap").
   Yapı ve tasarım korunur; yalnız koyu bant açık zemine döner, şerit kap genişliğinde kalır ve
   iki kenarda maske ile erir. Renkler token'lardan geldiği için koyu tema kendiliğinden çalışır. ---------- */
.ksp-mgz-strip { padding: 34px 0; background: var(--ksp-bg); color: var(--ksp-text); }
.ksp-mgz-strip__eyebrow { color: #ec003f; }
.ksp-mgz-strip h2 { color: var(--ksp-text); }
.ksp-mgz-strip__lead { color: var(--ksp-muted); }
.ksp-mgz-strip__all { border-color: var(--ksp-border); background: var(--ksp-surface); color: var(--ksp-text); }
.ksp-mgz-strip__all:hover { border-color: var(--ksp-ink); background: var(--ksp-ink); color: #fff; }

/* Tam sayfa DEĞİL: kap içinde kalır. Kenarlarda kaybolma maskesi (tasarım 247). */
.ksp-mgz-strip__vp {
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%);
          mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%);
}

/* Kartlar açık zeminde okunur kalsın (yerleşim aynı) */
.ksp-mgz-strip__card { border-color: var(--ksp-border); background: var(--ksp-surface); }
.ksp-mgz-strip__card:hover { border-color: #ffccd3; }
.ksp-mgz-strip__img { background-color: var(--ksp-bg); }
.ksp-mgz-strip__body h3 a { color: var(--ksp-text); }
.ksp-mgz-strip__body h3 a:hover { color: #ec003f; }
.ksp-mgz-strip__excerpt { color: var(--ksp-muted); }
.ksp-mgz-strip__meta { color: var(--ksp-muted); }
.ksp-mgz-strip__celeb { color: #b45309; }
/* @magazin-serit-acik-son */

/* ---------- @yorum-kaydir — site geneli: ilk 5 yorum görünür, gerisi liste içinde kayar (sahip isteği
   2026-09-24). Yükseklik app.js tarafından ölçülüp `max-height` olarak verilir; buradaki kurallar yalnız
   kaydırma görünümünü kurar. Alt kenarda hafif erime "devamı var" işaretidir. ---------- */
.ksp-yorum-kaydir { overflow-y: auto; overscroll-behavior: contain; padding-inline-end: 6px;
  -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 88%, rgba(0, 0, 0, .25) 100%);
          mask-image: linear-gradient(to bottom, #000 0, #000 88%, rgba(0, 0, 0, .25) 100%);
  scrollbar-width: thin; scrollbar-color: var(--ksp-border) transparent; }
.ksp-yorum-kaydir::-webkit-scrollbar { width: 8px; }
.ksp-yorum-kaydir::-webkit-scrollbar-track { background: transparent; }
.ksp-yorum-kaydir::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 999px; background-clip: padding-box; background-color: var(--ksp-border); }
.ksp-yorum-kaydir:hover::-webkit-scrollbar-thumb { background-color: var(--ksp-muted); }

/* "Faydalı" düğmesi (tasarım 249): yorumun sağ üstünde durur */
.ksp-mgz-yorum__it { position: relative; }
.ksp-mgz-yorum__govde { flex: 1 1 auto; min-width: 0; }
.ksp-mgz-yorum__fayda { flex: none; margin: 0; }
.ksp-mgz-fayda { display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-muted); font: inherit; font-size: .72rem; font-weight: 700; white-space: nowrap; cursor: pointer; }
.ksp-mgz-fayda .material-symbols-rounded { font-size: 15px; }
.ksp-mgz-fayda:hover { border-color: #ec003f; color: #ec003f; }
.ksp-mgz-fayda.is-on { border-color: #ec003f; background: #fff1f2; color: #ec003f; }
.ksp-mgz-fayda.is-on .material-symbols-rounded { font-variation-settings: 'FILL' 1; }

@media (max-width: 575px) {
  .ksp-mgz-yorum__it { flex-wrap: wrap; }
  .ksp-mgz-yorum__fayda { width: 100%; margin-top: 8px; padding-inline-start: 52px; }
}
/* @yorum-kaydir-son */

/* ---------- @salon-magazin-sss — salon sayfasındaki "Magazin" ve "S.S.S." sekmeleri
   (sahip isteği 2026-09-24, tasarımlar 252–254; KARARLAR §36.12). Salon sayfasının kendi dili korunur. ---------- */
.ksp-sp-press, .ksp-sp-faq { display: flex; flex-direction: column; gap: 16px; }

/* Kategori hapları (tasarım 254) */
.ksp-sp-press__pills { display: flex; flex-wrap: wrap; gap: 8px; }
.ksp-sp-press__pills button { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-muted); font: inherit; font-size: .78rem; font-weight: 700; cursor: pointer; }
.ksp-sp-press__pills button .material-symbols-rounded { font-size: 16px; }
.ksp-sp-press__pills button b { color: var(--ksp-muted); font-weight: 700; opacity: .75; }
.ksp-sp-press__pills button:hover { border-color: var(--ksp-ink); color: var(--ksp-text); }
.ksp-sp-press__pills button.is-active { border-color: transparent; background: var(--ksp-ink); color: #fff; }
.ksp-sp-press__pills button.is-active b { color: rgba(255, 255, 255, .7); }

.ksp-sp-press__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
/* Magazin sekmesi — Matris Tablosu (sahip isteği 2026-09-24): kapak SOLDA tek görsel, kalan alanlar sütun sütun.
   Çerçeve / başlık stilleri şube matrisinden (.ksp-sp-net__table) gelir; burada yalnız magazine özgü hücreler. */
.ksp-sp-press__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; }
.ksp-sp-press__tablewrap[hidden], .ksp-sp-press__grid[hidden] { display: none; }
.ksp-sp-press__table { min-width: 880px; }
.ksp-sp-press__table tbody th, .ksp-sp-press__table td { vertical-align: middle; }
.ksp-sp-press__table tbody th { max-width: 360px; }
.ksp-sp-press__table tbody th > a { color: var(--ksp-text); font-size: .86rem; font-weight: 800; text-decoration: none; }
.ksp-sp-press__table tbody th > a:hover { text-decoration: underline; }
.ksp-sp-press__table tbody th .ksp-sp-branch__tag { display: inline-flex; align-items: center; gap: 3px; margin-inline-start: 6px; vertical-align: middle; }
.ksp-sp-press__table tbody th .ksp-sp-branch__tag .material-symbols-rounded { font-size: 12px; }
.ksp-sp-press__table td b, .ksp-sp-press__table td small { display: block; overflow: hidden; max-width: 190px; text-overflow: ellipsis; white-space: nowrap; }
.ksp-sp-press__table td b { font-size: .82rem; font-weight: 800; }
.ksp-sp-press__table td small { color: var(--ksp-muted); font-size: .72rem; }
.ksp-sp-press__table tbody tr:hover { background: var(--ksp-surface-2); }
.ksp-sp-press__table .is-cover { width: 104px; padding-inline-end: 0; }
.ksp-sp-press__thumb { display: block; overflow: hidden; width: 88px; height: 60px; border-radius: 10px; background: var(--ksp-surface-2); }
.ksp-sp-press__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ksp-sp-press__thumb .ksp-mesh { display: block; width: 100%; height: 100%; }
.ksp-sp-press__spot { display: -webkit-box; overflow: hidden; margin-top: 3px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: var(--ksp-muted); font-size: .74rem; font-weight: 500; line-height: 1.4; }
.ksp-sp-press__kat { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; font-size: .7rem; font-weight: 800; white-space: nowrap; }
.ksp-sp-press__kat .material-symbols-rounded { font-size: 14px; }
.ksp-sp-press__kat.is-amber { background: #fef3c7; color: #92400e; }
.ksp-sp-press__kat.is-violet { background: #ede9fe; color: #6d28d9; }
.ksp-sp-press__kat.is-rose { background: #ffe4e6; color: #be123c; }
.ksp-sp-press__kat.is-orange { background: #ffedd5; color: #c2410c; }
.ksp-sp-press__kat.is-blue { background: #dbeafe; color: #1d4ed8; }
.ksp-sp-press__kat.is-stone { background: #f5f5f4; color: #57534e; }
@media (max-width: 575.98px) {
    .ksp-sp-press__bar { align-items: stretch; }
    .ksp-sp-press__bar .ksp-sp-net__view { align-self: flex-start; }
}
.ksp-sp-press__bos { margin: 0; padding: 26px; border: 1px dashed var(--ksp-border); border-radius: 14px; color: var(--ksp-muted); font-size: .84rem; text-align: center; }
.ksp-sp-press__bos[hidden] { display: none; }

.ksp-sp-presscard { display: flex; flex-direction: column; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); overflow: hidden; }
.ksp-sp-presscard[hidden] { display: none; }
.ksp-sp-presscard__img { position: relative; display: block; aspect-ratio: 3 / 2; background: var(--ksp-bg) center / cover no-repeat; }
.ksp-sp-presscard__cat, .ksp-sp-presscard__manset { position: absolute; top: 9px; display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: 999px; font-size: .64rem; font-weight: 800; }
.ksp-sp-presscard__cat { inset-inline-start: 9px; background: rgba(255, 255, 255, .94); color: #1c1917; }
.ksp-sp-presscard__manset { inset-inline-end: 9px; background: #ec003f; color: #fff; }
.ksp-sp-presscard__cat .material-symbols-rounded, .ksp-sp-presscard__manset .material-symbols-rounded { font-size: 13px; }
.ksp-sp-presscard__body { display: flex; flex: 1 1 auto; flex-direction: column; gap: 6px; padding: 14px 16px 16px; }
.ksp-sp-presscard__celeb { display: flex; align-items: center; gap: 4px; margin: 0; color: #b45309; font-size: .72rem; font-weight: 700; }
.ksp-sp-presscard__celeb .material-symbols-rounded { font-size: 14px; }
.ksp-sp-presscard__body h3 { margin: 0; font-size: .9rem; font-weight: 800; line-height: 1.38; }
.ksp-sp-presscard__body h3 a { color: var(--ksp-text); text-decoration: none; }
.ksp-sp-presscard__body h3 a:hover { color: #ec003f; }
.ksp-sp-presscard__spot { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin: 0; overflow: hidden; color: var(--ksp-muted); font-size: .78rem; line-height: 1.6; }
.ksp-sp-presscard__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin: auto 0 0; padding-top: 10px; border-top: 1px solid var(--ksp-border); color: var(--ksp-muted); font-size: .72rem; }
.ksp-sp-presscard__meta span, .ksp-sp-presscard__meta a { display: inline-flex; align-items: center; gap: 4px; }
.ksp-sp-presscard__meta .material-symbols-rounded { font-size: 14px; }
.ksp-sp-presscard__meta a { margin-inline-start: auto; color: #ec003f; font-weight: 800; text-decoration: none; }

/* S.S.S. listesi — salon sayfasının sade dilinde, <details> ile JS'siz açılır (tasarım 253 sadeliği) */
.ksp-sp-faq__rozet { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border: 1px solid var(--ksp-border); border-radius: 999px; color: var(--ksp-muted); font-size: .74rem; font-weight: 700; white-space: nowrap; }
.ksp-sp-faq__rozet .material-symbols-rounded { font-size: 16px; color: #00b074; }
.ksp-sp-faq__list { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-sp-faq__it { border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); overflow: hidden; }
.ksp-sp-faq__it[open] { border-color: #ffccd3; }
.ksp-sp-faq__it summary { display: flex; align-items: center; gap: 11px; padding: 14px 16px; cursor: pointer; list-style: none; }
.ksp-sp-faq__it summary::-webkit-details-marker { display: none; }
.ksp-sp-faq__no { display: grid; place-items: center; flex: none; width: 26px; height: 26px; border-radius: 9px; background: var(--ksp-bg); color: var(--ksp-muted); font-size: .72rem; font-weight: 800; }
.ksp-sp-faq__it[open] .ksp-sp-faq__no { background: #fff1f2; color: #ec003f; }
.ksp-sp-faq__q { flex: 1 1 auto; min-width: 0; color: var(--ksp-ink); font-size: .88rem; font-weight: 700; }
.ksp-sp-faq__ok { flex: none; color: var(--ksp-muted); transition: transform .18s ease; }
.ksp-sp-faq__it[open] .ksp-sp-faq__ok { transform: rotate(180deg); }
.ksp-sp-faq__a { margin: 0; padding: 0 16px 16px 53px; color: var(--ksp-muted); font-size: .84rem; line-height: 1.75; }

/* Kokpit S.S.S. satırı */
.ksp-sss-row { display: flex; align-items: flex-start; gap: 14px; padding: 14px 18px; border-top: 1px solid var(--adm-line); }
.ksp-sss-row:first-child { border-top: 0; }
.ksp-sss-row.is-pasif { opacity: .6; }
.ksp-sss-row__no { display: grid; place-items: center; flex: none; width: 28px; height: 28px; border-radius: 9px; background: var(--adm-bg); color: var(--adm-muted); font-size: .74rem; font-weight: 800; }
.ksp-sss-row__main { flex: 1 1 auto; min-width: 0; }
.ksp-sss-row__q { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 4px; color: var(--adm-ink); font-size: .88rem; font-weight: 800; }
.ksp-sss-row__a { margin: 0; color: var(--adm-soft); font-size: .78rem; line-height: 1.65; }
.ksp-sss-dolu { display: inline-flex; align-items: center; gap: 6px; padding: 9px 15px; border: 1px solid rgba(255, 255, 255, .22); border-radius: 11px; color: rgba(255, 255, 255, .82); font-size: .76rem; font-weight: 700; }
.ksp-sss-dolu .material-symbols-rounded { font-size: 16px; }
.ksp-mag-kpi__value small { color: var(--adm-muted); font-size: .9rem; font-weight: 700; }
.ksp-sss-check { margin-top: 10px; }
.ksp-mag-icon[disabled] { opacity: .35; cursor: default; }
/* @salon-magazin-sss-son */

/* ---------- @salon-bolum-basligi — salon sayfasındaki TÜM panel başlıkları tek dilde
   (sahip isteği 2026-09-24, referans tasarım 255 "Öncesi & Sonrası Dönüşüm Portföyü" künyesi).
   Paketler, Yorumlar, Magazin ve S.S.S. artık aynı kartı kullanır: çerçeveli beyaz künye,
   pembe ikon + başlık, açıklama ve sağda pembe hap. Tek salon için değil, TÜM salon ve uzmanlarda. ---------- */
.ksp-sp-sechead {
  align-items: center; flex-wrap: wrap; gap: 12px 20px; margin-bottom: 20px;
  padding: 16px 22px; border: 1px solid var(--ksp-border); border-radius: 16px;
  background: var(--ksp-surface); box-shadow: 0 1px 2px rgba(28, 25, 23, .05);
}
.ksp-sp-sechead__title { display: flex; align-items: center; gap: 8px; font-size: 17px; }
.ksp-sp-sechead__title .material-symbols-rounded { flex: none; color: #ec003f; font-size: 22px; }
.ksp-sp-sechead__lead { font-size: 12.5px; }
/* Sağdaki hap: paketlerdeki pembe hapla aynı (referans 255/258) */
.ksp-sp-sechead .ksp-sp-pill-rose { flex: none; }
/* Yorumlar künyesi de aynı kartı kullanır; puan rozeti sağda kalır */
.ksp-sp-reviews__head { align-items: center; flex-wrap: wrap; gap: 12px 20px; margin-bottom: 20px;
  padding: 16px 22px; border: 1px solid var(--ksp-border); border-radius: 16px;
  background: var(--ksp-surface); box-shadow: 0 1px 2px rgba(28, 25, 23, .05); }
.ksp-sp-reviews__head > div { flex: 1 1 260px; }

@media (max-width: 767.98px) {
  .ksp-sp-sechead, .ksp-sp-reviews__head { flex-direction: column; align-items: flex-start; padding: 14px 16px; }
}
/* @salon-bolum-basligi-son */

/* ---------- @kokpit-eksik — "Salon sayfanız %X tamamlandı" kartı (sahip kararı 2026-09-24; KARARLAR §36.14).
   Boş sekmeler sitede gizlendiği için eksikler SALONA burada söylenir; sayfa tamamlanınca kart hiç basılmaz. */
.ksp-ck-eksik { margin-top: 16px; padding: 18px 20px; border: 1px solid var(--adm-amber-line, #fde68a); border-radius: 18px; background: var(--adm-amber-bg, #fffbeb); }
.ksp-ck-eksik__head { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-bottom: 14px; }
.ksp-ck-eksik__ring { display: grid; place-items: center; flex: none; width: 54px; height: 54px; border-radius: 50%;
  background: conic-gradient(#ec003f calc(var(--pct) * 1%), rgba(28, 25, 23, .1) 0); }
.ksp-ck-eksik__ring b { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #fff; color: #ec003f; font-size: .78rem; font-weight: 800; }
.ksp-ck-eksik__head > div { flex: 1 1 260px; min-width: 0; }
.ksp-ck-eksik__head h2 { margin: 0 0 3px; color: #1c1917; font-size: 1rem; font-weight: 800; }
.ksp-ck-eksik__head p { margin: 0; color: #78716c; font-size: .8rem; line-height: 1.6; }
.ksp-ck-eksik__head p b { color: #b45309; }
.ksp-ck-eksik__gor { display: inline-flex; align-items: center; gap: 6px; flex: none; padding: 9px 15px; border: 1px solid #fde68a; border-radius: 11px; background: #fff; color: #b45309; font-size: .78rem; font-weight: 700; text-decoration: none; }
.ksp-ck-eksik__gor:hover { border-color: #b45309; color: #92400e; }
.ksp-ck-eksik__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.ksp-ck-eksik__list a { display: flex; align-items: center; gap: 11px; padding: 11px 13px; border: 1px solid #fde68a; border-radius: 13px; background: #fff; color: #1c1917; text-decoration: none; }
.ksp-ck-eksik__list a:hover { border-color: #ec003f; }
.ksp-ck-eksik__ico { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 11px; background: #fff1f2; color: #ec003f; }
.ksp-ck-eksik__txt { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.ksp-ck-eksik__txt b { font-size: .84rem; font-weight: 800; }
.ksp-ck-eksik__txt i { color: #78716c; font-size: .72rem; font-style: normal; line-height: 1.45; }
.ksp-ck-eksik__list a > .material-symbols-rounded { flex: none; color: #a8a29e; font-size: 18px; }
[data-bs-theme="dark"] .ksp-ck-eksik { border-color: rgba(253, 230, 138, .24); background: rgba(180, 83, 9, .12); }
[data-bs-theme="dark"] .ksp-ck-eksik__head h2, [data-bs-theme="dark"] .ksp-ck-eksik__txt b { color: #fafaf9; }
[data-bs-theme="dark"] .ksp-ck-eksik__list a, [data-bs-theme="dark"] .ksp-ck-eksik__gor { border-color: rgba(255, 255, 255, .12); background: var(--ksp-surface, #1c1917); color: #fafaf9; }
@media (max-width: 575px) { .ksp-ck-eksik__gor { width: 100%; justify-content: center; } }
/* @kokpit-eksik-son */

/* ---------- @kokpit-muzik — Salon Kokpiti > Müzik Yönetimi (KARARLAR §37) ---------- */
.ksp-muz-row__ico { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 11px; background: var(--adm-bg); color: var(--adm-muted); }
.ksp-muz-row__ico.is-spotify { background: #e6f9ef; color: #0f9d58; }
.ksp-muz-row__ico.is-youtube { background: #fff1f2; color: #ec003f; }
.ksp-muz-form { display: flex; flex-direction: column; gap: 10px; padding: 18px 20px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); }
.ksp-muz-form h2 { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--adm-ink); font-size: .95rem; font-weight: 800; }
.ksp-muz-form h2 .material-symbols-rounded { font-size: 19px; color: var(--adm-rose); }
.ksp-muz-form .ksp-mag-btn { align-self: flex-start; }
.ksp-muz-plat { padding: 18px 20px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card-2); }
.ksp-muz-plat h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 3px; color: var(--adm-ink); font-size: .92rem; font-weight: 800; }
.ksp-muz-plat h2 .material-symbols-rounded { font-size: 18px; color: var(--adm-muted); }
.ksp-muz-plat > p { margin: 0 0 12px; color: var(--adm-muted); font-size: .78rem; }
.ksp-muz-plat ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.ksp-muz-plat li { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid var(--adm-line); border-radius: 11px; background: var(--adm-card); font-size: .78rem; }
.ksp-muz-plat li .material-symbols-rounded { font-size: 16px; color: var(--adm-muted); }
.ksp-muz-plat li b { flex: 1 1 auto; color: var(--adm-ink); font-weight: 700; }
.ksp-muz-plat li span { color: var(--adm-muted); font-size: .72rem; }
/* @kokpit-muzik-son */

/* ---------- @yonetim-reklam — Süper Admin > Gelir > Sponsorlu Reklamlar (KARARLAR §42) ----------
   Kampanyayı işletme açar; bu ekran gelir + denetim masası. Tablo iskeleti şube/magazin matrisiyle
   ortak (.ksp-sp-net__table), buradaki kurallar yalnız reklam sütunlarına özgü. */
/* @yonetim-reklam-son */

/* ---------- @panel-reklam — Reklam & Öne Çıkma (KARARLAR §42.11) ----------
   Salon kokpiti ve bireysel uzman paneli AYNI ekranı kullanır. Token'lar admin kitinden gelir
   (kapsam yukarıda genişletildi); buradaki kurallar reklam ekranına özgüdür. */

/* Tanıtım şeridi */

/* Göstergeler */

/* Bölüm başlıkları */

/* Kampanya kartları */
/* Künye iki satırlık yer tutar: kısa hedefli kartta da alt bölümler aynı hizada başlar */
/* Uyarı satırı yoksa yerini boş bırakmaz; ızgara satırı kendiliğinden kapanır */

/* Günlük performans */

/* Form */
/* Alanların ızgaradaki yeri: 12 sütun üzerinden sabit — her satır tam dolar, kutular aynı hizada başlar */

/* Süper Admin > Reklam Ayarları */

/* Alanlara göre getiri (sahip isteği 2026-09-25, §42.21): hangi alan ne getirdi.
   Zemin tokenları --adm-card / --adm-card-2; --adm-soft METİN rengidir, zemin yapılmaz (§42.16 kök nedeni). */
/* ---------- @hakkinda-duzen — "Hakkında" paneli tek ızgara, tek kart dili (sahip, 2026-09-26) ----------
   Sorun: panelde iki ayrı kart sistemi yan yanaydı (.ksp-sp-card 20px/16r gölgeli, .ksp-stfp-card
   26px/18r gölgesiz) ve personel blokları ızgaranın dışına eklendiği için boşluklar tutmuyordu.
   Çözüm: personel kartları ana sütunun ızgara öğesi oldu; kabuk ölçüleri burada eşitlenir. */
.ksp-sp-panel .ksp-stfp-card { padding: 20px 22px; border: 1px solid #e7e5e4; border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(28, 25, 23, .05); }
/* Başlık bloğu: salon kartının başlık ölçüsüyle aynı hizaya gelir, ayraç inceltilir */
.ksp-sp-panel .ksp-stfp-head { padding-bottom: 12px; margin-bottom: 14px; border-bottom: 1px solid #f5f5f4; }
.ksp-sp-panel .ksp-stfp-eyebrow { margin: 0 0 4px; color: #a8a29e; font-size: .64rem; font-weight: 800; letter-spacing: .08em; }
.ksp-sp-panel .ksp-stfp-h2 { margin: 0; font-size: 15px; font-weight: 800; line-height: 1.35; letter-spacing: -.01em; color: #1c1917; }
.ksp-sp-panel .ksp-stfp-head__lead { margin: 5px 0 0; font-size: .78rem; line-height: 1.5; }
/* İç ritim: her blok aynı üst boşlukla başlar (12px), yapışık durmaz */
.ksp-sp-panel .ksp-stfp-bio { margin: 0; padding: 14px 16px; border-radius: 12px; font-size: .86rem; line-height: 1.7; }
.ksp-sp-panel .ksp-stfp-empty { margin: 0; padding: 14px 16px; border: 1px dashed #e7e5e4; border-radius: 12px; color: #78716c; font-size: .82rem; text-align: center; }
.ksp-sp-panel .ksp-stfp-quote { margin: 12px 0 0; padding: 12px 14px; font-size: .84rem; }
.ksp-sp-panel .ksp-stfp-feats { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin: 12px 0 0; }
.ksp-sp-panel .ksp-stfp-feats > li { padding: 12px 14px; border-radius: 12px; background: #fafaf9; }
.ksp-sp-panel .ksp-stfp-label { margin: 16px 0 8px; color: #a8a29e; font-size: .64rem; font-weight: 800; letter-spacing: .08em; }
.ksp-sp-panel .ksp-stfp-tags { gap: 7px; }
.ksp-sp-panel .ksp-stfp-works { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin: 0; }
/* Sağ ray: üç kart da AYNI kabukta (dolgu / köşe / gölge). "Küçültme" yalnız olanak SATIRLARINDA:
   kart komşularıyla aynı, içindeki liste ince (sahip, 2026-09-26: "Servis Bölgesi gibi olsun"). */
@media (max-width: 767.98px) {
    .ksp-sp-panel .ksp-stfp-card { padding: 16px 16px; }
    .ksp-sp-panel .ksp-stfp-works { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); }
}
/* @hakkinda-duzen-son */
/* @panel-reklam-son */

/* @ayar-web-kilit — Web adresi alanı: otomatik, salt-okunur, kopyalanabilir (KARARLAR §42.19) */
.ksp-set-locked { position: relative; display: flex; align-items: center; }
.ksp-set-locked .ksp-set-input { padding-inline-end: 42px; background: var(--adm-card-2, #fafaf9); color: var(--adm-soft); cursor: default; }
.ksp-set-copy { position: absolute; inset-inline-end: 5px; display: grid; place-items: center; width: 30px; height: 30px;
    border: 0; border-radius: 8px; background: transparent; color: var(--adm-muted); cursor: pointer; transition: background .14s, color .14s; }
.ksp-set-copy:hover { background: var(--adm-line-2, #f0efee); color: var(--adm-ink); }
.ksp-set-copy.is-done { color: #047857; }
.ksp-set-copy .material-symbols-rounded { font-size: 18px; }
.ksp-set-help { display: flex; align-items: center; gap: 5px; margin: 5px 0 0; color: var(--adm-muted); font-size: .76rem; }
.ksp-set-help .material-symbols-rounded { font-size: 15px; }

/* @kadro-kart-kalp — Favori kalbi kartın sağ üst köşesinde duruyor ve puan bloğunun üstüne biniyordu
   (sahip bildirimi 2026-09-25). Üst şeride kalp kadar sağ boşluk verilir; puan ve "N Yorum" metni
   kalbin soluna oturur, satır kırılmaz. */
.ksp-tm-x .ksp-expert__top { padding-inline-end: 42px; }
.ksp-tm-x .ksp-expert__rating { flex-shrink: 0; align-items: flex-end; text-align: end; }
.ksp-tm-x .ksp-expert__rating .ksp-rate,
.ksp-tm-x .ksp-expert__rating small { white-space: nowrap; }
.ksp-tm-x .ksp-expert__rating small { font-size: .68rem; line-height: 1.25; }
/* Ad ve unvan da kalbin altına girmesin */
.ksp-tm-x .ksp-expert__info { min-width: 0; }
.ksp-tm-x .ksp-expert__info h3 { overflow-wrap: anywhere; }

/* @sadakat-sekme-sigdir — Beş sekme dar panelde sığmıyor, yatay kaydırma çubuğu çıkıyor ve son sekme
   kesiliyordu (sahip bildirimi 2026-09-25). Şerit KADEMELİ sıkışır; kaydırma gerekirse çubuk gizli
   kalır ama kaydırma çalışmaya devam eder (dokunmatikte ve tekerlekle). */
.ksp-loy-tabs { scrollbar-width: none; -ms-overflow-style: none; }
.ksp-loy-tabs::-webkit-scrollbar { height: 0; }
@media (max-width: 1600px) {
    .ksp-loy-tab { padding: 10px 11px; gap: 6px; font-size: .8rem; }
    .ksp-loy-tab .material-symbols-rounded { font-size: 18px; }
}
/* Panel şeridi ≈ pencere − 350 px (sol menü). 1450 px altında beş sekme ancak ikonlar düşerse sığar. */
@media (max-width: 1450px) {
    .ksp-loy-tab { padding: 10px 10px; gap: 5px; font-size: .78rem; }
    .ksp-loy-tab .material-symbols-rounded { display: none; }
    .ksp-loy-tab b { padding: 1px 6px; font-size: .65rem; }
}
/* Daha dar panelde sekmeler ESNER ve uzun ad üç noktayla kısalır — şerit asla taşmaz.
   Tam ad başlık (title) olarak kalır; sayaç rozeti kısalmaz. */
@media (max-width: 1400px) {
    .ksp-loy-tabs { gap: 2px; }
    .ksp-loy-tab { flex: 1 1 auto; min-width: 0; justify-content: center; padding: 9px 8px; gap: 4px; font-size: .74rem; }
    .ksp-loy-tab > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .ksp-loy-tab b { flex-shrink: 0; }
}
@media (max-width: 1000px) {
    .ksp-loy-tab { padding: 9px 7px; font-size: .72rem; }
    .ksp-loy-tab b { padding: 1px 5px; font-size: .62rem; }
}

/* @yonetim-kadrodan-kaldir — Yönetim detayında "Kadrodan Kaldır" (KARARLAR §27.1).
   "Personele Geri Taşı"nın yanında ama ayırt edilsin diye kırmızı çerçeveli. */
.ksp-mgd-del { display: inline-flex; align-items: center; gap: 5px; height: 34px; padding: 0 12px;
    border: 1px solid var(--adm-rose-line, #ffccd3); border-radius: 10px; background: var(--adm-rose-bg, #fff1f2);
    color: var(--adm-rose-ink, #c70036); font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer;
    transition: background .14s, border-color .14s; }
.ksp-mgd-del:hover { border-color: #ec003f; background: #ffe4e9; }
.ksp-mgd-del .material-symbols-rounded { font-size: 17px; }

/* @uzman-hero-fon — Tanıtım şeridinin fonunda bölüme göre portre + karartma (sahip isteği 2026-09-25).
   Görsel sağda durur (portreler zaten sağ yaslı), soldan sağa açılan koyu perde yazıların okunmasını
   garantiler. Şerit bu sayfada koyu temaya döner; içindeki çip ve metin renkleri buna göre ayarlanır. */
.ksp-stfp-hero--fon {
    border-color: rgba(255, 255, 255, .10);
    background-color: #0c0a09;
    background-repeat: no-repeat;
    background-position: center right;
    background-size: cover;
    color: #fafaf9;
}
.ksp-stfp-hero--fon.is-kadin {
    background-image:
        linear-gradient(100deg, rgba(12, 10, 9, .97) 0%, rgba(12, 10, 9, .92) 38%, rgba(12, 10, 9, .62) 68%, rgba(12, 10, 9, .38) 100%),
        url('../img/uzman-fon-kadin.webp');
}
.ksp-stfp-hero--fon.is-erkek {
    background-image:
        linear-gradient(100deg, rgba(12, 10, 9, .97) 0%, rgba(12, 10, 9, .92) 38%, rgba(12, 10, 9, .62) 68%, rgba(12, 10, 9, .38) 100%),
        url('../img/uzman-fon-erkek.webp');
}
/* Koyu zeminde okunurluk: çipler, ad, unvan ve künye satırı */
.ksp-stfp-hero--fon .ksp-stfp-chip { border-color: rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .10); color: #e7e5e4; }
.ksp-stfp-hero--fon .ksp-stfp-chip.is-violet { border-color: rgba(196, 181, 253, .34); background: rgba(167, 139, 250, .20); color: #ddd6fe; }
.ksp-stfp-hero--fon .ksp-stfp-chip.is-violet .material-symbols-rounded { color: #ddd6fe; }
.ksp-stfp-hero--fon .ksp-stfp-hero__name { color: #fff; }
.ksp-stfp-hero--fon .ksp-stfp-hero__sex { background: rgba(255, 32, 86, .22); color: #ffa2b8; }
.ksp-stfp-hero--fon .ksp-stfp-hero__title { color: #ff7a94; }
.ksp-stfp-hero--fon .ksp-stfp-hero__meta,
.ksp-stfp-hero--fon .ksp-stfp-hero__head { color: #d6d3d1; }
/* Salon logosu koyu zeminde beyaz silüete döner (eski koyu tasarımdaki davranış) */
.ksp-stfp-hero--fon .ksp-stfp-hero__brand img { opacity: .13; filter: grayscale(1) brightness(0) invert(1); }
.ksp-stfp-hero--fon .ksp-stfp-hero__brandText { color: rgba(255, 255, 255, .08); }
/* BİREYSEL UZMAN tanıtım sayfası (sahip, 2026-09-26: "resim ve logo yansımıyor"). Uzmanın görseli çoğu zaman
   BEYAZ ZEMİNLİ kare logo; yukarıdaki brightness(0) invert(1) opak zemini de beyaza boyar → gri kutu çıkar.
   Burada ters çevir + screen karışımı: beyaz zemin siyaha döner ve fonda görünmez, çizim açık filigran kalır.
   Karışım span'de (z-index:0 yığın bağlamı; img'de olsa span içinde yalıtılır). SALON PERSONELİ DEĞİŞMEZ. */
/* Portre yedeği logo alanından geldiyse kırpılmadan sığar (kare logo 4:5 kartta yazısı kesilmesin) */
.ksp-stfp-photo__img.is-logo { background-color: #fff; background-size: contain; }
/* Dar ekranda metin görselin üstüne biner: perde koyulaşır, görsel sağ üstte kalır */
@media (max-width: 767.98px) {
    .ksp-stfp-hero--fon { background-position: 72% center; }
    .ksp-stfp-hero--fon.is-kadin {
        background-image:
            linear-gradient(170deg, rgba(12, 10, 9, .80) 0%, rgba(12, 10, 9, .93) 46%, rgba(12, 10, 9, .97) 100%),
            url('../img/uzman-fon-kadin.webp');
    }
    .ksp-stfp-hero--fon.is-erkek {
        background-image:
            linear-gradient(170deg, rgba(12, 10, 9, .80) 0%, rgba(12, 10, 9, .93) 46%, rgba(12, 10, 9, .97) 100%),
            url('../img/uzman-fon-erkek.webp');
    }
}

/* @uzman-hero-okunur — Koyu fonlu şeritte imza teknik çipleri beyaz zemin + beyaz yazı olduğu için
   okunmuyordu (sahip bildirimi 2026-09-25). Koyu zemine uygun renklere çevrildi. */
.ksp-stfp-hero--fon .ksp-stfp-tags > li {
    border-color: rgba(255, 255, 255, .22);
    background: rgba(255, 255, 255, .10);
    color: #f5f5f4;
    backdrop-filter: blur(3px);
}
.ksp-stfp-hero--fon .ksp-stfp-tags > li.is-more { background: rgba(255, 255, 255, .16); color: #fff; }
.ksp-stfp-hero--fon .ksp-stfp-tags__mark { color: #ffc9d5; }
.ksp-stfp-hero--fon .ksp-stfp-tags .material-symbols-rounded { color: #6ee7b7; }
/* Unvan satırı: erkek fonunda beyaz, kadın fonunda pembe kalır (sahip kararı 2026-09-25) */
.ksp-stfp-hero--fon.is-erkek .ksp-stfp-hero__title { color: #ffffff; }
.ksp-stfp-hero--fon.is-kadin .ksp-stfp-hero__title { color: #ff7a94; }

/* @yonetim-hero-fon — Yönetim şeridinin fonunda salonun kendi banner'ı + karartma (sahip isteği
   2026-09-25). Görsel satır içi --mg-fon değişkeniyle gelir; banner yoksa şerit eski açık hâlinde kalır. */
.ksp-mgp-hero.has-fon {
    border-color: rgba(255, 255, 255, .10);
    background:
        linear-gradient(100deg, rgba(12, 10, 9, .96) 0%, rgba(12, 10, 9, .90) 40%, rgba(12, 10, 9, .66) 72%, rgba(12, 10, 9, .48) 100%),
        var(--mg-fon) center / cover no-repeat,
        #0c0a09;
    color: #fafaf9;
}
/* Koyu zeminde künye, ad, rozet ve metinler */
.ksp-mgp-hero.has-fon .ksp-mgp-eyebrow { color: #d6d3d1; }
.ksp-mgp-hero.has-fon .ksp-mgp-eyebrow .material-symbols-rounded { color: #ff7a94; }
.ksp-mgp-hero.has-fon .ksp-mgp-name { color: #fff; }
/* Unvan, söz ve tanıtım koyu zeminde beyaz (sahip 2026-09-25) */
.ksp-mgp-hero.has-fon .ksp-mgp-title { color: #ffffff; }
.ksp-mgp-hero.has-fon .ksp-mg-quote,
.ksp-mgp-hero.has-fon .ksp-mg-quote p { color: #f5f5f4; }
.ksp-mgp-hero.has-fon .ksp-mgp-bio,
.ksp-mgp-hero.has-fon .ksp-mgp-bio p { color: #d6d3d1; }
/* Rozetler: beyaz zemin yerine koyu cam; yazı ve ikon beyaz */
.ksp-mgp-hero.has-fon .ksp-mg-badge,
.ksp-mgp-hero.has-fon .ksp-mgp-chip { border: 1px solid rgba(255, 255, 255, .26); background: rgba(255, 255, 255, .12); color: #ffffff; }
.ksp-mgp-hero.has-fon .ksp-mg-badge .material-symbols-rounded,
.ksp-mgp-hero.has-fon .ksp-mgp-chip .material-symbols-rounded { color: #ffd166; }
/* Eylem düğmeleri ve sosyal ikonlar koyu zemine uyar */
.ksp-mgp-hero.has-fon .ksp-mg-btn--line { border-color: rgba(255, 255, 255, .26); background: rgba(255, 255, 255, .10); color: #ffffff; }
.ksp-mgp-hero.has-fon .ksp-mg-btn--line:hover { border-color: rgba(255, 255, 255, .45); background: rgba(255, 255, 255, .18); color: #fff; }
.ksp-mgp-hero.has-fon .ksp-mgp-social a { border-color: rgba(255, 255, 255, .26); background: rgba(255, 255, 255, .10); color: #ffffff; }
.ksp-mgp-hero.has-fon .ksp-mgp-social a:hover { border-color: rgba(255, 255, 255, .45); color: #fff; }
/* Dar ekranda perde dikey ve daha koyu — metin banner'ın üstüne biniyor */
@media (max-width: 767.98px) {
    .ksp-mgp-hero.has-fon {
        background:
            linear-gradient(170deg, rgba(12, 10, 9, .82) 0%, rgba(12, 10, 9, .94) 48%, rgba(12, 10, 9, .97) 100%),
            var(--mg-fon) center / cover no-repeat,
            #0c0a09;
    }
}
/* Şeridin sağında işletme logosu — beyaz silüet (sahip isteği 2026-09-25).
   Uzman profilindeki marka öğesiyle aynı dil: logolar çoğunlukla koyu çizimli olduğu için
   brightness(0) invert(1) hepsini beyaza çevirir; banner yoksa öğe hiç basılmaz. */
.ksp-mgp-hero { position: relative; overflow: hidden; }
.ksp-mgp-hero > * { position: relative; z-index: 1; }
.ksp-mgp-brand {
    position: absolute; inset-block: 0; inset-inline-end: 0; z-index: 0;
    display: grid; place-items: center; width: min(40%, 380px); pointer-events: none;
}
.ksp-mgp-brand img {
    position: absolute; inset: 22px; width: calc(100% - 44px); height: calc(100% - 44px);
    object-fit: contain; object-position: center right;
    opacity: .22; filter: grayscale(1) brightness(0) invert(1);
}
.ksp-mgp-brand__text {
    padding: 18px 20px; color: rgba(255, 255, 255, .13);
    font-size: clamp(1.2rem, 2.8vw, 2.1rem); font-weight: 800; line-height: 1.15;
    text-align: end; letter-spacing: -.02em;
}
@media (max-width: 767.98px) { .ksp-mgp-brand { width: 58%; } .ksp-mgp-brand img { opacity: .14; } }

/* @yonetim-instagram — Süper Admin > Instagram Entegrasyonu (KARARLAR §43).
   Kurulum adımları, kopyalanabilir webhook/OAuth adresleri, bağlı hesap tablosu.
   NOT: --adm-soft bir METİN rengidir, arka plan olarak kullanılmaz. */
.ksp-adm-ig-state { display: inline-flex; align-items: center; gap: 6px; }
.ksp-adm-ig-state .material-symbols-rounded { font-size: 20px; }
.ksp-adm-ig-state.is-on { color: var(--adm-green-ink); }
.ksp-adm-ig-state.is-off { color: var(--adm-muted); }

.ksp-adm-ig-steps { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; counter-reset: igstep; }
.ksp-adm-ig-steps > li { min-width: 0; padding: 14px 16px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius-sm); background: var(--adm-card-2); }
.ksp-adm-ig-steps > li > b { display: block; margin-bottom: 4px; color: var(--adm-ink); font-size: .86rem; font-weight: 800; }
.ksp-adm-ig-steps > li > p { margin: 0; color: var(--adm-ink-2); font-size: .8rem; line-height: 1.6; }
.ksp-adm-ig-steps code { padding: 1px 5px; border-radius: 5px; background: var(--adm-bg); color: var(--adm-ink); font-size: .76rem; font-weight: 700; }
.ksp-adm-ig-steps em { color: var(--adm-ink); font-style: normal; font-weight: 700; }

.ksp-adm-ig-copy { display: flex; gap: 8px; margin: 10px 0 6px; }
.ksp-adm-ig-copy input { flex: 1 1 auto; min-width: 0; font-size: .78rem; }
.ksp-adm-ig-copy .ksp-adm-btn { flex: none; }
.ksp-adm-ig-copy .ksp-adm-btn.is-done { border-color: var(--adm-green-line); background: var(--adm-green-bg); color: var(--adm-green-ink); }

.ksp-adm-ig-flag.is-on { color: var(--adm-green-ink); }
.ksp-adm-ig-flag.is-off { color: var(--adm-rose-ink); }

.ksp-adm-ig-tag { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; font-size: .72rem; font-weight: 800; }
.ksp-adm-ig-tag.is-ok { background: var(--adm-green-bg); color: var(--adm-green-ink); }
.ksp-adm-ig-tag.is-warn { background: var(--adm-amber-bg); color: var(--adm-amber-ink); }
.ksp-adm-ig-tag.is-danger { background: var(--adm-rose-bg); color: var(--adm-rose-ink); }

.ksp-adm-ig-table { margin-top: 4px; overflow-x: auto; }
.ksp-adm-ig-table table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.ksp-adm-ig-table th { padding: 8px 10px; border-bottom: 1px solid var(--adm-line); color: var(--adm-muted); font-size: .72rem; font-weight: 800; text-align: start; white-space: nowrap; }
.ksp-adm-ig-table td { padding: 10px; border-bottom: 1px solid var(--adm-line-2); color: var(--adm-ink-2); vertical-align: top; }
.ksp-adm-ig-table tr:last-child td { border-bottom: 0; }
.ksp-adm-ig-table td b { display: block; color: var(--adm-ink); font-weight: 800; }
.ksp-adm-ig-table td small { display: block; margin-top: 2px; color: var(--adm-muted); font-size: .7rem; }
.ksp-adm-ig-table .ksp-adm-badge { margin-top: 4px; }
@media (max-width: 767.98px) {
    .ksp-adm-ig-copy { flex-direction: column; }
    .ksp-adm-ig-copy .ksp-adm-btn { width: 100%; }
}

/* @panel-instagram — Salon kokpiti / uzman paneli > Instagram Mesajları (KARARLAR §43).
   Bağlantı kartı, konuşma listesi, sohbet, cevap formu ve randevuya çevirme formu.
   Token ailesi panelin kendisinden (--ksp-*); marka rengi yalnız bağlan / gönder düğmesinde. */
.ksp-ig { display: flex; flex-direction: column; gap: 16px; }
.ksp-ig-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; clip-path: inset(50%); overflow: hidden; white-space: nowrap; }

.ksp-ig-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); }
.ksp-ig-head h1 { margin: 0; font-size: 1.15rem; font-weight: 800; color: var(--ksp-text); }
.ksp-ig-head p { margin: 6px 0 0; max-width: 62ch; color: var(--ksp-muted); font-size: .82rem; line-height: 1.55; }
.ksp-ig-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 20px; margin: 0; }
.ksp-ig-stats dt { color: var(--ksp-muted); font-size: .68rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.ksp-ig-stats dd { margin: 2px 0 0; font-size: 1.05rem; font-weight: 800; color: var(--ksp-text); }
.ksp-ig-stats dd.is-amber { color: #b45309; }
.ksp-ig-stats dd.is-green { color: #15803d; }

/* Düğmeler */
.ksp-ig-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 0 16px; border: 1px solid transparent; border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-text); font-family: inherit; font-size: .84rem; font-weight: 700; text-decoration: none; cursor: pointer; }
.ksp-ig-btn .material-symbols-rounded { font-size: 19px; }
.ksp-ig-btn--brand { border: 0; background: linear-gradient(115deg, #8134af 0%, #dd2a7b 55%, #f58529 100%); color: #fff; }
.ksp-ig-btn--brand:hover { filter: brightness(1.07); }
.ksp-ig-btn--line { border-color: var(--ksp-border); background: var(--ksp-surface); }
.ksp-ig-btn--ghost { background: transparent; color: var(--ksp-muted); }
.ksp-ig-btn--ghost:hover { color: var(--ksp-text); }
.ksp-ig-btn:disabled { opacity: .5; cursor: default; }

/* Bağlantı kartı (hesap bağlı değilken) */
.ksp-ig-connect { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 36px 24px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); text-align: center; }
.ksp-ig-connect__mark { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 18px; background: linear-gradient(115deg, #8134af 0%, #dd2a7b 55%, #f58529 100%); color: #fff; font-size: 1.7rem; }
.ksp-ig-connect h2 { margin: 6px 0 0; font-size: 1.05rem; font-weight: 800; color: var(--ksp-text); }
.ksp-ig-connect p { margin: 0; max-width: 58ch; color: var(--ksp-muted); font-size: .84rem; line-height: 1.6; }
.ksp-ig-connect__req { display: flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 12px; background: var(--ksp-surface-2); font-size: .78rem !important; }
.ksp-ig-connect__note { margin-top: 4px !important; font-size: .74rem !important; }
.ksp-ig-connect form { margin-top: 6px; }

/* Bağlı hesap şeridi */
.ksp-ig-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-ig-bar__who { display: flex; align-items: center; gap: 12px; min-width: 0; }
.ksp-ig-bar__who > i { display: grid; place-items: center; width: 38px; height: 38px; flex: none; border-radius: 12px; background: linear-gradient(115deg, #8134af 0%, #dd2a7b 55%, #f58529 100%); color: #fff; font-size: 1.1rem; }
.ksp-ig-bar__who b { display: block; color: var(--ksp-text); font-size: .9rem; font-weight: 800; }
.ksp-ig-bar__who small { display: block; color: var(--ksp-muted); font-size: .74rem; }
.ksp-ig-bar__end { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

.ksp-ig-chip { display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .74rem; font-weight: 700; }
.ksp-ig-chip .material-symbols-rounded { font-size: 17px; }
.ksp-ig-chip.is-amber { background: #fef3c7; color: #92400e; }
.ksp-ig-chip.is-green { background: #dcfce7; color: #15803d; }

.ksp-ig-warn { display: flex; align-items: center; gap: 8px; margin: 0; padding: 10px 14px; border-radius: 12px; background: #fef3c7; color: #92400e; font-size: .8rem; font-weight: 600; line-height: 1.5; }
.ksp-ig-warn small { display: block; opacity: .8; font-weight: 500; }

/* Gelen kutusu ızgarası */
.ksp-ig-grid { display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr); gap: 16px; align-items: start; }
.ksp-ig-list { border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); overflow: hidden; }
.ksp-ig-list ul { display: flex; flex-direction: column; margin: 0; padding: 0; max-height: 70vh; overflow-y: auto; list-style: none; }
.ksp-ig-item { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border-bottom: 1px solid var(--ksp-border); color: var(--ksp-text); text-decoration: none; }
.ksp-ig-list li:last-child .ksp-ig-item { border-bottom: 0; }
.ksp-ig-item:hover { background: var(--ksp-surface-2); }
.ksp-ig-item.is-active { background: rgba(var(--ksp-primary-rgb), .08); box-shadow: inset 3px 0 0 var(--ksp-primary); }
.ksp-ig-item__top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.ksp-ig-item__top b { min-width: 0; font-size: .86rem; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-ig-item__top time { flex: none; color: var(--ksp-muted); font-size: .68rem; font-weight: 600; }
.ksp-ig-item__last { display: flex; align-items: center; gap: 4px; color: var(--ksp-muted); font-size: .78rem; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksp-ig-item__last .material-symbols-rounded { font-size: 15px; }
.ksp-ig-item__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.ksp-ig-badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px; background: var(--ksp-primary); color: #fff; font-size: .66rem; font-weight: 800; }
.ksp-ig-badge.is-green { background: #dcfce7; color: #15803d; }
.ksp-ig-badge .material-symbols-rounded { font-size: 14px; }

/* Sohbet */
.ksp-ig-chat { display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 16px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
.ksp-ig-chat__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid var(--ksp-border); }
.ksp-ig-chat__head b { display: block; color: var(--ksp-text); font-size: .95rem; font-weight: 800; }
.ksp-ig-chat__head small { display: flex; align-items: center; gap: 5px; margin-top: 2px; color: var(--ksp-muted); font-size: .74rem; }
.ksp-ig-chat__head small .material-symbols-rounded { font-size: 16px; }

.ksp-ig-msgs { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; max-height: 52vh; overflow-y: auto; list-style: none; }
.ksp-ig-msg { max-width: 76%; padding: 10px 13px; border-radius: 14px; background: var(--ksp-surface-2); color: var(--ksp-text); font-size: .84rem; line-height: 1.55; }
.ksp-ig-msg p { margin: 0; overflow-wrap: anywhere; }
.ksp-ig-msg.is-out { align-self: flex-end; background: rgba(var(--ksp-primary-rgb), .1); }
.ksp-ig-msg.is-failed { background: #fee2e2; }
.ksp-ig-msg__att { display: flex; align-items: center; gap: 5px; margin-bottom: 4px !important; color: var(--ksp-muted); font-size: .76rem; font-weight: 700; }
.ksp-ig-msg__att .material-symbols-rounded { font-size: 16px; }
.ksp-ig-msg__meta { display: block; margin-top: 5px; color: var(--ksp-muted); font-size: .66rem; font-weight: 600; }
.ksp-ig-msg__meta b { color: #b91c1c; }

.ksp-ig-reply { display: flex; align-items: flex-end; gap: 10px; }
.ksp-ig-reply textarea { flex: 1 1 auto; min-width: 0; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: .85rem; line-height: 1.5; resize: vertical; }
.ksp-ig-reply textarea:focus-visible { outline: 2px solid var(--ksp-primary); outline-offset: 1px; }
.ksp-ig-reply .ksp-ig-btn { flex: none; }

.ksp-ig-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 42px 18px; color: var(--ksp-muted); text-align: center; }
.ksp-ig-empty .material-symbols-rounded { font-size: 34px; opacity: .55; }
.ksp-ig-empty p { margin: 0; max-width: 40ch; font-size: .82rem; line-height: 1.55; }

/* Randevuya çevir */
.ksp-ig-book { display: none; padding: 16px; border: 1px dashed var(--ksp-border); border-radius: 14px; background: var(--ksp-surface-2); }
.ksp-ig-book.is-open { display: block; }
.ksp-ig-book h3 { display: flex; align-items: center; gap: 7px; margin: 0; color: var(--ksp-text); font-size: .92rem; font-weight: 800; }
.ksp-ig-book__lead { margin: 6px 0 12px; color: var(--ksp-muted); font-size: .78rem; line-height: 1.55; }
.ksp-ig-book__errors { margin: 0 0 12px; padding: 10px 14px 10px 30px; border-radius: 12px; background: #fee2e2; color: #991b1b; font-size: .78rem; font-weight: 600; }
.ksp-ig-book__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.ksp-ig-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ksp-ig-field--wide { grid-column: 1 / -1; }
.ksp-ig-field > span { color: var(--ksp-muted); font-size: .72rem; font-weight: 800; }
.ksp-ig-field input, .ksp-ig-field select { min-height: 40px; padding: 0 11px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: .84rem; }
.ksp-ig-book__svc { margin: 14px 0 0; padding: 0; border: 0; }
.ksp-ig-book__svc legend { padding: 0; color: var(--ksp-muted); font-size: .72rem; font-weight: 800; }
.ksp-ig-book__svcs { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 8px; margin-top: 8px; max-height: 210px; overflow-y: auto; }
.ksp-ig-check { display: flex; align-items: flex-start; gap: 8px; padding: 8px 10px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); font-size: .8rem; font-weight: 600; cursor: pointer; }
.ksp-ig-check input { flex: none; width: 16px; height: 16px; margin-top: 2px; accent-color: var(--ksp-primary); }
.ksp-ig-check small { display: block; color: var(--ksp-muted); font-size: .7rem; font-weight: 500; }
.ksp-ig-book__acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }

@media (max-width: 991.98px) {
    .ksp-ig-grid { grid-template-columns: minmax(0, 1fr); }
    .ksp-ig-list ul { max-height: 42vh; }
}
@media (max-width: 575.98px) {
    /* Dar ekranda "Randevuya çevrilen" etiketi iki satıra taşıyordu: uzun kısım gizlenir */
    .ksp-ig-stats__uzun { display: none; }
    .ksp-ig-stats { gap: 10px 12px; }
    .ksp-ig-msg { max-width: 88%; }
    .ksp-ig-reply { flex-direction: column; align-items: stretch; }
    .ksp-ig-reply .ksp-ig-btn { width: 100%; }
}

/* @yonetim-whatsapp — Süper Admin > WhatsApp Cloud API şablon rehberi (KARARLAR §44).
   Şablon adı ile kopyala düğmesi aynı satırda kalır; değişken sırası alt alta okunur. */
.ksp-adm-wa-tpl td { vertical-align: top; }
.ksp-adm-wa-tpl td:nth-child(2) { white-space: nowrap; }
.ksp-adm-wa-tpl td:nth-child(2) code { display: inline-block; padding: 2px 7px; border-radius: 6px; background: var(--adm-bg); font-size: .74rem; font-weight: 700; }
.ksp-adm-wa-tpl td:nth-child(2) .ksp-adm-btn { margin-inline-start: 6px; vertical-align: middle; }
.ksp-adm-wa-tpl td:nth-child(4) { white-space: nowrap; }
.ksp-adm-wa-tpl td:nth-child(4) .ksp-adm-ig-tag { display: flex; width: fit-content; margin-bottom: 4px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .68rem; white-space: nowrap; }
.ksp-adm-wa-tpl td:nth-child(5) { min-width: 240px; }
.ksp-adm-wa-tpl td:nth-child(5) small { color: var(--adm-muted); font-size: .72rem; line-height: 1.5; }

/* @uzman-hakedis — Uzman ↔ Süper Admin hakediş mutabakatı (KARARLAR §66). Görsel dil salon bordro raporundan (.ksp-pay-*). */
/* Uzman Hakedişleri (SA) sıkı düzen — sahip, 2026-09-26: "bu alanları küçült". Yalnız bu iki sayfa; diğer SA ekranları aynen.
   Başlık küçük, 6 özet kartı TEK SATIR (1400 altı 3+3 — 1200'de 6 sütun kart 136 px'e sıkışıyordu —, telefonda 2 sütun). */
/* "Bu ay ödenen" / "Bu ay tahsilat" (ayrı, sahip 2026-09-26): düz blok — flex'te etiket bölünüp tutar sağa itiliyordu */
/* Başlık alanı kartı (sahip, 2026-09-26: "arka planı ekle, boş duruyor") — SA hakediş panosu + döküm sayfası */
/* Açıklama satırı düz akış: flex iken telefonda "periyot · Kasa defteri · İşletme detayı" üç dar sütuna bölünüyordu */
/* SA başlık alanı kartı — TÜM /yonetim sayfaları (sahip, 2026-09-26: "arka plan ekle, boş duruyor"; hakediş sayfalarından sonra
   "hallet"). YALNIZ .ksp-adm'nin DOĞRUDAN çocuğu: hakediş başlığı .ksp-payout-hero içinde kaldığı için eşleşmez (çift kart yok),
   kendi hero'su olan sayfalar (ksp-mag / ksp-kar / ksp-cat / ksp-log) .ksp-adm-head kullanmaz. gap / flex-wrap YAZILMAZ
   (.ksp-adm-ledger .ksp-adm-head ile aynı ağırlıkta; kazanan satır sırasına kalmasın). */
.ksp-adm > .ksp-adm-head { padding: 16px 20px; border: 1px solid var(--adm-line); border-radius: var(--adm-radius); background: var(--adm-card); box-shadow: var(--adm-shadow); }
.ksp-adm > .ksp-adm-head .ksp-adm-back { margin: 0 0 6px; }
.ksp-adm > .ksp-adm-head .ksp-adm-seg { background: var(--adm-card-2); }
/* Çok parçalı alt yazı düz akış (flex iken telefonda dar sütunlara bölünüyordu — hakediş kartındaki düzeltmenin aynısı) */
.ksp-adm > .ksp-adm-head .ksp-adm-head__sub { display: block; line-height: 1.5; }
.ksp-adm > .ksp-adm-head .ksp-adm-head__sub > .material-symbols-rounded { margin-inline-end: 6px; vertical-align: -3px; }
.ksp-adm > .ksp-adm-head .ksp-adm-head__actions { min-width: 0; max-width: 100%; } /* sekme şeridi kartı taşmasın, içinde yana kaysın (telefonda 529 px şerit 358 px kartı aşıyordu) */
@media (max-width: 767.98px) { .ksp-adm > .ksp-adm-head { padding: 14px; } }
/* <ul class="ksp-adm-kpis"> (ayarlar, abonelikler): tarayıcının varsayılan 32 px liste boşluğu özet kartlarını içeri itiyordu */
ul.ksp-adm-kpis { margin: 0; padding: 0; list-style: none; }
/* Hakediş ödeme bilgileri (KARARLAR §66.1) */
/* Hakediş dönem seçici — TEK SATIR (sahip, 2026-09-26: "hap şeridi iki satıra taşıyor, kafa karışıyor"); uzman + Süper Admin ortak */
/* Ödeme bilgileri — İNCE tek satır (sahip, 2026-09-26: "bu alanı küçült"); form yalnız düğmeyle açılır */
/* Telefonda da TEK SATIR (sahip, 2026-09-26): ‹ seçili dönem › ☰ — dönem + durum kutunun içinde alt alta, "Tüm dönemler" simgeye döner.
   Banka satırı iki satır: "Ödeme bilgilerin + durum" / "ad · •••• 1326", Değiştir kalem simgesi. */

/* @site-ayarlari — Süper Admin > Büyüme > Site Ayarları (KARARLAR §70) + vitrine yansıyan parçalar */
/* Vitrin: yüklenen hero görseli (varsayılanla aynı perde; telefonda -sm dosyası) */
/* Vitrin: yüklenen logo simgesi */
.ksp-brand__mark--img { overflow: hidden; background: transparent; box-shadow: none; }
.ksp-brand__mark--img img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
/* Vitrin: footer iletişim + sosyal simgeler */
.ksp-footer__contact { display: grid; gap: .45rem; margin: .9rem 0 0; font-size: .8rem; }
.ksp-footer__contact li { display: flex; align-items: flex-start; gap: .4rem; color: var(--ksp-muted); line-height: 1.45; }
.ksp-footer__contact a { display: inline-flex; align-items: center; gap: .4rem; color: var(--ksp-text); text-decoration: none; }
.ksp-footer__contact a:hover { color: var(--ksp-primary); }
.ksp-footer__contact .material-symbols-rounded, .ksp-footer__contact .bi { flex-shrink: 0; font-size: 16px; line-height: 1.2; color: var(--ksp-primary); vertical-align: 0; }
.ksp-footer__social { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 0; }
.ksp-footer__social a { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-bg); color: var(--ksp-text); font-size: 1rem; text-decoration: none; transition: color .15s, border-color .15s; }
.ksp-footer__social a:hover, .ksp-footer__social a:focus-visible { border-color: var(--ksp-primary); color: var(--ksp-primary); }

/* Yönetim ekranı */
.ksp-adm-site-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; margin-top: 14px; }
.ksp-adm-site-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ksp-adm-site-field:has(textarea) { grid-column: 1 / -1; }
.ksp-adm-site-field .ksp-adm-help { margin: 0; }
.ksp-adm-site-upload { display: flex; align-items: flex-start; gap: 16px; margin-top: 18px; padding: 14px; border: 1px dashed var(--adm-line); border-radius: 12px; background: var(--adm-bg); }
.ksp-adm-site-upload.is-bad { border-color: var(--adm-rose-ink); }
.ksp-adm-site-upload__preview { flex-shrink: 0; overflow: hidden; border: 1px solid var(--adm-line); border-radius: 10px; background: var(--adm-card-2); }
.ksp-adm-site-upload__preview.is-wide { width: 220px; aspect-ratio: 1920 / 900; }
.ksp-adm-site-upload__preview.is-square { width: 88px; aspect-ratio: 1 / 1; }
.ksp-adm-site-upload__preview { position: relative; }
.ksp-adm-site-upload__preview img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ksp-adm-site-upload__preview img[hidden] { display: none; }
.ksp-adm-site-upload__empty { display: none; }
.ksp-adm-site-upload__preview.is-empty { display: grid; place-items: center; background: radial-gradient(55% 60% at 85% 75%, rgba(136, 19, 55, .55), transparent 70%), #1c1917; }
.ksp-adm-site-upload__preview.is-square.is-empty { background: #292524; }
.ksp-adm-site-upload__preview.is-empty .ksp-adm-site-upload__empty { display: block; padding: 0 8px; color: #e7e5e4; font-size: .7rem; font-weight: 700; text-align: center; }
.ksp-adm-site-upload__body { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.ksp-adm-site-upload__body .ksp-adm-help { margin: 0; }
.ksp-adm-site-upload__title { margin: 0; color: var(--adm-ink); font-size: .85rem; font-weight: 800; }
.ksp-adm-site-upload__pick { cursor: pointer; }
.ksp-adm-site-upload__file { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ksp-adm-site-upload__name { color: var(--adm-muted); font-size: .75rem; word-break: break-all; }
.ksp-adm-site-upload__name:empty, .ksp-adm-site-upload [data-site-file-err]:empty { display: none; }
.ksp-adm-site-secs { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.ksp-adm-site-sec { padding: 12px 14px; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card); }
.ksp-adm-site-sec.is-off { background: var(--adm-bg); }
.ksp-adm-site-sec.is-off .ksp-adm-site-sec__toggle b { color: var(--adm-muted); }
.ksp-adm-site-sec__toggle span, .ksp-adm-site-sec__fixed span { display: flex; flex-direction: column; gap: 2px; }
.ksp-adm-site-sec__toggle i, .ksp-adm-site-sec__fixed i { color: var(--adm-muted); font-size: .74rem; font-style: normal; font-weight: 500; }
.ksp-adm-site-sec__fixed { display: flex; align-items: flex-start; gap: 8px; margin: 0; color: var(--adm-ink-2); font-size: .82rem; }
.ksp-adm-site-sec__fixed .material-symbols-rounded { flex-shrink: 0; font-size: 16px; color: var(--adm-muted); }
.ksp-adm-site-sec__edit { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--adm-line); }
.ksp-adm-site-sec__edit > summary { display: inline-flex; align-items: center; gap: 4px; color: var(--adm-ink-2); font-size: .76rem; font-weight: 700; list-style: none; cursor: pointer; }
.ksp-adm-site-sec__edit > summary::-webkit-details-marker { display: none; }
.ksp-adm-site-sec__edit > summary .material-symbols-rounded { font-size: 15px; }
.ksp-adm-site-sec__edit .ksp-adm-site-grid { margin-top: 10px; }
.ksp-adm-site-why { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 8px; }
.ksp-adm-site-why__card { display: flex; flex-direction: column; gap: 8px; min-width: 0; margin: 0; padding: 8px 12px 12px; border: 1px solid var(--adm-line); border-radius: 10px; }
.ksp-adm-site-why__card legend { float: none; width: auto; margin: 0; padding: 0 4px; color: var(--adm-muted); font-size: .72rem; font-weight: 800; }
.ksp-adm-site-why__row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 8px; }
.ksp-adm-site-why__title { display: block; margin: 16px 0 0; }
.ksp-adm-site-notes { display: flex; flex-direction: column; gap: 8px; margin: 12px 0 0; padding-inline-start: 18px; color: var(--adm-ink-2); font-size: .8rem; line-height: 1.5; }
.ksp-adm-site-brand { margin-top: 12px; padding: 14px; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--ksp-surface, #fff); }
.ksp-adm-site-brand .ksp-brand { pointer-events: none; }
@media (max-width: 767.98px) {
    .ksp-adm-site-grid,
.ksp-adm-site-why { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575.98px) {
    .ksp-adm-site-upload { flex-direction: column; }
    .ksp-adm-site-upload__preview.is-wide { width: 100%; }
}

/* @site-sayfalar — Site Ayarları > Sayfalar (KARARLAR §70.2): vitrin sayfası + yönetim düzenleyicisi */
/* Ortak gövde: PageMarkup çıktısı (vitrin) ve canlı önizleme (yönetim) aynı görünür; renkler bulunduğu yüzeyden gelir */
.ksp-cms-body { font-size: .95rem; line-height: 1.75; overflow-wrap: anywhere; }
.ksp-cms-body > :first-child { margin-top: 0; }
.ksp-cms-body h2 { margin: 1.8rem 0 .6rem; font-size: 1.25rem; font-weight: 800; letter-spacing: -.02em; scroll-margin-top: 90px; }
.ksp-cms-body h3 { margin: 1.4rem 0 .5rem; font-size: 1.05rem; font-weight: 800; scroll-margin-top: 90px; }
.ksp-cms-body p { margin: 0 0 1rem; }
.ksp-cms-body ul, .ksp-cms-body ol { margin: 0 0 1rem; padding-inline-start: 1.35rem; }
.ksp-cms-body li { margin-bottom: .35rem; }
.ksp-cms-body a { color: var(--ksp-primary, #e11d48); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.ksp-cms-body strong { font-weight: 800; }
/* Vitrin sayfası */
.ksp-cms { max-width: 820px; margin: 0 auto; padding: 24px 16px 56px; }
.ksp-cms__crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-bottom: 14px; color: var(--ksp-muted); font-size: .78rem; }
.ksp-cms__crumbs a { color: var(--ksp-muted); }
.ksp-cms__crumbs .material-symbols-rounded { font-size: 15px; vertical-align: 0; }
.ksp-cms__title { margin: 0 0 6px; font-size: clamp(1.6rem, 4vw, 2.2rem); font-weight: 800; letter-spacing: -.03em; }
.ksp-cms__meta { margin: 0; color: var(--ksp-muted); font-size: .8rem; }
.ksp-cms__head { margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--ksp-border); }
.ksp-cms__admin { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 20px; padding: 10px 14px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); color: var(--ksp-muted); font-size: .8rem; font-weight: 600; }
.ksp-cms__admin.is-draft { border-color: rgba(245, 158, 11, .4); background: var(--ksp-amber-50, #fffbeb); color: #b45309; }
.ksp-cms__admin span { flex: 1; min-width: 180px; }
.ksp-cms__admin a { display: inline-flex; align-items: center; gap: 4px; font-weight: 800; }
.ksp-cms__admin .material-symbols-rounded { font-size: 18px; vertical-align: 0; }
.ksp-cms__contact { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin-bottom: 26px; }
.ksp-cms__cbox { display: flex; align-items: center; gap: 12px; margin: 0; padding: 14px 16px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); color: var(--ksp-text); text-decoration: none; }
a.ksp-cms__cbox:hover { border-color: var(--ksp-primary); }
.ksp-cms__cbox > .material-symbols-rounded, .ksp-cms__cbox > .bi { flex-shrink: 0; color: var(--ksp-primary); font-size: 22px; }
.ksp-cms__cbox span { display: flex; flex-direction: column; min-width: 0; font-size: .88rem; font-weight: 700; overflow-wrap: anywhere; }
.ksp-cms__cbox small { color: var(--ksp-muted); font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.ksp-cms__social { grid-column: 1 / -1; margin: 0; }
/* Sayfa konumu + "Ana sayfaya dön" aynı satırda (sahip, 2026-09-28: dönüş düğmesi üste) */
.ksp-cms__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin-bottom: 16px; }
.ksp-cms__top .ksp-cms__crumbs { margin-bottom: 0; }
.ksp-cms__back { flex-shrink: 0; height: 34px; margin-inline-start: auto; padding: 0 12px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .76rem;
    white-space: nowrap; text-decoration: none; } /* dar ekranda alt satıra düşse de sağda kalır */
.ksp-cms__back:hover, .ksp-cms__back:focus-visible { border-color: var(--ksp-primary); color: var(--ksp-primary); }
.ksp-cms__back .material-symbols-rounded { font-size: 17px; }

/* @site-sayfa-tanitim (KARARLAR §77) — /sayfa/{slug} tanıtım bloğu: solda etiket + başlık + giriş + sayılar, sağda görsel.
   Tanıtımlı sayfa dar metin kutusundan geniş ızgaraya çıkar; sayılar accent renkli ince çizgiyle ayrılır. */
.ksp-cms--intro { max-width: 1180px; padding-bottom: 64px; }
.ksp-pi { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: center; margin-bottom: 34px; }
.ksp-pi__eyebrow { margin-bottom: 12px; }
.ksp-pi__title { margin: 0 0 14px; font-size: clamp(1.5rem, 3.6vw, 2.1rem); font-weight: 800; line-height: 1.22; letter-spacing: -.03em; }
.ksp-pi__lead { color: var(--ksp-muted); font-size: .96rem; line-height: 1.85; }
.ksp-pi__lead > :last-child { margin-bottom: 0; }
.ksp-pi__lead strong { color: var(--ksp-text); }
.ksp-pi__stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 22px; margin: 26px 0 0; }
.ksp-pi__stat { padding-inline-start: 14px; border-inline-start: 2px solid var(--ksp-primary); }
.ksp-pi__value { margin: 0; color: var(--ksp-text); font-size: 1.5rem; font-weight: 800; line-height: 1.2; letter-spacing: -.03em; overflow-wrap: anywhere; }
.ksp-pi__label { margin: 2px 0 0; color: var(--ksp-muted); font-size: .76rem; font-weight: 600; line-height: 1.35; }
.ksp-pi__meta { margin-top: 22px; }
.ksp-pi__media { position: relative; margin: 0; }
.ksp-pi__img { display: block; width: 100%; aspect-ratio: 3 / 2; border-radius: var(--ksp-radius-lg); object-fit: cover; box-shadow: var(--ksp-shadow-lg); }
/* Görselin sağ altından taşan süsleme çerçevesi (referans tasarım) */
.ksp-pi__deco { position: absolute; z-index: -1; inset-block-end: -14px; inset-inline-end: -14px; width: 42%; max-width: 220px; height: 58%;
    border: 2px solid var(--ksp-primary); border-radius: var(--ksp-radius-lg); }
@media (min-width: 992px) {
    .ksp-pi { grid-template-columns: minmax(0, 1.02fr) minmax(0, 1fr); gap: 54px; margin-bottom: 46px; }
    .ksp-cms--intro .ksp-cms-body { max-width: 820px; }
}
/* Tanıtımlı sayfanın alt metni — kartlar + not şeridi (sahip, 2026-09-28: "alt taraflar saçma duruyor"; §77.1) */
.ksp-pi-more { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.ksp-pi-more__intro { margin-bottom: 18px; }
.ksp-pi-card { padding: 24px 24px 22px; border: 1px solid var(--ksp-border); border-radius: var(--ksp-radius-lg); background: var(--ksp-surface); box-shadow: var(--ksp-shadow-sm); }
.ksp-pi-card__icon { display: inline-grid; place-items: center; width: 44px; height: 44px; margin-bottom: 14px; border-radius: 14px;
    background: color-mix(in srgb, var(--ksp-primary) 10%, var(--ksp-surface)); color: var(--ksp-primary); }
.ksp-pi-card__icon .material-symbols-rounded { font-size: 22px; }
.ksp-pi-card__body h2 { margin: 0 0 14px; font-size: 1.15rem; letter-spacing: -.02em; }
.ksp-pi-card__body ul { display: grid; gap: 10px; margin: 0 0 14px; padding: 0; list-style: none; }
.ksp-pi-card__body li { margin: 0; color: var(--ksp-muted); font-size: .92rem; line-height: 1.6; }
.ksp-pi-card__body ul > li { position: relative; padding-inline-start: 28px; }
/* Onay işareti yazı tipi ligatürü değil maske: ekran okuyucu "check_circle" okumaz, simge yazı tipi gelmeden metnin üstüne taşmaz */
.ksp-pi-card__body ul > li::before { content: ""; position: absolute; top: 2px; inset-inline-start: 0; width: 20px; height: 20px; background: #047857;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8.5 12.5 2.5 2.5 5-5.5'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8.5 12.5 2.5 2.5 5-5.5'/%3E%3C/svg%3E") center / contain no-repeat; }
[data-bs-theme="dark"] .ksp-pi-card__body ul > li::before { background: #34d399; }
/* Numaralı liste kendi numarasıyla (onay işareti yalnız madde listesinde; ikisi birden çıkmaz) */
.ksp-pi-card__body ol { display: grid; gap: 10px; margin: 0 0 14px; padding-inline-start: 1.35rem; }
.ksp-pi-card__body ol > li { padding-inline-start: 4px; }
.ksp-pi-card__body ol > li::marker { color: var(--ksp-primary); font-weight: 800; }
.ksp-pi-card__body li strong { color: var(--ksp-text); }
.ksp-pi-card__body p { color: var(--ksp-muted); }
.ksp-pi-card__body > :last-child { margin-bottom: 0; }
.ksp-pi-note { display: flex; align-items: center; gap: 14px; margin-top: 18px; padding: 16px 20px; border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--ksp-primary) 22%, var(--ksp-border)); background: color-mix(in srgb, var(--ksp-primary) 6%, var(--ksp-surface)); }
.ksp-pi-note__icon { display: inline-grid; flex-shrink: 0; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--ksp-primary); color: #fff; }
.ksp-pi-note__icon .material-symbols-rounded { font-size: 20px; }
.ksp-pi-note__body { font-weight: 600; }
.ksp-pi-note__body p { margin: 0 0 .5rem; }
.ksp-pi-note__body > :last-child { margin-bottom: 0; }
@media (min-width: 768px) {
    .ksp-pi-more--2, .ksp-pi-more--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
    .ksp-pi-more--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* 4 kutu yan yana yalnız geniş ekranda: 992–1199 px'te sol sütun dar, "12.400+" gibi değer yan kutuya taşardı */
@media (min-width: 1200px) {
    .ksp-pi__stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 575.98px) {
    .ksp-pi__stats { gap: 14px 16px; }
    .ksp-pi__value { font-size: 1.3rem; }
    .ksp-pi__deco { inset-block-end: -10px; inset-inline-end: -10px; }
}
/* Yönetim: liste */
.ksp-adm-badge--green { border-color: var(--adm-green-line); background: var(--adm-green-bg); color: var(--adm-green-ink); }
.ksp-adm-site-pghead { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ksp-adm-site .ksp-adm-note { margin: 14px 0; }
.ksp-adm-site-pgname { color: var(--adm-ink); text-decoration: none; }
.ksp-adm-site-pgslug { display: block; color: var(--adm-muted); font-size: .72rem; }
.ksp-adm-site-pgact { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
/* Yönetim: düzenleyici */
.ksp-adm-site .ksp-adm-back { margin: 0 0 14px; }
.ksp-adm-site-prefix { display: flex; align-items: stretch; }
.ksp-adm-site-prefix span { display: grid; place-items: center; padding: 0 10px; border: 1px solid var(--adm-line); border-inline-end: 0; border-radius: 10px 0 0 10px; background: var(--adm-card-2); color: var(--adm-muted); font-size: .8rem; font-weight: 700; }
.ksp-adm-site-prefix .ksp-adm-input { min-width: 0; border-radius: 0 10px 10px 0; }
.ksp-adm-site-editor { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-top: 14px; }
.ksp-adm-site-editor__write { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ksp-adm-site-editor__area { min-height: 380px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .82rem; line-height: 1.6; resize: vertical; }
.ksp-adm-site-editor__write .ksp-adm-help { margin: 0; }
.ksp-adm-site-toolbar { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px; border: 1px solid var(--adm-line); border-radius: 10px; background: var(--adm-card-2); }
.ksp-adm-site-toolbar__btn { display: inline-flex; align-items: center; gap: 4px; height: 32px; padding: 0 9px; border: 0; border-radius: 8px; background: transparent; color: var(--adm-ink-2); font-family: inherit; font-size: .74rem; font-weight: 700; cursor: pointer; }
.ksp-adm-site-toolbar__btn:hover, .ksp-adm-site-toolbar__btn:focus-visible { background: var(--adm-card); color: var(--adm-ink); }
.ksp-adm-site-toolbar__btn .material-symbols-rounded { font-size: 18px; }
.ksp-adm-site-editor__preview { display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card-2); }
.ksp-adm-site-editor__label { display: flex; align-items: center; gap: 6px; margin: 0; padding: 10px 14px; border-bottom: 1px solid var(--adm-line); color: var(--adm-muted); font-size: .72rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.ksp-adm-site-editor__label .material-symbols-rounded { font-size: 16px; }
.ksp-adm-site-editor__out { flex: 1; max-height: 560px; padding: 14px 16px; overflow: auto; color: var(--adm-ink); font-size: .86rem; }
.ksp-adm-site-editor__out a { color: var(--adm-rose-ink); }
.ksp-adm-site-pgopts { display: flex; flex-direction: column; gap: 10px; margin: 14px 0; }
.ksp-adm-site-pg .ksp-adm-btn--block + .ksp-adm-btn--block { margin-top: 8px; }
.ksp-adm-site-upload__preview.is-page { width: 180px; aspect-ratio: 3 / 2; }
.ksp-adm-site-field--wide { grid-column: 1 / -1; }
.ksp-adm-site-stats__head { margin: 18px 0 0; }
.ksp-adm-site-stats { display: grid; gap: 10px; margin-top: 10px; }
.ksp-adm-site-stat { display: grid; grid-template-columns: minmax(0, 240px) minmax(0, 96px) minmax(0, 1fr); gap: 8px; }
/* Canlı kaynakta değer sunucuda yok sayılır: kutu soluk görünür (elle yazılan değer seçilince açılır) */
.ksp-adm-site-stat:not(:has(option[value="elle"]:checked)) [data-stat-value] { opacity: .45; }
@media (max-width: 767.98px) { .ksp-adm-site-stat { grid-template-columns: minmax(0, 1fr); } }
.ksp-adm-site-guide code { padding: 1px 5px; border-radius: 5px; background: var(--adm-card-2); color: var(--adm-ink); font-size: .74rem; }
.ksp-adm-site-pgdel { display: flex; justify-content: flex-end; margin-top: 16px; }
@media (max-width: 1199.98px) {
    .ksp-adm-site-editor { grid-template-columns: minmax(0, 1fr); }
    .ksp-adm-site-editor__out { max-height: 420px; }
}
@media (max-width: 575.98px) {
    .ksp-adm-site-toolbar__btn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .ksp-adm-site-editor__area { min-height: 280px; }
}

/* Yönetim: tanıtım sekmesi + Planlar */

/* @yonetim-satir — tanıtım avantaj kartları: ekle / kaldır (KARARLAR §70.5) */
.ksp-adm-site-why__card { position: relative; }
.ksp-adm-site-why__card .ksp-adm-site-why__row { padding-inline-end: 34px; }

/* @marka-beyaz — logonun koyu zemin hali (partials/brand; sahip, 2026-09-26: "logo siyah alanda beyaz olsun, görünmüyor").
   Beyaz tek renk dosya Site Ayarları > Marka'da yüklenirken üretilir (Admin\Site\LogoWhite); yoksa renkli logo kalır. */
.ksp-brand__mark--img .ksp-brand__logo--white { display: none; }
:is(.ksp-brand--light, .ksp-site--home .ksp-header:not(.is-scrolled) .ksp-brand, [data-bs-theme="dark"] .ksp-brand) .has-white .ksp-brand__logo { display: none; }
:is(.ksp-brand--light, .ksp-site--home .ksp-header:not(.is-scrolled) .ksp-brand, [data-bs-theme="dark"] .ksp-brand) .has-white .ksp-brand__logo--white { display: block; }

/* @abonelik-secenek — ödeme ekranlarında Aylık / Yıllık + kupon + döküm + iade garantisi (partials/billing-quote; KARARLAR §73).
   Kayıt 3. adımı (.ksp-su) ve kokpit Abonelik & Ödeme (.ksp-sub) aynı blok. */
/* Kokpit: iade talebi kutusu */
/* Süper Admin > Kuponlar */
.ksp-adm-input.is-invalid { border-color: var(--ksp-danger); }
/* Belgeler: 72 saat evrak kuralıyla kapatılan vitrin uyarısı (KARARLAR §74) */

/* ==========================================================================
   Süper Admin > İçe Aktarma (Markdown) + Blog Yazıları (KARARLAR §75)
   ========================================================================== */
.ksp-adm-imp .ksp-adm-head__title { display: flex; align-items: center; gap: .5rem; }
.ksp-adm-imp .ksp-adm-head__title .material-symbols-rounded { font-size: 1.5rem; }
.ksp-adm-imp .ksp-adm-head__sub { display: block; line-height: 1.5; }
.ksp-adm-imp code { padding: .05rem .35rem; border-radius: 6px; background: var(--adm-card-2); color: var(--adm-ink-2); font-size: .82em; }
.ksp-adm-imp__tabs { margin: 0 0 16px; }
.ksp-adm-imp__tabs a { display: inline-flex; align-items: center; gap: 4px; }
.ksp-adm-imp__tabs .material-symbols-rounded { font-size: 17px; }
.ksp-adm-imp > .ksp-adm-card + .ksp-adm-card, .ksp-adm-imp > .ksp-adm-note + .ksp-adm-card { margin-top: 16px; }
.ksp-adm-imp__card { scroll-margin-top: 80px; }
.ksp-adm-imp__card form { display: flex; flex-direction: column; gap: 18px; margin: 0; }
.ksp-adm-imp__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; }
.ksp-adm-imp__pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 6px; }
.ksp-adm-imp__src { min-height: 300px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .8rem; line-height: 1.65; resize: vertical; tab-size: 2; }
.ksp-adm-imp__file { padding: 8px 10px; cursor: pointer; }
.ksp-adm-imp__current { display: inline-flex; align-items: center; gap: 4px; width: fit-content; color: var(--adm-blue); font-size: .78rem; font-weight: 700; text-decoration: none; }
.ksp-adm-imp__current:hover { text-decoration: underline; }
.ksp-adm-imp__current .material-symbols-rounded { font-size: 17px; }
.ksp-adm-imp__current.is-off { color: var(--adm-faint); pointer-events: none; }
.ksp-adm-imp__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 4px; }
.ksp-adm-imp__actions .ksp-adm-help { margin: 0; }
.ksp-adm-imp__preview { margin-top: 16px; scroll-margin-top: 80px; outline: none; }
.ksp-adm-imp__preview .ksp-adm-note { margin-bottom: 14px; }
.ksp-adm-imp__diff th[scope="row"] { width: 180px; color: var(--adm-ink); font-weight: 700; white-space: nowrap; }
.ksp-adm-imp__diff td { vertical-align: top; overflow-wrap: anywhere; }
.ksp-adm-imp__diff tr.is-keep td, .ksp-adm-imp__diff tr.is-same td { color: var(--adm-muted); }
.ksp-adm-imp__empty { color: var(--adm-faint); }
.ksp-adm-imp__len { display: block; margin-top: 2px; color: var(--adm-faint); font-size: .7rem; }
.ksp-adm-imp__h { margin: 22px 0 10px; color: var(--adm-ink); font-size: .92rem; font-weight: 800; }
.ksp-adm-imp__render { max-height: 560px; overflow: auto; padding: 18px 20px; border: 1px dashed var(--adm-line); border-radius: var(--adm-radius-sm); background: var(--adm-card-2); color: var(--adm-ink); }
.ksp-adm-imp__render .ksp-cms-body a { color: var(--adm-blue); }
.ksp-adm-imp__title { margin: 0 0 6px; font-size: 1.35rem; font-weight: 800; letter-spacing: -.02em; }
.ksp-adm-imp__lead { margin: 0 0 16px; color: var(--adm-muted); }
.ksp-adm-imp__faq { display: grid; gap: 10px; margin: 0 0 8px; padding-inline-start: 22px; }
.ksp-adm-imp__faq strong { color: var(--adm-ink); }
.ksp-adm-imp__faq span { display: block; margin-top: 2px; color: var(--adm-muted); font-size: .84rem; line-height: 1.55; }
.ksp-adm-imp__help { margin-top: 16px; }
.ksp-adm-imp .ksp-adm-site-pgact form { display: inline-flex; margin: 0; }
@media (max-width: 767.98px) {
  .ksp-adm-imp__grid, .ksp-adm-imp__pair { grid-template-columns: 1fr; }
  .ksp-adm-imp__diff th[scope="row"] { width: auto; white-space: normal; }
}

/* ==========================================================================
   Platform blogu (/blog, /blog/{slug}) + kategori sayfası rehber / SSS / yazılar (KARARLAR §75)
   Tasarım 2 (sahip referansı 2026-09-27): koyu başlık bandı + breadcrumb, meta satırı, sol çizgili özet, sol vurgulu H2,
   sağda gruplu "Kategoriler" + "Bu yazıda"; kapaksız kartta degrade yer tutucu.
   ========================================================================== */
/* Koyu başlık bandı (açık / koyu temada aynı) */
.ksp-bh { position: relative; overflow: hidden; color: #fafaf9;
  background: radial-gradient(900px 340px at 88% -30%, rgba(var(--ksp-primary-rgb, 225, 29, 72), .38), transparent 62%),
    radial-gradient(640px 280px at -5% 130%, rgba(245, 158, 11, .16), transparent 60%),
    linear-gradient(135deg, #0c0a09 0%, #1c1917 55%, #111827 100%); }
.ksp-bh::after { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px);
  background-size: 22px 22px; -webkit-mask-image: linear-gradient(180deg, #000, transparent 85%); mask-image: linear-gradient(180deg, #000, transparent 85%); }
.ksp-bh__inner { position: relative; z-index: 1; padding-top: clamp(34px, 6vw, 64px); padding-bottom: clamp(30px, 5vw, 54px); }
.ksp-bh__top { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 14px; }
.ksp-bh__eyebrow { display: inline-flex; align-items: center; gap: 6px; color: #fda4af; font-size: .74rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.ksp-bh__eyebrow .material-symbols-rounded { font-size: 18px; }
.ksp-bh__chip { display: inline-flex; align-items: center; padding: 4px 12px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 999px; background: rgba(255, 255, 255, .08); color: #fff; font-size: .75rem; font-weight: 700; text-decoration: none; }
.ksp-bh__chip:hover { background: rgba(255, 255, 255, .16); color: #fff; }
.ksp-bh__title { max-width: 940px; margin: 0; color: #fff; font-size: clamp(1.7rem, 4.2vw, 2.7rem); font-weight: 800; letter-spacing: -.035em; line-height: 1.16; text-wrap: balance; }
.ksp-bh__lead { max-width: 720px; margin: 12px 0 0; color: #d6d3d1; font-size: 1rem; line-height: 1.65; }
.ksp-bh__crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 16px; color: #d6d3d1; font-size: .9rem; font-weight: 600; }
.ksp-bh__crumbs a { color: #e7e5e4; text-decoration: none; }
.ksp-bh__crumbs a:hover { color: #fff; text-decoration: underline; }
.ksp-bh__crumbs [aria-current] { color: #fb7185; }
.ksp-bh__sep { color: #78716c; }

/* İki sütun: içerik + kenar çubuğu */
.ksp-bl, .ksp-bp { padding: clamp(26px, 4vw, 44px) 0 64px; }
.ksp-bl__layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 40px; align-items: start; }
.ksp-bl__main, .ksp-bp__main { min-width: 0; }
.ksp-blog__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.ksp-bl__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ksp-blog__rowhead { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 20px; margin-bottom: 20px; }
.ksp-blog__subtitle { margin: 0; color: var(--ksp-text); font-size: clamp(1.25rem, 3vw, 1.6rem); font-weight: 800; letter-spacing: -.02em; }
.ksp-blog__all { display: inline-flex; align-items: center; gap: 4px; color: var(--ksp-primary); font-size: .88rem; font-weight: 700; text-decoration: none; }
.ksp-blog__all .material-symbols-rounded { font-size: 18px; }
.ksp-blog__pages { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px; margin-top: 32px; color: var(--ksp-muted); font-size: .88rem; font-weight: 600; }
.ksp-blog__empty .material-symbols-rounded { font-size: 40px; color: var(--ksp-primary); }
.ksp-blog--related { padding-top: 8px; }
.ksp-bp .ksp-blog--related { margin-top: 40px; padding: 40px 0 0; border-top: 1px solid var(--ksp-border); }

/* Kart */
.ksp-blog-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); box-shadow: var(--ksp-shadow-sm); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.ksp-blog-card:hover { transform: translateY(-3px); border-color: rgba(var(--ksp-primary-rgb, 225, 29, 72), .25); box-shadow: var(--ksp-shadow); }
.ksp-blog-card__media { display: block; aspect-ratio: 1.91 / 1; overflow: hidden; background: var(--ksp-surface-2); }
.ksp-blog-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.ksp-blog-card:hover .ksp-blog-card__media img { transform: scale(1.04); }
.ksp-blog-card__ph { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 100%; overflow: hidden; color: #fff; }
.ksp-blog-card__ph::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255, 255, 255, .16) 1px, transparent 1px); background-size: 18px 18px; -webkit-mask-image: linear-gradient(135deg, #000, transparent 75%); mask-image: linear-gradient(135deg, #000, transparent 75%); }
.ksp-blog-card__ph .material-symbols-rounded { position: relative; z-index: 1; font-size: 44px; opacity: .92; }
.ksp-blog-card__ph em { position: relative; z-index: 1; padding: 0 18px; font-size: .74rem; font-style: normal; font-weight: 800; letter-spacing: .1em; text-align: center; text-transform: uppercase; opacity: .92; }
.ksp-blog-card__ph--1 { background: linear-gradient(135deg, #f43f5e, #9f1239); }
.ksp-blog-card__ph--2 { background: linear-gradient(135deg, #8b5cf6, #4c1d95); }
.ksp-blog-card__ph--3 { background: linear-gradient(135deg, #14b8a6, #134e4a); }
.ksp-blog-card__ph--4 { background: linear-gradient(135deg, #f59e0b, #9a3412); }
.ksp-blog-card__ph--5 { background: linear-gradient(135deg, #334155, #0f172a); }
.ksp-blog-card__ph--6 { background: linear-gradient(135deg, #ec4899, #831843); }
.ksp-blog-card__body { display: flex; flex: 1; flex-direction: column; gap: 9px; padding: 18px 20px 20px; }
.ksp-blog-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 0; color: var(--ksp-muted); font-size: .74rem; font-weight: 600; }
.ksp-blog-card__meta span { display: inline-flex; align-items: center; gap: 4px; }
.ksp-blog-card__meta .material-symbols-rounded { font-size: 15px; }
.ksp-blog-card__title { margin: 0; font-size: 1.06rem; font-weight: 800; letter-spacing: -.015em; line-height: 1.35; }
.ksp-blog-card__title a { color: var(--ksp-text); text-decoration: none; }
.ksp-blog-card__title a:hover { color: var(--ksp-primary); }
.ksp-blog-card__excerpt { display: -webkit-box; margin: 0; overflow: hidden; color: var(--ksp-muted); font-size: .86rem; line-height: 1.6; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.ksp-blog-card__more { display: inline-flex; align-items: center; gap: 4px; margin-top: auto; padding-top: 6px; color: var(--ksp-primary); font-size: .84rem; font-weight: 700; text-decoration: none; }
.ksp-blog-card__more .material-symbols-rounded { font-size: 17px; transition: transform .18s ease; }
.ksp-blog-card__more:hover .material-symbols-rounded { transform: translateX(3px); }
.ksp-blog-card--featured { flex-direction: row; margin-bottom: 22px; }
.ksp-blog-card--featured .ksp-blog-card__media { flex: 0 0 52%; aspect-ratio: auto; min-height: 300px; }
.ksp-blog-card--featured .ksp-blog-card__body { justify-content: center; padding: 28px 30px; gap: 12px; }
.ksp-blog-card--featured .ksp-blog-card__title { font-size: clamp(1.25rem, 2.4vw, 1.6rem); line-height: 1.25; }
.ksp-blog-card--featured .ksp-blog-card__excerpt { font-size: .95rem; -webkit-line-clamp: 4; }
.ksp-blog-card--featured .ksp-blog-card__ph .material-symbols-rounded { font-size: 64px; }
.ksp-blog-card--featured .ksp-blog-card__more { margin-top: 6px; }
.ksp-blog-chip { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; background: var(--ksp-primary-50); color: var(--ksp-primary-600, var(--ksp-primary)); font-size: .72rem; font-weight: 800; text-decoration: none; }
a.ksp-blog-chip:hover { background: var(--ksp-primary-100); }

/* Kenar çubuğu */
.ksp-bs { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.ksp-bs__card { padding: 22px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); box-shadow: var(--ksp-shadow-sm); }
.ksp-bs__title { position: relative; margin: 0 0 14px; padding-bottom: 12px; border-bottom: 1px solid var(--ksp-border); color: var(--ksp-text); font-size: .86rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.ksp-bs__title::after { content: ""; position: absolute; inset-inline-start: 0; bottom: -1px; width: 44px; height: 2px; background: var(--ksp-primary); }
.ksp-bs__group { margin: 16px 0 4px; color: var(--ksp-muted); font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.ksp-bs__list { margin: 0; padding: 0; list-style: none; }
.ksp-bs__list a, .ksp-bs__all { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 10px; border-radius: 10px; color: var(--ksp-text); font-size: .86rem; font-weight: 600; text-decoration: none; }
.ksp-bs__list a:hover, .ksp-bs__all:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-bs__list a.is-active, .ksp-bs__all.is-active { background: var(--ksp-primary-50); color: var(--ksp-primary-600, var(--ksp-primary)); }
.ksp-bs__list b { color: var(--ksp-muted); font-size: .75rem; font-weight: 700; }
.ksp-bs__all .material-symbols-rounded { font-size: 17px; }
/* İçindekiler: numara YOK (yazı başlıkları çoğu zaman kendi numarasını taşır — "03 1. …" çift numara olmasın); ince çizgi */
.ksp-bs__toc ol { max-height: 46vh; margin: 0; padding: 0; overflow: auto; list-style: none; border-inline-start: 2px solid var(--ksp-border); }
.ksp-bs__toc a { display: block; margin-inline-start: -2px; padding: 6px 10px 6px 14px; border-inline-start: 2px solid transparent; color: var(--ksp-muted); font-size: .84rem; line-height: 1.4; text-decoration: none; transition: color .15s ease, border-color .15s ease; }
.ksp-bs__toc a:hover, .ksp-bs__toc a:focus-visible { border-inline-start-color: var(--ksp-primary); color: var(--ksp-text); }
.ksp-bs__cta { background: linear-gradient(160deg, var(--ksp-primary-50), var(--ksp-surface) 70%); }
.ksp-bs__cta-icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; margin-bottom: 10px; border-radius: 12px; background: var(--ksp-primary); color: #fff; }
.ksp-bs__cta-title { margin: 0 0 4px; color: var(--ksp-text); font-size: 1rem; font-weight: 800; }
.ksp-bs__cta-text { margin: 0 0 14px; color: var(--ksp-muted); font-size: .84rem; line-height: 1.55; }

/* Yazı sayfası */
.ksp-bp__meta { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 0 0 24px; padding-bottom: 18px; border-bottom: 1px solid var(--ksp-border); color: var(--ksp-muted); font-size: .86rem; font-weight: 600; }
.ksp-bp__meta span { display: inline-flex; align-items: center; gap: 6px; }
.ksp-bp__meta .material-symbols-rounded { color: var(--ksp-primary); font-size: 18px; }
.ksp-bp__lead { margin: 0 0 28px; padding: 6px 0 6px 20px; border-inline-start: 3px solid var(--ksp-border); color: var(--ksp-text); font-size: 1.12rem; line-height: 1.7; opacity: .88; }
.ksp-bp__cover { margin: 0 0 30px; overflow: hidden; border-radius: 20px; background: var(--ksp-surface-2); aspect-ratio: 1.91 / 1; }
.ksp-bp__cover img { width: 100%; height: 100%; object-fit: cover; }
.ksp-bp__body { font-size: 1.02rem; line-height: 1.85; }
.ksp-bp__body h2 { position: relative; margin: 2.3rem 0 .9rem; padding-inline-start: 16px; font-size: clamp(1.3rem, 2.6vw, 1.6rem); line-height: 1.3; }
.ksp-bp__body h2::before { content: ""; position: absolute; inset-inline-start: 0; top: .12em; bottom: .12em; width: 4px; border-radius: 4px; background: var(--ksp-primary); }
.ksp-bp__body > h2:first-child { margin-top: 0; }
.ksp-bp__body h3 { margin: 1.7rem 0 .6rem; font-size: 1.15rem; }
.ksp-bp__body p { margin: 0 0 1.15rem; }
.ksp-bp__body li::marker { color: var(--ksp-primary); font-weight: 800; }
/* Tablo (PageMarkup "| a | b |"): tüm ksp-cms-body içeriklerinde; dar ekranda kendi içinde yatay kayar */
.ksp-cms-table { margin: 0 0 1.4rem; overflow-x: auto; border: 1px solid var(--ksp-border); border-radius: 14px; -webkit-overflow-scrolling: touch; }
.ksp-cms-table table { width: 100%; min-width: 420px; border-collapse: collapse; font-size: .92rem; line-height: 1.55; }
.ksp-cms-table th, .ksp-cms-table td { padding: 11px 14px; border-bottom: 1px solid var(--ksp-border); text-align: start; vertical-align: top; }
.ksp-cms-table th { background: var(--ksp-surface-2); color: var(--ksp-text); font-size: .8rem; font-weight: 800; letter-spacing: .02em; }
.ksp-cms-table tbody tr:nth-child(even) td { background: color-mix(in srgb, var(--ksp-surface-2) 55%, transparent); }
.ksp-cms-table tbody tr:last-child td { border-bottom: 0; }
.ksp-cms-table td:first-child { color: var(--ksp-text); font-weight: 700; }
.ksp-bp__tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 30px 0 0; }
.ksp-bp__tags li { padding: 4px 12px; border: 1px solid var(--ksp-border); border-radius: 999px; color: var(--ksp-muted); font-size: .78rem; font-weight: 600; }
.ksp-bp__share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 22px 0 0; padding-top: 20px; border-top: 1px solid var(--ksp-border); }
.ksp-bp__share > span { margin-inline-end: 4px; color: var(--ksp-muted); font-size: .84rem; font-weight: 700; }
.ksp-bp__share a, .ksp-bp__share button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 38px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-text); font-family: inherit; font-size: .82rem; font-weight: 700; text-decoration: none; cursor: pointer; transition: border-color .15s ease, color .15s ease; }
.ksp-bp__share a { width: 38px; }
.ksp-bp__share button { padding: 0 14px; }
.ksp-bp__share a:hover, .ksp-bp__share button:hover { border-color: var(--ksp-primary); color: var(--ksp-primary); }
.ksp-bp__share .material-symbols-rounded { font-size: 18px; }
.ksp-blog-cta { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; margin: 30px 0 0; padding: 20px 22px; border: 1px solid var(--ksp-border); border-radius: 20px; background: linear-gradient(135deg, var(--ksp-primary-50), var(--ksp-surface)); }
.ksp-blog-cta__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 14px; background: var(--ksp-primary); color: #fff; }
.ksp-blog-cta__title { margin: 0 0 4px; color: var(--ksp-text); font-size: 1.02rem; font-weight: 800; }
.ksp-blog-cta__text { margin: 0; color: var(--ksp-muted); font-size: .86rem; }
.ksp-blog-cta .btn { white-space: nowrap; }

/* Kategori sayfası: rehber kutusu + bölüm etiketi */
.ksp-blog__eyebrow, .ksp-lc-guide__eyebrow { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 8px; color: var(--ksp-primary); font-size: .75rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.ksp-blog__eyebrow .material-symbols-rounded, .ksp-lc-guide__eyebrow .material-symbols-rounded { font-size: 18px; }
/* Rehber kartı (sahip referansı 2026-09-27): tam genişlik, sol vurgulu başlık, giriş görünür + "Devamını Göster" (details) */
.ksp-lc-guide { padding: 2.5rem 0 3.5rem; }
.ksp-lc-results + .ksp-sec.ksp-lc-guide { padding-top: 0; } /* sonuç bölümünün alt boşluğu yeterli */
.ksp-lc-guide + .ksp-sec { padding-top: 0; }
.ksp-lc-guide__card { overflow: hidden; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); box-shadow: var(--ksp-shadow-sm); }
.ksp-lc-guide__lead { padding: clamp(20px, 3vw, 28px) clamp(20px, 3vw, 32px) clamp(18px, 2.6vw, 24px); }
.ksp-lc-guide__title { position: relative; margin: 0 0 14px; padding-inline-start: 14px; color: var(--ksp-text); font-size: clamp(1.12rem, 2.4vw, 1.3rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.3; }
.ksp-lc-guide__title::before { content: ""; position: absolute; inset-inline-start: 0; top: .08em; bottom: .08em; width: 4px; border-radius: 4px; background: var(--ksp-primary); }
.ksp-lc-guide__lead .ksp-cms-body, .ksp-lc-guide__rest .ksp-cms-body { font-size: .96rem; line-height: 1.8; }
.ksp-lc-guide__lead .ksp-cms-body > :last-child, .ksp-lc-guide__rest .ksp-cms-body > :last-child { margin-bottom: 0; }
.ksp-lc-guide__rest .ksp-cms-body h2 { font-size: 1.12rem; }
.ksp-lc-guide__rest .ksp-cms-body h3 { font-size: 1.02rem; }
.ksp-lc-guide__more { border-top: 1px solid var(--ksp-border); }
.ksp-lc-guide__more > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px clamp(20px, 3vw, 32px); cursor: pointer; list-style: none; transition: background-color .15s ease; }
.ksp-lc-guide__more > summary::-webkit-details-marker { display: none; }
.ksp-lc-guide__more > summary:hover { background: var(--ksp-surface-2); }
.ksp-lc-guide__more > summary:focus-visible { outline: 2px solid var(--ksp-primary); outline-offset: -2px; }
.ksp-lc-guide__more-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ksp-lc-guide__more-text strong { color: var(--ksp-text); font-size: .92rem; font-weight: 800; }
.ksp-lc-guide__more-text small { overflow: hidden; color: var(--ksp-muted); font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-lc-guide__more[open] [data-more-closed], .ksp-lc-guide__more:not([open]) [data-more-open] { display: none; }
.ksp-lc-guide__chev { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--ksp-surface-2); color: var(--ksp-text); transition: transform .2s ease; }
.ksp-lc-guide__more[open] .ksp-lc-guide__chev { transform: rotate(180deg); }
.ksp-lc-guide__rest { padding: 20px clamp(20px, 3vw, 32px) clamp(22px, 3vw, 30px); border-top: 1px solid var(--ksp-border); }
.ksp-lc-guide__faq { scroll-margin-top: 90px; }
.ksp-lc-guide__rest .ksp-cms-body + .ksp-lc-guide__faq { margin-top: 26px; padding-top: 22px; border-top: 1px dashed var(--ksp-border); }
.ksp-lc-guide__faqtitle { position: relative; margin: 0 0 14px; padding-inline-start: 14px; color: var(--ksp-text); font-size: 1.05rem; font-weight: 800; }
.ksp-lc-guide__faqtitle::before { content: ""; position: absolute; inset-inline-start: 0; top: .1em; bottom: .1em; width: 4px; border-radius: 4px; background: var(--ksp-primary); }
.ksp-lc-guide__faq .ksp-faq__list .accordion-item:last-child { margin-bottom: 0; }
.ksp-lc-results + .ksp-sec { padding-top: 2.5rem; }

@media (max-width: 1199.98px) { .ksp-bl__layout { grid-template-columns: minmax(0, 1fr) 280px; gap: 28px; } }
@media (max-width: 991.98px) {
  .ksp-bl__layout { grid-template-columns: minmax(0, 1fr); }
  .ksp-bs { position: static; }
  .ksp-blog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .ksp-blog-card--featured { flex-direction: column; }
  .ksp-blog-card--featured .ksp-blog-card__media { flex: none; min-height: 0; aspect-ratio: 1.91 / 1; }
  .ksp-blog-card--featured .ksp-blog-card__body { padding: 18px 20px 20px; }
}
@media (max-width: 575.98px) {
  .ksp-blog__grid, .ksp-bl__grid { grid-template-columns: 1fr; }
  .ksp-blog-cta { grid-template-columns: 1fr; }
  .ksp-blog-cta .btn { width: 100%; justify-content: center; }
  .ksp-bp__cover { border-radius: 14px; }
  .ksp-bp__lead { font-size: 1.02rem; }
}

/* Kategori hero arka planı (sahip, 2026-09-27: "kategoriye yüklenen resim ana sayfadaki gibi karartmalı"): kategori kapağı
   (yoksa üst kategorininki) ana sayfa .ksp-hero2__bg ile AYNI perdeyle; alt kenar sayfa rengine erir. Görselsiz kategori açık kalır. */
.ksp-lc-hero--img { position: relative; overflow: hidden; padding-bottom: 5rem; background: linear-gradient(180deg, #0c0a09 78%, var(--ksp-bg) 100%); color: #fff; }
.ksp-lc-hero__bg { position: absolute; inset: 0 0 -1px; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(12, 10, 9, .62) 0%, rgba(12, 10, 9, .82) 52%, rgba(12, 10, 9, .6) 80%, var(--ksp-bg) 100%),
    radial-gradient(55% 60% at 85% 75%, rgba(136, 19, 55, .45), transparent 70%),
    radial-gradient(40% 45% at 10% 30%, rgba(120, 53, 15, .35), transparent 70%),
    var(--ksp-hero-img) center / cover no-repeat; }
@media (max-width: 767.98px) {
  .ksp-lc-hero--img { padding-bottom: 3.5rem; }
  .ksp-lc-hero__bg { background:
      linear-gradient(180deg, rgba(12, 10, 9, .62) 0%, rgba(12, 10, 9, .82) 52%, rgba(12, 10, 9, .6) 80%, var(--ksp-bg) 100%),
      radial-gradient(55% 60% at 85% 75%, rgba(136, 19, 55, .45), transparent 70%),
      var(--ksp-hero-img-sm, var(--ksp-hero-img)) center / cover no-repeat; }
}
.ksp-lc-hero--img > .container { position: relative; z-index: 1; }
.ksp-lc-hero--img .ksp-lc-badge { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .2); color: #fecdd3; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.ksp-lc-hero--img .ksp-lc-title { color: #fff; }
.ksp-lc-hero--img .ksp-lc-title__accent { background-image: linear-gradient(90deg, #ff2056 0%, #ff637e 100%); }
.ksp-lc-hero--img .ksp-lc-lead { color: #d6d3d1; }
.ksp-lc-hero--img .ksp-lc-tabs { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.ksp-lc-hero--img .ksp-lc-tabs__item { color: #e7e5e4; }
.ksp-lc-hero--img .ksp-lc-tabs__item:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.ksp-lc-hero--img .ksp-lc-tabs__item.is-active { background: #fff; color: #1c1917; }
.ksp-lc-hero--img .ksp-lx-chips__label { color: #d6d3d1; }
.ksp-lc-hero--img .ksp-lc-trust__item { background: rgba(12, 10, 9, .72); border-color: rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.ksp-lc-hero--img .ksp-lc-trust__label { color: #d6d3d1; }
.ksp-lc-hero--img .ksp-lc-trust__value { color: #fff; }

/* @panel-destek — Salon Keşfet Destek (kokpit / uzman) + Süper Admin > İşletme Mesajları; ortak sohbet .ksp-chat (KARARLAR §79).
   Yükseklikler panel ölçeğine bölünür: ≥1700 px'te body zoom (--ksp-z) vh'yi de çarpıyor (ksp-panel-olcek tuzağı). */

.ksp-chat { display: flex; flex-direction: column; min-height: 0; }
.ksp-chat__scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 16px 18px 8px; background: var(--ksp-bg); overscroll-behavior: contain; }
.ksp-chat__more { display: flex; align-items: center; gap: 6px; margin: 0 auto 12px; padding: 6px 12px; border: 1px solid var(--ksp-border); border-radius: 999px;
    background: var(--ksp-surface); color: var(--ksp-muted); font-size: .78rem; font-weight: 600; }
.ksp-chat__more[hidden] { display: none; }
.ksp-chat__more:hover { color: var(--ksp-primary); }
.ksp-chat__more .material-symbols-rounded { font-size: 16px; }
.ksp-chat__list { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ksp-chat__day { align-self: center; margin: 10px 0 4px; }
.ksp-chat__day span { padding: 3px 10px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .7rem; font-weight: 700; }
.ksp-chat__msg { display: flex; }
.ksp-chat__msg.is-mine { justify-content: flex-end; }
.ksp-chat__bubble { display: flex; flex-direction: column; gap: 4px; max-width: min(78%, 560px); padding: 8px 12px 6px; border: 1px solid var(--ksp-border);
    border-radius: 18px 18px 18px 6px; background: var(--ksp-surface); box-shadow: var(--ksp-shadow-sm); }
.ksp-chat__msg.is-mine .ksp-chat__bubble { border-color: transparent; border-radius: 18px 18px 6px 18px; background: var(--ksp-primary); color: #fff; }
.ksp-chat__author { color: var(--ksp-muted); font-size: .7rem; font-weight: 700; }
.ksp-chat__msg.is-mine .ksp-chat__author, .ksp-chat__msg.is-mine .ksp-chat__meta { color: rgba(255, 255, 255, .85); }
.ksp-chat__text { margin: 0; font-size: .9rem; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.ksp-chat__img { display: block; overflow: hidden; border-radius: 12px; background: var(--ksp-surface-2); }
.ksp-chat__img img { display: block; width: 100%; max-width: 320px; height: auto; max-height: 320px; object-fit: cover; }
.ksp-chat__meta { display: flex; align-items: center; justify-content: flex-end; gap: 8px; color: var(--ksp-muted); font-size: .68rem; }
.ksp-chat__seen { display: inline-flex; align-items: center; gap: 2px; font-weight: 700; }
.ksp-chat__seen[hidden] { display: none; }
.ksp-chat__seen .material-symbols-rounded { font-size: 14px; }
.ksp-chat__msg.is-pending .ksp-chat__bubble { opacity: .6; }
/* Ekip sohbeti sistem satırı: portal şifresi salon tarafından yenilendi (KARARLAR §79.4) — baloncuk değil, ortada uyarı notu */
.ksp-chat__msg.is-event { justify-content: center; }
.ksp-chat__event { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 6px; max-width: min(92%, 520px); margin: 6px 0; padding: 8px 12px;
    border: 1px dashed var(--ksp-border); border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .76rem; line-height: 1.45; text-align: center; }
.ksp-chat__event .material-symbols-rounded { color: var(--ksp-warning, #b45309); font-size: 16px; }
.ksp-chat__event time { font-size: .68rem; font-weight: 700; }
.ksp-chat__empty { display: grid; place-items: center; align-content: center; gap: 6px; min-height: 100%; padding: 24px; color: var(--ksp-muted); text-align: center; }
.ksp-chat__empty[hidden] { display: none; }
.ksp-chat__empty .material-symbols-rounded { color: var(--ksp-primary); font-size: 40px; opacity: .5; }
.ksp-chat__empty p { max-width: 380px; margin: 0; font-size: .88rem; }
.ksp-chat__composer { flex: 0 0 auto; padding: 10px 14px 8px; border-top: 1px solid var(--ksp-border); background: var(--ksp-surface); }
.ksp-chat__row { display: flex; align-items: flex-end; gap: 8px; }
.ksp-chat__row textarea { flex: 1 1 auto; min-width: 0; max-height: 160px; padding: 10px 14px; border: 1px solid var(--ksp-border); border-radius: 20px;
    background: var(--ksp-bg); color: var(--ksp-text); font-size: .9rem; line-height: 1.4; resize: none; }
.ksp-chat__row textarea:focus { border-color: var(--ksp-primary); outline: 0; box-shadow: 0 0 0 3px var(--ksp-primary-100); }
.ksp-chat__iconbtn { display: inline-grid; flex-shrink: 0; place-items: center; width: 40px; height: 40px; margin: 0; padding: 0; border: 0; border-radius: 50%;
    background: transparent; color: var(--ksp-muted); cursor: pointer; }
.ksp-chat__iconbtn:hover, .ksp-chat__attach:focus-within { background: var(--ksp-surface-2); color: var(--ksp-primary); }
.ksp-chat__send { display: inline-grid; flex-shrink: 0; place-items: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%; background: var(--ksp-primary); color: #fff; }
.ksp-chat__send:hover { background: var(--ksp-primary-600); }
.ksp-chat__send:disabled { opacity: .55; }
.ksp-chat__preview { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; padding: 6px 6px 6px 8px; border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-bg); }
.ksp-chat__preview[hidden] { display: none; }
.ksp-chat__preview img { width: 44px; height: 44px; border-radius: 10px; object-fit: cover; }
.ksp-chat__preview span { flex: 1 1 auto; min-width: 0; overflow: hidden; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-chat__error { margin: 0 0 8px; padding: 8px 12px; border-radius: 12px; background: var(--ksp-primary-50); color: var(--ksp-primary-600); font-size: .8rem; font-weight: 600; }
.ksp-chat__error[hidden] { display: none; }
[data-bs-theme="dark"] .ksp-chat__error { color: var(--ksp-primary); }
.ksp-chat__hint { margin: 6px 4px 0; color: var(--ksp-muted); font-size: .7rem; }

.ksp-sup-pane { overflow: hidden; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-surface); }
 /* offsetTop listeye göre (seçili satırı görünür alana getirme) */
.ksp-sup-item { display: flex; gap: 10px; padding: 10px; border-radius: 12px; color: inherit; text-decoration: none; }
.ksp-sup-item:hover { background: var(--ksp-surface-2); color: inherit; }
.ksp-sup-item.is-active { background: var(--ksp-primary-50); }
.ksp-sup-item__ava { display: inline-grid; flex-shrink: 0; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-text); font-size: .8rem; font-weight: 800; }
.ksp-sup-item__main { display: flex; flex: 1 1 auto; flex-direction: column; gap: 3px; min-width: 0; }
.ksp-sup-item__top, .ksp-sup-item__bottom { display: flex; align-items: center; gap: 6px; min-width: 0; }
.ksp-sup-item__name { flex: 1 1 auto; min-width: 0; overflow: hidden; font-size: .86rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-sup-item__when { flex-shrink: 0; color: var(--ksp-muted); font-size: .7rem; }
.ksp-sup-item.is-unread .ksp-sup-item__when { color: var(--ksp-primary); font-weight: 700; }
.ksp-sup-item__chip { flex-shrink: 0; padding: 1px 7px; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .64rem; font-weight: 700; }
.ksp-sup-item__chip.is-warn { background: var(--ksp-amber-50); color: #b45309; }
[data-bs-theme="dark"] .ksp-sup-item__chip.is-warn { color: #fbbf24; }
.ksp-sup-item__preview { flex: 1 1 auto; min-width: 0; overflow: hidden; color: var(--ksp-muted); font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-sup-item.is-unread .ksp-sup-item__preview { color: var(--ksp-text); font-weight: 600; }
.ksp-sup-item__badge { flex-shrink: 0; min-width: 20px; padding: 1px 6px; border-radius: 999px; background: var(--ksp-primary); color: #fff; font-size: .66rem; font-weight: 800; text-align: center; }
.ksp-sup-item__seen { display: inline-flex; flex-shrink: 0; color: var(--ksp-info); }
.ksp-sup-item__seen .material-symbols-rounded { font-size: 16px; }
.ksp-sup-pane { display: flex; flex-direction: column; min-height: 0; }
.ksp-sup-pane .ksp-chat { flex: 1 1 auto; height: var(--sup-h); min-height: 420px; }
@media (max-width: 575.98px) {
    .ksp-chat__scroll { padding: 12px 10px 6px; }
    .ksp-chat__bubble { max-width: 86%; }
    .ksp-chat__hint { display: none; }
    }

/* @panel-destek-kutu — sağ alt mesaj kutusu (views/partials/chat-dock.php) + İşletme Mesajları başlık seçicileri / toplu hatırlatma
   (KARARLAR §79.1). Kutu alt menünün (z 1040) üstünde, Bootstrap çekmece / pencerelerin (1045+) altında. */
.ksp-chat__end { display: block; height: 0; }
.ksp-dock { position: fixed; bottom: 20px; inset-inline-end: 20px; z-index: 1042; }
.ksp-ptop:has(.dropdown-menu.show) { z-index: 1043; } /* zil / kullanıcı menüsü açık kutunun ALTINDA kalmasın (inceleme 2026-09-28) */
.ksp-pk-head .dropdown-menu.show { z-index: 1043; }
.ksp-dock__fab { position: relative; display: inline-grid; place-items: center; width: 56px; height: 56px; padding: 0; border: 0; border-radius: 18px;
    background: var(--ksp-primary); color: #fff; box-shadow: 0 14px 30px -12px rgba(var(--ksp-primary-rgb), .65); transition: transform .15s ease; }
.ksp-dock__fab:hover { background: var(--ksp-primary-600); transform: translateY(-1px); }
.ksp-dock__fab:focus-visible { outline: 3px solid var(--ksp-primary-100); outline-offset: 2px; }
.ksp-dock__fab .material-symbols-rounded { font-size: 26px; }
.ksp-dock__badge { position: absolute; top: -6px; inset-inline-end: -6px; min-width: 22px; height: 22px; padding: 0 6px; border: 2px solid var(--ksp-bg);
    border-radius: 999px; background: var(--ksp-ink); color: #fff; font-size: .68rem; font-weight: 800; line-height: 18px; text-align: center; }
[data-bs-theme="dark"] .ksp-dock__badge { background: #fafaf9; color: #1c1917; }
.ksp-dock__badge[hidden] { display: none; }
.ksp-dock__panel { position: absolute; bottom: 70px; inset-inline-end: 0; display: flex; flex-direction: column; overflow: hidden;
    width: min(400px, calc(100vw - 32px)); height: calc(min(620px * var(--ksp-z, 1), 76dvh) / var(--ksp-z, 1)); border: 1px solid var(--ksp-border);
    border-radius: 22px; background: var(--ksp-surface); box-shadow: var(--ksp-shadow-lg); }
.ksp-dock__panel[hidden] { display: none; }
.ksp-dock__head { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; padding: 10px 10px 10px 12px; border-bottom: 1px solid var(--ksp-border); }
.ksp-dock__mark { display: inline-grid; flex-shrink: 0; place-items: center; width: 36px; height: 36px; border-radius: 12px; background: var(--ksp-primary-50); color: var(--ksp-primary); }
.ksp-dock__mark .material-symbols-rounded { font-size: 20px; }
.ksp-dock__title { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; }
.ksp-dock__title b { overflow: hidden; font-size: .92rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-dock__title small { overflow: hidden; color: var(--ksp-muted); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-dock__iconbtn { display: inline-grid; flex-shrink: 0; place-items: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%;
    background: transparent; color: var(--ksp-muted); text-decoration: none; }
.ksp-dock__iconbtn:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-dock__iconbtn[hidden] { display: none; }
.ksp-dock__iconbtn .material-symbols-rounded { font-size: 20px; }
.ksp-dock__tabs { display: flex; flex: 0 0 auto; gap: 4px; padding: 6px 10px 0; border-bottom: 1px solid var(--ksp-border); }
.ksp-dock__tab { display: inline-flex; flex: 1 1 0; align-items: center; justify-content: center; gap: 6px; padding: 8px 10px 10px; border: 0;
    border-bottom: 2px solid transparent; background: none; color: var(--ksp-muted); font-size: .84rem; font-weight: 700; }
.ksp-dock__tab[aria-selected="true"] { border-bottom-color: var(--ksp-primary); color: var(--ksp-text); }
.ksp-dock__tbadge { min-width: 18px; padding: 0 5px; border-radius: 999px; background: var(--ksp-primary); color: #fff; font-size: .64rem; line-height: 18px; text-align: center; }
.ksp-dock__tbadge[hidden] { display: none; }
.ksp-dock__body { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.ksp-dock__listview { flex: 1 1 auto; min-height: 0; padding: 6px; overflow-y: auto; }
.ksp-dock__listview[hidden], .ksp-dock__chatview[hidden] { display: none; }
.ksp-dock__chatview { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.ksp-dock__chatview .ksp-chat { flex: 1 1 auto; min-height: 0; }
.ksp-dock__chatview .ksp-chat__scroll { padding: 12px 12px 6px; }
.ksp-dock__chatview .ksp-chat__bubble { max-width: 86%; }
.ksp-dock__chatview .ksp-chat__hint { display: none; }
.ksp-dock__items { margin: 0; padding: 0; list-style: none; }
.ksp-dock__row { display: flex; gap: 10px; width: 100%; padding: 10px; border: 0; border-radius: 12px; background: transparent; color: inherit; text-align: start; }
.ksp-dock__row:hover, .ksp-dock__row:focus-visible { background: var(--ksp-surface-2); }
.ksp-dock__ava { display: inline-grid; flex-shrink: 0; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: var(--ksp-surface-2);
    color: var(--ksp-text); font-size: .76rem; font-weight: 800; }
.ksp-dock__rowmain { display: flex; flex: 1 1 auto; flex-direction: column; gap: 3px; min-width: 0; }
.ksp-dock__rowtop, .ksp-dock__rowbottom { display: flex; align-items: center; gap: 6px; min-width: 0; }
.ksp-dock__rowtop b { flex: 1 1 auto; min-width: 0; overflow: hidden; font-size: .86rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-dock__rowtop time { flex-shrink: 0; color: var(--ksp-muted); font-size: .7rem; }
.ksp-dock__row.is-unread .ksp-dock__rowtop time { color: var(--ksp-primary); font-weight: 700; }
.ksp-dock__preview { flex: 1 1 auto; min-width: 0; overflow: hidden; color: var(--ksp-muted); font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.ksp-dock__row.is-unread .ksp-dock__preview { color: var(--ksp-text); font-weight: 600; }
.ksp-dock__empty { margin: 24px 16px; color: var(--ksp-muted); font-size: .84rem; text-align: center; }
.ksp-dock__empty[hidden] { display: none; }
/* Personel Portalı "Ekip": kendi şifresini belirleme (KARARLAR §79.2) */
.ksp-dock__ownpw { display: flex; flex-direction: column; gap: 6px; margin: 6px; padding: 14px; border: 1px solid var(--ksp-border); border-radius: 16px; background: var(--ksp-bg); }
.ksp-dock__ownpw[hidden] { display: none; }
.ksp-dock__ownpw-lead { display: flex; gap: 8px; margin: 0 0 6px; font-size: .82rem; line-height: 1.45; }
.ksp-dock__ownpw-lead .material-symbols-rounded { flex-shrink: 0; color: var(--ksp-primary); font-size: 20px; }
.ksp-dock__ownpw label { margin-top: 4px; font-size: .76rem; font-weight: 800; }
.ksp-dock__ownpw label small { color: var(--ksp-muted); font-weight: 600; }
.ksp-dock__ownpw input { height: 40px; padding: 0 12px; border: 1px solid var(--ksp-border); border-radius: 10px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .88rem; }
.ksp-dock__ownpw input:focus { border-color: var(--ksp-primary); outline: 0; box-shadow: 0 0 0 3px var(--ksp-primary-100); }
.ksp-dock__ownpw-err { margin: 4px 0 0; color: var(--ksp-danger, #b91c1c); font-size: .78rem; font-weight: 600; }
.ksp-dock__ownpw-err[hidden] { display: none; }
.ksp-dock__ownpw-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 42px; margin-top: 8px; border: 0; border-radius: 12px;
    background: var(--ksp-primary); color: #fff; font-size: .86rem; font-weight: 800; }
.ksp-dock__ownpw-btn:hover { background: var(--ksp-primary-600); }
.ksp-dock__ownpw-btn:disabled { opacity: .6; }
.ksp-dock__ownpw-btn .material-symbols-rounded { font-size: 18px; }
.ksp-dock__ownpw-note { color: var(--ksp-muted); font-size: .72rem; line-height: 1.4; }
.ksp-dock__ownpw-cancel { height: 38px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-surface); color: var(--ksp-text); font-size: .82rem; font-weight: 700; }
.ksp-dock__ownpw-cancel:hover { border-color: var(--ksp-primary); color: var(--ksp-primary); }
.ksp-dock__ownpw-cancel[hidden] { display: none; }
/* Kendi şifresinin belirlendiği an + "Şifremi değiştir" (Personel Portalı Ekip listesi altı — KARARLAR §79.4) */
.ksp-dock__ownat { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 10px 6px 4px; padding: 10px 12px; border-radius: 12px;
    background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .74rem; line-height: 1.4; }
.ksp-dock__ownat[hidden] { display: none; }
.ksp-dock__ownat > .material-symbols-rounded { color: var(--ksp-primary); font-size: 18px; }
.ksp-dock__ownat > span:not(.material-symbols-rounded) { flex: 1 1 180px; min-width: 0; }
.ksp-dock__ownat-btn { padding: 4px 10px; border: 1px solid var(--ksp-border); border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-primary); font-size: .74rem; font-weight: 800; }
.ksp-dock__ownat-btn:hover { border-color: var(--ksp-primary); }
@media (max-width: 991.98px) {
    .ksp-dock { bottom: calc(var(--ksp-bottom-h) + 14px + env(safe-area-inset-bottom)); inset-inline-end: 14px; }
    .ksp-share-page .ksp-dock { bottom: calc(16px + env(safe-area-inset-bottom)); }
    /* Pencere alt menü + düğme ofsetiyle yukarıda başlar: yüksekliği ekrana sığdır (yatay telefonda üstü taşıyordu — inceleme 2026-09-28) */
    .ksp-dock__panel { height: min(620px, calc(100dvh - var(--ksp-bottom-h) - 96px - env(safe-area-inset-bottom))); }
    .ksp-share-page .ksp-dock__panel { height: min(620px, calc(100dvh - 98px - env(safe-area-inset-bottom))); }
}
/* Ayarlar sayfalarının yapışık kaydet çubuğu varken düğme çubuğun üstüne çıkar ('Değişiklikleri Kaydet' örtülmesin) */
@media (max-width: 767.98px) {
    body:has(.ksp-set-pane:not([hidden]) .ksp-set-savebar) .ksp-dock { bottom: calc(var(--ksp-bottom-h) + 84px + env(safe-area-inset-bottom)); }
}
@media (max-width: 575.98px), (max-width: 991.98px) and (max-height: 540px) {
    /* .ksp-share-page (Personel Portalı) yükseklik kuralı daha özgül: tam ekranda o da sıfırlanır (önizlemede 620 px'te kalıyordu) */
    .ksp-dock__panel, .ksp-share-page .ksp-dock__panel { position: fixed; inset: 0; width: auto; height: auto; border: 0; border-radius: 0;
        padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); } /* çentik / ev çubuğu payı */
    .ksp-dock.is-open .ksp-dock__fab { visibility: hidden; }
    /* Tam ekran kutu açıkken arkadaki sayfa kaymasın; liste sonuna gelince kaydırma sayfaya taşmasın (inceleme 2026-09-28) */
    body:has(.ksp-dock.is-open) { overflow: hidden; }
    .ksp-dock__listview { overscroll-behavior: contain; }
}
@media print { .ksp-dock { display: none; } }

 /* seçiciler başlığın SAĞINA sığsın (sahip işaretli alanı) */
 /* ada yakın küçük kutucuk yanlışlıkla yazışmayı açmasın */
/* iOS Safari 16 px altındaki alana odaklanınca sayfayı yakınlaştırıyor (inceleme): yalnız dokunmatik cihazda, yalnız bu alanlar */
@media (hover: none) and (pointer: coarse) {
    .ksp-chat__row textarea,
.ksp-dock__ownpw input { font-size: 16px; }
}

/* @ana-sayfa — Color Lounge ana sayfası (views/site/home*, KARARLAR §82.12; sahip tasarımı 2026-09-29).
   Hero / paket / magazin / yorum bölümleri eski ön sayfa kurallarını (ksp-hero2, ksp-finder, ksp-hstat, ksp-sec, ksp-mgz-strip,
   ksp-review) kullanır; burada yalnız YENİ parçalar: randevu kutusu, kategori şeridi (ikon + yazı yan yana, tek satır),
   alt kategori kartları (3. görselin kart düzeni), öncesi / sonrası kabı. */
.ksp-home-finder { max-width: 920px; }
.ksp-home-finder .ksp-finder__control select { width: 100%; min-width: 0; text-overflow: ellipsis; cursor: pointer; }
.ksp-home-finder .ksp-finder__submit { display: inline-flex; align-items: center; justify-content: center; gap: 8px; white-space: nowrap; }
.ksp-hero2__popular a[data-bk-open] { cursor: pointer; }

.ksp-home-head { margin-bottom: 18px; }
.ksp-home-head__title { margin: 0 0 4px; color: var(--ksp-text); font-size: clamp(1.25rem, 2.2vw, 1.6rem); font-weight: 800; letter-spacing: -.02em; }
.ksp-home-head__lead { margin: 0; color: var(--ksp-muted); font-size: .9rem; }

/* Kart genişliği İÇERİĞE göre (sahip: ikon + yazı yan yana, tek satır — ad kesilmesin); sığmayan kart alt sıraya geçer */
.ksp-hcats { display: flex; flex-wrap: nowrap; gap: 12px; margin: 0 -4px 22px; padding: 4px 4px 10px; overflow-x: auto; scroll-snap-type: x proximity; scroll-padding-inline: 4px;
  overscroll-behavior-x: contain; scrollbar-width: none; } /* tek satır, yana kayar (sahip: "2 satır olmayacak", §82.16) */
.ksp-hcats::-webkit-scrollbar { display: none; }
.ksp-hcats > .ksp-hcat { flex: 0 0 auto; scroll-snap-align: start; }
.ksp-home-head--row { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.ksp-hcats-nav { display: inline-flex; flex: none; gap: 8px; }
.ksp-hcats-nav[hidden] { display: none; }
.ksp-hcats-nav button { display: inline-grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--ksp-border); border-radius: 50%;
  background: var(--ksp-surface); color: var(--ksp-text); box-shadow: var(--ksp-shadow-sm); transition: opacity .2s ease, border-color .2s ease; }
.ksp-hcats-nav button:hover:not(:disabled) { border-color: rgba(var(--ksp-primary-rgb), .45); }
.ksp-hcats-nav button:disabled { opacity: .35; cursor: default; }
.ksp-hcat { display: flex; flex: 0 1 auto; align-items: center; gap: 10px; min-width: 0; max-width: 100%; padding: 12px 16px 12px 12px; border: 1px solid var(--ksp-border); border-radius: var(--ksp-radius);
  background: var(--ksp-surface); color: var(--ksp-text); text-align: start; box-shadow: var(--ksp-shadow-sm);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.ksp-hcat:hover { border-color: rgba(var(--ksp-primary-rgb), .35); box-shadow: var(--ksp-shadow); transform: translateY(-1px); }
.ksp-hcat__icon { flex: none; display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-hcat__icon .material-symbols-rounded { font-size: 20px; }
.ksp-hcat__name { flex: 1 1 auto; min-width: 0; overflow: hidden; font-size: .9rem; font-weight: 800; white-space: nowrap; text-overflow: ellipsis; }
.ksp-hcat__count { flex: none; padding: 3px 8px; border-radius: 8px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .7rem; font-weight: 800; white-space: nowrap; }
.ksp-hcat.is-active { border-color: var(--ksp-primary); background: var(--ksp-ink); color: #fff; box-shadow: 0 0 0 3px rgba(var(--ksp-primary-rgb), .18); }
.ksp-hcat.is-active .ksp-hcat__icon { background: var(--ksp-primary); color: #fff; }
.ksp-hcat.is-active .ksp-hcat__count { background: rgba(255, 255, 255, .12); color: #fff; }
.ksp-hcat:focus-visible { outline: 3px solid rgba(var(--ksp-primary-rgb), .45); outline-offset: 2px; }

.ksp-hsubs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.ksp-hsub { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--ksp-border); border-radius: var(--ksp-radius);
  background: var(--ksp-surface); box-shadow: var(--ksp-shadow-sm); transition: box-shadow .2s ease, transform .2s ease; }
.ksp-hsub[hidden] { display: none; }
.ksp-hsub:hover { box-shadow: var(--ksp-shadow); transform: translateY(-2px); }
.ksp-hsub__cover { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 200px; padding: 14px 16px;
  background: var(--ksp-ink) center / cover no-repeat; color: #fff; isolation: isolate; }
.ksp-hsub__cover::after { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(12, 10, 9, .15) 0%, rgba(12, 10, 9, .05) 40%, rgba(12, 10, 9, .78) 100%); }
.ksp-hsub__cover.is-empty { background: radial-gradient(90% 90% at 80% 20%, rgba(var(--ksp-primary-rgb), .55), transparent 70%), var(--ksp-ink); }
.ksp-hsub__badges { display: flex; flex-wrap: wrap; gap: 6px; }
.ksp-hsub__badge { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 999px; font-size: .68rem; font-weight: 800; line-height: 1.2; }
.ksp-hsub__badge .material-symbols-rounded { font-size: 14px; }
.ksp-hsub__badge.is-dark { background: rgba(28, 25, 23, .78); color: #fff; backdrop-filter: blur(4px); }
.ksp-hsub__badge.is-green { background: var(--ksp-success); color: #fff; }
.ksp-hsub__title { margin: 0; color: #fff; font-size: 1.2rem; font-weight: 800; letter-spacing: -.01em; text-shadow: 0 2px 10px rgba(0, 0, 0, .35); }
.ksp-hsub__body { display: flex; flex: 1; flex-direction: column; gap: 12px; padding: 16px; }
.ksp-hsub__price { margin: 0; color: var(--ksp-primary); font-size: .9rem; font-weight: 800; }
.ksp-hsub__desc { display: -webkit-box; margin: 0; overflow: hidden; color: var(--ksp-muted); font-size: .84rem; line-height: 1.5;
  -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; }
.ksp-hsub__crew { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--ksp-border); border-radius: 12px; background: var(--ksp-bg); }
.ksp-hsub__crew strong { font-size: .86rem; font-weight: 800; }
.ksp-hsub__avatars { display: inline-flex; }
.ksp-hsub__avatars .ksp-ava { width: 34px; height: 34px; margin-inline-start: -8px; border: 2px solid var(--ksp-surface); font-size: .7rem; }
.ksp-hsub__avatars .ksp-ava:first-child { margin-inline-start: 0; }
.ksp-hsub__book { display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin-top: auto; padding: 12px 16px; border: 0; border-radius: 12px;
  background: var(--ksp-primary); color: #fff; font-weight: 800; }
.ksp-hsub__book:hover, .ksp-hsub__book:focus-visible { background: var(--ksp-primary-600); color: #fff; }

/* Uzman kartı iki düğme yan yana (ana sayfa; sahip isteği 2026-09-29): Profili İncele · Randevu Al */
.ksp-expert__acts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: auto; }
.ksp-expert__acts .btn { display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-width: 0; margin-top: 0; padding: 9px 8px; font-size: .8rem; font-weight: 800; white-space: nowrap; }
.ksp-expert__acts .btn .material-symbols-rounded { font-size: 17px; }
.ksp-home-galcard { padding: 22px; border: 1px solid var(--ksp-border); border-radius: var(--ksp-radius-lg); background: var(--ksp-surface); box-shadow: var(--ksp-shadow-sm); }
.ksp-home-reviews .ksp-sec__note { text-decoration: none; }
.ksp-home-reviews .ksp-review__foot span { display: inline-flex; align-items: center; gap: 4px; }
.ksp-home-reviews .ksp-review__foot .material-symbols-rounded { font-size: 15px; color: var(--ksp-success); }

@media (max-width: 991.98px) {
  .ksp-hsubs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .ksp-hcats { gap: 10px; margin-inline: -16px; padding: 4px 16px 8px; scroll-padding-inline: 16px; }
  .ksp-hcats > .ksp-hcat { max-width: 78vw; }
  .ksp-hcats-nav { display: none; } /* telefonda parmakla kaydırılır */
  .ksp-hsubs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } /* sahip 2026-09-29: telefonda ikili (§82.23) */
  .ksp-home-galcard { padding: 14px; }
}
[data-bs-theme="dark"] .ksp-hcat, [data-bs-theme="dark"] .ksp-hsub, [data-bs-theme="dark"] .ksp-home-galcard { border-color: rgba(255, 255, 255, .1); }
@media (prefers-reduced-motion: reduce) {
  .ksp-hcat, .ksp-hsub { transition: none; }
  .ksp-hcat:hover, .ksp-hsub:hover { transform: none; }
}

/* @uygulama — Color Lounge Panel (PWA; KARARLAR §82.13). "Uygulamayı Yükle" şeridi (alt menünün üstünde; masaüstünde sağ alt),
   iPhone adım penceresi, /uygulama açılış ekranı, tam ekran kipi (html.is-app: lastik esneme kapalı, dokunma vurgusu yok) ve
   aşağı çekip yenile göstergesi (.ksp-ptr). */
.ksp-appin { position: fixed; inset-inline: 12px; bottom: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom) + 12px); z-index: 1045;
  display: flex; align-items: center; gap: 12px; padding: 10px 10px 10px 12px; border: 1px solid var(--ksp-border); border-radius: 18px;
  background: var(--ksp-surface); box-shadow: 0 18px 40px -16px rgba(28, 25, 23, .45); animation: kspAppIn .28s cubic-bezier(.2, .8, .3, 1); }
.ksp-appin[hidden] { display: none; }
.ksp-share-page .ksp-appin { bottom: calc(env(safe-area-inset-bottom) + 12px); }
.ksp-appin__icon { flex: none; width: 40px; height: 40px; border-radius: 10px; }
.ksp-appin__text { display: flex; flex: 1; flex-direction: column; min-width: 0; line-height: 1.25; }
.ksp-appin__text strong { color: var(--ksp-text); font-size: .88rem; font-weight: 800; }
.ksp-appin__text span { color: var(--ksp-muted); font-size: .74rem; }
.ksp-appin__go { display: inline-flex; flex: none; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 12px; font-size: .84rem; font-weight: 800; }
.ksp-appin__go .material-symbols-rounded { font-size: 18px; }
.ksp-appin__close { display: inline-grid; flex: none; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 10px; background: transparent; color: var(--ksp-muted); }
.ksp-appin__close:hover { background: var(--ksp-surface-2); color: var(--ksp-text); }
.ksp-appin-steps { display: grid; gap: 12px; margin: 0 0 14px; padding: 0; list-style: none; }
.ksp-appin-steps li { display: flex; align-items: flex-start; gap: 12px; font-size: .92rem; }
.ksp-appin-steps__n { display: inline-grid; flex: none; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--ksp-ink); color: #fff; font-size: .8rem; font-weight: 800; }
.ksp-appin-steps .material-symbols-rounded { font-size: 18px; vertical-align: -4px; }
.ksp-applaunch { display: grid; justify-items: center; align-content: center; gap: 12px; min-height: 70vh; padding: 24px 16px; text-align: center; }
.ksp-applaunch img { border-radius: 18px; }
.ksp-applaunch .btn { display: inline-flex; align-items: center; gap: 8px; }
.ksp-ptr { position: fixed; top: calc(env(safe-area-inset-top) + 8px); left: 50%; z-index: 1100; display: grid; place-items: center; width: 38px; height: 38px;
  border-radius: 50%; background: var(--ksp-surface); color: var(--ksp-muted); box-shadow: 0 6px 18px rgba(28, 25, 23, .25); opacity: 0;
  transform: translate(-50%, -48px); pointer-events: none; transition: opacity .15s ease; }
.ksp-ptr.is-ready { color: var(--ksp-primary); }
.ksp-ptr.is-loading .material-symbols-rounded { animation: kspPtrSpin .7s linear infinite; }
html.is-app, html.is-app body { overscroll-behavior-y: none; }
html.is-app { -webkit-tap-highlight-color: transparent; }
html.is-app .ksp-bottom-nav, html.is-app .ksp-ptop { -webkit-user-select: none; user-select: none; }
@keyframes kspAppIn { from { opacity: 0; transform: translateY(12px); } }
@keyframes kspPtrSpin { to { transform: rotate(360deg); } }
@media (min-width: 992px) {
  .ksp-appin, .ksp-share-page .ksp-appin { inset-inline: auto 24px; bottom: 24px; max-width: 400px; }
}
@media (prefers-reduced-motion: reduce) {
  .ksp-appin { animation: none; }
  .ksp-ptr.is-loading .material-symbols-rounded { animation: none; }
}
/* "Beni hatırla" — Personel Kokpiti girişi (KARARLAR §82.14) */
.ksp-acct-login__remember { display: flex; align-items: center; gap: 8px; margin: 2px 0 14px; color: var(--ksp-muted); font-size: .86rem; cursor: pointer; }
.ksp-acct-login__remember input { flex: none; width: 18px; height: 18px; accent-color: var(--ksp-primary); }

/* @ana-sayfa-alt — Color Lounge ana sayfası 2. dalga (KARARLAR §82.15; sahibin 8. görseli): hero arka plan videosu, en altta tek
   zeminde (beyazdan turkuaza) yavaş kayan marka şeridi + "Bize Ulaşın" (dikey başlık, alt çizgili form, sağda görsel + sosyal).
   Panel: Site Ayarları > Ana Sayfa marka satırları / video kutusu, Gelen Mesajlar listesi. */
.ksp-hero2__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }

.ksp-hbottom { --cl-crimson: var(--ksp-primary); --cl-ink: var(--ksp-text); position: relative; overflow: hidden; padding-top: 18px; color: var(--cl-ink); }
/* Fotoğraf varken şerit fotoğrafın üstünde: bölümün tepesine biner, logolar için çok hafif açık geçiş */
.ksp-hbottom.has-photo { padding-top: 0; }
.ksp-hbottom.has-photo .ksp-hbrands { position: absolute; inset-inline: 0; top: 0; z-index: 3; padding-top: 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .5) 0%, rgba(255, 255, 255, 0) 100%); }
.ksp-hbottom.has-photo .ksp-hcontact { padding-top: 112px; }

.ksp-hbrands { overflow: hidden; padding: 14px 0 10px;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.ksp-hbrands__track { display: flex; width: max-content; animation: kspMarquee var(--ksp-marquee, 40s) linear infinite; }
.ksp-hbrands:hover .ksp-hbrands__track, .ksp-hbrands:focus-within .ksp-hbrands__track { animation-play-state: paused; }
.ksp-hbrands__row { display: flex; flex: none; align-items: center; gap: 72px; padding-inline-end: 72px; }
.ksp-hbrands__item { display: inline-flex; align-items: center; height: 44px; }
.ksp-hbrands__item img { width: auto; height: 34px; max-width: 150px; object-fit: contain; filter: grayscale(1); opacity: .62; transition: opacity .25s ease, filter .25s ease; }
a.ksp-hbrands__item:hover img, a.ksp-hbrands__item:focus-visible img { filter: none; opacity: 1; }
@keyframes kspMarquee { to { transform: translateX(-50%); } }

/* Görsel sağda sayfa kenarına taşar: taşma = container dışı boşluk + iç boşluk (bu sitede ≥1200 container 1248px, altında Bootstrap 960) */
/* Sahip 2026-09-29 (§82.17): görsel bölümün TAMAMINI kaplar, sol taraf buzlu cam; içerik kenardan kenara, yazılar sola; sitenin fontu */
.ksp-hcontact { position: relative; isolation: isolate; padding: 56px 0 0; }
.ksp-hcontact__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 170px minmax(0, 560px) minmax(0, 1fr); gap: 56px;
  align-items: stretch; padding-inline: clamp(16px, 5vw, 96px); }
.ksp-hcontact__side { display: flex; flex-direction: column; justify-content: flex-end; gap: 28px; padding: 0 0 34px 34px; border-inline-start: 1px solid rgba(var(--ksp-primary-rgb), .4); }
/* Başlık sitenin başlık dili: 800 kalınlık, sıkı harf aralığı, hero gibi iki ton (koyu + ana renk degradesi) */
.ksp-hcontact__title { display: flex; align-items: flex-end; gap: 6px; margin: 0; font-size: clamp(2.8rem, 4.6vw, 4.4rem); font-weight: 800; line-height: 1;
  letter-spacing: -.035em; }
.ksp-hcontact__thin, .ksp-hcontact__bold { writing-mode: vertical-rl; transform: rotate(180deg); }
.ksp-hcontact__thin { color: var(--ksp-text); }
.ksp-hcontact__bold { background: linear-gradient(0deg, #ff2056 0%, #ff637e 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ksp-hcontact__mail { color: var(--ksp-text); font-size: .9rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.ksp-hcontact__mail:hover { color: var(--cl-crimson); }

.ksp-hcontact__form { position: relative; padding: 24px 0 68px; }
.ksp-hcontact__kicker { display: flex; margin: 0 0 10px; padding-bottom: 12px; border-bottom: 1px solid rgba(var(--ksp-primary-rgb), .25); }
.ksp-hcontact__hp { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ksp-hcontact__field { margin-bottom: 4px; }
.ksp-hcontact__input { display: block; width: 100%; padding: 14px 0 10px; border: 0; border-bottom: 1px solid rgba(28, 25, 23, .3); border-radius: 0;
  background: transparent; color: var(--cl-ink); font-size: .95rem; transition: border-color .2s ease, box-shadow .2s ease; }
.ksp-hcontact__input::placeholder { color: #57534e; opacity: .85; }
.ksp-hcontact__input:focus { outline: 0; border-bottom-color: var(--cl-crimson); box-shadow: 0 1px 0 var(--cl-crimson); }
.ksp-hcontact__area { min-height: 112px; resize: vertical; }
.ksp-hcontact__field.is-bad .ksp-hcontact__input { border-bottom-color: var(--cl-crimson); }
.ksp-hcontact__err { min-height: 0; margin: 4px 0 0; color: var(--cl-crimson); font-size: .76rem; font-weight: 600; }
.ksp-hcontact__err:empty { display: none; }
.ksp-hcontact__consent { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 12px; margin: 22px 0 22px; color: #44403c; font-size: .74rem; line-height: 1.65; text-align: justify; }
.ksp-hcontact__consent input { width: 16px; height: 16px; margin-top: 3px; accent-color: var(--cl-crimson); cursor: pointer; }
.ksp-hcontact__consent label { cursor: pointer; }
.ksp-hcontact__consent .ksp-hcontact__err { grid-column: 2; }
.ksp-hcontact__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
/* Düğme sitenin ana düğmesi (.btn.ksp-btn-primary): burada yalnız boyut ve ikon hizası */
.ksp-hcontact__send { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 180px; padding: .75rem 1.6rem; border-radius: 12px; font-weight: 800; }
.ksp-hcontact__send .material-symbols-rounded { font-size: 20px; }
.ksp-hcontact__send[disabled] { opacity: .7; cursor: progress; transform: none; }
.ksp-hcontact__status { flex: 1 1 220px; margin: 0; font-size: .84rem; font-weight: 700; }
.ksp-hcontact__status.is-ok { color: #047857; }
.ksp-hcontact__status.is-bad { color: var(--cl-crimson); }

.ksp-hcontact__visual { position: relative; display: flex; align-items: flex-end; justify-content: flex-end; padding-bottom: 36px; }
.ksp-hcontact.has-image { min-height: 660px; }
.ksp-hcontact__bg { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
/* Yatay fotoğraf: bölümün tamamı (model sağda kalır). Dikey: sağda tam boy, sola doğru zemine erir (gerilip bozulmaz) */
.ksp-hcontact__photo { position: absolute; inset-block: 0; inset-inline-end: 0; width: auto; height: 100%; max-width: 72%; object-fit: cover; object-position: 50% 20%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 34%); mask-image: linear-gradient(90deg, transparent 0%, #000 34%); }
.ksp-hcontact.is-wide .ksp-hcontact__photo { inset: 0; width: 100%; max-width: none; object-position: right center; -webkit-mask-image: none; mask-image: none; }
.ksp-hcontact__frost { position: absolute; inset: 0 auto 0 0; z-index: -1; width: calc(clamp(16px, 5vw, 96px) + 1010px); max-width: 100%;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  background: linear-gradient(90deg, rgba(255, 255, 255, .78) 0%, rgba(255, 255, 255, .55) 55%, rgba(255, 255, 255, .15) 100%);
  -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 220px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 220px), transparent); }
.ksp-hcontact__social { position: relative; }
.ksp-hcontact.has-image .ksp-hcontact__social { padding: 14px 18px; border-radius: 18px; background: rgba(12, 10, 9, .42);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.ksp-hcontact.has-image .ksp-hcontact__social p { color: #fff; }
.ksp-hcontact.has-image .ksp-hcontact__social a { color: #fff; }
.ksp-hcontact.has-image .ksp-hcontact__social a:hover, .ksp-hcontact.has-image .ksp-hcontact__social a:focus-visible { background: rgba(255, 255, 255, .18); color: #fff; }
.ksp-hcontact__social p { margin: 0 0 14px; color: #292524; font-size: .78rem; font-weight: 600; letter-spacing: .04em; }
.ksp-hcontact__social ul { display: flex; gap: 22px; margin: 0; padding: 0; list-style: none; }
.ksp-hcontact__social a { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: var(--cl-ink); font-size: 1.05rem;
  text-decoration: none; transition: color .2s ease, background-color .2s ease; }
.ksp-hcontact__social a:hover, .ksp-hcontact__social a:focus-visible { background: rgba(255, 255, 255, .55); color: var(--cl-crimson); }

@media (max-width: 1199.98px) {
  .ksp-hcontact__grid { grid-template-columns: 130px minmax(0, 1fr) minmax(0, .8fr); gap: 36px; }
}
@media (max-width: 991.98px) {
  .ksp-hcontact { padding-top: 32px; }
  .ksp-hcontact__grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .ksp-hcontact__side { gap: 10px; padding: 0 0 6px 16px; }
  .ksp-hcontact__title { gap: 12px; font-size: clamp(2.4rem, 10vw, 3.2rem); }
  .ksp-hcontact__thin, .ksp-hcontact__bold { writing-mode: horizontal-tb; transform: none; }
  .ksp-hcontact__form { padding: 18px 0 28px; }
  .ksp-hcontact__visual { justify-content: flex-start; padding-bottom: 28px; }
  .ksp-hcontact.has-image { min-height: 0; }
  .ksp-hcontact__frost { width: 100%; -webkit-mask-image: none; mask-image: none; background: rgba(253, 254, 254, .8); }
  .ksp-hcontact__photo { max-width: 100%; opacity: .55; }
  .ksp-hbrands__row { gap: 44px; padding-inline-end: 44px; }
  .ksp-hbrands__item img { height: 28px; }
}
@media (max-width: 575.98px) {
  .ksp-hcontact__send { justify-content: center; width: 100%; }
}

[data-bs-theme="dark"] .ksp-hbottom { --cl-crimson: #fb7185; --cl-ink: #f5f5f4; }
[data-bs-theme="dark"] .ksp-hbottom.has-photo .ksp-hbrands { background: linear-gradient(180deg, rgba(12, 10, 9, .5) 0%, rgba(12, 10, 9, 0) 100%); }
[data-bs-theme="dark"] .ksp-hbrands__item img { filter: grayscale(1) invert(1); opacity: .62; } /* koyu logolar koyu zeminde kaybolmasın */
[data-bs-theme="dark"] .ksp-hcontact__input { border-bottom-color: rgba(255, 255, 255, .28); }
[data-bs-theme="dark"] .ksp-hcontact__input::placeholder { color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-hcontact__consent, [data-bs-theme="dark"] .ksp-hcontact__social p { color: #d6d3d1; }
[data-bs-theme="dark"] .ksp-hcontact__frost { background: linear-gradient(90deg, rgba(12, 10, 9, .84) 0%, rgba(18, 25, 26, .72) 60%, rgba(18, 25, 26, .5) 100%); }
[data-bs-theme="dark"] .ksp-hcontact__send { background: #be123c; }
[data-bs-theme="dark"] .ksp-hcontact__status.is-ok { color: #34d399; }
@media (max-width: 991.98px) {
  [data-bs-theme="dark"] .ksp-hcontact__frost { background: rgba(12, 10, 9, .8); }
}
@media (prefers-reduced-motion: reduce) {
  .ksp-hbrands { overflow-x: auto; scrollbar-width: none; }
  .ksp-hbrands__track { animation: none; }
  .ksp-hbrands__row[aria-hidden="true"] { display: none; }
  .ksp-hcontact__send { transition: none; }
}

/* Seyrek veri (canlıda henüz hizmet / görsel yokken; sahip 2026-09-29 "buraya birşey yansımıyor"): az kartlı hero sayaçları ortalanır,
   görselsiz "Bize Ulaşın"da boş sağ sütun kalmaz — başlık + form + sosyal ortada, tamamlanmış görünür. */
.ksp-home-hero .ksp-hero2__stats { display: flex; flex-wrap: wrap; justify-content: center; }
.ksp-home-hero .ksp-hstat { flex: 1 1 20%; max-width: calc((100% - 3rem) / 4); min-width: 0; } /* az kartta çeyrek genişlik, ortada */
.ksp-hcontact:not(.has-image) .ksp-hcontact__visual { justify-content: flex-start; padding-bottom: 68px; }
@media (max-width: 991.98px) {
  .ksp-home-hero .ksp-hstat { flex: 1 1 40%; max-width: calc(50% - .5rem); } /* boşluktan bağımsız: satırda iki kart */
  .ksp-hcontact:not(.has-image) .ksp-hcontact__grid { grid-template-columns: minmax(0, 1fr); }
  .ksp-hcontact:not(.has-image) .ksp-hcontact__visual { padding-bottom: 28px; }
}
/* Panel — Site Ayarları > Ana Sayfa (hero videosu, marka satırları, Bize Ulaşın görseli) ve Gelen Mesajlar */
.ksp-adm-site-upload__preview.is-tall { width: 120px; aspect-ratio: 4 / 5; }
.ksp-adm-site-video { margin-top: 16px; }
.ksp-adm-site-video .ksp-adm-site-upload__preview img { width: 100%; height: 100%; object-fit: cover; }
.ksp-adm-site-video .ksp-adm-site-upload__empty { display: inline-flex; align-items: center; gap: 4px; }
.ksp-adm-site-brands { display: grid; gap: 10px; margin-bottom: 16px; }
.ksp-adm-site-brand { display: grid; grid-template-columns: 120px minmax(0, 1fr) minmax(0, 1.4fr) 76px auto; align-items: center; gap: 10px; padding: 10px;
  border: 1px solid var(--adm-line); border-radius: 12px; background: var(--adm-card-2); }
.ksp-adm-site-brand.is-bad { border-color: var(--adm-rose-line); }
.ksp-adm-site-brand__logo { display: grid; place-items: center; height: 48px; padding: 4px 8px; border-radius: 8px;
  background: repeating-conic-gradient(#f5f5f4 0 25%, #fff 0 50%) 0 0 / 12px 12px; }
.ksp-adm-site-brand__logo img { max-width: 100%; max-height: 38px; object-fit: contain; }
.ksp-adm-site-brand .ksp-adm-help { grid-column: 1 / -1; margin: 0; }
.ksp-adm-msgs { display: grid; gap: 12px; margin: 0 0 16px; padding: 0; list-style: none; }
.ksp-adm-msg { padding: 14px 16px; border: 1px solid var(--adm-line); border-radius: 14px; background: var(--adm-card); scroll-margin-top: 90px; }
.ksp-adm-msg.is-new { border-color: var(--adm-blue-line); box-shadow: inset 3px 0 0 var(--adm-blue); }
.ksp-adm-msg__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 8px; }
.ksp-adm-msg__name { color: var(--adm-ink); font-size: .95rem; }
.ksp-adm-msg__time { margin-inline-start: auto; color: var(--adm-muted); font-size: .78rem; }
.ksp-adm-msg__body { margin: 0 0 12px; color: var(--adm-ink-2); font-size: .9rem; line-height: 1.6; white-space: normal; overflow-wrap: anywhere; }
.ksp-adm-msg__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ksp-adm-msg__foot form { margin: 0; }
.ksp-adm-msg__spacer { flex: 1 1 auto; }
@media (max-width: 767.98px) {
  .ksp-adm-site-brand { grid-template-columns: 96px minmax(0, 1fr) 64px; }
  .ksp-adm-site-brand > input[type="url"] { grid-column: 1 / -1; }
  .ksp-adm-site-brand > .ksp-adm-check { grid-column: 1 / -1; }
  .ksp-adm-msg__time { margin-inline-start: 0; width: 100%; }
}
/* Alt kategori kartı salon kartı bileşenleriyle (§82.19): yorumsuz puan satırı sönük, gövde aralıkları */
.ksp-rate.is-new { color: var(--ksp-muted); font-weight: 600; }
.ksp-rate.is-new .material-symbols-rounded { color: var(--ksp-muted); }
.ksp-hsub__body .ksp-amenities { margin: 0; }
.ksp-hsub__body .ksp-crew { padding: .6rem .8rem; }
/* Ana sayfa kartındaki bağlantısız "+N" (span): olanak çipi kuralı (.ksp-amenities > span) ezmesin, salon kartındaki pembe kalsın */
.ksp-amenities > span.ksp-chip-more { flex: 0 0 auto; color: var(--ksp-primary); background: rgba(236, 0, 63, .08); font-weight: 800; cursor: default; }
.ksp-amenities > span.ksp-chip-more:hover { color: var(--ksp-primary); background: rgba(236, 0, 63, .08); }
/* Kart gövdesi de kapsayıcı: salon kartının dar kart kuralları (uzman kutusu sıkı, ≤270px "1 Usta" kısa etiketi) burada da işlesin */
.ksp-hsub__body { container-type: inline-size; }
/* Telefonda İKİLİ kart (sahip 2026-09-29: "responsivde bu alanlar 2'li gelsin", §82.23) — kart ~165px: kapak kısa, rozetler tek
   satır (kategori adı kırpılır, hizmet sayısı tam), puan ile fiyat alt alta, uzman kutusunda durum alt satıra iner, düğme sıkı.
   Bu blok §82.19 kurallarından SONRA durmalı (aynı özgüllükte, sıra kazanır). */
@media (max-width: 575.98px) {
  .ksp-hsub__cover { min-height: 132px; padding: 10px; }
  .ksp-hsub__badges { flex-wrap: nowrap; gap: 4px; min-width: 0; }
  .ksp-hsub__badge { min-width: 0; padding: 3px 7px; font-size: .6rem; }
  .ksp-hsub__badge.is-green { flex-shrink: 0; }
  .ksp-hsub__badge .material-symbols-rounded { flex-shrink: 0; font-size: 12px; }
  .ksp-hsub__title { font-size: .95rem; line-height: 1.2; }
  .ksp-hsub__body { gap: 8px; padding: 10px; }
  .ksp-hsub__body .ksp-salon2__row { flex-direction: column; align-items: flex-start; gap: 2px; }
  .ksp-hsub__body .ksp-rate { font-size: .72rem; }
  .ksp-hsub__body .ksp-salon2__price { font-size: .74rem; white-space: normal; }
  .ksp-hsub__desc { font-size: .74rem; line-height: 1.4; }
  .ksp-hsub__body .ksp-crew { flex-wrap: wrap; row-gap: 6px; padding: .45rem .5rem; }
  .ksp-hsub__body .ksp-crew__status { margin-inline-start: 0; }
  .ksp-hsub__book { gap: 5px; padding: 9px 8px; font-size: .8rem; }
  .ksp-hsub__book .material-symbols-rounded { font-size: 17px; }
}
/* Telefonda (sahip 2026-09-29, §82.24): hero "Popüler Aramalar" gizli; kategori şeridi 5'li İKON ızgarası — ikon kutusu + altında ad
   (2 satır), sayı rozeti yok, "Tüm Hizmetler" yok (5 ana kategori tek sıra; fazlası alt sıraya iner). İkon seçim penceresini açar. */
@media (max-width: 575.98px) {
  .ksp-hero2__popular { display: none; }
  .ksp-hcats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px 6px; margin: 0 0 18px; padding: 0; overflow: visible; }
  .ksp-hcats > .ksp-hcat[data-hcat="all"] { display: none; }
  .ksp-hcats > .ksp-hcat { flex-direction: column; justify-content: flex-start; gap: 6px; max-width: none; padding: 0; border: 0; border-radius: 0;
    background: transparent; box-shadow: none; color: var(--ksp-text); text-align: center; }
  .ksp-hcats > .ksp-hcat:hover { box-shadow: none; transform: none; }
  .ksp-hcats > .ksp-hcat:focus-visible { outline: 0; }
  .ksp-hcats > .ksp-hcat:focus-visible .ksp-hcat__icon { outline: 3px solid rgba(var(--ksp-primary-rgb), .45); outline-offset: 2px; }
  .ksp-hcats .ksp-hcat__icon { width: 54px; max-width: 100%; height: 54px; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface);
    box-shadow: var(--ksp-shadow-sm); transition: background-color .15s, color .15s, box-shadow .15s; }
  .ksp-hcats .ksp-hcat__icon .material-symbols-rounded { font-size: 25px; }
  .ksp-hcats .ksp-hcat__name { display: -webkit-box; width: 100%; overflow: hidden; font-size: .62rem; font-weight: 700; line-height: 1.25; white-space: normal;
    -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; } /* "Tırnak / Stüdyosu & / Nail Art" tam okunsun */
  .ksp-hcats .ksp-hcat__count { display: none; }
  .ksp-hcats > .ksp-hcat.is-active { border: 0; background: transparent; box-shadow: none; color: var(--ksp-primary); }
  .ksp-hcats > .ksp-hcat.is-active .ksp-hcat__icon { border-color: var(--ksp-primary); background: var(--ksp-primary); color: #fff;
    box-shadow: 0 8px 18px -8px rgba(var(--ksp-primary-rgb), .7); }
}

/* §82.25 (sahip 2026-09-29) — (1) Kategori kartları ile "Salonumuzdaki Uzman Ekibimiz" arası daraldı (web 9rem → 4rem, telefon
   6.5rem → 3rem). (2) Paket kartı: "Paketle Randevu Al" hiç kırılmaz; kart dar kalınca (≤320px gövde) düğme fiyatın ALTINA tam
   genişlik iner ("patlamış yazı" — telefonda 3 satıra bölünüyordu). (3) "Diğer Popüler Dönüşüm Örnekleri" TEK SIRA: masaüstünde
   6'lı, 1200px altı 4'lü, 768px altı 3'lü, telefonda 2'si + sonrakinin ucu; sığmayınca ‹ › okları (app.js "@degisim-oklar"). */
.ksp-home-cats { padding-bottom: 2rem; }
.ksp-home-cats + .ksp-home-team { padding-top: 2rem; }
@media (max-width: 575.98px) {
  .ksp-home-cats { padding-bottom: 1.5rem; }
  .ksp-home-cats + .ksp-home-team { padding-top: 1.5rem; }
}
.ksp-pkg__foot .btn { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; gap: .35rem; white-space: nowrap; }
.ksp-pkg__body { container-type: inline-size; }
@container (max-width: 320px) {
  .ksp-pkg__foot { flex-wrap: wrap; gap: .6rem; }
  .ksp-pkg__foot .ksp-pkg__price { flex: 1 1 100%; }
  .ksp-pkg__foot .btn { flex: 1 1 100%; padding-block: .6rem; }
}
.ksp-sp-tf-others__head { align-items: center; }
.ksp-sp-tf-others__hint { margin-inline-start: auto; }
.ksp-sp-tf-others__nav { display: inline-flex; flex: none; gap: 6px; }
.ksp-sp-tf-others__nav[hidden] { display: none; }
.ksp-sp-tf-others__nav button { display: inline-grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid var(--ksp-border); border-radius: 50%;
  background: var(--ksp-surface); color: var(--ksp-text); cursor: pointer; transition: border-color .15s, color .15s; }
.ksp-sp-tf-others__nav button .material-symbols-rounded { font-size: 20px; }
.ksp-sp-tf-others__nav button:hover:not(:disabled) { border-color: rgba(var(--ksp-primary-rgb), .45); color: var(--ksp-primary); }
.ksp-sp-tf-others__nav button:disabled { opacity: .35; cursor: default; }
.ksp-sp-tf-others__nav button:focus-visible { outline: 3px solid rgba(var(--ksp-primary-rgb), .45); outline-offset: 2px; }
.ksp-sp-tf-thumbs { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 5 * 10px) / 6); gap: 10px;
  overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 2px; }
.ksp-sp-tf-thumbs::-webkit-scrollbar { display: none; }
.ksp-sp-tf-thumbs > li { min-width: 0; scroll-snap-align: start; }
@media (max-width: 1199.98px) { .ksp-sp-tf-thumbs { grid-auto-columns: calc((100% - 3 * 10px) / 4); } }
@media (max-width: 767.98px) { .ksp-sp-tf-thumbs { grid-auto-columns: calc((100% - 2 * 10px) / 3); } }
@media (max-width: 575.98px) { .ksp-sp-tf-thumbs { grid-auto-columns: 44%; } .ksp-sp-tf-others__hint { display: none; } }

/* @firsat-paketleri — /firsat-paketleri (sahip 2026-09-29, KARARLAR §82.26): Salon Keşfet paket sayfası düzeninin tek salon hâli —
   koyu künye + sayı kutusu, kategori çipleri, arama çubuğu (sıralama seçim penceresinde, "%" = yalnız indirimli), sayı satırı + iptal
   kuralı, 3'lü kart ızgarası (kart: .ksp-pkg ortak), sayfa düğmeleri. Eski çok salonlu paket sayfası sınıfları KULLANILMAZ. */
.ksp-deals { padding: 1.5rem 0 4rem; }
.ksp-deals__hero { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 2rem 2.25rem; border-radius: 24px; color: #fff;
  background: radial-gradient(60% 120% at 92% 0%, rgba(136, 19, 55, .5), transparent 70%), linear-gradient(135deg, #1c1917 0%, #0c0a09 100%); }
.ksp-deals__heroText { min-width: 0; max-width: 660px; }
.ksp-deals__hero h1 { margin: .55rem 0 .45rem; color: #fff; font-size: clamp(1.45rem, 3vw, 2rem); font-weight: 800; letter-spacing: -.035em; }
.ksp-deals__hero p { margin: 0; color: #d6d3d1; font-size: .9rem; line-height: 1.55; }
.ksp-deals__stats { display: flex; flex: none; margin: 0; padding: .95rem .35rem; border: 1px solid rgba(255, 255, 255, .14); border-radius: 18px; background: rgba(255, 255, 255, .04); }
.ksp-deals__stats > div { display: flex; flex-direction: column-reverse; align-items: center; gap: .15rem; padding: 0 1.15rem; text-align: center; }
.ksp-deals__stats > div + div { border-inline-start: 1px solid rgba(255, 255, 255, .1); }
.ksp-deals__stats dd { margin: 0; color: #fb7185; font-size: 1.5rem; font-weight: 800; line-height: 1.1; }
.ksp-deals__stats dd.is-amber { color: #fbbf24; }
.ksp-deals__stats dd.is-green { color: #34d399; }
.ksp-deals__stats dt { color: #d6d3d1; font-size: .68rem; font-weight: 600; white-space: nowrap; }
.ksp-deals__cats { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.25rem 0 1rem; scroll-margin-top: 96px; }
.ksp-deals__anchor { display: block; height: 1rem; scroll-margin-top: 96px; }
.ksp-deals__chip { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .6rem .55rem .95rem; border: 1px solid var(--ksp-border); border-radius: 999px;
  background: var(--ksp-surface); color: var(--ksp-text); font-size: .82rem; font-weight: 700; text-decoration: none; white-space: nowrap; transition: border-color .15s, background-color .15s; }
.ksp-deals__chip b { padding: .05rem .5rem; border-radius: 999px; background: var(--ksp-surface-2); color: var(--ksp-muted); font-size: .7rem; font-weight: 800; }
.ksp-deals__chip:hover { border-color: rgba(var(--ksp-primary-rgb), .45); color: var(--ksp-text); }
.ksp-deals__chip.is-active { border-color: var(--ksp-primary); background: var(--ksp-primary); color: #fff; }
.ksp-deals__chip.is-active b { background: rgba(255, 255, 255, .22); color: #fff; }
.ksp-deals__chip:focus-visible { outline: 3px solid rgba(var(--ksp-primary-rgb), .4); outline-offset: 2px; }
.ksp-deals__bar { display: flex; align-items: center; gap: .6rem; padding: .6rem; border: 1px solid var(--ksp-border); border-radius: 18px; background: var(--ksp-surface); box-shadow: var(--ksp-shadow-sm); }
.ksp-deals__search { display: flex; flex: 1 1 auto; align-items: center; gap: .55rem; min-width: 0; height: 46px; margin: 0; padding: 0 .95rem; border-radius: 12px; background: var(--ksp-surface-2); color: var(--ksp-muted); cursor: text; }
.ksp-deals__search:focus-within { box-shadow: 0 0 0 2px rgba(var(--ksp-primary-rgb), .35); }
.ksp-deals__search .material-symbols-rounded { font-size: 20px; }
.ksp-deals__search input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: var(--ksp-text); font: inherit; font-size: .9rem; }
.ksp-deals__search input::placeholder { color: var(--ksp-muted); }
.ksp-deals__sort { display: flex; flex: 0 0 auto; align-items: center; width: auto; min-width: 220px; height: 46px; margin: 0; padding: 0 .9rem; border: 1px solid var(--ksp-border); border-radius: 12px;
  background: var(--ksp-surface); color: var(--ksp-text); font-size: .85rem; font-weight: 600; }
.ksp-deals__sort:focus-within { box-shadow: 0 0 0 2px rgba(var(--ksp-primary-rgb), .35); } /* JS'siz yerel select'te de odak görünsün */
.ksp-deals__sort select { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: inherit; font: inherit; }
.ksp-deals__sortlbl { flex: none; margin-inline-end: .3rem; white-space: nowrap; }
.ksp-deals__sort .ksp-sheetbtn { min-width: 0; }
/* iPhone 16px altındaki alana odaklanınca sayfayı yakınlaştırır — dokunmatikte arama kutusu 16px */
@media (hover: none) and (pointer: coarse) { .ksp-deals__search input { font-size: 16px; } }
.ksp-deals__off { position: relative; display: grid; flex: none; place-items: center; width: 46px; height: 46px; margin: 0; border: 1px solid var(--ksp-border); border-radius: 12px;
  background: var(--ksp-surface); color: var(--ksp-text); font-size: 1rem; font-weight: 800; cursor: pointer; transition: background-color .15s, border-color .15s, color .15s; }
.ksp-deals__off input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.ksp-deals__off.is-on, .ksp-deals__off:has(input:checked) { border-color: var(--ksp-primary); background: var(--ksp-primary); color: #fff; }
.ksp-deals__off:focus-within { outline: 3px solid rgba(var(--ksp-primary-rgb), .4); outline-offset: 2px; }
.ksp-deals__go { flex: none; height: 46px; padding: 0 1.5rem; border-radius: 12px; font-weight: 800; }
.ksp-deals__count { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; margin: .95rem 0 1.15rem; color: var(--ksp-muted); font-size: .8rem; }
.ksp-deals__count strong { color: var(--ksp-text); }
.ksp-deals__note { display: inline-flex; align-items: center; gap: .3rem; color: var(--ksp-success); font-weight: 600; }
.ksp-deals__note .material-symbols-rounded { font-size: 17px; }
.ksp-deals__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; }
.ksp-deals__grid .ksp-pkg { border: 1px solid var(--ksp-border); box-shadow: var(--ksp-shadow-sm); }
.ksp-deals__pager { display: flex; align-items: center; justify-content: center; gap: .75rem; margin-top: 2rem; }
.ksp-deals__pagebtn { display: inline-flex; align-items: center; gap: .25rem; padding: .55rem 1rem; border: 1px solid var(--ksp-border); border-radius: 999px;
  background: var(--ksp-surface); color: var(--ksp-text); font-size: .85rem; font-weight: 700; text-decoration: none; }
.ksp-deals__pagebtn:hover { border-color: rgba(var(--ksp-primary-rgb), .45); color: var(--ksp-primary); }
.ksp-deals__pagebtn .material-symbols-rounded { font-size: 19px; }
.ksp-deals__pageof { color: var(--ksp-muted); font-size: .82rem; font-weight: 600; }
.ksp-deals__empty { display: flex; flex-direction: column; align-items: center; gap: .6rem; padding: 3rem 1rem; border: 1px dashed var(--ksp-border); border-radius: 20px;
  background: var(--ksp-surface); color: var(--ksp-muted); text-align: center; }
.ksp-deals__empty .material-symbols-rounded { font-size: 40px; color: var(--ksp-primary); }
.ksp-deals__empty p { margin: 0; font-weight: 600; }
@media (max-width: 991.98px) {
  .ksp-deals__hero { flex-direction: column; align-items: flex-start; }
  .ksp-deals__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .ksp-deals__bar { flex-wrap: wrap; }
  .ksp-deals__search { flex-basis: 100%; }
  .ksp-deals__sort { flex: 1 1 0; width: auto; min-width: 0; } /* sıralama daralır: sıralama · % · Ara tek sırada */
  .ksp-deals__go { padding: 0 1.1rem; }
  .ksp-deals__sortlbl { display: none; }
}
@media (max-width: 575.98px) {
  .ksp-deals { padding-top: 1rem; }
  .ksp-deals__hero { padding: 1.4rem 1.2rem; border-radius: 20px; }
  .ksp-deals__stats { width: 100%; }
  .ksp-deals__stats > div { flex: 1 1 0; padding: 0 .35rem; }
  /* Taşma kabın yan boşluğu kadar (Bootstrap .container 12px) — fazlası sayfayı yatay kaydırıyordu */
  .ksp-deals__cats { flex-wrap: nowrap; margin-inline: -.75rem; padding: 2px .75rem 4px; overflow-x: auto; scroll-padding-inline: .75rem; scrollbar-width: none; }
  .ksp-deals__cats::-webkit-scrollbar { display: none; }
  .ksp-deals__grid { grid-template-columns: 1fr; }
}

/* @personel-menu — Personel Kokpiti telefon / tablet (sahip 2026-09-29: "personel kısmı tam sığmıyor, menü bu şekilde açılsın,
   Bugünkü Randevular kısmını 2'li yan yana yap" — KARARLAR §82.27). <992px: sekme ızgarası yerine TEK düğme (seçili sekme + sayı +
   açılır ok) → seçim penceresi (ikon kutusu + ad + sayı rozeti). Düğme JS açınca görünür (.has-sheet); JS yoksa ızgara kalır.
   Telefonda (≤640px) KPI kartları ikili ve sıkı. */
.ksp-pk-menubtn { display: none; }
@media (max-width: 991.98px) {
  .ksp-pk-tabs.has-sheet { padding: 6px; }
  .ksp-pk-tabs.has-sheet::after { display: none; }
  .ksp-pk-tabs.has-sheet .ksp-pk-tabs__list { display: none; }
  .ksp-pk-tabs.has-sheet .ksp-pk-menubtn { display: flex; }
  .ksp-pk-menubtn { align-items: center; gap: 10px; width: 100%; min-height: 50px; padding: 8px 12px 8px 8px; border: 0; border-radius: 12px;
    background: var(--ksp-text); color: var(--ksp-surface); font: inherit; font-size: .92rem; font-weight: 800; text-align: start; cursor: pointer; }
  .ksp-pk-menubtn > .material-symbols-rounded:first-child { display: grid; flex: none; place-items: center; width: 34px; height: 34px; border-radius: 10px;
    background: rgba(255, 255, 255, .14); font-size: 20px; }
  .ksp-pk-menubtn__label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ksp-pk-menubtn b { flex: none; padding: 1px 8px; border-radius: 999px; background: rgba(255, 255, 255, .18); font-size: .72rem; font-weight: 800; }
  .ksp-pk-menubtn__caret { flex: none; font-size: 22px; opacity: .85; }
  .ksp-pk-menubtn:focus-visible { outline: 3px solid rgba(var(--ksp-primary-rgb), .45); outline-offset: 2px; }
}
@media (max-width: 640px) {
  .ksp-pk-kpis, .ksp-pk-kpis--inline { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ksp-pk-kpi { min-width: 0; padding: 12px; border-radius: 14px; }
  .ksp-pk-kpi__head { gap: 6px; font-size: .7rem; line-height: 1.25; }
  .ksp-pk-kpi__head > span { min-width: 0; }
  .ksp-pk-kpi__head .material-symbols-rounded { flex: none; font-size: 17px; }
  .ksp-pk-kpi strong { flex-wrap: wrap; gap: 4px; margin: 6px 0 3px; font-size: 1.3rem; }
  .ksp-pk-kpi strong small { font-size: .68rem; }
  .ksp-pk-kpi__foot { font-size: .66rem; line-height: 1.3; }
}

/* @personel-duzen — Personel Kokpiti telefon düzeni (sahip 2026-09-29: "sağdan soldan geniş değil ortada kalıyor, burayı da düzenle
   düzensiz" — KARARLAR §82.28). (1) <992px kenar boşluğu TEK kat 12px (kabuk 16px + kokpit 16px = 32px iki kat oluyordu).
   (2) Randevu kartı işlemleri eşit genişlikte ızgara: tek tıklık (Onayla · Tamamlandı · Gelmedi) yan yana, alan isteyenler
   (Ertele · Müsait Değilim · İptal Et · Not Ekle) telefonda 2'li, genişte 4'lü; açılan işlemin formu tam satıra yayılır. */
@media (max-width: 991.98px) {
  .ksp-share-page:has(.ksp-pk) .ksp-share-page__main { padding: 12px 12px 40px; }
  .ksp-pk.ksp-portal { padding: 0; }
}
.ksp-pk-islem__durum { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 200px)); gap: 6px; }
.ksp-pk-islem__durum form { min-width: 0; }
.ksp-pk-islem__durum .ksp-pk-islem__btn { width: 100%; justify-content: center; }
.ksp-pk-ops { display: grid; grid-template-columns: repeat(auto-fit, minmax(135px, 200px)); gap: 6px; }
.ksp-pk-op { min-width: 0; }
.ksp-pk-op[open] { grid-column: 1 / -1; }
.ksp-pk-op > summary { display: flex; justify-content: center; width: 100%; white-space: nowrap; }
/* Telefonda açıkça 2 sütun (üst sınırlı auto-fit dar kartta tek sütuna düşüyordu); bekleyen randevuda Onayla üstte tam satır */
@media (max-width: 575.98px) {
  .ksp-pk-islem__durum, .ksp-pk-ops { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-pk-islem__durum form:first-child:nth-last-child(3) { grid-column: 1 / -1; }
}

/* @uzman-foto — Uzman tanıtım sayfası (sahip 2026-09-29: "personel profilinin tanıtım profil resmini tam boy yap sığsın, küçük kalmış" —
   KARARLAR §82.29): telefonda fotoğraf kartın TAM genişliğinde (158px'ten), 4:5 portre, yüz kesilmesin diye üstten hizalı; geniş
   telefonda / küçük tablette en çok 420px (aşırı uzamasın). Rozet büyüdü. ≥768px düzen değişmedi (258px). */
@media (max-width: 767.98px) {
  .ksp-stfp-photo { width: 100%; max-width: 420px; padding: 8px; border-radius: 22px; }
  .ksp-stfp-photo__img { border-radius: 16px; background-position: center top; font-size: 2.5rem; }
  .ksp-stfp-photo__badge { inset-inline: 16px; inset-block-end: 16px; padding: 8px 12px; font-size: .72rem; }
  .ksp-stfp-photo__badge .material-symbols-rounded { font-size: 17px; }
}

/* @musteri-menu — Müşteri Profilim telefon / tablet (sahip seçimi 2026-09-29: "menüler üstte var altta var, responsivde oturmuyor
   kayıyor" — KARARLAR §82.30). <992px ve menü penceresi açılabiliyorsa (body.has-cust-menu, JS): başlıkta yalnız başlık + profil
   simgesi, üst sekme şeridi gizli; tek menü alttaki 5 sabit öğe (Biletler · Kartım · Randevu Al · Kuponlar · Menü). Sayfa yana kaymaz. */
.ksp-cust-top__menu { display: none; }
@media (max-width: 991.98px) {
  body.has-cust-menu .ksp-cust-top__acts, body.has-cust-menu .ksp-cust-tabs { display: none; }
  body.has-cust-menu .ksp-cust-top__inner { flex-wrap: nowrap; }
  body.has-cust-menu .ksp-cust-brand { flex: 1 1 auto; }
  body.has-cust-menu .ksp-cust-top__menu { display: grid; flex: none; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--ksp-border);
    border-radius: 50%; background: var(--ksp-surface); color: var(--ksp-text); cursor: pointer; }
  body.has-cust-menu .ksp-cust-top__menu .material-symbols-rounded { font-size: 22px; }
  body.has-cust-menu .ksp-cust-top__menu:focus-visible { outline: 3px solid rgba(var(--ksp-primary-rgb), .45); outline-offset: 2px; }
  .ksp-cust-brand__text h1 { min-width: 0; }
}

/* @cip-pencere — Salon sayfası + ana sayfa telefon düzeni (sahip 2026-09-29, KARARLAR §82.31). (1) Süzgeç çipleri (hizmet,
   magazin, değişim, uzman kadrosu) ≤767px'te tek düğme → seçim penceresi (app.js "@cip-pencere"; kap yalnız JS kurunca gizlenir).
   (2) Magazin sekmesi telefonda tablo yerine KART görünümü: resim üstte, yazı altta (dar tabloda yazılar bozuluyordu).
   (3) Salon "Fırsat Paketleri" sekmesi ızgarası: tablette 2, telefonda 1 sütun (3 sütunda kartlar 95px'e sıkışıyordu). */
.ksp-chipsheet { display: none; }
@media (max-width: 767.98px) {
  [data-chip-sheet].has-chip-sheet { display: none !important; }
  .ksp-chipsheet { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 50px; margin: 0 0 12px; padding: 7px 12px 7px 7px;
    border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); color: var(--ksp-text); font: inherit;
    font-size: .9rem; font-weight: 800; text-align: start; cursor: pointer; box-shadow: var(--ksp-shadow-sm); }
  .ksp-chipsheet__ico { display: grid; flex: none; place-items: center; width: 36px; height: 36px; border-radius: 10px;
    background: rgba(var(--ksp-primary-rgb), .1); color: var(--ksp-primary); }
  .ksp-chipsheet__ico .material-symbols-rounded { font-size: 20px; }
  .ksp-chipsheet__label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ksp-chipsheet__n { flex: none; padding: 1px 8px; border-radius: 999px; background: var(--ksp-primary-50); color: var(--ksp-primary); font-size: .72rem; font-weight: 800; }
  .ksp-chipsheet__n[hidden] { display: none; }
  .ksp-chipsheet__caret { flex: none; font-size: 22px; color: var(--ksp-muted); }
  .ksp-chipsheet:focus-visible { outline: 3px solid rgba(var(--ksp-primary-rgb), .45); outline-offset: 2px; }
  .ksp-sp-press__bar .ksp-chipsheet { margin: 0; }
  /* Kart / tablo seçimini @salon-magazin JS yapar (telefonda kartlar; genişlik değişince de). CSS zorlamaz: Bootstrap
     [hidden] !important kuralı yenerdi, JS kapalıyken tablo görünür kalır (§82.31 incelemesi) */
  .ksp-sp-press__grid { grid-template-columns: 1fr; }
  .ksp-sp-press__bar .ksp-sp-net__view { display: none; }
}
@media (max-width: 991.98px) { .ksp-sp-pkggrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .ksp-sp-pkggrid { grid-template-columns: 1fr; } }

/* @personel-altmenu — Personel Kokpiti alt menüsü + E-Bilet araması (sahip 2026-09-29: "personel panelindeki menüleri de kullanıcı
   menüsü gibi yapalım, messenger ortada durmasın alt menüye ekle" — KARARLAR §82.32). <992px: 5 sabit öğe (Randevularım · Raporum ·
   ortada Mesajlar · Vardiyam · Menü). JS açınca (body.has-pk-nav) üstteki menü düğmesi / yan şerit ve sağ alttaki yüzen mesaj düğmesi
   gizlenir; mesaj kutusu alt menünün üstünde açılır (telefonda tam ekran kuralı aynen). Rozet yüzen düğmenin sayısını izler. */
.ksp-bottom-nav__icon { position: relative; }
.ksp-bottom-nav__badge { position: absolute; top: -4px; inset-inline-end: 4px; min-width: 20px; height: 20px; padding: 0 5px; border: 2px solid var(--ksp-bg);
  border-radius: 999px; background: var(--ksp-danger); color: #fff; font-size: .62rem; font-weight: 800; line-height: 16px; text-align: center; }
.ksp-bottom-nav__badge[hidden] { display: none; }
.ksp-bottom-nav__item.is-fab .ksp-bottom-nav__badge { top: -3px; inset-inline-end: -5px; }
@media (max-width: 991.98px) {
  .ksp-share-page:has(.ksp-pk) .ksp-share-page__main { padding-bottom: calc(var(--ksp-bottom-h) + 28px + env(safe-area-inset-bottom)); }
  .ksp-share-page:has(.ksp-bottom-nav) .ksp-dock { bottom: calc(var(--ksp-bottom-h) + 14px + env(safe-area-inset-bottom)); }
  .ksp-share-page:has(.ksp-bottom-nav) .ksp-appin { bottom: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom) + 12px); }
  body.has-pk-nav .ksp-pk-side, body.has-pk-nav .ksp-dock__fab { display: none; }
  /* .ksp-share-page ile: üstteki :has() kuralı (0,3,0) bunu eziyordu, kutu alt menünün 24px üstünde kalıyordu (inceleme 2026-09-29) */
  body.ksp-share-page.has-pk-nav .ksp-dock { bottom: calc(var(--ksp-bottom-h) + env(safe-area-inset-bottom)); }
}
@media (min-width: 576px) and (max-width: 991.98px) and (min-height: 541px) {
  body.has-pk-nav .ksp-dock__panel { bottom: 10px; height: min(620px, calc(100dvh - var(--ksp-bottom-h) - 34px - env(safe-area-inset-bottom))); }
}
/* E-Bilet kodu araması + okutulan biletin kartı (Randevularım) */
.ksp-pk-bilet { display: flex; align-items: center; gap: 6px; max-width: 440px; margin: 0 0 12px; padding: 4px 4px 4px 12px; border: 1px solid var(--ksp-border);
  border-radius: 999px; background: var(--ksp-surface); color: var(--ksp-muted); }
.ksp-pk-bilet:focus-within { border-color: var(--ksp-primary); box-shadow: 0 0 0 3px rgba(var(--ksp-primary-rgb), .16); }
.ksp-pk-bilet > .material-symbols-rounded { font-size: 20px; }
.ksp-pk-bilet input { flex: 1 1 auto; min-width: 0; border: 0; background: transparent; color: var(--ksp-text); font-size: .88rem; font-weight: 600; outline: 0; }
.ksp-pk-bilet input::-webkit-search-cancel-button { display: none; }
.ksp-pk-bilet button { flex: none; padding: 7px 18px; border: 0; border-radius: 999px; background: var(--ksp-primary); color: #fff; font-size: .82rem; font-weight: 800; }
.ksp-pk-biletkart { margin: 0 0 14px; padding: 12px 14px; border: 1px solid rgba(var(--ksp-primary-rgb), .35); border-radius: 14px; background: rgba(var(--ksp-primary-rgb), .06); }
.ksp-pk-biletkart.is-limited { border-color: var(--ksp-border); background: var(--ksp-surface-2); }
.ksp-pk-biletkart__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 6px; }
.ksp-pk-biletkart__head > .material-symbols-rounded { color: var(--ksp-primary); font-size: 20px; }
.ksp-pk-biletkart__meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0; color: var(--ksp-muted); font-size: .8rem; }
.ksp-pk-biletkart__meta > span { display: inline-flex; align-items: center; gap: 4px; }
.ksp-pk-biletkart__meta .material-symbols-rounded { font-size: 16px; }
.ksp-pk-biletkart__note { margin: 8px 0 0; color: var(--ksp-muted); font-size: .76rem; }
.ksp-pk-appt { scroll-margin-top: 16px; }
.ksp-pk-appt.is-scanned { border-color: var(--ksp-primary); box-shadow: 0 0 0 3px rgba(var(--ksp-primary-rgb), .18); }
@media (max-width: 575.98px) {
  .ksp-pk-bilet { max-width: none; }
  .ksp-pk-bilet input { font-size: 16px; } /* iOS odakta yakınlaştırmasın */
}
/* E-Bilet penceresi alt çubuğu (§82.32): üç düğme ("Resim Olarak Kaydet" eklendi) dar ekranda taşıyordu → ≤575px'te
   "Resim Olarak Kaydet" tam satır, altında Yazdır / PDF + Kapat yan yana */
.ksp-tkt-modal__foot { flex-wrap: wrap; }
@media (max-width: 575.98px) {
  .ksp-tkt-modal__foot { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksp-tkt-modal__foot [data-tm-image] { grid-column: 1 / -1; }
  .ksp-tkt-modal__foot .ksp-cust-btn { min-width: 0; padding-inline: 10px; }
}

/* @kokpit-telefon — Salon Kokpiti telefon / tablet düzeni (sahip 2026-09-29: "işaretli alanları düzelt; üstte menü var, altta bu sefer
   eksiklik var; hizmet düğmelerini 2'li yap; yorum yazılarını düzelt, süzgeci pencerede aç; S.S.S. yazıları bozuk; müzik yönetimini
   düzelt; sadakat yazıları okunmuyor" — KARARLAR §82.33). (1) <992px TEK menü alttadır ("Menü" → seçim penceresi, app.js "@panel-menu");
   üstteki kayan modül şeridi gizlenir, bölüm seçici (Tüm Salon / Kadın / Erkek) kalır. (2) Yorum süzgeci, Sadakat sekmeleri, Ayarlar
   bölümleri <992px seçim penceresinde (data-chip-sheet-upto="lg"). (3) Sayfa başlıkları ve satırlar dar ekranda taşmaz. */
@media (max-width: 991.98px) {
  body.has-panel-menu .ksp-ptabs__nav { display: none; }
  body.has-panel-menu .ksp-ptabs--nosec { display: none; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  [data-chip-sheet-upto="lg"].has-chip-sheet { display: none !important; }
  .ksp-chipsheet.ksp-chipsheet--lg { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 50px; margin: 0 0 12px; padding: 7px 12px 7px 7px;
    border: 1px solid var(--ksp-border); border-radius: 14px; background: var(--ksp-surface); color: var(--ksp-text); font: inherit;
    font-size: .9rem; font-weight: 800; text-align: start; cursor: pointer; box-shadow: var(--ksp-shadow-sm); }
  .ksp-chipsheet--lg .ksp-chipsheet__ico { display: grid; flex: none; place-items: center; width: 36px; height: 36px; border-radius: 10px;
    background: rgba(var(--ksp-primary-rgb), .1); color: var(--ksp-primary); }
  .ksp-chipsheet--lg .ksp-chipsheet__ico .material-symbols-rounded { font-size: 20px; }
  .ksp-chipsheet--lg .ksp-chipsheet__label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ksp-chipsheet--lg .ksp-chipsheet__n { flex: none; padding: 1px 8px; border-radius: 999px; background: var(--ksp-primary-50); color: var(--ksp-primary); font-size: .72rem; font-weight: 800; }
  .ksp-chipsheet--lg .ksp-chipsheet__n[hidden] { display: none; }
  .ksp-chipsheet--lg .ksp-chipsheet__caret { flex: none; font-size: 22px; color: var(--ksp-muted); }
}
/* Kapların kendi aralığı (gap) var: pencere düğmesi ek alt boşluk bırakmasın */
.ksp-rev > .ksp-chipsheet, .ksp-loy > .ksp-chipsheet, .ksp-set-nav > .ksp-chipsheet { margin-bottom: 0; }
/* Ayarlar başlığı: "Randevu Kuralları & Bakım" kartın dışına taşıyordu → doluluk tam satır, düğmeler sığdığı kadar yan yana */
@media (max-width: 767.98px) {
  .ksp-set-head__acts { flex-wrap: wrap; gap: 10px; }
  .ksp-set-fill { width: 100%; }
  .ksp-set-head__acts .ksp-set-view { flex: 1 1 auto; min-width: 0; white-space: normal; text-align: center; }
}
/* Hizmet Kataloğu başlığı: yan düğmeler 2'li ızgara, "Yeni Hizmet Ekle" tam satır; tek kalan yan düğme de tam satır */
@media (max-width: 575.98px) {
  .ksp-svc-head__acts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .ksp-svc-head__acts > .ksp-svc-add { min-width: 0; padding: 0 10px; font-size: 13px; }
  .ksp-svc-head__acts > .ksp-svc-add:not(.ksp-svc-add--ghost),
  .ksp-svc-head__acts > .ksp-svc-add--ghost:nth-child(odd):nth-last-child(2) { grid-column: 1 / -1; }
}
/* Müşteri Yorumları sayıları: ikonlu kutucuklar; telefonda 2'li */
.ksp-rev-stats dt { display: flex; align-items: center; gap: 5px; }
.ksp-rev-stats dt .material-symbols-rounded { font-size: 15px; text-transform: none; letter-spacing: 0; } /* büyük harf ligatürü bozar */
.ksp-rev-stats dd small { color: var(--ksp-muted); font-size: .72rem; font-weight: 700; }
@media (max-width: 767.98px) {
  .ksp-rev-head { padding: 16px; }
  .ksp-rev-stats { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .ksp-rev-stats > div { min-width: 0; padding: 10px 12px; border-radius: 12px; background: var(--ksp-surface-2); }
}
/* S.S.S. + Müzik listesi satırları (ortak .ksp-sss-row): işlem düğmeleri metnin üstüne biniyor, metin ~60px'e sıkışıyordu →
   dar ekranda düğmeler alta, sağa yaslı; uzun kelime / adres kırılır */
.ksp-sss-row__q, .ksp-sss-row__a { overflow-wrap: anywhere; }
@media (max-width: 767.98px) {
  .ksp-sss-row { flex-wrap: wrap; gap: 10px 12px; padding: 14px; }
  .ksp-sss-row__main { flex: 1 1 0; }
  .ksp-sss-row > .ksp-mag-row__acts { width: 100%; max-width: none; justify-content: flex-end; }
}
/* Müzik listesi satırında tek işlem (Kaldır) var: düğme alta inmez, sağda kalır; adres kırıldığı için metin sıkışmaz */
@media (max-width: 767.98px) {
  .ksp-muz .ksp-sss-row { flex-wrap: nowrap; }
  .ksp-muz .ksp-sss-row > .ksp-mag-row__acts { width: auto; }
}

/* @bilet-kamera — E-Bilet kamerayla okutma (sahip 2026-09-29, KARARLAR §82.34). "Bilet kodu" kutusunun solundaki simge, kamera olan
   cihazda düğmeye döner (app.js açar); okutma penceresi: masaüstünde ortada kart, telefonda tam ekran; kare çerçeve + durum metni. */
.ksp-calsum__ticket-ico, .ksp-pk-bilet__ico { display: inline-flex; }
.ksp-calsum__ticket-ico[hidden], .ksp-pk-bilet__ico[hidden] { display: none; }
.ksp-pk-bilet__ico .material-symbols-rounded { font-size: 20px; }
.ksp-qrcam { display: inline-grid; flex: none; place-items: center; width: 30px; height: 30px; margin-inline-start: -6px; padding: 0; border: 0;
  border-radius: 50%; background: rgba(var(--ksp-primary-rgb), .12); color: var(--ksp-primary); cursor: pointer; }
.ksp-qrcam .material-symbols-rounded { font-size: 19px; }
.ksp-qrcam:hover { background: rgba(var(--ksp-primary-rgb), .2); }
.ksp-qrcam:focus-visible { outline: 3px solid rgba(var(--ksp-primary-rgb), .45); outline-offset: 2px; }
.ksp-pk-bilet .ksp-qrcam { width: 34px; height: 34px; }
.ksp-qrscan { width: min(420px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); padding: 0; border: 0; border-radius: 22px; overflow: hidden;
  background: #0c0a09; color: #fafaf9; box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .6); }
.ksp-qrscan[open] { display: flex; flex-direction: column; }
.ksp-qrscan::backdrop { background: rgba(12, 10, 9, .72); }
.ksp-qrscan__head { display: flex; align-items: center; gap: 8px; padding: 12px 12px 12px 16px; font-size: .95rem; }
.ksp-qrscan__head > .material-symbols-rounded { font-size: 20px; color: var(--ksp-primary); }
.ksp-qrscan__head strong { flex: 1 1 auto; }
.ksp-qrscan__x { display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .1); color: #fafaf9; cursor: pointer; }
.ksp-qrscan__view { position: relative; flex: 0 0 auto; aspect-ratio: 1 / 1; background: #000; overflow: hidden; }
.ksp-qrscan__view video { display: block; width: 100%; height: 100%; object-fit: cover; }
.ksp-qrscan__frame { position: absolute; inset: 15%; border-radius: 20px; box-shadow: 0 0 0 3px rgba(255, 255, 255, .92), 0 0 0 999px rgba(0, 0, 0, .38); pointer-events: none; }
.ksp-qrscan__msg { margin: 0; padding: 14px 18px 4px; font-size: .88rem; line-height: 1.45; text-align: center; color: #e7e5e4; }
.ksp-qrscan__msg.is-bad { color: #fda4af; }
.ksp-qrscan__type { display: inline-flex; align-items: center; justify-content: center; gap: 6px; margin: 10px auto 16px; padding: 9px 16px;
  border: 1px solid rgba(255, 255, 255, .22); border-radius: 999px; background: transparent; color: #fafaf9; font-size: .84rem; font-weight: 700; cursor: pointer; }
.ksp-qrscan__type .material-symbols-rounded { font-size: 18px; }
.ksp-qrscan__x:focus-visible, .ksp-qrscan__type:focus-visible { outline: 3px solid rgba(var(--ksp-primary-rgb), .6); outline-offset: 2px; }
@media (max-width: 575.98px) {
  .ksp-qrscan { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; margin: 0; border-radius: 0;
    padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); }
  .ksp-qrscan__view { flex: 1 1 auto; aspect-ratio: auto; min-height: 0; }
  .ksp-qrscan__frame { inset: auto; top: 50%; left: 50%; width: min(70vw, 60dvh); height: min(70vw, 60dvh); transform: translate(-50%, -50%); }
}

/* §82.33 incelemesi (3 ajan, 2026-09-29): 320–360px'te hizmet düğmesi metni kenara dayanıyordu → sarılır; tablette pencere düğmesinin
   odak halkası; JS gelmeden şerit bir an görünüp içerik kaymasın (head betiği html.ksp-sheet-ok ekler, JS'siz şerit görünür kalır) */
@media (max-width: 575.98px) {
  .ksp-svc-head__acts > .ksp-svc-add { white-space: normal; line-height: 1.15; text-align: center; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .ksp-chipsheet--lg:focus-visible { outline: 3px solid rgba(var(--ksp-primary-rgb), .45); outline-offset: 2px; }
}
@media (max-width: 991.98px) {
  html.ksp-sheet-ok body.ksp-panel--tabs .ksp-ptabs__nav { display: none; }
  html.ksp-sheet-ok body.ksp-panel--tabs .ksp-ptabs--nosec { display: none; }
}
/* Formların genel "button" kuralı (gönder düğmesi: dolu pembe / hap) kamera düğmesini ezmesin — açık zeminli daire kalsın */
.ksp-calsum__ticket .ksp-qrcam, .ksp-pk-bilet .ksp-qrcam { flex: none; width: 30px; height: 30px; margin-inline-start: -6px; padding: 0; border-radius: 50%;
  background: rgba(var(--ksp-primary-rgb), .12); color: var(--ksp-primary); font-size: inherit; }
.ksp-pk-bilet .ksp-qrcam { width: 34px; height: 34px; margin-inline-start: -8px; }
.ksp-calsum__ticket .ksp-qrcam:hover, .ksp-pk-bilet .ksp-qrcam:hover { background: rgba(var(--ksp-primary-rgb), .2); }

/* @kokpit-liste-telefon — Takvim telefonda LİSTE ile açılır (KARARLAR §82.35). Liste satırında işlem düğmeleri (4 × 30px) sağ sütunu
   144px'e genişletip müşteri adı / hizmeti "Ozcan …", "Saç Kesi…" diye kesiyordu, telefon numarası ikiye bölünüyordu → ≤575px'te
   işlemler kendi satırına (ad sütununun altına) iner; işlemi olmayan satırda (iptal / tamamlanan) o satır hiç çizilmez.
   Alt menü etiketleri tek satır (kırılırsa üç nokta). */
@media (max-width: 575.98px) {
  .ksp-cal-row { grid-template-columns: 44px 4px minmax(0, 1fr) auto; column-gap: 10px; padding-inline: 12px;
    grid-template-areas: "time bar who status" "time bar svc total" "time bar staff staff" "time bar acts acts"; }
  .ksp-cal-row__who small { white-space: nowrap; }
  .ksp-cal-row__acts { justify-content: start; }
  .ksp-cal-row__acts:not(:has(form)) { display: none; }
}
.ksp-bottom-nav__label { max-width: 100%; padding-inline: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 575.98px) {
  /* Telefonda işlem satırı: boş yuvalar (izin verilmeyen işlem) yer kaplamaz, düğmeler 36px dokunma hedefi */
  .ksp-cal-row__acts { display: flex; flex-wrap: wrap; gap: 8px; }
  .ksp-cal-row__acts .ksp-cal-row__slot { display: none; }
  .ksp-cal-row__acts .ksp-cal-act { width: 36px; min-height: 36px; }
}

/* @kokpit-denetim — kokpit sayfalarının telefon taraması (sahip 2026-09-29: "içerde bozukları göz at" — KARARLAR §82.35).
   (1) Kasa, Site Ayarları, SEO & GEO, İletişim Kanalları sekme şeritleri sağdan kesiliyordu → <992px seçim penceresi (görünümlerde
   data-chip-sheet-upto="lg"); başlık kaplarında pencere düğmesi ek boşluk bırakmaz. (2) Sistem Sağlığı / SMS kullanımı tabloları:
   ilk sütun ~80px'e sıkışıp 4 satıra bölünüyordu → telefonda en az 170px (tablo zaten yatay kayar). (3) 4 kartlı sayı ızgaraları
   (Ürünler, Aylık Bilanço, Z Raporu, Bordro) telefonda tek sütun uzun liste yerine 2'li. (4) Sağ alttaki mesaj düğmesi sayfanın son
   öğelerinin (Kaydet düğmesi vb.) üstünde kalmasın: içerik altına düğme payı. */
.ksp-adm-head__actions > .ksp-chipsheet, .ksp-cash-head > .ksp-chipsheet { margin: 0; }
@media (max-width: 767.98px) {
  .ksp-adm-table-wrap > .ksp-adm-table th:first-child, .ksp-adm-table-wrap > .ksp-adm-table td:first-child { min-width: 170px; }
  .ksp-cash-kpis:not(.ksp-cash-kpis--3) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}
@media (max-width: 991.98px) {
  body.ksp-panel:has(.ksp-dock) .ksp-panel__content { padding-bottom: 76px; }
}
@media (max-width: 767.98px) {
  /* 2'li sayı kartı: simge sağ üst köşede (metin tüm genişliği kullanır), değer tek satır */
  .ksp-cash-kpis:not(.ksp-cash-kpis--3) .ksp-cash-kpi { position: relative; padding: 12px; }
  .ksp-cash-kpis:not(.ksp-cash-kpis--3) .ksp-cash-kpi__ico { position: absolute; top: 10px; inset-inline-end: 10px; width: 28px; height: 28px; border-radius: 9px; }
  .ksp-cash-kpis:not(.ksp-cash-kpis--3) .ksp-cash-kpi__ico .material-symbols-rounded { font-size: 16px; }
  .ksp-cash-kpis:not(.ksp-cash-kpis--3) .ksp-cash-kpi__label { padding-inline-end: 30px; font-size: 10px; line-height: 1.3; }
  .ksp-cash-kpis:not(.ksp-cash-kpis--3) .ksp-cash-kpi__value { margin-top: 8px; font-size: 20px; white-space: nowrap; overflow-wrap: normal; }
}
/* §82.36: kısa ekranda (dizüstü %150 ölçek, yatay telefon) kart düzeninde görüntü alanı küçülebilir — ileti ve "Kodu yazarak ara"
   kesilmesin (video object-fit: cover ile kırpılır). Yalnız ≥576px: telefondaki tam ekran kuralı (flex: 1) ezilmesin */
@media (min-width: 576px) {
  .ksp-qrscan__view { flex: 0 1 auto; min-height: 0; }
}
.ksp-qrscan__view video { cursor: pointer; }

/* @footer-menu — Footer sütunları (sahip 2026-09-29: "footer alanına menülerden popüler yapıp yay" — KARARLAR §82.37): Popüler Hizmetler ·
   Salon · Online Randevu (düğme + KVKK notu). Başlık / bağlantı stilleri mevcut .ksp-footer__title / __links. */
.ksp-footer__cta-text { max-width: 360px; margin: 0 0 .9rem; color: var(--ksp-muted); font-size: .82rem; line-height: 1.6; }
.ksp-footer__cta { display: inline-flex; align-items: center; gap: .45rem; padding: .65rem 1.25rem; border-radius: 12px; background: var(--ksp-text);
  color: var(--ksp-surface); font-size: .86rem; font-weight: 800; }
.ksp-footer__cta:hover { background: var(--ksp-primary); color: #fff; }
.ksp-footer__cta .material-symbols-rounded { font-size: 19px; color: var(--ksp-primary); }
.ksp-footer__cta:hover .material-symbols-rounded { color: #fff; }
.ksp-footer__kvkk { display: flex; align-items: flex-start; gap: .4rem; max-width: 360px; margin: .9rem 0 0; color: var(--ksp-muted); font-size: .74rem; line-height: 1.5; }
.ksp-footer__kvkk .material-symbols-rounded { flex: none; font-size: 16px; color: var(--ksp-success); }
.ksp-footer__kvkk a { color: var(--ksp-text); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
/* Telif satırındaki yazılımcı bağlantısı (istartpay): satırın rengiyle, üzerine gelince belirgin */
.ksp-footer__bottom .ksp-footer__vendor { color: inherit; font-weight: 700; text-decoration: none; }
.ksp-footer__bottom .ksp-footer__vendor:hover, .ksp-footer__bottom .ksp-footer__vendor:focus-visible { color: var(--ksp-primary); text-decoration: underline; text-underline-offset: 2px; }

/* @kaydirma-seridi — ana sayfa yorumları yan yana kayar, magazin şeridi kendiliğinden kayar (sahip 2026-09-29: "responsivde yan yana
   getir, webte de aynı; Kuaför Koltuğunda Ünlü İsimler & Saç Trendleri hareketli olsun kayar" — KARARLAR §82.38). Davranış app.js
   "@kaydirma-seridi" ([data-rail]); ‹ › düğmeleri kategori oklarının görünümü (.ksp-hcats-nav, telefonda gizli — parmakla kaydırılır). */
.ksp-rail-tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px; }
/* Yorumlar: alt alta ızgara değil yatay şerit — masaüstü 3, tablet 2, telefon 2 + sonrakinin kenarı */
.ksp-reviewgrid--rail { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * 1.25rem) / 3);
  gap: 1.25rem; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 2px 2px 6px; margin: -2px -2px 0; }
.ksp-reviewgrid--rail::-webkit-scrollbar { display: none; }
.ksp-reviewgrid--rail > .ksp-review { min-width: 0; scroll-snap-align: start; }
@media (max-width: 991.98px) {
  .ksp-reviewgrid--rail { grid-template-columns: none; grid-auto-columns: calc((100% - 1rem) / 2); gap: 1rem; }
}
/* Küçük tablet / yatay telefon (576–767): iki kart ~250px'e düşüp alt satır ve hizmet çipi kırılıyordu → bir kart + yarım kart */
@media (max-width: 767.98px) {
  .ksp-reviewgrid--rail { grid-auto-columns: 64%; }
}
/* Telefon: kart TAM okunur genişlikte (≈%84) + sonrakinin kenarı; iki dar kart yan yana sığmıyordu — hizmet çipi, alt satır ve metin
   kelime kelime kırılıyordu (sahip 2026-09-29: "responsivde yorumlar kısmı patlamış"). Parmakla yana kayar. */
@media (max-width: 575.98px) {
  .ksp-reviewgrid--rail { grid-auto-columns: 84%; gap: 12px; margin-inline: -16px; padding-inline: 16px; scroll-padding-inline: 16px; }
  .ksp-reviewgrid--rail .ksp-review { padding: 1rem; }
  .ksp-reviewgrid--rail .ksp-review__head > div { min-width: 0; }
  .ksp-reviewgrid--rail .ksp-review__head strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ksp-reviewgrid--rail .ksp-review__foot span { white-space: nowrap; }
  .ksp-mgz-strip__head .ksp-rail-tools { width: 100%; }
  .ksp-mgz-strip__head .ksp-rail-tools .ksp-mgz-strip__all { flex: 1 1 auto; }
}
/* @kaydirma-seridi-son */

/* @magazin-tek-salon — magazin kartındaki "İlgili Salon:" etiketi yerine vitrin simgesi + salon adı (2026-09-29 denetimi) */
.ksp-mgz-card__salon > span { display: inline-flex; align-items: center; gap: 5px; }
.ksp-mgz-card__salon > span b { display: inline; }
.ksp-mgz-card__salon > span .material-symbols-rounded { font-size: 16px; color: var(--ksp-primary); }