/* Panel tema token'ları */
:root {
    color-scheme: light;

    /* Marka */
    --cp-primary: #2563ff;
    --cp-primary-dark: #1d4ed8;
    --cp-accent: #7c3aed;
    --cp-on-primary: #ffffff;

    /* Yüzeyler: sayfa → kart → hafif dolgu */
    --cp-bg: #f4f6fb;
    --cp-surface: #ffffff;
    --cp-surface-2: #f8fafc;
    --cp-soft: #f1f5f9;
    --cp-soft-2: #eef2f7;

    /* Çizgiler */
    --cp-border: #e5e8f2;
    --cp-line: #e5e8f2;
    --cp-line-strong: #cbd5e1;

    /* Metin */
    --cp-text: #0b0f1f;
    --cp-ink: #0b0f1f;
    --cp-text-strong: #0f172a;
    --cp-muted: #606e83;          /* sayfa zemininde 4.79:1 */
    --cp-muted-2: #475569;

    /* Kenar çubuğu (her iki temada da koyu) */
    --cp-sidebar: #0b0f1f;
    --cp-sidebar-hover: #1b2342;

    /* Durum renkleri */
    --cp-success-bg: #dcfce7;  --cp-success-fg: #166534;  --cp-success-line: #bbf7d0;
    --cp-danger-bg:  #fee2e2;  --cp-danger-fg:  #991b1b;  --cp-danger-line:  #fecaca;
    --cp-warning-bg: #fef3c7;  --cp-warning-fg: #92400e;  --cp-warning-line: #fde68a;
    --cp-info-bg:    #dbeafe;  --cp-info-fg:    #1e40af;  --cp-info-line:    #bfdbfe;
    --cp-danger:   #dc2626;
    --cp-danger-2: #ef4444;
    --cp-tint: #ecfdf5;

    /* Gölgeler */
    --cp-shadow: 0 1px 3px rgba(11,15,31,.06);
    --cp-shadow-lg: 0 20px 60px rgba(11,15,31,.25);
}

/* Koyu tema */
[data-theme="dark"] {
    color-scheme: dark;

    --cp-primary: #5b8cff;
    --cp-primary-dark: #86aaff;
    --cp-accent: #a17dff;

    --cp-bg: #0c1017;
    --cp-surface: #151a24;
    --cp-surface-2: #1a212c;
    --cp-soft: #1e2632;
    --cp-soft-2: #232c3a;

    --cp-border: #29323f;
    --cp-line: #29323f;
    --cp-line-strong: #3b4757;

    --cp-text: #e5eaf3;
    --cp-ink: #e5eaf3;
    --cp-text-strong: #f4f7fc;
    --cp-muted: #94a3b8;
    --cp-muted-2: #aab6c7;

    --cp-sidebar: #080b11;
    --cp-sidebar-hover: #1a2333;

    --cp-success-bg: rgba(34,197,94,.16);  --cp-success-fg: #56d98a;  --cp-success-line: rgba(34,197,94,.32);
    --cp-danger-bg:  rgba(239,68,68,.16);  --cp-danger-fg:  #ff8b8b;  --cp-danger-line:  rgba(239,68,68,.32);
    --cp-warning-bg: rgba(245,158,11,.16); --cp-warning-fg: #fbbf24;  --cp-warning-line: rgba(245,158,11,.32);
    --cp-info-bg:    rgba(59,130,246,.16); --cp-info-fg:    #7fb0ff;  --cp-info-line:    rgba(59,130,246,.32);
    --cp-danger:   #ef4444;
    --cp-danger-2: #f87171;
    --cp-tint: rgba(91,140,255,.14);

    --cp-shadow: 0 1px 3px rgba(0,0,0,.4);
    --cp-shadow-lg: 0 20px 60px rgba(0,0,0,.6);
}

body, .cp-topbar, .card, table.data td, table.data th, .form-control, .form-select {
    transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
@media (prefers-reduced-motion: reduce) {
    body, .cp-topbar, .card, table.data td, table.data th, .form-control, .form-select { transition: none; }
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background: var(--cp-bg);
    color: var(--cp-text);
    font-size: 14px;
}

a { color: var(--cp-primary); text-decoration: none; }
a:hover { color: var(--cp-primary-dark); }

.cp-wrapper { display: flex; min-height: 100vh; }

.cp-sidebar {
    width: 256px;
    background: linear-gradient(180deg, #0e1626 0%, #0a1120 100%);
    color: var(--cp-muted);
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    position: fixed;
    height: 100vh;
    overflow-y: auto;
    border-right: 1px solid rgba(255,255,255,.05);
}
/* İnce, sade scrollbar */
.cp-sidebar::-webkit-scrollbar { width: 6px; }
.cp-sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.08); border-radius: 99px; }
.cp-sidebar:hover::-webkit-scrollbar-thumb { background: rgba(255,255,255,.14); }

.cp-brand {
    padding: 20px 18px;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 4px;
}
.cp-brand .logo {
    width: 32px; height: 32px; border-radius: 9px;
    background: var(--cp-primary); display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 12px -4px rgba(37,99,255,.5);
}
.cp-brand .logo svg { width: 18px; height: 18px; color: #fff; }
.cp-brand small { display: block; font-size: 11px; color: var(--cp-muted); font-weight: 500; margin-top: 1px; }
/* Logo */
.brand-logo { display: inline-block; width: auto; line-height: 0; }
.brand-logo-dark { display: none; }
[data-theme="dark"] .brand-logo-light { display: none; }
[data-theme="dark"] .brand-logo-dark { display: block; }
.brand-logo img { height: 24px; width: auto; max-width: 150px; display: block; }

.cp-nav { padding: 6px 12px 18px; flex: 1; }
.cp-nav-label {
    font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase;
    color: var(--cp-sidebar-muted); padding: 16px 12px 7px; font-weight: 600;
    display: flex; align-items: center; gap: 6px;
}
.cp-nav-label i { font-size: 11px; opacity: .7; }

.cp-nav a,
.cp-nav details > summary {
    display: flex; align-items: center; gap: 11px;
    padding: 9px 12px; border-radius: 10px;
    color: var(--cp-sidebar-muted); font-weight: 500; font-size: 13.5px; margin-bottom: 1px;
    transition: background .14s, color .14s, box-shadow .14s;
    position: relative;
}
.cp-nav details > summary { cursor: pointer; list-style: none; }
.cp-nav details > summary::-webkit-details-marker { display: none; }
.cp-nav-badge { margin-left: auto; flex: none; background: var(--cp-danger); color: #fff; font-size: 11px; font-weight: 700; line-height: 1; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; }

.cp-nav a:hover,
.cp-nav details > summary:hover { background: rgba(255,255,255,.04); color: var(--cp-sidebar-text); }

/* Aktif olurken yumuşak animasyon */
.cp-nav a,
.cp-nav details > summary { transition: background .18s ease, box-shadow .18s ease, color .18s ease; }

/* Aktif: canlı gradyan pill + sol vurgu çubuğu + rafine glow */
.cp-nav a.active,
.cp-nav details > summary.active {
    position: relative;
    background: linear-gradient(135deg, #2563ff 0%, #6d28d9 52%, #8b5cf6 100%);
    color: #fff;
    box-shadow: 0 9px 24px -9px rgba(99,42,214,.72), 0 0 0 1px rgba(255,255,255,.09) inset;
}
.cp-nav a.active::before,
.cp-nav details > summary.active::before {
    content: '';
    position: absolute; left: 0; top: 50%; transform: translateY(-50%);
    width: 3px; height: 58%; border-radius: 0 4px 4px 0;
    background: #fff; opacity: .95;
}
.cp-nav a.active:hover,
.cp-nav details > summary.active:hover {
    background: linear-gradient(135deg, #3068ff 0%, #7c3aed 52%, #9b6cf7 100%);
    color: #fff;
    box-shadow: 0 11px 28px -9px rgba(99,42,214,.85), 0 0 0 1px rgba(255,255,255,.14) inset;
}
.cp-nav a svg { width: 18px; height: 18px; flex-shrink: 0; opacity: .85; }
.cp-nav a.active svg { opacity: 1; }
.cp-nav details > summary .lead-ico { width: 18px; height: 18px; flex-shrink: 0; }
.cp-nav details > summary .chev { width: 14px; height: 14px; margin-left: auto; opacity: .5; transition: transform .2s; }
.cp-nav details[open] > summary .chev { transform: rotate(90deg); }
.cp-apps-count { margin-left: auto; font-size: 10px; font-weight: 700; min-width: 17px; height: 17px; padding: 0 5px; border-radius: 9px; background: rgba(14,165,233,.18); color: #0ea5e9; display: inline-flex; align-items: center; justify-content: center; }
.cp-nav details > summary .cp-apps-count + .chev { margin-left: 8px; }

.cp-nav-sub { margin: 1px 0 6px 22px; padding-left: 12px; border-left: 1px solid rgba(255,255,255,.07); }
.cp-nav-sub a { padding: 7px 11px; font-size: 13px; gap: 10px; color: var(--cp-sidebar-muted); }
.cp-nav-sub a:hover { color: var(--cp-sidebar-text); }
.cp-nav-sub a.active { background: rgba(37,99,255,.14); color: var(--cp-primary); box-shadow: inset 2px 0 0 var(--cp-primary); }
.cp-nav-sub a i { width: 16px; text-align: center; font-size: 12.5px; opacity: .65; flex-shrink: 0; }
.cp-nav-sub a.active i { opacity: 1; }

/* Uygulamalar listesi öğeleri: aynı sade dil */
.cp-nav a.cp-app-link { color: var(--cp-sidebar-muted); }
.cp-nav a.cp-app-link:hover { background: rgba(255,255,255,.04); color: var(--cp-sidebar-text); }

/* Modül grupları (açılır alt sayfalar) */
.cp-nav details.cp-nav-group > summary i.lead-ico {
    width: 18px; font-size: 17px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}

.cp-nav details.cp-nav-group > .cp-nav-sub {
    overflow: hidden;
    transition: height .24s ease, opacity .24s ease;
}
.cp-nav details.cp-nav-group.cp-animating > .cp-nav-sub { will-change: height; }
/* chevron dönüşünü biraz yumuşat */
.cp-nav details > summary .chev { transition: transform .25s ease; }
@media (prefers-reduced-motion: reduce) {
    .cp-nav details.cp-nav-group > .cp-nav-sub { transition: none; }
}

.cp-main { flex: 1; margin-left: 256px; display: flex; flex-direction: column; }

.cp-topbar {
    background: var(--cp-surface); border-bottom: 1px solid var(--cp-border);
    padding: 0 28px; height: 64px;
    display: flex; align-items: center; justify-content: space-between;
    position: sticky; top: 0; z-index: 10;
}
.cp-topbar h1 { font-size: 18px; margin: 0; font-weight: 600; }

.cp-user { display: flex; align-items: center; gap: 14px; }
.cp-avatar {
    width: 36px; height: 36px; border-radius: 50%;
    background: var(--cp-primary); color: #fff;
    display: flex; align-items: center; justify-content: center; font-weight: 600;
    overflow: hidden; flex-shrink: 0;
}
.cp-company-tag { font-size: 13px; color: var(--cp-muted); }
.cp-company-tag strong { color: var(--cp-text); display: block; }

.cp-impersonation-bar {
    background: var(--cp-warning-bg); color: var(--cp-warning-fg); border-bottom: 1px solid var(--cp-warning-line);
    padding: 10px 28px; display: flex; align-items: center; justify-content: space-between;
    gap: 16px; font-size: 14px; font-weight: 500;
}
.cp-impersonation-bar span { display: flex; align-items: center; gap: 8px; }

/* Modal */
.modal-backdrop { display: none; position: fixed; inset: 0; background: rgba(15,23,42,.55); z-index: 100; align-items: flex-start; justify-content: center; padding: 60px 20px; overflow-y: auto; }
.modal-backdrop.open { display: flex; }
.modal-box { background: var(--cp-surface); border-radius: 16px; width: 100%; max-width: 520px; box-shadow: 0 20px 60px rgba(0,0,0,.25); animation: modalIn .15s ease; }
@keyframes modalIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
.modal-head { display: flex; justify-content: space-between; align-items: center; padding: 18px 22px; border-bottom: 1px solid var(--cp-border); font-size: 16px; }
.modal-close { background: none; border: none; font-size: 26px; line-height: 1; color: var(--cp-muted); cursor: pointer; }
.modal-close:hover { color: var(--cp-text); }
.modal-body { padding: 22px; }
.modal-foot { padding: 16px 22px; border-top: 1px solid var(--cp-border); display: flex; justify-content: flex-end; gap: 10px; }
.field-error { color: var(--cp-danger-2); font-size: 12px; margin-top: 4px; }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--cp-danger-2); }

.app-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; padding: 14px 28px; border-top: 1px solid var(--cp-border); color: var(--cp-muted); font-size: 13px; background: var(--cp-surface); }
.app-footer-links { display: flex; gap: 18px; flex-wrap: wrap; }
.app-footer-links a { color: var(--cp-muted); }
.app-footer-links a:hover { color: var(--cp-primary); }

.cp-bell { position: relative; display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 9px; color: var(--cp-muted); }
.cp-bell:hover { background: var(--cp-soft); color: var(--cp-text); }
.cp-bell svg { width: 20px; height: 20px; }
.cp-bell-badge { position: absolute; top: 2px; right: 2px; background: var(--cp-danger-2); color: #fff; font-size: 10px; font-weight: 700; min-width: 16px; height: 16px; border-radius: 8px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }

.cp-content { padding: 28px; flex: 1; }

/* Breadcrumb barı (başlığın hemen altı) */
.cp-breadcrumb-bar {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
    padding: 9px 28px; background: var(--cp-surface); border-bottom: 1px solid var(--cp-border);
    position: sticky; top: 64px; z-index: 9;
}
.cp-breadcrumb { display: flex; align-items: center; gap: 7px; font-size: 13px; color: var(--cp-muted); min-width: 0; flex-wrap: wrap; }
.cp-breadcrumb a { color: var(--cp-muted); display: inline-flex; align-items: center; gap: 5px; }
.cp-breadcrumb a:hover { color: var(--cp-primary); }
.cp-breadcrumb .sep { color: var(--cp-line-strong); }
.cp-breadcrumb .cur { color: var(--cp-text-strong); font-weight: 600; }
.cp-breadcrumb-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.cp-breadcrumb-actions button {
    display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 500;
    padding: 6px 12px; border: 1px solid var(--cp-border); background: var(--cp-surface); color: var(--cp-muted-2);
    border-radius: 8px; cursor: pointer; transition: background .15s, color .15s, border-color .15s;
}
.cp-breadcrumb-actions button:hover { background: var(--cp-soft); color: var(--cp-text-strong); border-color: var(--cp-line-strong); }
.cp-breadcrumb-actions button i { font-size: 12px; }

.card {
    background: var(--cp-surface); border: 1px solid var(--cp-border);
    border-radius: 14px; box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.card-header {
    padding: 18px 22px; border-bottom: 1px solid var(--cp-border);
    font-weight: 600; display: flex; justify-content: space-between; align-items: center;
}
.card-body { padding: 22px; }

.stat-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 18px; margin-bottom: 24px;
}
.stat-card {
    background: var(--cp-surface); border: 1px solid var(--cp-border);
    border-radius: 14px; padding: 22px;
    display: flex; align-items: center; gap: 16px;
}
.stat-icon {
    width: 50px; height: 50px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    background: var(--cp-success-bg); color: var(--cp-primary);
}
.stat-icon svg { width: 24px; height: 24px; }
.stat-meta .value { font-size: 24px; font-weight: 700; line-height: 1; }
.stat-meta .label { color: var(--cp-muted); font-size: 13px; margin-top: 4px; }

.table-wrap { overflow-x: auto; }
table.data { width: 100%; border-collapse: collapse; }
table.data th {
    text-align: left; padding: 12px 16px; font-size: 12px;
    text-transform: uppercase; letter-spacing: .04em; color: var(--cp-muted);
    border-bottom: 1px solid var(--cp-border); font-weight: 600;
}
table.data td { padding: 14px 16px; border-bottom: 1px solid var(--cp-border); }
table.data tr:last-child td { border-bottom: none; }
table.data tbody tr:hover { background: var(--cp-surface-2); }

.btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 9px 16px; border-radius: 9px; border: 1px solid transparent;
    font-weight: 500; font-size: 14px; cursor: pointer; transition: all .15s; background: var(--cp-surface);
}
.btn svg { width: 16px; height: 16px; }
.btn-primary { background: var(--cp-primary); color: #fff; }
.btn-primary:hover { background: var(--cp-primary-dark); color: #fff; }
.btn-light { background: var(--cp-surface); border-color: var(--cp-border); color: var(--cp-text); }
.btn-light:hover { background: var(--cp-surface-2); }
.btn-danger { background: var(--cp-danger-2); color: #fff; }
.btn-danger:hover { background: var(--cp-danger); color: #fff; }
.btn-sm { padding: 6px 12px; font-size: 13px; }
.btn-block { width: 100%; justify-content: center; }

.form-group { margin-bottom: 18px; }
.form-label { display: block; font-weight: 500; margin-bottom: 7px; font-size: 13px; }
.form-control, .form-select, select {
    width: 100%; box-sizing: border-box; padding: 10px 14px; border: 1px solid var(--cp-border);
    border-radius: 9px; font-size: 14px; line-height: 1.4; font-family: inherit; background-color: #fff; color: inherit;
    transition: border-color .15s, box-shadow .15s;
}

.form-select, select {
    -webkit-appearance: none; -moz-appearance: none; appearance: none;
    padding-right: 38px; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20fill='none'%20stroke='%2364748b'%20stroke-width='2'%20viewBox='0%200%2024%2024'%3E%3Cpath%20stroke-linecap='round'%20stroke-linejoin='round'%20d='M19%209l-7%207-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 13px center; background-size: 16px;
}
.form-select::-ms-expand, select::-ms-expand { display: none; }
.form-control:focus, .form-select:focus {
    outline: none; border-color: var(--cp-primary);
    box-shadow: 0 0 0 3px rgba(22,163,74,.12);
}
textarea.form-control { min-height: 90px; resize: vertical; }
.form-hint { font-size: 12px; color: var(--cp-muted); margin-top: 5px; }

/* ============ Tarih & saat inputları — premium tasarım ============ */
/* Ortak: daha büyük alan, solda marka ikon boşluğu, sağda picker butonu */
input[type="date"].form-control, input[type="time"].form-control,
input[type="datetime-local"].form-control, input[type="month"].form-control,
input[type="week"].form-control {
    min-height: 47px; cursor: pointer; accent-color: var(--cp-primary);
    font-variant-numeric: tabular-nums; font-weight: 550;
    padding-left: 44px; padding-right: 10px;
    background-repeat: no-repeat; background-position: left 14px center; background-size: 19px;
    transition: border-color .15s, box-shadow .15s, background-color .15s;
}
/* Sol ikon — tarih türlerinde marka renkli takvim */
input[type="date"].form-control, input[type="datetime-local"].form-control,
input[type="month"].form-control, input[type="week"].form-control {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='20'%20height='20'%20fill='none'%20stroke='%2316a34a'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20viewBox='0%200%2024%2024'%3E%3Crect%20x='3'%20y='4'%20width='18'%20height='18'%20rx='2.5'/%3E%3Cpath%20d='M16%202v4M8%202v4M3%2010h18'/%3E%3C/svg%3E");
}
/* Sol ikon — saatte marka renkli saat */
input[type="time"].form-control {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='20'%20height='20'%20fill='none'%20stroke='%2316a34a'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20viewBox='0%200%2024%2024'%3E%3Ccircle%20cx='12'%20cy='12'%20r='9'/%3E%3Cpath%20d='M12%207v5l3%202'/%3E%3C/svg%3E");
}
input[type="date"].form-control:hover, input[type="time"].form-control:hover,
input[type="datetime-local"].form-control:hover, input[type="month"].form-control:hover,
input[type="week"].form-control:hover { border-color: var(--cp-primary); }
input[type="date"].form-control:focus, input[type="time"].form-control:focus,
input[type="datetime-local"].form-control:focus, input[type="month"].form-control:focus,
input[type="week"].form-control:focus { background-color: color-mix(in srgb, var(--cp-primary) 4%, var(--cp-surface,#fff)); }
input[type="date"].form-control::-webkit-datetime-edit,
input[type="time"].form-control::-webkit-datetime-edit,
input[type="datetime-local"].form-control::-webkit-datetime-edit { padding: 2px 0; color: var(--cp-text-strong,#0f172a); }
/* Sağdaki picker göstergesi — belirgin marka "aç" butonu (chevron) */
input[type="date"].form-control::-webkit-calendar-picker-indicator,
input[type="time"].form-control::-webkit-calendar-picker-indicator,
input[type="datetime-local"].form-control::-webkit-calendar-picker-indicator,
input[type="month"].form-control::-webkit-calendar-picker-indicator,
input[type="week"].form-control::-webkit-calendar-picker-indicator {
    cursor: pointer; width: 15px; height: 15px; padding: 6px; margin-left: 6px; border-radius: 9px;
    background-color: color-mix(in srgb, var(--cp-primary) 12%, transparent);
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='15'%20height='15'%20fill='none'%20stroke='%2316a34a'%20stroke-width='2.4'%20stroke-linecap='round'%20stroke-linejoin='round'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M6%209l6%206%206-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: center; background-size: 14px;
    transition: background-color .15s, transform .15s;
}
input[type="date"].form-control::-webkit-calendar-picker-indicator:hover,
input[type="time"].form-control::-webkit-calendar-picker-indicator:hover,
input[type="datetime-local"].form-control::-webkit-calendar-picker-indicator:hover,
input[type="month"].form-control::-webkit-calendar-picker-indicator:hover,
input[type="week"].form-control::-webkit-calendar-picker-indicator:hover { background-color: color-mix(in srgb, var(--cp-primary) 24%, transparent); }

/* Sosyal gönderi listesi — görsel küçük resmi */
.sp-thumb { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 9px; overflow: hidden;
    border: 1px solid var(--cp-border); background: var(--cp-surface-2); flex: none; }
.sp-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
a.sp-thumb { transition: transform .12s, box-shadow .12s; }
a.sp-thumb:hover { transform: scale(1.04); box-shadow: 0 4px 12px rgba(0,0,0,.14); }
.sp-thumb-empty { color: var(--cp-muted); font-size: 16px; }
.sp-thumb-vid { color: var(--cp-primary); font-size: 15px; background: color-mix(in srgb, var(--cp-primary) 12%, var(--cp-surface-2)); }

.chk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 6px 14px; }
.chk { display: flex; align-items: center; gap: 8px; font-size: 13.5px; cursor: pointer; padding: 4px 0; }
.chk input { flex: none; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-check { display: flex; align-items: center; gap: 10px; }
.form-check input { width: 18px; height: 18px; }

/* Toggle switch (otomasyon ayarları vb.) */
.cp-switch { position: relative; display: inline-block; width: 42px; height: 24px; flex-shrink: 0; }
.cp-switch input { opacity: 0; width: 0; height: 0; }
.cp-switch .track { position: absolute; inset: 0; background: var(--cp-line-strong); border-radius: 999px; transition: background .18s; cursor: pointer; }
.cp-switch .track::before { content: ""; position: absolute; height: 18px; width: 18px; left: 3px; top: 3px; background: var(--cp-surface); border-radius: 50%; transition: transform .18s; box-shadow: 0 1px 3px rgba(0,0,0,.3); }
.cp-switch input:checked + .track { background: var(--cp-primary); }
.cp-switch input:checked + .track::before { transform: translateX(18px); }
.cp-switch input:disabled + .track { opacity: .5; cursor: not-allowed; }
.cp-switch-row { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--cp-border); }
.cp-switch-row:last-child { border-bottom: none; }
.cp-switch-row .info { flex: 1; min-width: 0; }
.cp-switch-row .info strong { display: block; font-size: 14px; }
.cp-switch-row .info small { color: var(--cp-muted); font-size: 12.5px; }
.cp-switch-row .ico { width: 34px; height: 34px; border-radius: 9px; background: var(--cp-soft); display: flex; align-items: center; justify-content: center; color: var(--cp-muted-2); flex-shrink: 0; }

select[multiple], select[multiple].form-select { min-height: 160px; background-image: none; padding-right: 14px; cursor: default; }

.badge {
    display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px;
    border-radius: 20px; font-size: 12px; font-weight: 600;
}
.badge-success { background: var(--cp-success-bg); color: var(--cp-success-fg); }
.badge-danger { background: var(--cp-danger-bg); color: var(--cp-danger-fg); }
.badge-warning { background: var(--cp-warning-bg); color: var(--cp-warning-fg); }
.badge-info { background: var(--cp-info-bg); color: var(--cp-info-fg); }
.badge-muted { background: var(--cp-soft); color: var(--cp-muted-2); }
/* Rozet rafine: hafif kenarlık + ikon hizası (panel geneli) */
.badge { letter-spacing: .01em; line-height: 1.1; border: 1px solid transparent; }
.badge i { font-size: .9em; }
.badge-success { border-color: color-mix(in srgb, var(--cp-success-fg) 22%, transparent); }
.badge-danger  { border-color: color-mix(in srgb, var(--cp-danger-fg) 22%, transparent); }
.badge-warning { border-color: color-mix(in srgb, var(--cp-warning-fg) 22%, transparent); }
.badge-info    { border-color: color-mix(in srgb, var(--cp-info-fg) 22%, transparent); }
.badge-muted   { border-color: color-mix(in srgb, var(--cp-muted-2) 18%, transparent); }
.badge-dot::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .9; }

/* ---- Panel ortak modal ---- */
.cp-modal-overlay { position: fixed; inset: 0; background: rgba(15,23,42,.55); display: flex; align-items: center; justify-content: center; padding: 20px; z-index: 1000; }
.cp-modal { background: var(--cp-surface,#fff); border-radius: 18px; width: 100%; max-width: 520px; max-height: 88vh; overflow: auto; box-shadow: 0 30px 70px -20px rgba(0,0,0,.55); }
.cp-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 18px 22px; border-bottom: 1px solid var(--cp-border); position: sticky; top: 0; background: var(--cp-surface,#fff); }
.cp-modal-head h3 { margin: 0; font-size: 17px; font-weight: 700; }
.cp-modal-x { background: none; border: none; color: var(--cp-muted); cursor: pointer; width: 34px; height: 34px; border-radius: 9px; font-size: 16px; }
.cp-modal-x:hover { background: var(--cp-soft); color: var(--cp-text); }
.cp-modal-body { padding: 20px 22px; }

/* ---- Hashtag chip'leri ---- */
.ht-wrap { margin-top: 12px; }
.ht-title { font-size: 12px; font-weight: 700; color: var(--cp-muted); text-transform: uppercase; letter-spacing: .04em; display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.ht-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.ht-chip { display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border-radius: 999px; border: 1.5px solid var(--cp-border); background: var(--cp-surface,#fff); color: var(--cp-primary,#2563eb); font-size: 12.5px; font-weight: 600; cursor: pointer; transition: .15s; }
.ht-chip:hover { border-color: var(--cp-primary); background: color-mix(in srgb, var(--cp-primary) 8%, var(--cp-surface)); transform: translateY(-1px); }
.ht-empty { font-size: 12.5px; color: var(--cp-muted); background: var(--cp-soft); border: 1px dashed var(--cp-border); border-radius: 10px; padding: 10px 12px; }
.ht-manage-chip { border-style: dashed; color: var(--cp-muted); }
.ht-manage-chip:hover { color: var(--cp-primary); }
.ht-row { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--cp-border); }
.ht-row .ht-tag { flex: 1; font-weight: 600; color: var(--cp-text-strong,#0f172a); }

/* ---- Yaklaşan özel gün rozeti ---- */
.sp-upcoming { display: flex; align-items: center; gap: 12px; padding: 12px 16px; margin-bottom: 14px; border-radius: 14px;
    background: linear-gradient(100deg, color-mix(in srgb,#7c3aed 14%, var(--cp-surface)), color-mix(in srgb,#2563eb 10%, var(--cp-surface)));
    border: 1px solid color-mix(in srgb,#7c3aed 30%, transparent); }
.sp-upcoming-ic { flex: none; width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; font-size: 18px; color: #fff; background: linear-gradient(135deg,#7c3aed,#2563eb); box-shadow: 0 6px 14px -6px rgba(124,58,237,.6); }
.sp-upcoming-body { flex: 1; min-width: 0; }
.sp-upcoming-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 5px; }
.sp-up-pill { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: var(--cp-surface,#fff); border: 1px solid var(--cp-border); }
.sp-up-pill b { color: #7c3aed; }

/* ---- Paylaşım metni alanı ---- */
.msg-wrap { position: relative; }
.msg-wrap textarea { padding-bottom: 26px; }
.msg-counter { position: absolute; right: 12px; bottom: 8px; font-size: 11.5px; color: var(--cp-muted); font-variant-numeric: tabular-nums; pointer-events: none; background: var(--cp-surface,#fff); padding: 0 4px; border-radius: 6px; }
.msg-counter.over { color: var(--cp-danger,#dc2626); font-weight: 700; }

.alert {
    padding: 14px 18px; border-radius: 10px; margin-bottom: 20px; font-size: 14px;
}
.alert-success { background: var(--cp-success-bg); color: var(--cp-success-fg); border: 1px solid var(--cp-success-line); }
.alert-danger { background: var(--cp-danger-bg); color: var(--cp-danger-fg); border: 1px solid var(--cp-danger-line); }
.alert-info { background: var(--cp-info-bg); color: var(--cp-info-fg); border: 1px solid var(--cp-info-line); }
.alert-warning { background: var(--cp-warning-bg); color: var(--cp-warning-fg); border: 1px solid var(--cp-warning-line); }

.auth-wrap {
    min-height: 100vh; display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #0b0f1f 0%, #2563ff 100%); padding: 20px;
}
.auth-card {
    background: var(--cp-surface); border-radius: 18px; padding: 40px; width: 100%;
    max-width: 420px; box-shadow: 0 20px 50px rgba(0,0,0,.2);
}
.auth-card h2 { margin: 0 0 6px; font-size: 22px; }
.auth-card .sub { color: var(--cp-muted); margin-bottom: 28px; }

.page-actions { display: flex; gap: 10px; align-items: center; }
.flex-between { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.mb-0 { margin-bottom: 0; }
.mt-3 { margin-top: 18px; }
.mb-3 { margin-bottom: 22px; }
.text-muted { color: var(--cp-muted); }
.text-right { text-align: right; }
.empty-state { text-align: center; padding: 50px 20px; color: var(--cp-muted); }

.pagination { display: flex; gap: 6px; margin-top: 20px; list-style: none; padding: 0; flex-wrap: wrap; }
.pagination a, .pagination span {
    padding: 7px 12px; border-radius: 8px; border: 1px solid var(--cp-border);
    color: var(--cp-text); background: var(--cp-surface);
}
.pagination .active span { background: var(--cp-primary); color: #fff; border-color: var(--cp-primary); }

/* Docs */
.docs-layout { display: grid; grid-template-columns: 260px 1fr; gap: 24px; align-items: start; }
.docs-sidebar { position: sticky; top: 92px; }

.docs-cat { font-size: 10.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
    color: var(--cp-muted); padding: 12px 10px 6px; }
.docs-sidebar .docs-cat:first-child { padding-top: 2px; }
.docs-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.docs-card { padding: 16px 18px; display: block; }
.docs-card strong { font-size: 15px; display: block; }
.docs-card span { font-size: 13px; margin-top: 4px; display: block; line-height: 1.5; }
@media (max-width: 900px) { .docs-cards { grid-template-columns: 1fr; } }
.docs-sidebar a {
    display: block; padding: 10px 14px; border-radius: 9px;
    color: var(--cp-text); margin-bottom: 3px; font-weight: 500;
}
.docs-sidebar a:hover { background: var(--cp-soft); }
.docs-sidebar a.active { background: var(--cp-primary); color: #fff; }
.docs-article { line-height: 1.7; }
.docs-article h4 { margin-top: 28px; margin-bottom: 10px; font-size: 17px; }
.docs-article h4:first-child { margin-top: 0; }
.docs-article ol, .docs-article ul { padding-left: 22px; }
.docs-article li { margin-bottom: 7px; }
.docs-article code { background: var(--cp-soft); padding: 2px 6px; border-radius: 5px; font-size: 13px; color: var(--cp-danger-fg); }
.docs-article table { width: 100%; border-collapse: collapse; margin: 16px 0; }
.docs-article table th, .docs-article table td {
    border: 1px solid var(--cp-border); padding: 10px 12px; text-align: left;
}
.docs-article table th { background: var(--cp-surface-2); font-weight: 600; }
.docs-article .alert { margin-top: 20px; }

.toggle-section { display: none; }

/* Inbox */
.inbox { display: grid; grid-template-columns: 370px 1fr; gap: 18px; height: calc(100vh - 64px - 56px); }
.inbox-list { display: flex; flex-direction: column; overflow: hidden; }
.inbox-list-head { padding: 16px 18px; border-bottom: 1px solid var(--cp-border); font-weight: 600; display: flex; justify-content: space-between; align-items: center; }
.inbox-conversations { overflow-y: auto; flex: 1; }
.inbox-conv { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--cp-border); color: var(--cp-text); }
.inbox-conv:hover { background: var(--cp-surface-2); }
.inbox-conv.active { background: var(--cp-success-bg); }
.inbox-conv-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--cp-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 600; flex-shrink: 0; object-fit: cover; text-transform: uppercase; }
.inbox-conv-meta { flex: 1; min-width: 0; }
.inbox-conv-name { font-weight: 600; font-size: 14px; display: flex; align-items: center; gap: 6px; }
.inbox-conv-phone { color: var(--cp-muted); font-size: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin-top: 4px; }
.inbox-conv-time { color: var(--cp-muted); font-size: 11px; white-space: nowrap; }

/* Sohbet satırı + satır içi işlem menüsü */
.inbox-conv-item { position: relative; border-bottom: 1px solid var(--cp-border); }
.inbox-conv-item .inbox-conv { border-bottom: 0; padding-right: 40px; }
.inbox-conv-item:hover .inbox-conv { background: var(--cp-surface-2); }
.inbox-conv-item.active .inbox-conv { background: var(--cp-success-bg); }
.inbox-conv-menu-btn { position: absolute; top: 10px; right: 8px; width: 26px; height: 26px; border: 0; border-radius: 6px; background: transparent; color: var(--cp-muted); font-size: 18px; line-height: 1; cursor: pointer; opacity: 0; transition: opacity .12s; }
.inbox-conv-item:hover .inbox-conv-menu-btn { opacity: 1; }
.inbox-conv-menu-btn:hover { background: var(--cp-soft-2); color: var(--cp-text); }
.inbox-conv-menu { position: absolute; top: 34px; right: 8px; z-index: 30; min-width: 190px; background: var(--cp-surface); border: 1px solid var(--cp-border); border-radius: 10px; box-shadow: 0 8px 24px rgba(15,23,42,.14); padding: 6px; display: none; }
.inbox-conv-menu.open { display: block; }
.inbox-conv-menu form { margin: 0; }
.inbox-conv-menu-i { width: 100%; text-align: left; border: 0; background: transparent; padding: 8px 10px; border-radius: 7px; font-size: 13px; cursor: pointer; color: var(--cp-text); }
.inbox-conv-menu-i:hover { background: var(--cp-soft); }
.inbox-conv-menu-i.danger { color: var(--cp-danger); }
.inbox-conv-menu-i.danger:hover { background: var(--cp-danger-bg); }
.inbox-conv-menu-assign { padding: 6px 10px; }
.inbox-conv-menu-lbl { display: block; font-size: 11px; color: var(--cp-muted); margin-bottom: 4px; }

.inbox-thread { display: flex; flex-direction: column; overflow: hidden; }
.inbox-thread-head { padding: 16px 20px; border-bottom: 1px solid var(--cp-border); display: flex; justify-content: space-between; align-items: center; }
.inbox-messages { flex: 1; overflow-y: auto; padding: 20px; background: var(--cp-bg); display: flex; flex-direction: column; gap: 8px; }
.inbox-bubble-row { display: flex; }
.inbox-bubble-row.in { justify-content: flex-start; }
.inbox-bubble-row.out { justify-content: flex-end; }
.inbox-bubble { max-width: 70%; padding: 9px 13px; border-radius: 12px; font-size: 14px; line-height: 1.4; }
.inbox-bubble-row.in .inbox-bubble { background: var(--cp-surface); border: 1px solid var(--cp-border); border-bottom-left-radius: 3px; }
.inbox-bubble-row.out .inbox-bubble { background: var(--cp-primary); color: #fff; border-bottom-right-radius: 3px; }
.inbox-bubble-text { white-space: pre-wrap; word-break: break-word; }
.inbox-bubble-time { font-size: 10px; opacity: .7; margin-top: 4px; }
.inbox-compose { padding: 14px 18px; border-top: 1px solid var(--cp-border); }
.inbox-compose-form { display: flex; gap: 10px; }
.inbox-tabs { display: flex; gap: 4px; margin-bottom: 10px; }
.inbox-tab { padding: 6px 14px; border: 1px solid var(--cp-border); background: var(--cp-surface); border-radius: 8px; cursor: pointer; font-size: 13px; font-weight: 500; color: var(--cp-muted); }
.inbox-tab.active { background: var(--cp-primary); color: #fff; border-color: var(--cp-primary); }
.inbox-note { align-self: center; background: var(--cp-warning-bg); border: 1px solid var(--cp-warning-line); color: var(--cp-warning-fg); padding: 8px 14px; border-radius: 10px; font-size: 13px; max-width: 80%; }
.inbox-note .inbox-bubble-time { color: var(--cp-warning-fg); }

@media (max-width: 900px) {
    .inbox { grid-template-columns: 1fr; height: auto; }
}

@media (max-width: 900px) {
    .docs-layout { grid-template-columns: 1fr; }
    .form-row { grid-template-columns: 1fr; }
}

/* ===== Mobil uyumluluk ===== */
.cp-burger { display: none; background: none; border: none; cursor: pointer; padding: 6px; margin-right: 6px; color: var(--cp-text); }
.cp-burger svg { width: 26px; height: 26px; }
.cp-backdrop { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 39; }

@media (max-width: 860px) {
    .cp-sidebar { transform: translateX(-100%); transition: transform .25s ease; z-index: 40; width: 250px; }
    body.cp-nav-open .cp-sidebar { transform: translateX(0); box-shadow: 0 0 40px rgba(0,0,0,.4); }
    body.cp-nav-open .cp-backdrop { display: block; }
    .cp-main { margin-left: 0; }
    .cp-topbar { padding: 0 14px; height: 58px; }
    .cp-topbar h1 { font-size: 16px; }
    .cp-breadcrumb-bar { padding: 8px 14px; top: 58px; }
    .cp-breadcrumb-actions button span { display: none; }
    .cp-breadcrumb-actions button { padding: 6px 9px; }
    .cp-burger { display: inline-flex; align-items: center; }
    .cp-company-tag { display: none; }
    .cp-user { gap: 10px; }

    /* Geniş tablolar kart içinde yatay kaydırılsın */
    .card { overflow-x: auto; }
    table.data { min-width: 560px; }

    /* Genel boşluk/ölçek */
    .cp-content, main { padding: 16px !important; }
    .page-header, .page-actions { flex-wrap: wrap; gap: 10px; }
    .stat-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
    .modal-box { width: 94vw; max-width: 94vw; }
}

@media (max-width: 480px) {
    .stat-grid { grid-template-columns: 1fr; }
}

/* Kullanıcı açılır menüsü (üst bar) */
.cp-usermenu { position: relative; }
.cp-usermenu > summary { display: flex; align-items: center; gap: 10px; cursor: pointer; list-style: none; }
.cp-usermenu > summary::-webkit-details-marker { display: none; }
.cp-usermenu-chev { width: 16px; height: 16px; color: var(--cp-muted); transition: transform .2s; flex-shrink: 0; }
.cp-usermenu[open] .cp-usermenu-chev { transform: rotate(180deg); }
.cp-usermenu-panel {
    position: absolute; right: 0; top: calc(100% + 10px);
    background: var(--cp-surface); border: 1px solid var(--cp-border); border-radius: 12px;
    box-shadow: 0 14px 34px rgba(15,23,42,.14); min-width: 210px; padding: 6px; z-index: 50;
}
.cp-usermenu-panel a,
.cp-usermenu-panel button {
    display: flex; align-items: center; gap: 10px; width: 100%;
    padding: 10px 12px; border-radius: 9px; font-size: 14px; color: var(--cp-text);
    background: none; border: none; cursor: pointer; text-align: left; font-family: inherit; text-decoration: none;
}
.cp-usermenu-panel a:hover,
.cp-usermenu-panel button:hover { background: var(--cp-soft); }
.cp-usermenu-panel svg { width: 18px; height: 18px; color: var(--cp-muted); flex-shrink: 0; }
.cp-usermenu-panel form { margin: 0; }
.cp-usermenu-panel button { color: var(--cp-danger); }
.cp-usermenu-panel button svg { color: var(--cp-danger); }

/* Dil değiştirici (üst bar) */
.cp-langmenu > summary{gap:4px}
.cp-lang-flag{font-size:18px;line-height:1}
.cp-langmenu .cp-usermenu-panel{min-width:180px}
.cp-lang-soon{display:flex;align-items:center;gap:9px;padding:9px 12px;font-size:14px;color: var(--cp-muted);cursor:not-allowed;user-select:none}
.cp-lang-soon .cp-lang-flag{opacity:.5;filter:grayscale(.6)}
.cp-lang-soon em{margin-left:auto;font-style:normal;font-size:11px;background: var(--cp-soft);color: var(--cp-muted);padding:2px 8px;border-radius:100px}

:root{
    --cp-sidebar: #ffffff;
    --cp-sidebar-border: #e5e7eb;
    --cp-sidebar-hover: #f3f4f6;
    --cp-sidebar-text: #414855;
    --cp-sidebar-muted: #6f7786;   /* beyaz menüde 4.51:1 */
}
.cp-sidebar{ background: var(--cp-surface); color:var(--cp-sidebar-text); border-right:1px solid var(--cp-sidebar-border); }
.cp-brand{ color: var(--cp-text-strong); border-bottom:1px solid var(--cp-sidebar-border); }
.cp-brand small{ color:var(--cp-sidebar-muted); }
.cp-nav-label{ text-transform:uppercase; letter-spacing:.06em; color:var(--cp-sidebar-muted); font-weight:600; font-size:10.5px; }

/* Öğeler */
.cp-nav a,
.cp-nav details > summary{ color:var(--cp-sidebar-text); font-weight:500; }
.cp-nav a:hover,
.cp-nav details > summary:hover{ background:var(--cp-sidebar-hover); color: var(--cp-text-strong); }

/* Aktif */
.cp-nav a.active,
.cp-nav details > summary.active{
    background: var(--cp-tint); color:var(--cp-primary); font-weight:600;
    box-shadow: inset 3px 0 0 var(--cp-primary);
}
.cp-nav-sub a.active{ box-shadow:none; background: var(--cp-tint); }

/* Alt menü ayraç çizgisi açık gri */
.cp-nav-sub{ border-left:1px solid var(--cp-sidebar-border); }
.cp-nav-sub a{ color:var(--cp-sidebar-text); }
.cp-nav-sub a i{ opacity:.7; }

/* Chevron ve badge okunur kalsın */
.cp-nav details > summary .chev{ color:var(--cp-sidebar-muted); }

/* Butonlar — daha sade/minimal */
.btn{ border-radius:7px; font-weight:500; box-shadow:none; }
.btn-sm{ border-radius:6px; padding:6px 11px; }
.btn-primary{ background:var(--cp-primary); border-color:var(--cp-primary); }
.btn-primary:hover{ background:var(--cp-primary-dark); border-color:var(--cp-primary-dark); }
.btn-light{ background: var(--cp-surface); border-color: var(--cp-border); color: var(--cp-text); }
.btn-light:hover{ background: var(--cp-surface-2); border-color: var(--cp-line-strong); color: var(--cp-text-strong); }
.btn-danger{ background: var(--cp-danger-2); border-color: var(--cp-danger-2); color:#fff; }
.btn-danger:hover{ background: var(--cp-danger); border-color: var(--cp-danger); color:#fff; }

/* Görsel/video yükleme kutusu (Paylaşım Yap) */
.media-drop{ border:1.5px dashed var(--cp-line-strong); border-radius:12px; background: var(--cp-surface-2); transition:border-color .15s, background .15s; overflow:hidden; }
.media-drop.drag{ border-color:var(--cp-primary); background: var(--cp-tint); }
.media-drop-empty{ display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:6px; padding:26px 16px; cursor:pointer; }
.media-drop-empty:hover{ background: var(--cp-soft); }
.media-drop-empty i{ font-size:26px; color:var(--cp-primary); }
.media-drop-title{ font-size:14px; color: var(--cp-muted-2); }
.media-drop-hint{ font-size:12px; color: var(--cp-muted); }
.media-drop-preview{ position:relative; display:flex; align-items:center; gap:12px; padding:12px; }
.media-drop-preview img, .media-drop-preview video{ max-width:240px; max-height:240px; width:auto; height:auto; object-fit:contain; border-radius:9px; background:#0b1220; flex-shrink:0; }
.media-drop-info{ min-width:0; flex:1; }
.media-drop-name{ font-size:13px; font-weight:600; color: var(--cp-text-strong); word-break:break-all; }
.media-remove{ position:absolute; top:8px; right:8px; width:26px; height:26px; border-radius:50%; border:0; background: var(--cp-danger-2); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:13px; box-shadow:0 2px 6px rgba(0,0,0,.2); }
.media-remove:hover{ background: var(--cp-danger); }

/* Lead form cevapları */
.lead-extra-title{ font-size:12px; font-weight:700; color: var(--cp-muted); text-transform:uppercase; letter-spacing:.4px; margin:12px 0 4px; }
.lead-extra{ display:flex; flex-direction:column; gap:2px; }
.lead-extra-row{ display:flex; gap:8px; padding:5px 0; border-bottom:1px solid var(--cp-border); font-size:14px; }
.lead-extra-row:last-child{ border-bottom:0; }
.lead-extra-q{ color: var(--cp-muted); flex:0 0 42%; max-width:42%; word-break:break-word; }
.lead-extra-a{ color: var(--cp-text-strong); font-weight:500; flex:1; word-break:break-word; }

.cp-billing-alert{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
    background:linear-gradient(90deg,#ef4444,#dc2626); color:#fff; padding:11px 18px; font-size:14px; }
.cp-billing-alert.is-suspended{ background:linear-gradient(90deg,#dc2626,#b91c1c); }
.cp-billing-alert-txt{ display:flex; align-items:center; gap:10px; min-width:0 }
.cp-billing-alert-txt i{ font-size:16px; flex:0 0 auto }
.cp-billing-alert .btn{ flex:0 0 auto; border:0 }

/* İndirim kuponu kutusu (faturalandırma) */
.coupon-box{ display:flex; gap:12px; align-items:center; margin-bottom:16px; padding:12px 14px;
    background:var(--cp-success-bg); border:1px solid var(--cp-success-line); border-radius:12px; }
.coupon-ic{ width:34px; height:34px; border-radius:9px; flex:0 0 auto; display:flex; align-items:center; justify-content:center;
    background:linear-gradient(140deg,#16a34a,#15803d); color:#fff; font-size:14px; box-shadow:0 6px 14px -7px rgba(22,163,74,.6) }
.coupon-main{ flex:1; min-width:0 }
.coupon-title{ font-size:13px; font-weight:600; color: var(--cp-success-fg); margin-bottom:7px }
.coupon-row{ display:flex; gap:6px; flex-wrap:wrap; align-items:center }
/* input + Uygula düğmesi tek birleşik kontrol gibi görünür */
.coupon-row input{ width:170px; max-width:100%; height:34px; padding:0 12px; border:1px solid var(--cp-success-line); border-radius:9px;
    font-size:12.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; background: var(--cp-surface); outline:none;
    transition:border-color .15s,box-shadow .15s }
.coupon-row input::placeholder{ letter-spacing:.04em; font-weight:500; color: var(--cp-muted) }
.coupon-row input:focus{ border-color:#16a34a; box-shadow:0 0 0 3px rgba(22,163,74,.15) }
.coupon-row .btn{ height:34px; padding:0 12px }
.coupon-msg{ font-size:12px; margin-top:7px }

.copy-row{display:flex;align-items:center;gap:10px;background:var(--cp-soft,#f4f6fb);border:1px solid var(--cp-line,#e5e8f2);
    border-radius:10px;padding:8px 10px 8px 14px;margin-bottom:8px;flex-wrap:wrap}
.copy-row code{flex:1;min-width:0;font-size:12.5px;word-break:break-all;color:var(--cp-ink,#0b0f1f)}
.copy-row .btn{flex:none}

.setup-block{padding:16px 0;border-top:1px solid var(--cp-line,#eef2f7)}
.setup-block:first-of-type{padding-top:0;border-top:0}
.setup-block--last{padding-bottom:0}
.setup-title{font-weight:700;color:var(--cp-ink,#0b0f1f);margin-bottom:8px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.setup-badge{font-size:11px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;border-radius:999px;padding:4px 10px}
.setup-badge--easy{background:rgba(22,163,74,.12);color:#16a34a}
.setup-list{margin:0;padding-left:20px}
.setup-list > li{margin-bottom:7px}
.setup-list code{background:var(--cp-soft,#f4f6fb);border-radius:5px;padding:2px 6px;font-size:12.5px}

/* Koyu tema: sol menü */
[data-theme="dark"] {
    --cp-sidebar: #0f141d;
    --cp-sidebar-border: #242c3a;
    --cp-sidebar-hover: #1b2432;
    --cp-sidebar-text: #cdd6e4;
    --cp-sidebar-muted: #8391a5;
}

[data-theme="dark"] img.cp-thumb,
[data-theme="dark"] .media-drop-preview img { filter: brightness(.92); }

/* Tema seçici (üst menü) */
.cp-thememenu > summary { gap: 7px; }
.cp-theme-ic { display: inline-flex; align-items: center; justify-content: center; width: 18px; font-size: 15px; }
.cp-thememenu .cp-usermenu-panel button {
    display: flex; align-items: center; gap: 10px; width: 100%;
    background: none; border: 0; font: inherit; font-size: 14px; text-align: left;
    padding: 9px 12px; cursor: pointer; color: var(--cp-text); border-radius: 8px;
}
.cp-thememenu .cp-usermenu-panel button:hover { background: var(--cp-soft); }
.cp-thememenu .cp-usermenu-panel button > i:first-child { width: 16px; text-align: center; color: var(--cp-muted); }
.cp-thememenu .cp-usermenu-panel button.active { color: var(--cp-primary); font-weight: 600; }
.cp-thememenu .cp-usermenu-panel button.active > i:first-child { color: var(--cp-primary); }
/* Seçili olanın tiki */
.cp-theme-check { margin-left: auto; opacity: 0; font-size: 12px; }
.cp-thememenu .cp-usermenu-panel button.active .cp-theme-check { opacity: 1; }
.cp-theme-note {
    margin-top: 6px; padding: 10px 12px 2px; border-top: 1px solid var(--cp-border);
    font-size: 11.5px; line-height: 1.6; color: var(--cp-muted);
}

/* AI gönderi metni önerisi (Paylaşım Yap) */
.ai-suggest-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 8px; }
.ai-suggest-warn { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--cp-warning-fg); }
.ai-suggest-warn a { color: var(--cp-warning-fg); text-decoration: underline; }

.ai-caption-msg { margin-top: 12px; font-size: 13px; line-height: 1.5; color: var(--cp-muted); }
.ai-caption-msg.is-err { color: var(--cp-danger-fg); }

.ai-caption-empty { display: flex; gap: 14px; align-items: flex-start; }
.ai-caption-empty > i { font-size: 18px; color: var(--cp-info-fg); margin-top: 2px; }
.ai-caption-empty strong { display: block; font-size: 14.5px; color: var(--cp-text); }
.ai-caption-empty p { font-size: 13px; line-height: 1.6; color: var(--cp-muted); margin: 6px 0 14px; }

/* İçerik kütüphanesi: görsel yükleme alanı */
.lib-drop {
    border: 2px dashed var(--cp-line-strong); border-radius: 12px;
    background: var(--cp-surface-2); padding: 24px; cursor: pointer;
    transition: border-color .2s, background .2s;
}
.lib-drop:hover, .lib-drop.is-over { border-color: var(--cp-primary); background: var(--cp-tint); }

.lib-drop-empty { text-align: center; color: var(--cp-muted); }
.lib-drop-empty > i { font-size: 26px; color: var(--cp-primary); }
.lib-drop-title { font-size: 14px; margin-top: 10px; color: var(--cp-text); }
.lib-drop-hint { font-size: 12px; margin-top: 4px; }

.lib-drop-preview { display: flex; align-items: center; gap: 14px; }
.lib-drop-preview img { width: 68px; height: 68px; object-fit: cover; border-radius: 10px; flex: none; }
.lib-drop-meta { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.lib-drop-meta strong { font-size: 13.5px; color: var(--cp-text); word-break: break-all; }
.lib-drop-meta span { font-size: 12px; color: var(--cp-muted); }

.lib-copy {
    display: inline-flex; align-items: center; gap: 6px; margin-top: 8px;
    background: none; border: none; padding: 0; cursor: pointer;
    font: inherit; font-size: 12px; color: var(--cp-primary);
}
.lib-copy:hover { text-decoration: underline; }
.lib-copy.is-done { color: var(--cp-success-fg); text-decoration: none; }

/* AI işletme profili: web sitesinden otomatik doldurma */
.aip-autofill {
    display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
    background: var(--cp-tint); border: 1px solid var(--cp-info-line);
    border-radius: 12px; padding: 14px 16px; margin-bottom: 18px;
}
.aip-autofill strong { display: block; font-size: 14px; color: var(--cp-text); }
.aip-autofill p { font-size: 12.5px; line-height: 1.55; color: var(--cp-muted); margin: 4px 0 0; }

.aip-msg { margin: 12px 0 0; font-size: 13px; line-height: 1.55; color: var(--cp-muted); }
.aip-msg.is-err { color: var(--cp-danger-fg); }

/* ===== Komut paleti (⌘K) ===== */
.cp-search-trigger { display:inline-flex; align-items:center; gap:8px; height:36px; padding:0 10px 0 11px;
    background:var(--cp-soft); border:1px solid var(--cp-border); border-radius:10px; cursor:pointer;
    color:var(--cp-muted); font-size:13px; transition:border-color .15s, color .15s, background .15s; }
.cp-search-trigger:hover { border-color:var(--cp-primary); color:var(--cp-text); }
.cp-search-trigger svg { width:16px; height:16px; }
.cp-search-label { font-weight:600; }
.cp-search-kbd { font-family:inherit; font-size:11px; font-weight:700; padding:2px 6px; border-radius:6px;
    background:var(--cp-surface); border:1px solid var(--cp-border); color:var(--cp-muted); }
@media(max-width:640px){ .cp-search-label, .cp-search-kbd { display:none; } .cp-search-trigger { padding:0 9px; } }

.cmdk-backdrop { position:fixed; inset:0; z-index:2000; background:rgba(11,15,31,.45); backdrop-filter:blur(3px);
    display:flex; align-items:flex-start; justify-content:center; padding:12vh 16px 16px;
    opacity:0; transition:opacity .16s; }
/* hidden özniteliği display:flex'i ezmesin — kapalıyken katman tıklamaları yutmasın. */
.cmdk-backdrop[hidden] { display:none; }
.cmdk-backdrop.show { opacity:1; }
.cmdk-box { width:100%; max-width:600px; background:var(--cp-surface); border:1px solid var(--cp-border);
    border-radius:16px; box-shadow:var(--cp-shadow-lg); overflow:hidden; transform:translateY(-8px); transition:transform .16s; }
.cmdk-backdrop.show .cmdk-box { transform:none; }
.cmdk-input-row { display:flex; align-items:center; gap:11px; padding:15px 18px; border-bottom:1px solid var(--cp-border); }
.cmdk-input-row svg { width:19px; height:19px; color:var(--cp-muted); flex:none; }
.cmdk-input-row input { flex:1; border:none; outline:none; background:transparent; font-size:16px; color:var(--cp-text); }
.cmdk-esc { font-size:11px; font-weight:700; padding:3px 7px; border-radius:6px; background:var(--cp-soft);
    border:1px solid var(--cp-border); color:var(--cp-muted); }
.cmdk-results { max-height:52vh; overflow-y:auto; padding:8px; }
.cmdk-group { font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--cp-muted);
    padding:10px 10px 5px; }
.cmdk-item { display:flex; align-items:center; gap:10px; padding:9px 11px; border-radius:9px; text-decoration:none;
    color:var(--cp-text); cursor:pointer; }
.cmdk-item.active { background:var(--cp-soft); }
.cmdk-item-label { font-size:14px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cmdk-item-sub { margin-left:auto; font-size:12px; color:var(--cp-muted); flex:none; }
.cmdk-empty { padding:26px; text-align:center; color:var(--cp-muted); font-size:13.5px; }
.cmdk-foot { display:flex; gap:16px; padding:9px 16px; border-top:1px solid var(--cp-border); background:var(--cp-soft); }
.cmdk-foot span { font-size:11.5px; color:var(--cp-muted); display:inline-flex; align-items:center; gap:5px; }
.cmdk-foot kbd, .cmdk-foot .cmdk-esc { font-family:inherit; font-size:10.5px; font-weight:700; padding:1px 5px;
    border-radius:5px; background:var(--cp-surface); border:1px solid var(--cp-border); color:var(--cp-muted); }