/**
 * Bimetrik SaaS - Ana Tema Renkleri
 * -------------------------------------------------------------------------------------
 * Marka gradyanı: sağ #0369B1 → sol #2E88C0
 * config.js ve BimetrikTheme (bimetrik.js) ile senkron tutulmalıdır.
 */

:root {
  /* Marka gradyanı */
  --primary-gradient: linear-gradient(270deg, #0369B1 0%, #2E88C0 100%);
  --primary-gradient-alt: linear-gradient(135deg, #2E88C0 0%, #0369B1 100%);

  /* Bootstrap tema eşlemesi */
  --bs-primary: #2E88C0;
  --bs-primary-rgb: 46, 136, 192;
  --bs-link-color: #0369B1;
  --bs-link-hover-color: #025694;

  /* Ana Renkler */
  --primary: #2E88C0;
  --primary-100: #E6F3FA;
  --primary-200: #CCE7F5;
  --primary-300: #99CFEB;
  --primary-400: #66B7E0;
  --primary-500: #2E88C0;
  --primary-600: #1878B8;
  --primary-700: #0369B1;
  --primary-800: #025694;
  --primary-900: #024477;

  /* Ana Renk Opasite Değerleri */
  --primary-o-lighter: rgba(46, 136, 192, 0.08);
  --primary-o-light: rgba(46, 136, 192, 0.16);
  --primary-o-main: rgba(46, 136, 192, 0.24);
  --primary-o-dark: rgba(46, 136, 192, 0.32);
  --primary-o-darker: rgba(46, 136, 192, 0.38);

  /* İkincil Renkler (gradyan koyu ucu) */
  --secondary: #0369B1;
  --secondary-100: #E6F0F8;
  --secondary-200: #CCE0F1;
  --secondary-300: #99C1E3;
  --secondary-400: #66A2D5;
  --secondary-500: #0369B1;
  --secondary-600: #025694;
  --secondary-700: #024477;
  --secondary-800: #013359;
  --secondary-900: #01223B;

  /* İkincil Renk Opasite Değerleri */
  --secondary-o-lighter: rgba(3, 105, 177, 0.08);
  --secondary-o-light: rgba(3, 105, 177, 0.16);
  --secondary-o-main: rgba(3, 105, 177, 0.24);
  --secondary-o-dark: rgba(3, 105, 177, 0.32);
  --secondary-o-darker: rgba(3, 105, 177, 0.38);

  /* Bilgi Renkleri */
  --info: #00BAD1;
  --info-100: #CCF1F6;
  --info-200: #99E3ED;
  --info-300: #66D6E3;
  --info-400: #33C8DA;
  --info-500: #00BAD1;
  --info-600: #00A7BC;
  --info-700: #009EB2;
  --info-800: #0095A7;
  --info-900: #008C9D;

  /* Bilgi Renk Opasite Değerleri */
  --info-o-lighter: rgba(0, 186, 209, 0.08);
  --info-o-light: rgba(0, 186, 209, 0.16);
  --info-o-main: rgba(0, 186, 209, 0.24);
  --info-o-dark: rgba(0, 186, 209, 0.32);
  --info-o-darker: rgba(0, 186, 209, 0.38);

  /* Başarı Renkleri */
  --success: #28C76F;
  --success-100: #D4F4E2;
  --success-200: #A9E9C5;
  --success-300: #7EDDA9;
  --success-400: #53D28C;
  --success-500: #28C76F;
  --success-600: #24B364;
  --success-700: #22A95E;
  --success-800: #209F59;
  --success-900: #1E9553;

  /* Başarı Renk Opasite Değerleri */
  --success-o-lighter: rgba(40, 199, 111, 0.08);
  --success-o-light: rgba(40, 199, 111, 0.16);
  --success-o-main: rgba(40, 199, 111, 0.24);
  --success-o-dark: rgba(40, 199, 111, 0.32);
  --success-o-darker: rgba(40, 199, 111, 0.38);

  /* Uyarı Renkleri */
  --warning: #FF9F43;
  --warning-100: #FFECD9;
  --warning-200: #FFD9B4;
  --warning-300: #FFC58E;
  --warning-400: #FFB269;
  --warning-500: #FF9F43;
  --warning-600: #E68F3C;
  --warning-700: #D98739;
  --warning-800: #CC7F36;
  --warning-900: #BF7732;

  /* Uyarı Renk Opasite Değerleri */
  --warning-o-lighter: rgba(255, 159, 67, 0.08);
  --warning-o-light: rgba(255, 159, 67, 0.16);
  --warning-o-main: rgba(255, 159, 67, 0.24);
  --warning-o-dark: rgba(255, 159, 67, 0.32);
  --warning-o-darker: rgba(255, 159, 67, 0.38);

  /* Hata/Tehlike Renkleri */
  --danger: #FF4C51;
  --error: #FF4C51;
  --error-100: #FFDBDC;
  --error-200: #FFB7B9;
  --error-300: #FF9497;
  --error-400: #FF7074;
  --error-500: #FF4C51;
  --error-600: #E64449;
  --error-700: #D94145;
  --error-800: #CC3D41;
  --error-900: #BF393D;

  /* Hata/Tehlike Renk Opasite Değerleri */
  --error-o-lighter: rgba(255, 76, 81, 0.08);
  --error-o-light: rgba(255, 76, 81, 0.16);
  --error-o-main: rgba(255, 76, 81, 0.24);
  --error-o-dark: rgba(255, 76, 81, 0.32);
  --error-o-darker: rgba(255, 76, 81, 0.38);

  /* Gri Tonları */
  --gray-100: #EAEAEC;
  --gray-200: #D5D5D8;
  --gray-300: #C1BFC5;
  --gray-400: #ACAAB1;
  --gray-500: #97959E;
  --gray-600: #82808B;
  --gray-700: #6D6B77;
  --gray-800: #595564;
  --gray-900: #444050;

  /* Gri Tonları Opasite Değerleri */
  --gray-o-lighter: rgba(46, 38, 61, 0.08);
  --gray-o-light: rgba(46, 38, 61, 0.16);
  --gray-o-main: rgba(46, 38, 61, 0.24);
  --gray-o-dark: rgba(46, 38, 61, 0.32);
  --gray-o-darker: rgba(46, 38, 61, 0.38);

  /* Temel Renkler */
  --dark: #4b4b4b;
  --black: #000;
  --white: #fff;

  /* Gölge Renkler */
  --shadow-color-primary: rgba(46, 136, 192, 0.3);
  --shadow-color-secondary: rgba(3, 105, 177, 0.3);
  --shadow-color-info: rgba(0, 186, 209, 0.3);
  --shadow-color-success: rgba(40, 199, 111, 0.3);
  --shadow-color-warning: rgba(255, 159, 67, 0.3);
  --shadow-color-error: rgba(255, 76, 81, 0.3);
  --shadow-color-gray: rgba(46, 38, 61, 0.15);

  /* UI Bileşen Renkleri */
  --card-bg: #fff;
  --body-bg: #f8f7fa;
  --body-color: #6d6b77;
  --heading-color: #444050;
  --text-muted: #acaab1;
  --border-color: #e6e6e8;

  /* Eylem Renkleri */
  --action-hover: #F3F2F3;
  --action-selected: #EEEEEF;
  --action-disabled: #DEDDE0;
  --action-disabled-bg: #DEDDE0;
  --action-focus: #EAEAEC;
  --action-active: #97959E;

  /* Metin Renkleri */
  --text-primary: #444050;
  --text-secondary: #6D6B77;
  --text-disabled: #ACAAB1;

  /* Diğer UI Renkleri */
  --divider: #E6E6E8;
  --outline-border: #CDCCD0;
  --input-border: #D1D0D4;
  --backdrop-overlay: rgba(151, 149, 158, 0.5);
  --snackbar-bg: #2f2b3d;
  --paper-bg: #FFFFFF;
  --table-header: #FFFFFF;
  --chat-bg: #f3f2f5;
  --track-bg: #f1f0f2;
  --grey-light: #FAFAFA;

  /* Gölge Boyutları */
  --shadow-xs: 0 2px 4px rgba(46, 38, 61, 0.08);
  --shadow-sm: 0 4px 8px rgba(46, 38, 61, 0.12);
  --shadow-md: 0 8px 16px rgba(46, 38, 61, 0.16);
  --shadow-lg: 0 12px 24px rgba(46, 38, 61, 0.2);
  --shadow-xl: 0 16px 32px rgba(46, 38, 61, 0.24);

  /* Gölge Efektleri - Renkli */
  --shadow-primary-sm: 0 2px 8px 0 var(--shadow-color-primary);
  --shadow-primary-md: 0 4px 16px 0 var(--shadow-color-primary);
  --shadow-primary-lg: 0 8px 24px 0 var(--shadow-color-primary);

  --shadow-secondary-sm: 0 2px 8px 0 var(--shadow-color-secondary);
  --shadow-secondary-md: 0 4px 16px 0 var(--shadow-color-secondary);
  --shadow-secondary-lg: 0 8px 24px 0 var(--shadow-color-secondary);

  --shadow-success-sm: 0 2px 8px 0 var(--shadow-color-success);
  --shadow-success-md: 0 4px 16px 0 var(--shadow-color-success);
  --shadow-success-lg: 0 8px 24px 0 var(--shadow-color-success);

  --shadow-info-sm: 0 2px 8px 0 var(--shadow-color-info);
  --shadow-info-md: 0 4px 16px 0 var(--shadow-color-info);
  --shadow-info-lg: 0 8px 24px 0 var(--shadow-color-info);

  --shadow-warning-sm: 0 2px 8px 0 var(--shadow-color-warning);
  --shadow-warning-md: 0 4px 16px 0 var(--shadow-color-warning);
  --shadow-warning-lg: 0 8px 24px 0 var(--shadow-color-warning);

  --shadow-error-sm: 0 2px 8px 0 var(--shadow-color-error);
  --shadow-error-md: 0 4px 16px 0 var(--shadow-color-error);
  --shadow-error-lg: 0 8px 24px 0 var(--shadow-color-error);
}

/* DARK MODE DEĞİŞKENLERİ */
[data-bs-theme="dark"] {
  --card-bg: #2f3349;
  --body-bg: #25293c;
  --body-color: #b2b1cb;
  --heading-color: #cfcce4;
  --text-muted: #8285a0;
  --border-color: #565b79;

  --primary-100: #1A3044;
  --primary-200: #1F3D56;
  --primary-300: #254E6E;
  --primary-400: #2A6A96;
  --primary-500: #2E88C0;
  --primary-600: #66B7E0;
  --primary-700: #99CFEB;
  --primary-800: #CCE7F5;
  --primary-900: #E6F3FA;

  --action-hover: #2a2c40;
  --action-selected: #32354a;
  --action-disabled-bg: #3a3c50;
  --divider: #444564;
  --outline-border: #4d4e67;
  --input-border: #56586e;
  --paper-bg: #2f3349;
  --table-header: #343747;
  --chat-bg: #2a2c3d;
  --track-bg: #2d2f42;
  --grey-light: #25293c;

  --text-primary: #cfcce4;
  --text-secondary: #b2b1cb;
  --text-disabled: #8285a0;
}

/* Yardımcı Sınıflar */
.text-primary { color: var(--primary) !important; }
.text-secondary { color: var(--secondary) !important; }
.text-success { color: var(--success) !important; }
.text-info { color: var(--info) !important; }
.text-warning { color: var(--warning) !important; }
.text-danger { color: var(--error) !important; }
.text-light { color: var(--gray-100) !important; }
.text-dark { color: var(--dark) !important; }

.bg-primary { background-color: var(--primary) !important; }
.bg-secondary { background-color: var(--secondary) !important; }
.bg-success { background-color: var(--success) !important; }
.bg-info { background-color: var(--info) !important; }
.bg-warning { background-color: var(--warning) !important; }
.bg-danger { background-color: var(--error) !important; }
.bg-light { background-color: var(--gray-100) !important; }
.bg-dark { background-color: var(--dark) !important; }

.bg-primary-gradient { background: var(--primary-gradient) !important; }
.bg-primary-gradient-alt { background: var(--primary-gradient-alt) !important; }

.bg-primary-light { background-color: var(--primary-100) !important; }
.bg-secondary-light { background-color: var(--secondary-100) !important; }
.bg-success-light { background-color: var(--success-100) !important; }
.bg-info-light { background-color: var(--info-100) !important; }
.bg-warning-light { background-color: var(--warning-100) !important; }
.bg-danger-light { background-color: var(--error-100) !important; }

.bg-primary-subtle { background-color: var(--primary-o-lighter) !important; }
.bg-secondary-subtle { background-color: var(--secondary-o-lighter) !important; }
.bg-success-subtle { background-color: var(--success-o-lighter) !important; }
.bg-info-subtle { background-color: var(--info-o-lighter) !important; }
.bg-warning-subtle { background-color: var(--warning-o-lighter) !important; }
.bg-danger-subtle { background-color: var(--error-o-lighter) !important; }

.border-primary { border-color: var(--primary) !important; }
.border-secondary { border-color: var(--secondary) !important; }
.border-success { border-color: var(--success) !important; }
.border-info { border-color: var(--info) !important; }
.border-warning { border-color: var(--warning) !important; }
.border-danger { border-color: var(--error) !important; }
.border-light { border-color: var(--gray-100) !important; }
.border-dark { border-color: var(--dark) !important; }

/* Buton Gölgeleri */
.btn-primary { box-shadow: var(--shadow-primary-sm); }
.btn-secondary { box-shadow: var(--shadow-secondary-sm); }
.btn-success { box-shadow: var(--shadow-success-sm); }
.btn-info { box-shadow: var(--shadow-info-sm); }
.btn-warning { box-shadow: var(--shadow-warning-sm); }
.btn-danger { box-shadow: var(--shadow-error-sm); }

.btn-primary:hover, .btn-primary:focus { box-shadow: var(--shadow-primary-md); }
.btn-secondary:hover, .btn-secondary:focus { box-shadow: var(--shadow-secondary-md); }
.btn-success:hover, .btn-success:focus { box-shadow: var(--shadow-success-md); }
.btn-info:hover, .btn-info:focus { box-shadow: var(--shadow-info-md); }
.btn-warning:hover, .btn-warning:focus { box-shadow: var(--shadow-warning-md); }
.btn-danger:hover, .btn-danger:focus { box-shadow: var(--shadow-error-md); }

/* Kart Stilleri */
.card {
  background-color: var(--card-bg);
  border-color: var(--border-color);
  box-shadow: var(--shadow-sm);
}

.card-header {
  background-color: var(--table-header);
  border-bottom-color: var(--border-color);
}

.card-footer {
  background-color: var(--table-header);
  border-top-color: var(--border-color);
}

/* Form Elemanları */
.form-control, .form-select {
  border-color: var(--input-border);
  background-color: var(--paper-bg);
  color: var(--body-color);
}

.form-control:focus, .form-select:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 0.25rem var(--primary-o-lighter);
}

/* Liste Grubu */
.list-group-item {
  background-color: var(--card-bg);
  border-color: var(--border-color);
  color: var(--body-color);
}

/* Navbar */
.navbar-light {
  background-color: var(--card-bg);
  box-shadow: var(--shadow-sm);
}

.navbar-dark {
  background-color: var(--dark);
  box-shadow: var(--shadow-sm);
}

/* Tablo */
.table {
  color: var(--body-color);
  border-color: var(--border-color);
}

.table thead th {
  background-color: var(--table-header);
  color: var(--heading-color);
  border-bottom-color: var(--border-color);
}

/* Animasyonlar için değişkenler */
:root {
  --transition-base: all 0.2s ease;
  --transition-fast: all 0.15s ease;
  --transition-slow: all 0.3s ease;
}

.transition-base { transition: var(--transition-base); }
.transition-fast { transition: var(--transition-fast); }
.transition-slow { transition: var(--transition-slow); }

.hover-scale {
  transition: var(--transition-base);
}
.hover-scale:hover {
  transform: scale(1.05);
}

.hover-shadow {
  transition: var(--transition-base);
}
.hover-shadow:hover {
  box-shadow: var(--shadow-md);
}

/* Bootstrap / Vuexy primary override — marka gradyanı */
.btn-primary:not(.btn-label-primary):not(.btn-outline-primary):not(.btn-text-primary) {
  background: var(--primary-gradient) !important;
  border-color: var(--primary-700) !important;
  color: #fff !important;
}

.btn-primary:not(.btn-label-primary):not(.btn-outline-primary):not(.btn-text-primary):hover:not(:disabled):not(.disabled),
.btn-primary:not(.btn-label-primary):not(.btn-outline-primary):not(.btn-text-primary):focus:not(:disabled):not(.disabled),
.btn-primary:not(.btn-label-primary):not(.btn-outline-primary):not(.btn-text-primary):active:not(:disabled):not(.disabled),
.btn-primary:not(.btn-label-primary):not(.btn-outline-primary):not(.btn-text-primary).active:not(:disabled):not(.disabled),
.show > .btn-primary.dropdown-toggle:not(.btn-label-primary):not(.btn-outline-primary) {
  background: var(--primary-gradient-alt) !important;
  border-color: var(--primary-800) !important;
  color: #fff !important;
}

.btn-outline-primary {
  color: var(--primary-700) !important;
  border-color: var(--primary-500) !important;
}

.btn-outline-primary:hover:not(:disabled):not(.disabled),
.btn-outline-primary:focus:not(:disabled):not(.disabled),
.btn-outline-primary:active:not(:disabled):not(.disabled) {
  background: var(--primary-gradient) !important;
  border-color: var(--primary-700) !important;
  color: #fff !important;
}

.btn-label-primary {
  color: var(--primary-700) !important;
  background: var(--primary-o-light) !important;
}

.bg-label-primary {
  background-color: var(--primary-o-light) !important;
  color: var(--primary-700) !important;
}

.page-item.active .page-link,
.pagination li.active > a:not(.page-link) {
  background: var(--primary-gradient) !important;
  border-color: var(--primary-700) !important;
}

.progress-bar {
  background: var(--primary-gradient) !important;
}

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

.form-switch .form-check-input:checked {
  background-color: var(--primary-500);
  border-color: var(--primary-700);
}
