/* ======================================================================
   ZİRVE TEKNİK — SERVİS ÇAĞRI MERKEZİ
   MARKA RENK KAYNAĞI  (assets/css/marka.css)
   ----------------------------------------------------------------------
   Sitedeki ve yönetim panelindeki BÜTÜN renklerin tek kaynağı bu dosyadır.
   Logodaki üç renkten türetilmiştir:

     • Koyu petrol-lacivert  (logo yazısı / dağ silueti)  → --navy ailesi
     • Petrol turkuazı       ("SERVİS ÇAĞRI MERKEZİ")     → --brand ailesi
     • Açık gri-mavi         (logo dairesi)               → --surface / --line

   Bootstrap'in varsayılan mavi (#0d6efd) ve camgöbeği (#0dcaf0) renkleri
   aşağıdaki "Bootstrap Ezme Katmanı" ile tamamen devre dışı bırakılmıştır.

   Renk değiştirmek isterseniz SADECE bu dosyayı düzenleyin.
   Düzenledikten sonra theme.php içindeki ZSC_THEME sürümünü artırın
   (tarayıcı önbelleğini tazelemek için).

   YÜKLENDİĞİ YERLER:
     • /header.php            (ön yüz — Bootstrap'ten sonra)
     • /ofopanel/inc/header.php (yönetim paneli — Bootstrap'ten sonra)
   ====================================================================== */

:root {
    /* ── Lacivert ailesi (logo koyu tonu) ──────────────────────────── */
    --navy-900: #0e2e44;
    --navy: #123b57;
    --navy-2: #17496b;
    --navy-3: #1f6390;

    /* ── Marka turkuazı (logo petrol yeşili) ───────────────────────── */
    --brand-700: #1d5e6d;
    --brand-600: #24707f;
    --brand: #2e8497;
    --brand-400: #4ba3b5;
    --brand-300: #7fc2cf;
    --brand-100: #cde6ec;
    --brand-050: #eaf4f7;

    /* ── Parlak aksan (çağrı butonu / vurgular) ────────────────────── */
    --accent: #3fb3c9;
    --accent-2: #2a93ac;
    --accent-050: #e6f7fa;

    /* Çağrı butonu degrade durakları + üzerindeki yazı rengi */
    --cta-1: #5cc9dd;
    --cta-2: #3fb3c9;
    --cta-3: #2a93ac;
    --cta-ink: #0e2e44;

    /* Geriye dönük uyum: eski --gold / --teal kullanımları aksana düşer */
    --gold: var(--accent);
    --gold-050: var(--accent-050);
    --teal: var(--accent);
    --teal-050: var(--accent-050);

    /* ── Yüzeyler (logo dairesinin açık gri-mavisi) ────────────────── */
    --bg: #eff4f7;
    --surface: #ffffff;
    --surface-2: #f7fafc;
    --surface-3: #e7eff3;
    --line: #dce6ec;
    --line-2: #c4d4dd;

    /* ── Mürekkep ──────────────────────────────────────────────────── */
    --ink: #10293c;
    --ink-2: #3c5567;
    --ink-3: #74899a;

    /* ── Durum renkleri (palete uyumlu, doygunluğu kısılmış) ───────── */
    --success: #17a67f;
    --success-050: #e4f7f1;
    --danger: #d6455b;
    --danger-050: #fdecee;
    --warn: #d98324;
    --warn-050: #fdf1e3;

    /* WhatsApp'ın kendi marka rengi — değiştirilmez */
    --wa: #25d366;
    --wa-600: #17ac52;
}

/* ======================================================================
   BOOTSTRAP EZME KATMANI
   Bootstrap 5.3 CSS değişkenleriyle çalıştığı için renkleri kaynağından
   değiştiriyoruz; böylece .btn-primary, .text-primary, .alert-info,
   sayfalama, form odağı vb. hepsi otomatik olarak markaya döner.
   ====================================================================== */

:root,
[data-bs-theme="light"] {
    --bs-blue: var(--brand);
    --bs-indigo: var(--navy-2);
    --bs-cyan: var(--accent);

    --bs-primary: #2e8497;
    --bs-primary-rgb: 46, 132, 151;
    --bs-primary-text-emphasis: #1d5e6d;
    --bs-primary-bg-subtle: #eaf4f7;
    --bs-primary-border-subtle: #cde6ec;

    --bs-secondary: #3c5567;
    --bs-secondary-rgb: 60, 85, 103;
    --bs-secondary-text-emphasis: #10293c;
    --bs-secondary-bg-subtle: #eff4f7;
    --bs-secondary-border-subtle: #dce6ec;

    --bs-info: #3fb3c9;
    --bs-info-rgb: 63, 179, 201;
    --bs-info-text-emphasis: #2a93ac;
    --bs-info-bg-subtle: #e6f7fa;
    --bs-info-border-subtle: #bfe8f0;

    --bs-success: #17a67f;
    --bs-success-rgb: 23, 166, 127;
    --bs-success-text-emphasis: #0f7a5d;
    --bs-success-bg-subtle: #e4f7f1;
    --bs-success-border-subtle: #b9eadd;

    --bs-danger: #d6455b;
    --bs-danger-rgb: 214, 69, 91;
    --bs-danger-text-emphasis: #a32f42;
    --bs-danger-bg-subtle: #fdecee;
    --bs-danger-border-subtle: #f6c6ce;

    --bs-warning: #d98324;
    --bs-warning-rgb: 217, 131, 36;
    --bs-warning-text-emphasis: #995c15;
    --bs-warning-bg-subtle: #fdf1e3;
    --bs-warning-border-subtle: #f7d9b4;

    --bs-body-color: var(--ink-2);
    --bs-body-color-rgb: 60, 85, 103;
    --bs-emphasis-color: var(--ink);
    --bs-border-color: var(--line);
    --bs-border-color-translucent: rgba(16, 41, 60, .12);

    --bs-link-color: #2e8497;
    --bs-link-color-rgb: 46, 132, 151;
    --bs-link-hover-color: #1d5e6d;
    --bs-link-hover-color-rgb: 29, 94, 109;

    --bs-focus-ring-color: rgba(46, 132, 151, .22);
    --bs-heading-color: var(--ink);
}

/* ── Butonlar ─────────────────────────────────────────────────────── */
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand);
    --bs-btn-border-color: var(--brand);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-600);
    --bs-btn-hover-border-color: var(--brand-600);
    --bs-btn-focus-shadow-rgb: 46, 132, 151;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-700);
    --bs-btn-active-border-color: var(--brand-700);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--brand-300);
    --bs-btn-disabled-border-color: var(--brand-300);
}

.btn-outline-primary {
    --bs-btn-color: var(--brand);
    --bs-btn-border-color: var(--brand);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand);
    --bs-btn-hover-border-color: var(--brand);
    --bs-btn-focus-shadow-rgb: 46, 132, 151;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand);
    --bs-btn-active-border-color: var(--brand);
    --bs-btn-disabled-color: var(--brand-300);
    --bs-btn-disabled-border-color: var(--brand-300);
}

.btn-secondary {
    --bs-btn-bg: var(--navy-2);
    --bs-btn-border-color: var(--navy-2);
    --bs-btn-hover-bg: var(--navy);
    --bs-btn-hover-border-color: var(--navy);
    --bs-btn-active-bg: var(--navy-900);
    --bs-btn-active-border-color: var(--navy-900);
    --bs-btn-focus-shadow-rgb: 23, 73, 107;
}

.btn-outline-secondary {
    --bs-btn-color: var(--ink-2);
    --bs-btn-border-color: var(--line-2);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--navy-2);
    --bs-btn-hover-border-color: var(--navy-2);
    --bs-btn-active-bg: var(--navy);
    --bs-btn-active-border-color: var(--navy);
    --bs-btn-focus-shadow-rgb: 23, 73, 107;
}

.btn-info {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--accent);
    --bs-btn-border-color: var(--accent);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--accent-2);
    --bs-btn-hover-border-color: var(--accent-2);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--accent-2);
    --bs-btn-active-border-color: var(--accent-2);
    --bs-btn-focus-shadow-rgb: 63, 179, 201;
}

.btn-success {
    --bs-btn-bg: var(--success);
    --bs-btn-border-color: var(--success);
    --bs-btn-hover-bg: #128c6b;
    --bs-btn-hover-border-color: #128c6b;
    --bs-btn-active-bg: #0f7a5d;
    --bs-btn-active-border-color: #0f7a5d;
    --bs-btn-focus-shadow-rgb: 23, 166, 127;
}

.btn-danger {
    --bs-btn-bg: var(--danger);
    --bs-btn-border-color: var(--danger);
    --bs-btn-hover-bg: #bf3a4e;
    --bs-btn-hover-border-color: #bf3a4e;
    --bs-btn-active-bg: #a32f42;
    --bs-btn-active-border-color: #a32f42;
    --bs-btn-focus-shadow-rgb: 214, 69, 91;
}

.btn-warning {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--warn);
    --bs-btn-border-color: var(--warn);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #c1731f;
    --bs-btn-hover-border-color: #c1731f;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #995c15;
    --bs-btn-active-border-color: #995c15;
    --bs-btn-focus-shadow-rgb: 217, 131, 36;
}

.btn-dark {
    --bs-btn-bg: var(--navy);
    --bs-btn-border-color: var(--navy);
    --bs-btn-hover-bg: var(--navy-900);
    --bs-btn-hover-border-color: var(--navy-900);
    --bs-btn-active-bg: var(--navy-900);
    --bs-btn-active-border-color: var(--navy-900);
}

.btn-link {
    --bs-btn-color: var(--brand);
    --bs-btn-hover-color: var(--brand-700);
    --bs-btn-active-color: var(--brand-700);
}

/* ── Form odağı (mavi halkalar) ───────────────────────────────────── */
.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.btn:focus-visible,
.btn-check:focus-visible + .btn,
.page-link:focus,
.accordion-button:focus,
.note-editable:focus {
    border-color: var(--brand-400);
    box-shadow: 0 0 0 .22rem rgba(46, 132, 151, .18);
    outline: 0;
}

.form-check-input:checked {
    background-color: var(--brand);
    border-color: var(--brand);
}

.form-check-input:focus {
    border-color: var(--brand-400);
}

/* Anahtar (switch) düğmesinin mavi topuzu */
.form-switch .form-check-input:focus {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%232e8497'/%3e%3c/svg%3e");
}

.form-range::-webkit-slider-thumb { background-color: var(--brand); }
.form-range::-moz-range-thumb { background-color: var(--brand); }

/* ── Gezinme, sayfalama, listeler ─────────────────────────────────── */
.nav-pills {
    --bs-nav-pills-link-active-bg: var(--brand);
}

.page-link {
    --bs-pagination-color: var(--ink-2);
    --bs-pagination-hover-color: var(--brand-700);
    --bs-pagination-hover-bg: var(--brand-050);
    --bs-pagination-hover-border-color: var(--brand-100);
    --bs-pagination-focus-color: var(--brand-700);
    --bs-pagination-focus-bg: var(--brand-050);
    --bs-pagination-focus-box-shadow: 0 0 0 .22rem rgba(46, 132, 151, .18);
    --bs-pagination-active-bg: var(--brand);
    --bs-pagination-active-border-color: var(--brand);
}

.list-group {
    --bs-list-group-active-bg: var(--brand);
    --bs-list-group-active-border-color: var(--brand);
    --bs-list-group-action-hover-bg: var(--brand-050);
}

.dropdown-menu {
    --bs-dropdown-link-active-bg: var(--brand);
    --bs-dropdown-link-hover-bg: var(--brand-050);
    --bs-dropdown-link-hover-color: var(--brand-700);
}

.nav-tabs {
    --bs-nav-tabs-link-active-color: var(--brand-700);
    --bs-nav-tabs-link-hover-border-color: var(--brand-100) var(--brand-100) var(--line);
}

.progress { --bs-progress-bar-bg: var(--brand); }

.accordion {
    --bs-accordion-btn-focus-box-shadow: 0 0 0 .22rem rgba(46, 132, 151, .18);
    --bs-accordion-active-color: var(--brand-700);
    --bs-accordion-active-bg: var(--brand-050);
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%231d5e6d'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708'/%3e%3c/svg%3e");
}

/* ── Metin / arka plan yardımcıları ───────────────────────────────── */
.text-primary { color: var(--brand) !important; }
.text-info { color: var(--accent-2) !important; }
.text-secondary { color: var(--ink-3) !important; }
.text-dark { color: var(--ink) !important; }
.text-muted { color: var(--ink-3) !important; }
.text-warning { color: var(--warn) !important; }
.text-success { color: var(--success) !important; }
.text-danger { color: var(--danger) !important; }

.bg-primary { background-color: var(--brand) !important; }
.bg-info { background-color: var(--accent) !important; }
.bg-dark { background-color: var(--navy) !important; }
.bg-light { background-color: var(--surface-2) !important; }
.bg-warning { background-color: var(--warn) !important; }
.bg-success { background-color: var(--success) !important; }
.bg-danger { background-color: var(--danger) !important; }

.border-primary { border-color: var(--brand) !important; }
.border-info { border-color: var(--accent) !important; }

.link-primary { color: var(--brand) !important; }
.link-primary:hover { color: var(--brand-700) !important; }

/* ── Panelde kullanılan eklentiler ────────────────────────────────── */

/* Summernote editör */
.note-editor.note-frame { border-color: var(--line); border-radius: 12px; overflow: hidden; }
.note-toolbar { background: var(--surface-2) !important; border-bottom: 1px solid var(--line) !important; }
.note-btn.active,
.note-btn:active { background: var(--brand-050) !important; color: var(--brand-700) !important; }

/* DataTables */
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--brand) !important;
    border-color: var(--brand) !important;
    color: #fff !important;
}
.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus {
    border-color: var(--brand-400);
    box-shadow: 0 0 0 .22rem rgba(46, 132, 151, .18);
    outline: 0;
}

/* Dropzone */
.dropzone {
    border: 2px dashed var(--line-2) !important;
    border-radius: 16px !important;
    background: var(--surface-2) !important;
}
.dropzone:hover { border-color: var(--brand-400) !important; background: var(--brand-050) !important; }
.dropzone .dz-preview .dz-progress .dz-upload { background: var(--brand) !important; }

/* SweetAlert2 */
.swal2-styled.swal2-confirm { background-color: var(--brand) !important; }
.swal2-styled.swal2-deny { background-color: var(--danger) !important; }
.swal2-styled.swal2-cancel { background-color: var(--ink-3) !important; }
.swal2-styled:focus { box-shadow: 0 0 0 .22rem rgba(46, 132, 151, .28) !important; }

/* Fancybox */
.fancybox__container { --fancybox-accent-color: var(--brand); }

/* Seçim rengi */
::selection { background: var(--brand-100); color: var(--navy); }
