@font-face{font-family:'Bodoni';font-style:normal;font-weight:500 700;font-display:swap;src:url(../fonts/bodoni-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Bodoni';font-style:normal;font-weight:500 700;font-display:swap;src:url(../fonts/bodoni-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Bricolage';font-style:normal;font-weight:500 700;font-display:swap;src:url(../fonts/bricolage-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Bricolage';font-style:normal;font-weight:500 700;font-display:swap;src:url(../fonts/bricolage-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jakarta';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/plus-jakarta-sans-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Jakarta';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/plus-jakarta-sans-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root {
    /* Site ile ayni palet: "Gece Yarisi" — lacivert-siyah zemin,
       GUL eylem rengi, BUZ ikincil/veri rengi. Altin ve magenta yok. */
    --bg-0: #070911;
    --bg-1: #0e1220;
    --bg-2: #151b2c;
    --bg-3: #1d2438;
    --line: rgba(148, 163, 220, .12);
    --line-strong: rgba(148, 163, 220, .26);
    --text-0: #edf0fa;
    --text-1: #98a2bd;
    --text-2: #5d6785;
    --accent: #f2506e;
    --accent-1: #ff8aa0;
    --accent-soft: rgba(242, 80, 110, .14);
    --gold: #8fa8ff;
    --ok: #3ecf8e;
    --warn: #e0a54a;
    --danger: #f2506e;
    --display: 'Bricolage', 'Segoe UI', system-ui, sans-serif;
    --wordmark: 'Bodoni', 'Didot', 'Times New Roman', serif;
    --body: 'Jakarta', -apple-system, BlinkMacSystemFont, system-ui, 'Segoe UI', sans-serif;
    --r-card: 12px;
    --r-ctl: 9px;
    --ease: cubic-bezier(.22, .61, .36, 1);
    --dur: 200ms;
    --side-w: 248px;
    --maxw: 1320px;
    --shadow: 0 1px 0 rgba(255, 255, 255, .03), 0 18px 40px -28px rgba(3, 5, 12, .85);
    color-scheme: dark;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    font-family: var(--body);
    background: var(--bg-0);
    color: var(--text-0);
    font-size: 15px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
    margin: 0;
    font-family: var(--display);
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1.2;
    color: var(--text-0);
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    font: inherit;
    cursor: pointer;
}

input, textarea, select {
    font: inherit;
    color: inherit;
}

img {
    display: block;
    max-width: 100%;
}

::selection {
    background: var(--accent-soft);
}

[data-count-up],
.metric-card strong,
.stat-card strong,
.analytics-list strong,
.analytics-panel-head strong {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
}

/* ---------- Login ---------- */
.login-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
    background:
        radial-gradient(1200px 600px at 50% -10%, rgba(242,80,110, .10), transparent 60%),
        var(--bg-0);
}

.login-card {
    width: 100%;
    max-width: 380px;
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-card);
    padding: 32px 28px;
    box-shadow: var(--shadow);
}

.login-card::before {
    content: "Eskort Adresi";
    display: block;
    font-size: 13px;
    letter-spacing: .32em;
    color: var(--text-2);
    margin-bottom: 22px;
    text-align: center;
}

.login-form {
    display: grid;
    gap: 14px;
}

/* Giris/kayit kartinda baslik ile ilk alan arasinda nefes payi.
   h1..h4 icin margin:0 sifirlamasi bu kartta ozellikle telafi ediliyor. */
.login-card h1 {
    font-size: 22px;
    margin-bottom: 18px;
}
.login-card > p:not(.admin-kicker) {
    font-size: 13px;
    color: var(--text-1);
}

.login-form label {
    display: grid;
    gap: 7px;
    font-size: 12px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--text-1);
}

.login-form input {
    background: var(--bg-2);
    border: 1px solid var(--line);
    border-radius: var(--r-ctl);
    padding: 11px 13px;
    color: var(--text-0);
    transition: border-color var(--dur) var(--ease);
}

.login-form input:focus {
    outline: none;
    border-color: var(--accent);
}

.login-form .btn {
    margin-top: 6px;
    justify-content: center;
}

.login-error {
    background: var(--accent-soft);
    border: 1px solid rgba(242,80,110, .35);
    color: #ffc2ce;
    border-radius: var(--r-ctl);
    padding: 11px 13px;
    font-size: 13.5px;
    margin-bottom: 16px;
}

/* ---------- Shell ---------- */
.admin-body {
    background: var(--bg-0);
}

.admin-shell {
    display: grid;
    grid-template-columns: var(--side-w) 1fr;
    min-height: 100vh;
}

.admin-nav-scrim {
    display: none;
}

.admin-side {
    position: sticky;
    top: 0;
    align-self: start;
    height: 100vh;
    background: var(--bg-1);
    border-right: 1px solid var(--line);
    padding: 22px 16px;
    display: flex;
    flex-direction: column;
    gap: 26px;
}

.admin-brand {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 6px 10px;
}

.admin-brand strong {
    font-family: var(--wordmark);
    font-size: 19px;
    font-weight: 600;
    letter-spacing: .08em;
    color: var(--text-0);
}

.admin-brand strong::after {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-left: 8px;
    border-radius: 50%;
    background: var(--accent);
    vertical-align: middle;
}

.admin-nav {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.admin-nav a {
    position: relative;
    padding: 10px 12px 10px 14px;
    border-radius: var(--r-ctl);
    color: var(--text-1);
    font-size: 14px;
    transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}

.admin-nav a:hover {
    background: var(--bg-2);
    color: var(--text-0);
}

.admin-nav a.active {
    background: var(--accent-soft);
    color: var(--text-0);
}

.admin-nav a.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    bottom: 8px;
    width: 2px;
    border-radius: 2px;
    background: var(--accent);
}

.admin-main {
    padding: 30px clamp(20px, 4vw, 44px) 64px;
    width: 100%;
    min-width: 0;
}

.admin-side-toggle {
    display: none;
}

/* ---------- Flash ---------- */
.flash {
    border: 1px solid var(--line);
    border-left: 2px solid var(--accent);
    background: var(--bg-1);
    border-radius: var(--r-ctl);
    padding: 12px 15px;
    margin-bottom: 22px;
    font-size: 14px;
}

.flash.success {
    border-left-color: var(--ok);
}

.flash.error {
    border-left-color: var(--danger);
}

/* ---------- Head + buttons ---------- */
.admin-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 26px;
    flex-wrap: wrap;
}

.admin-head h1 {
    font-size: 26px;
}

.admin-head p {
    margin: 6px 0 0;
    color: var(--text-1);
    font-size: 14px;
    max-width: 60ch;
}

.admin-kicker {
    display: inline-block;
    font-size: 11px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--accent-1);
    margin-bottom: 8px;
}

.admin-head-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--line-strong);
    background: var(--bg-2);
    color: var(--text-0);
    padding: 10px 16px;
    border-radius: var(--r-ctl);
    font-size: 14px;
    transition: transform var(--dur) var(--ease), border-color var(--dur) var(--ease), background var(--dur) var(--ease);
}

.btn:hover {
    border-color: var(--text-2);
}

.btn:active {
    transform: translateY(1px);
}

.btn.primary {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}

.btn.primary:hover {
    background: var(--accent-1);
    border-color: var(--accent-1);
}

.btn.quiet {
    background: transparent;
    color: var(--text-1);
}

.status-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    color: var(--text-1);
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 6px 12px;
}

.status-pill i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--ok);
    box-shadow: 0 0 0 0 rgba(62,207,142, .5);
    animation: pulse-dot 2.2s var(--ease) infinite;
}

@keyframes pulse-dot {
    0% { box-shadow: 0 0 0 0 rgba(62,207,142, .5); }
    70% { box-shadow: 0 0 0 7px rgba(62,207,142, 0); }
    100% { box-shadow: 0 0 0 0 rgba(62,207,142, 0); }
}

/* ---------- Stat cards ---------- */
.stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 14px;
    margin-bottom: 26px;
}

.stat-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-card);
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.stat-card span {
    font-size: 12px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--text-2);
}

.stat-card strong {
    font-size: 26px;
    font-weight: 600;
}

.stat-card em {
    font-style: normal;
    font-size: 12px;
    color: var(--text-2);
}

.metric-card.accent {
    border-color: rgba(242,80,110, .4);
    background:
        linear-gradient(180deg, var(--accent-soft), transparent 70%),
        var(--bg-1);
}

.metric-card.accent strong {
    color: var(--accent-1);
}

/* ---------- Toolbar / search ---------- */
.admin-toolbar {
    margin-bottom: 18px;
}

.search-box {
    display: grid;
    gap: 6px;
    max-width: 360px;
}

.search-box span {
    font-size: 12px;
    color: var(--text-2);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.search-box input {
    background: var(--bg-2);
    border: 1px solid var(--line);
    border-radius: var(--r-ctl);
    padding: 10px 13px;
    transition: border-color var(--dur) var(--ease);
}

.search-box input:focus {
    outline: none;
    border-color: var(--accent);
}

/* ---------- Table ---------- */
.admin-table-wrap {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-card);
    overflow: hidden;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.admin-table th {
    text-align: left;
    font-size: 11.5px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--text-2);
    font-weight: 500;
    padding: 13px 16px;
    border-bottom: 1px solid var(--line);
}

.admin-table td {
    padding: 13px 16px;
    border-bottom: 1px solid var(--line);
    vertical-align: middle;
}

.admin-table tr:last-child td {
    border-bottom: none;
}

.admin-table tbody tr {
    transition: background var(--dur) var(--ease);
}

.admin-table tbody tr:hover {
    background: var(--bg-2);
}

.admin-table td span {
    color: var(--text-2);
    font-size: 12.5px;
}

.messages-table td {
    vertical-align: top;
}

.messages-table time {
    color: var(--text-2);
    font-size: 12.5px;
}

.message-link {
    color: var(--accent-1);
    font-size: 12.5px;
    overflow-wrap: anywhere;
}

.message-body {
    margin: 0;
    max-width: 560px;
    color: var(--text-1);
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.admin-thumb {
    width: 46px;
    height: 46px;
    border-radius: 8px;
    object-fit: cover;
    border: 1px solid var(--line-strong);
}

.badge {
    display: inline-block;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid var(--line);
}

.badge.on {
    color: #bfe9d8;
    border-color: rgba(62,207,142, .4);
    background: rgba(62,207,142, .12);
}

.badge.off {
    color: var(--text-2);
}

.row-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.row-actions form {
    margin: 0;
}

.mini-btn {
    border: 1px solid var(--line);
    background: var(--bg-2);
    color: var(--text-1);
    padding: 6px 11px;
    border-radius: 7px;
    font-size: 12.5px;
    transition: color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}

.mini-btn:hover {
    color: var(--text-0);
    border-color: var(--text-2);
}

.mini-btn.danger:hover {
    color: #ffc2ce;
    border-color: var(--danger);
}

/* ---------- Forms ---------- */
.admin-form {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-card);
    padding: 24px;
    display: grid;
    gap: 16px;
    max-width: 880px;
}

.admin-form label {
    display: grid;
    gap: 7px;
    font-size: 12.5px;
    color: var(--text-1);
}

.admin-form input,
.admin-form textarea {
    background: var(--bg-2);
    border: 1px solid var(--line);
    border-radius: var(--r-ctl);
    padding: 11px 13px;
    color: var(--text-0);
    transition: border-color var(--dur) var(--ease);
}

.admin-form input:focus,
.admin-form textarea:focus {
    outline: none;
    border-color: var(--accent);
}

.admin-form input[type="file"] {
    padding: 9px 12px;
    color: var(--text-2);
}

.field-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.image-preview,
.gallery-preview {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.image-preview img,
.gallery-preview img {
    width: 84px;
    height: 84px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid var(--line-strong);
}

.image-preview span {
    color: var(--text-2);
    font-size: 12.5px;
}

.switch-row {
    display: flex !important;
    align-items: center;
    gap: 10px;
    grid-auto-flow: column;
    justify-content: start;
}

.switch-row input {
    width: 18px;
    height: 18px;
    accent-color: var(--accent);
}

.form-actions {
    display: flex;
    gap: 12px;
    margin-top: 6px;
}

.form-errors {
    background: var(--accent-soft);
    border: 1px solid rgba(242,80,110, .35);
    border-radius: var(--r-ctl);
    padding: 12px 15px;
    margin-bottom: 18px;
}

.form-errors p {
    margin: 0 0 4px;
    color: #ffc2ce;
    font-size: 13.5px;
}

.form-errors p:last-child {
    margin-bottom: 0;
}

/* ---------- Analytics shell ---------- */
.analytics-dashboard {
    display: grid;
    gap: 22px;
}

.analytics-hero {
    margin-bottom: 4px;
}

.analytics-stat-grid {
    grid-template-columns: repeat(4, 1fr);
    margin-bottom: 0;
}

.analytics-board {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.analytics-panel {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-card);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.analytics-panel-large {
    grid-column: span 2;
}

.analytics-panel-full {
    grid-column: 1 / -1;
}

.analytics-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.analytics-panel-head h2 {
    font-size: 15px;
}

.analytics-panel-head span {
    display: block;
    margin-top: 3px;
    font-size: 12.5px;
    color: var(--text-2);
}

.analytics-panel-head strong {
    font-size: 22px;
    color: var(--text-0);
}

.analytics-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.analytics-layout.secondary {
    grid-template-columns: 1fr 1fr;
}

.analytics-list {
    display: grid;
    gap: 2px;
}

.analytics-list div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 0;
    border-bottom: 1px solid var(--line);
    font-size: 13.5px;
}

.analytics-list div:last-child {
    border-bottom: none;
}

.analytics-list span {
    color: var(--text-1);
}

.analytics-list strong {
    color: var(--text-0);
}

.analytics-list p {
    color: var(--text-2);
    font-size: 13px;
    margin: 4px 0;
}

.activity-list {
    display: grid;
    gap: 2px;
}

.activity-list article {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas: "title meta" "sub meta";
    column-gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
}

.activity-list article:last-child {
    border-bottom: none;
}

.activity-list strong {
    grid-area: title;
    font-size: 13.5px;
    font-weight: 500;
}

.activity-list span {
    grid-area: sub;
    font-size: 12.5px;
    color: var(--text-2);
}

.activity-list em {
    grid-area: meta;
    align-self: center;
    font-style: normal;
    font-size: 12px;
    color: var(--text-2);
    white-space: nowrap;
}

.activity-list p {
    color: var(--text-2);
    font-size: 13px;
}

.analytics-table td strong {
    font-weight: 500;
}

/* ---------- Chart containers (filled by admin.js) ---------- */
.flow-chart,
.funnel-chart,
.device-chart,
.bar-chart,
.location-map {
    position: relative;
    width: 100%;
    min-width: 0;
}

.flow-chart {
    min-height: 220px;
}

.flow-chart > p,
.location-map > p {
    color: var(--text-2);
    font-size: 13px;
}

.bar-chart {
    display: grid;
    gap: 12px;
}

.bar-chart.compact {
    gap: 9px;
}

.device-chart {
    display: grid;
    grid-template-columns: 132px 1fr;
    gap: 18px;
    align-items: center;
}

.funnel-chart {
    display: grid;
    gap: 10px;
}

.admin-chart-tooltip {
    position: absolute;
    pointer-events: none;
    background: var(--bg-3);
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12.5px;
    color: var(--text-0);
    white-space: nowrap;
    transform: translate(-50%, -120%);
    opacity: 0;
    transition: opacity 120ms var(--ease);
    z-index: 5;
}

.admin-chart-tooltip.show {
    opacity: 1;
}

/* flow */
.flow-chart svg {
    width: 100%;
    height: 230px;
    display: block;
    overflow: visible;
}

.flow-grid {
    stroke: var(--line);
    stroke-width: 1;
}

.flow-line {
    fill: none;
    stroke: var(--accent);
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.flow-dot {
    fill: var(--bg-0);
    stroke: var(--accent);
    stroke-width: 2;
}

.flow-marker {
    fill: var(--accent);
    stroke: var(--bg-0);
    stroke-width: 2;
    transition: opacity 120ms var(--ease);
}

.flow-label {
    fill: var(--text-2);
    font-size: 11px;
}

/* bars */
.chart-row {
    display: grid;
    gap: 7px;
}

.chart-row-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
}

.chart-row-head span {
    color: var(--text-1);
}

.chart-row-head em {
    font-style: normal;
    color: var(--text-0);
    font-variant-numeric: tabular-nums;
}

.chart-bar-track {
    height: 8px;
    border-radius: 999px;
    background: var(--bg-3);
    overflow: hidden;
}

.chart-bar-fill {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--accent), var(--accent-1));
    width: 0;
    transition: width 700ms var(--ease);
}

.bar-chart.compact .chart-bar-track {
    height: 6px;
}

/* funnel */
.funnel-band {
    display: flex;
    justify-content: center;
}

.funnel-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 8%;
    padding: 11px 14px;
    border-radius: 8px;
    background: linear-gradient(90deg, var(--accent-soft), rgba(242,80,110, .04));
    border: 1px solid rgba(242,80,110, .26);
    transition: width 700ms var(--ease);
    overflow: hidden;
}

.funnel-label {
    font-size: 13px;
    color: var(--text-0);
    white-space: nowrap;
}

.funnel-value {
    font-style: normal;
    font-size: 12.5px;
    color: var(--text-1);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* donut */
.device-donut-visual {
    width: 132px;
    height: 132px;
    border-radius: 50%;
    background: var(--bg-3);
    -webkit-mask: radial-gradient(circle, transparent 52%, #000 53%);
    mask: radial-gradient(circle, transparent 52%, #000 53%);
}

.device-donut-legend {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.device-legend-item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 9px;
    font-size: 13px;
}

.device-legend-item i {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    background: var(--legend-color, var(--accent));
}

.device-legend-item span {
    color: var(--text-1);
}

.device-legend-item em {
    font-style: normal;
    color: var(--text-0);
    font-variant-numeric: tabular-nums;
}

.device-chart p {
    color: var(--text-2);
    font-size: 13px;
}

/* color swatch (settings) */
.color-swatch {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 5px;
    border: 1px solid var(--line-strong);
    vertical-align: middle;
    margin-left: 8px;
}

/* ---------- Geo map ---------- */
.geo-controls {
    display: flex;
    gap: 8px;
}

.geo-stage {
    position: relative;
    width: 100%;
    min-height: 280px;
    display: grid;
    place-items: center;
}

.geo-empty {
    color: var(--text-2);
    font-size: 13px;
}

.geo-svg {
    width: 100%;
    height: auto;
    max-height: 540px;
    display: block;
    overflow: visible;
}

.geo-svg path {
    fill: var(--bg-3);
    stroke: var(--bg-0);
    stroke-width: .6;
    stroke-linejoin: round;
    transition: fill var(--dur) var(--ease), fill-opacity var(--dur) var(--ease);
    vector-effect: non-scaling-stroke;
}

.geo-svg path.has-data {
    fill: var(--accent);
}

.geo-svg path.clickable {
    cursor: pointer;
}

.geo-svg path:hover {
    stroke: var(--accent-1);
    stroke-width: 1.4;
}

.geo-svg path.active-region {
    stroke: var(--gold);
    stroke-width: 1.4;
}

.geo-marker {
    fill: var(--accent);
    stroke: var(--bg-0);
    stroke-width: 1.4;
    transform-box: fill-box;
    transform-origin: center;
}

.geo-marker.pulse {
    animation: geo-pulse 2.4s var(--ease) infinite;
}

@keyframes geo-pulse {
    0% { opacity: 1; }
    50% { opacity: .45; }
    100% { opacity: 1; }
}

.geo-spark {
    fill: none;
    stroke: var(--accent-1);
    stroke-width: 2;
    opacity: 0;
}

.geo-spark.go {
    animation: geo-spark 1.4s var(--ease) forwards;
}

@keyframes geo-spark {
    0% { r: 2; opacity: .9; }
    100% { r: 26; opacity: 0; }
}

.geo-tooltip {
    position: absolute;
    pointer-events: none;
    background: var(--bg-3);
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12.5px;
    color: var(--text-0);
    white-space: nowrap;
    transform: translate(-50%, -130%);
    opacity: 0;
    transition: opacity 120ms var(--ease);
    z-index: 5;
}

.geo-tooltip.show {
    opacity: 1;
}

.geo-tooltip b {
    color: var(--accent-1);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.geo-legend {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: var(--text-2);
}

.geo-legend .geo-scale {
    display: flex;
    gap: 3px;
}

.geo-legend .geo-scale i {
    width: 22px;
    height: 10px;
    border-radius: 2px;
    background: var(--accent);
}

.geo-attribution {
    margin: 0;
    font-size: 11px;
    color: var(--text-2);
}

.live-enter {
    animation: live-in 280ms var(--ease);
}

@keyframes live-in {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: none; }
}

/* ---------- Dönem analizi ---------- */
.period-section {
    display: grid;
    gap: 18px;
}

.period-bar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.period-bar-title h2 {
    font-size: 20px;
    margin-top: 2px;
}

.period-pills {
    display: inline-flex;
    gap: 4px;
    background: var(--bg-2);
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 4px;
}

.period-pill {
    padding: 7px 14px;
    border-radius: 7px;
    font-size: 13px;
    color: var(--text-1);
    transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}

.period-pill:hover {
    color: var(--text-0);
}

.period-pill.active {
    background: var(--accent);
    color: #fff;
}

.period-grid {
    grid-template-columns: repeat(4, 1fr);
}

.period-grid .stat-card em {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: flex-start;
}

.trend-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 12px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 6px;
}

.trend-badge.up {
    color: var(--ok);
    background: rgba(62,207,142, .14);
}

.trend-badge.down {
    color: var(--danger);
    background: rgba(242,80,110, .14);
}

.trend-badge.flat {
    color: var(--text-2);
    background: var(--bg-2);
}

.trend-prev {
    color: var(--text-2);
    font-size: 11.5px;
}

.conv-pill {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 6px;
    font-size: 12.5px;
    font-weight: 600;
    background: var(--accent-soft);
    color: var(--accent-1);
}

/* ---------- Trend grafiği ---------- */
.trend-chart {
    position: relative;
    width: 100%;
}

.trend-svg {
    width: 100%;
    height: 260px;
    display: block;
    overflow: visible;
}

.trend-grid {
    stroke: var(--line);
    stroke-width: 1;
    shape-rendering: crispEdges;
}

.trend-ytick,
.trend-xtick {
    fill: var(--text-2);
    font-size: 11px;
    font-variant-numeric: tabular-nums;
}

.trend-path {
    vector-effect: non-scaling-stroke;
}

.trend-guide {
    stroke: var(--line-strong);
    stroke-width: 1;
    stroke-dasharray: 3 3;
    pointer-events: none;
}

.trend-dot {
    stroke: var(--bg-1);
    stroke-width: 2;
    pointer-events: none;
}

.trend-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 10px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}

.trend-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
    color: var(--text-1);
}

.trend-legend-item i {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}

.trend-chart .admin-chart-tooltip {
    transform: translate(-50%, 0);
    text-align: left;
}

.admin-chart-tooltip .tip-row {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 3px;
    white-space: nowrap;
}

.admin-chart-tooltip .tip-row i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
}

/* ---------- Isı haritası ---------- */
.heatmap-grid {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.heatmap-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.heatmap-day {
    flex: 0 0 30px;
    width: 30px;
    font-size: 11px;
    color: var(--text-2);
}

.heatmap-cells {
    display: grid;
    grid-template-columns: repeat(24, 1fr);
    gap: 3px;
    flex: 1;
    min-width: 0;
}

.heatmap-cell {
    position: relative;
    aspect-ratio: 1 / 1;
    border-radius: 3px;
    background: var(--bg-3);
}

.heatmap-cell::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: var(--accent);
    opacity: var(--lvl, 0);
}

.heatmap-axis {
    display: flex;
    justify-content: space-between;
    margin-left: 38px;
    margin-top: 6px;
    font-size: 10.5px;
    color: var(--text-2);
}

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
    .analytics-board {
        grid-template-columns: 1fr 1fr;
    }

    .analytics-panel-large {
        grid-column: span 2;
    }
}

@media (max-width: 860px) {
    .admin-shell {
        grid-template-columns: 1fr;
    }

    .admin-side {
        position: fixed;
        z-index: 40;
        width: min(82vw, var(--side-w));
        transform: translateX(-100%);
        transition: transform var(--dur) var(--ease);
    }

    .admin-shell.nav-open .admin-side {
        transform: translateX(0);
    }

    .admin-side-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        top: 14px;
        left: 14px;
        z-index: 50;
        width: 42px;
        height: 42px;
        border-radius: 10px;
        border: 1px solid var(--line-strong);
        background: var(--bg-1);
        color: var(--text-0);
    }

    .admin-main {
        padding-top: 70px;
    }

    .analytics-stat-grid,
    .period-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .analytics-board,
    .analytics-layout,
    .analytics-layout.secondary,
    .field-grid {
        grid-template-columns: 1fr;
    }

    .analytics-panel-large {
        grid-column: auto;
    }

    .admin-nav-scrim {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, .5);
        z-index: 39;
        opacity: 0;
        pointer-events: none;
        transition: opacity var(--dur) var(--ease);
    }

    .admin-shell.nav-open .admin-nav-scrim {
        opacity: 1;
        pointer-events: auto;
    }
}

@media (max-width: 560px) {
    .device-chart {
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .admin-table thead {
        display: none;
    }

    .admin-table,
    .admin-table tbody,
    .admin-table tr,
    .admin-table td {
        display: block;
        width: 100%;
    }

    .admin-table tr {
        border-bottom: 1px solid var(--line);
        padding: 6px 0;
    }

    .admin-table td {
        border: none;
        padding: 6px 16px;
        display: flex;
        justify-content: space-between;
        gap: 16px;
    }

    .admin-table td::before {
        content: attr(data-label);
        color: var(--text-2);
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: .04em;
    }

    .admin-table td[data-label="Görsel"]::before {
        align-self: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }
}

/* ---- LİZA: Güvenlik sayfası + settings-grid (Cherry admin.css temasına uyumlu) ---- */
.settings-grid{display:grid;gap:1.1rem}
.admin-subhead{font-size:1.1rem;color:var(--text-0);margin:.2rem 0 .5rem;font-weight:600}
.admin-form+.admin-form{margin-top:2rem;padding-top:2rem;border-top:1px solid var(--line)}
.admin-form .hint{font-size:.78rem;line-height:1.6;color:var(--text-2);letter-spacing:normal;text-transform:none}
.admin-form .hint code,.admin-table code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82em;color:var(--accent-1);background:var(--accent-soft);padding:.05rem .35rem;border-radius:6px}
.ua-cell{font-size:.78rem;color:var(--text-2);word-break:break-word}
.bot-lists{display:grid;gap:1rem;margin-top:2rem}
.bot-list-card{padding:1.3rem 1.4rem;border:1px solid var(--line);border-radius:var(--r-card);background:var(--bg-2)}
.bot-list-card h3{font-size:1.05rem;color:var(--text-0);margin-bottom:.35rem}
.bot-list-card h3 em{font-style:normal;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;padding:.14rem .5rem;border-radius:20px;margin-left:.3rem;vertical-align:middle}
.bot-list-card h3 em.on{color:var(--ok);background:rgba(62,207,142,.16)}
.bot-list-card h3 em.off{color:var(--text-2);background:rgba(255,255,255,.05)}
.bot-list-card p{font-size:.82rem;color:var(--text-2);margin-bottom:.8rem}
.chip-row{display:flex;flex-wrap:wrap;gap:.4rem}
.chip-row span{padding:.28rem .6rem;border:1px solid var(--line);border-radius:30px;font-size:.68rem;color:var(--text-1)}
@media (min-width:860px){.settings-grid,.bot-lists{grid-template-columns:1fr 1fr}}


/* ---- Şehir yönetimi / gruplu navigasyon ---- */
.admin-nav-group{
  display:block;
  margin:1.1rem 0 .35rem;
  font-size:.62rem;
  font-weight:700;
  letter-spacing:.22em;
  text-transform:uppercase;
  opacity:.45;
}
.admin-nav-group:first-child{margin-top:0}
.nav-pill{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 .3rem;margin-left:.4rem;border-radius:20px;background:var(--danger);color:#fff;font-size:.64rem;font-weight:700}
.flash.warn{
  border-color:rgba(224,165,74,.45);
  background:rgba(224,165,74,.10);
  color:#f3ddb4;
}
.admin-table tr.is-child td{opacity:.78;font-size:.92em}
.admin-table code{
  font-size:.82em;
  padding:.15rem .4rem;
  border-radius:3px;
  background:rgba(255,255,255,.05);
}

/* ================================================================
   Pazaryeri: durum rozetleri, kota çubuğu, QR/adres kutusu, paket
   kartları, kademe göstergesi (stepper), sayfalama, boş durum.
   İlan sahibi paneli (/panel) bu dosyayı ve admin-shell iskeletini
   birebir paylaşır — ayrı bir panel.css'e gerek kalmadan tutarlı kalır.
   ================================================================ */

.badge.pending,.badge.submitted{color:var(--warn);background:rgba(224,165,74,.16)}
.badge.paid,.badge.approved,.badge.active{color:var(--ok);background:rgba(62,207,142,.16)}
.badge.rejected,.badge.expired,.badge.suspended{color:var(--danger);background:rgba(242,80,110,.16)}
.badge.draft{color:var(--text-2);background:rgba(255,255,255,.06)}

.quota-bar{height:8px;border-radius:20px;background:rgba(255,255,255,.06);overflow:hidden;margin:.4rem 0}
.quota-bar span{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,var(--accent),var(--accent-1));transition:width .4s var(--ease)}
.quota-bar.is-high span{background:linear-gradient(90deg,var(--warn),var(--danger))}
.quota-row{display:flex;align-items:center;justify-content:space-between;font-size:.78rem;color:var(--text-2);margin-top:.3rem}

.panel-alert{
  padding:1rem 1.2rem;border:1px solid var(--line-strong);border-radius:var(--r-card);
  background:var(--bg-1);font-size:.85rem;color:var(--text-1);margin-bottom:1.4rem;
  display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center;justify-content:space-between;
}
.panel-alert.warn{border-color:rgba(224,165,74,.4);background:rgba(224,165,74,.08)}
.panel-alert.danger{border-color:rgba(242,80,110,.4);background:rgba(242,80,110,.08)}
.panel-alert strong{color:var(--text-0)}

.copy-field{
  display:flex;align-items:stretch;gap:0;border:1px solid var(--line-strong);border-radius:var(--r-ctl);
  overflow:hidden;background:var(--bg-2);
}
.copy-field input{
  flex:1;min-width:0;border:0;background:transparent;padding:.7rem .9rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.82rem;color:var(--text-0);
}
.copy-field button{
  border:0;border-left:1px solid var(--line-strong);background:var(--bg-3);color:var(--text-1);
  padding:.7rem 1rem;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease);
}
.copy-field button:hover{background:var(--accent-soft);color:var(--accent-1)}

.qr-box{
  display:inline-flex;padding:14px;background:#fff;border-radius:14px;box-shadow:var(--shadow);
}
.qr-box svg{display:block;width:196px;height:196px}
.pay-grid{display:grid;gap:1.6rem;align-items:start}
@media (min-width:820px){.pay-grid{grid-template-columns:auto 1fr}}
.pay-summary{display:grid;gap:.6rem;padding:1.2rem 1.3rem;border:1px solid var(--line);border-radius:var(--r-card);background:var(--bg-1)}
.pay-summary div{display:flex;justify-content:space-between;gap:1rem;font-size:.86rem}
.pay-summary span{color:var(--text-2)}
.pay-summary strong{color:var(--text-0);font-variant-numeric:tabular-nums}
.pay-summary .pay-total{border-top:1px solid var(--line);margin-top:.3rem;padding-top:.7rem}
.pay-total strong{font-size:1.15rem;color:var(--accent-1)}
.pay-countdown{font-size:.76rem;color:var(--warn);letter-spacing:.03em}

.asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.7rem;margin:1rem 0}
.asset-option{position:relative}
.asset-option input{position:absolute;opacity:0;inset:0;cursor:pointer}
.asset-option span{
  display:flex;flex-direction:column;gap:.15rem;padding:.8rem 1rem;border:1px solid var(--line-strong);
  border-radius:var(--r-ctl);background:var(--bg-2);transition:border-color var(--dur),background var(--dur);
}
.asset-option span strong{font-size:.92rem;color:var(--text-0)}
.asset-option span em{font-style:normal;font-size:.72rem;color:var(--text-2)}
.asset-option input:checked+span{border-color:var(--accent-1);background:var(--accent-soft)}
.asset-option input:focus-visible+span{outline:2px solid var(--accent-1);outline-offset:2px}

.package-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.1rem;margin:1.2rem 0}
.package-card{
  display:flex;flex-direction:column;gap:.9rem;padding:1.5rem 1.4rem;border:1px solid var(--line);
  border-radius:var(--r-card);background:var(--bg-1);position:relative;
}
.package-card.is-highlight{border-color:rgba(242,80,110,.5);background:linear-gradient(180deg,var(--accent-soft),var(--bg-1) 60%)}
.package-card .pkg-badge{
  position:absolute;top:-.6rem;right:1.2rem;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;
  padding:.28rem .7rem;border-radius:20px;background:var(--accent-1);color:#1a0610;font-weight:700;
}
.package-card h3{font-size:1.15rem;color:var(--text-0)}
.package-card .pkg-tagline{font-size:.82rem;color:var(--text-2);margin-top:-.4rem}
.package-card .pkg-price{font-size:1.6rem;color:var(--text-0);font-weight:600}
.package-card .pkg-price small{font-size:.7rem;font-weight:500;color:var(--text-2);text-transform:uppercase;letter-spacing:.06em}
.package-card ul{display:grid;gap:.5rem;font-size:.82rem;color:var(--text-1);flex:1}
.package-card ul li{display:flex;gap:.5rem;align-items:flex-start}
.package-card ul li::before{content:'✓';color:var(--ok);font-weight:700;flex-shrink:0}
.package-card .btn{margin-top:.3rem;text-align:center}

.stepper{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.8rem;counter-reset:step}
.stepper span{
  display:flex;align-items:center;gap:.5rem;font-size:.76rem;color:var(--text-2);
  padding:.5rem .9rem .5rem .6rem;border:1px solid var(--line);border-radius:30px;
}
.stepper span::before{
  counter-increment:step;content:counter(step);width:20px;height:20px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:var(--bg-3);font-size:.68rem;color:var(--text-1);
}
.stepper span.is-done{color:var(--ok);border-color:rgba(62,207,142,.4)}
.stepper span.is-done::before{background:var(--ok);color:#08140e}
.stepper span.is-current{color:var(--text-0);border-color:var(--accent-1);background:var(--accent-soft)}
.stepper span.is-current::before{background:var(--accent-1);color:#1a0610}

.pagination{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.6rem}
.pagination a,.pagination span{
  min-width:36px;height:36px;padding:0 .6rem;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);border-radius:var(--r-ctl);font-size:.82rem;color:var(--text-1);
}
.pagination a:hover{border-color:var(--accent-1);color:var(--accent-1)}
.pagination .is-current{background:var(--accent-1);border-color:var(--accent-1);color:#1a0610;font-weight:600}

.admin-empty{
  padding:2.6rem 1.6rem;border:1px dashed var(--line-strong);border-radius:var(--r-card);
  text-align:center;color:var(--text-2);display:grid;gap:.6rem;justify-items:center;
}
.admin-empty strong{color:var(--text-0);font-size:1rem}

.trend-chip{display:inline-flex;align-items:center;gap:.3rem;font-size:.74rem;font-weight:600}
.trend-chip.up{color:var(--ok)}
.trend-chip.down{color:var(--danger)}
.trend-chip.flat{color:var(--text-2)}

.kpi-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.9rem;margin-bottom:1.6rem}
.kpi-strip a.stat-card{transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.kpi-strip a.stat-card:hover{border-color:var(--accent-1);transform:translateY(-2px)}

.city-select-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:640px){.city-select-grid{grid-template-columns:1fr}}

.view-toggle{display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--r-ctl);overflow:hidden;margin-bottom:1rem}
.view-toggle a{padding:.5rem 1rem;font-size:.78rem;color:var(--text-2)}
.view-toggle a.active{background:var(--accent-soft);color:var(--accent-1)}

/* ================================================================
   Yardımcı sınıflar

   CSP `style-src 'self' 'nonce-…'` satır içi style ÖZNİTELİKLERİNİ
   engelliyor (nonce yalnızca <style> etiketine uygulanır, özniteliğe
   uygulanamaz). Bu yüzden şablonlardaki style="" kullanımları buradaki
   sınıflara taşındı; aksi hâlde stiller sessizce hiç uygulanmıyordu.
   ================================================================ */

.u-mb-sm{margin-bottom:.6rem}
.u-mt-sm{margin-top:.5rem}
.u-mt-md{margin-top:.6rem}
.u-mt-lg{margin-top:1rem}
.u-mt-xl{margin-top:2.4rem}
.u-m-0{margin:0}
.u-block{width:100%}
.u-break{word-break:break-all}
.u-hidden{display:none}

.muted-sm{font-size:.8rem;color:var(--text-2)}
.muted-xs{font-size:.78rem;color:var(--text-2)}
.reject-note{font-size:.72rem;color:var(--danger)}

.login-h{font-size:22px;margin-bottom:1rem}
.login-alt{margin-top:1.2rem;font-size:.82rem;color:var(--text-2)}
.login-alt a{color:var(--accent-1)}
.login-back{margin-top:.5rem;font-size:.82rem}
.login-back a{color:var(--text-2)}

.badge-lg{font-size:.85rem;padding:.4rem .8rem}
.field-note{font-size:.8rem;color:var(--text-2);margin:1rem 0 .3rem}
.field-hint{font-size:.78rem;color:var(--text-2);margin-top:1.3rem}

/* Form denetimleri: satır içi stil yerine tek yerden yönetilen görünüm */
.ctl{
  width:100%;
  margin-top:.35rem;
  padding:.6rem;
  border-radius:var(--r-ctl);
  border:1px solid var(--line-strong);
  background:var(--bg-2);
  color:var(--text-0);
  font:inherit;
}
.ctl:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.ctl-sm{
  padding:.5rem;
  border-radius:var(--r-ctl);
  border:1px solid var(--line-strong);
  background:var(--bg-2);
  color:var(--text-0);
  font:inherit;
}
.label-block{display:block;margin-bottom:.7rem}
.label-cap{font-size:.72rem;color:var(--text-2);text-transform:uppercase;letter-spacing:.06em}

.toolbar-row{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.panel-full{grid-column:1/-1}

/* ---- İlan sahibi detay sayfası ---- */
.back-link{
  display:inline-block;
  margin-bottom:.4rem;
  font-size:.78rem;
  color:var(--text-2);
  transition:color var(--dur) var(--ease);
}
.back-link:hover{color:var(--accent-1)}
.row-title{font-weight:600;color:var(--text-0);transition:color var(--dur) var(--ease)}
.row-title:hover{color:var(--accent-1)}
.count-chip{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:20px;height:20px;padding:0 .38rem;margin-left:.45rem;
  border-radius:20px;background:var(--accent-soft);
  font-family:var(--body);font-size:.68rem;font-weight:700;color:var(--accent-1);
  vertical-align:middle;font-variant-numeric:tabular-nums;
}
