/*
 * Korel Depo marka teması
 * Ana renk: #F27422
 * Bu dosya style.bundle.css dosyasından sonra yüklenmelidir.
 */

:root,
[data-bs-theme="light"] {
    --korel-primary: #F27422;
    --korel-primary-rgb: 242, 116, 34;
    --korel-primary-active: #D85B12;
    --korel-primary-light: #FEF0E7;
    --korel-primary-inverse: #FFFFFF;
    --korel-primary-focus: rgba(242, 116, 34, .25);

    --bs-primary: var(--korel-primary);
    --bs-primary-rgb: var(--korel-primary-rgb);
    --bs-primary-active: var(--korel-primary-active);
    --bs-primary-light: var(--korel-primary-light);
    --bs-primary-inverse: var(--korel-primary-inverse);
    --bs-link-color: var(--korel-primary);
    --bs-link-color-rgb: var(--korel-primary-rgb);
    --bs-link-hover-color: var(--korel-primary-active);
    --bs-link-hover-color-rgb: 216, 91, 18;
    --bs-focus-ring-color: var(--korel-primary-focus);
}

[data-bs-theme="dark"] {
    --korel-primary-light: #3A241B;
    --bs-primary: var(--korel-primary);
    --bs-primary-rgb: var(--korel-primary-rgb);
    --bs-primary-active: var(--korel-primary-active);
    --bs-primary-light: var(--korel-primary-light);
    --bs-primary-inverse: var(--korel-primary-inverse);
    --bs-link-color: var(--korel-primary);
    --bs-link-color-rgb: var(--korel-primary-rgb);
    --bs-link-hover-color: #FF9B62;
    --bs-link-hover-color-rgb: 255, 155, 98;
    --bs-focus-ring-color: var(--korel-primary-focus);
}

.btn-primary {
    --bs-btn-color: var(--korel-primary-inverse);
    --bs-btn-bg: var(--korel-primary);
    --bs-btn-border-color: var(--korel-primary);
    --bs-btn-hover-color: var(--korel-primary-inverse);
    --bs-btn-hover-bg: var(--korel-primary-active);
    --bs-btn-hover-border-color: var(--korel-primary-active);
    --bs-btn-focus-shadow-rgb: var(--korel-primary-rgb);
    --bs-btn-active-color: var(--korel-primary-inverse);
    --bs-btn-active-bg: var(--korel-primary-active);
    --bs-btn-active-border-color: var(--korel-primary-active);
    --bs-btn-disabled-color: var(--korel-primary-inverse);
    --bs-btn-disabled-bg: var(--korel-primary);
    --bs-btn-disabled-border-color: var(--korel-primary);
}

.btn-outline-primary {
    --bs-btn-color: var(--korel-primary);
    --bs-btn-border-color: var(--korel-primary);
    --bs-btn-hover-color: var(--korel-primary-inverse);
    --bs-btn-hover-bg: var(--korel-primary);
    --bs-btn-hover-border-color: var(--korel-primary);
    --bs-btn-focus-shadow-rgb: var(--korel-primary-rgb);
    --bs-btn-active-color: var(--korel-primary-inverse);
    --bs-btn-active-bg: var(--korel-primary-active);
    --bs-btn-active-border-color: var(--korel-primary-active);
    --bs-btn-disabled-color: var(--korel-primary);
    --bs-btn-disabled-border-color: var(--korel-primary);
}

.btn-light-primary,
.badge-light-primary,
.bg-light-primary {
    color: var(--korel-primary) !important;
    border-color: var(--korel-primary-light) !important;
    background-color: var(--korel-primary-light) !important;
}

.btn-light-primary:hover:not(.btn-active),
.btn-light-primary:focus:not(.btn-active),
.btn-light-primary:active:not(.btn-active),
.btn-light-primary.active,
.show > .btn-light-primary.dropdown-toggle {
    color: var(--korel-primary-inverse) !important;
    border-color: var(--korel-primary) !important;
    background-color: var(--korel-primary) !important;
}

.text-primary,
.link-primary {
    color: rgba(var(--korel-primary-rgb), var(--bs-text-opacity, 1)) !important;
}

.link-primary:hover,
.link-primary:focus {
    color: var(--bs-link-hover-color) !important;
}

.bg-primary,
.text-bg-primary {
    color: var(--korel-primary-inverse) !important;
    background-color: rgba(var(--korel-primary-rgb), var(--bs-bg-opacity, 1)) !important;
}

.border-primary {
    border-color: rgba(var(--korel-primary-rgb), var(--bs-border-opacity, 1)) !important;
}

.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate,
.form-check.form-check-solid .form-check-input[type="checkbox"]:indeterminate {
    background-color: var(--korel-primary);
    border-color: var(--korel-primary);
}

.form-check-input:focus,
.form-control:focus,
.form-select:focus,
.select2-container--bootstrap5.select2-container--focus .form-select,
.select2-container--bootstrap5.select2-container--open .form-select {
    border-color: var(--korel-primary);
    box-shadow: 0 0 0 .25rem var(--korel-primary-focus);
}

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

.form-range::-moz-range-thumb {
    background-color: var(--korel-primary);
}

.form-range:focus::-webkit-slider-thumb,
.form-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 1px var(--bs-body-bg), 0 0 0 .25rem var(--korel-primary-focus);
}

.page-item.active .page-link,
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link,
.dropdown-item.active,
.dropdown-item:active,
.progress-bar {
    color: var(--korel-primary-inverse);
    border-color: var(--korel-primary);
    background-color: var(--korel-primary);
}

.page-link:focus,
.nav-link:focus-visible {
    box-shadow: 0 0 0 .25rem var(--korel-primary-focus);
}

.table-primary {
    --bs-table-color: #071437;
    --bs-table-bg: #FEF0E7;
    --bs-table-border-color: #E4D8D1;
    --bs-table-striped-bg: #F5E6DE;
    --bs-table-striped-color: #071437;
    --bs-table-active-bg: #ECDCD3;
    --bs-table-active-color: #071437;
    --bs-table-hover-bg: #F0E1D8;
    --bs-table-hover-color: #071437;
}

[data-bs-theme="dark"] .table-primary {
    --bs-table-color: #FFFFFF;
    --bs-table-bg: #3A241B;
    --bs-table-border-color: #563325;
    --bs-table-striped-bg: #42281D;
    --bs-table-striped-color: #FFFFFF;
    --bs-table-active-bg: #4B2C20;
    --bs-table-active-color: #FFFFFF;
    --bs-table-hover-bg: #452A1F;
    --bs-table-hover-color: #FFFFFF;
}

/*
 * Proje geneli outline badge standardi
 * Mevcut badge-light-* siniflari korunarak rozetler dolgusuz hale getirilir.
 */
.badge.badge-light-primary,
.badge.badge-light-secondary,
.badge.badge-light-success,
.badge.badge-light-info,
.badge.badge-light-warning,
.badge.badge-light-danger,
.badge.badge-light-dark,
.badge.badge-light {
    background-color: transparent !important;
    border: 1px solid currentColor !important;
}

.badge.badge-light-primary {
    color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
}

.badge.badge-light-secondary {
    color: var(--bs-secondary) !important;
    border-color: var(--bs-secondary) !important;
}

.badge.badge-light-secondary.text-gray-700 {
    color: var(--bs-gray-700) !important;
    border-color: var(--bs-secondary) !important;
}

.badge.badge-light-success {
    color: var(--bs-success) !important;
    border-color: var(--bs-success) !important;
}

.badge.badge-light-info {
    color: var(--bs-info) !important;
    border-color: var(--bs-info) !important;
}

.badge.badge-light-warning {
    color: var(--bs-warning) !important;
    border-color: var(--bs-warning) !important;
}

.badge.badge-light-danger {
    color: var(--bs-danger) !important;
    border-color: var(--bs-danger) !important;
}

.badge.badge-light-dark {
    color: var(--bs-dark) !important;
    border-color: var(--bs-dark) !important;
}

.badge.badge-light {
    color: var(--bs-gray-700) !important;
    border-color: var(--bs-gray-400) !important;
}

/* Renkli butonlardaki sayaclar buton zemini uzerinde okunabilir kalir. */
.btn .badge.badge-light {
    color: var(--bs-white) !important;
    border-color: rgba(255, 255, 255, .72) !important;
}

[data-bs-theme="dark"] .badge.badge-light,
[data-bs-theme="dark"] .badge.badge-light-secondary.text-gray-700 {
    color: var(--bs-gray-300) !important;
}

::selection {
    color: var(--korel-primary-inverse);
    background: var(--korel-primary);
}
