﻿body {
}
.custom-input {
    border: 1px solid #e9ecef;
    border-radius: 8px;
    transition: 0.3s;
}

    .custom-input:focus {
        border-color: #556ee6;
        box-shadow: 0 0 0 0.15rem rgba(85, 110, 230, 0.15);
    }

    .custom-input::placeholder {
        color: #6c757d;  
        opacity: 1;  
    }
     
    .custom-input::-webkit-input-placeholder {
        color: #6c757d;
    }

    .custom-input:-ms-input-placeholder {
        color: #6c757d;
    }

.select2-container--default .select2-selection--single {
    border: 1px solid #e9ecef !important;
    border-radius: 8px !important;
    height: 38px;
    display: flex;
    align-items: center;
    transition: 0.3s;
}

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        line-height: 38px;
        padding-left: 10px;
        color: #495057;
    }

    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 38px;
    }

.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: #556ee6 !important;
    box-shadow: 0 0 0 0.15rem rgba(85, 110, 230, 0.15);
}

/* SELECT2 INVALID (Bootstrap compatible) */
.was-validated select.form-control:invalid + .select2-container .select2-selection--single {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.15rem rgba(220, 53, 69, 0.15);
}

/* SELECT2 VALID */
.was-validated select.form-control:valid + .select2-container .select2-selection--single {
    border-color: #198754 !important;
}

.section-box {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 15px;
}

.section-title {
    font-weight: 600;
    font-size: 14px;
    color: #495057;
    margin-bottom: 10px;
}

/*
 * Drezoc Theme — Brand Color Override
 * Replaces #3f87fd (RGB 63,135,253) → #0C447C (RGB 12,68,124)
 * Include this file AFTER style_min.css
 */

/* ─── CSS Custom Properties (Root Variables) ─── */
:root {
    --bs-blue: #0C447C !important;
    --bs-primary: #0C447C !important;
    --bs-primary-rgb: 12, 68, 124 !important;
    --bs-blue-rgb: 12, 68, 124 !important;
    --bs-link-color: #0C447C !important;
    --bs-link-color-rgb: 12, 68, 124 !important;
    --bs-link-hover-color: #093561 !important;
}

/* ─── Menu Color Variants ─── */
[data-menu-color=light] {
    --bs-menu-item-hover-color: #0C447C !important;
    --bs-menu-item-active-color: #0C447C !important;
}

[data-menu-color=brand] {
    --bs-menu-bg: #0C447C !important;
}

/* ─── Topbar Color Variants ─── */
[data-topbar-color=light] {
    --bs-topbar-item-hover-color: #0C447C !important;
}

[data-topbar-color=brand] {
    --bs-topbar-bg: #0C447C !important;
}

/* ─── Primary Text & Emphasis ─── */
.text-primary,
.link-primary {
    color: #0C447C !important;
}

.text-primary-emphasis {
    color: #093561 !important;
}

/* ─── Backgrounds ─── */
.bg-primary,
.badge.bg-primary,
.btn.bg-primary {
    background-color: #0C447C !important;
    border-color: #0C447C !important;
}

.bg-primary-subtle {
    background-color: rgba(12, 68, 124, 0.1) !important;
}

/* ─── Borders ─── */
.border-primary {
    border-color: #0C447C !important;
}

/* ─── Buttons ─── */
.btn-primary {
    --bs-btn-bg: #0C447C !important;
    --bs-btn-border-color: #0C447C !important;
    --bs-btn-hover-bg: #093561 !important;
    --bs-btn-hover-border-color: #093561 !important;
    --bs-btn-active-bg: #072a4e !important;
    --bs-btn-active-border-color: #072a4e !important;
    --bs-btn-focus-shadow-rgb: 12, 68, 124 !important;
    background-color: #0C447C !important;
    border-color: #0C447C !important;
}

    .btn-primary:hover,
    .btn-primary:focus,
    .btn-primary:active,
    .btn-primary.active {
        background-color: #093561 !important;
        border-color: #093561 !important;
    }

    .btn-primary:focus,
    .btn-primary:focus-visible {
        box-shadow: 0 0 0 0.25rem rgba(12, 68, 124, 0.5) !important;
    }

/* Soft / outline primary button */
.btn-soft-primary,
.btn-outline-primary {
    --bs-btn-color: #0C447C !important;
    --bs-btn-border-color: #0C447C !important;
    --bs-btn-hover-bg: #0C447C !important;
    --bs-btn-bg: rgba(12, 68, 124, 0.1) !important;
    color: #0C447C !important;
    border-color: #0C447C !important;
}

    .btn-outline-primary:hover,
    .btn-outline-primary:focus,
    .btn-outline-primary:active,
    .btn-outline-primary.active {
        background-color: #0C447C !important;
        color: #ffffff !important;
    }

/* ─── Badges ─── */
.badge-primary,
.badge.text-bg-primary {
    background-color: #0C447C !important;
    color: #ffffff !important;
}

/* ─── Alerts ─── */
.alert-primary {
    --bs-alert-color: #093561 !important;
    --bs-alert-bg: rgba(12, 68, 124, 0.18) !important;
    --bs-alert-border-color: rgba(12, 68, 124, 0.3) !important;
    color: #093561 !important;
    background-color: rgba(12, 68, 124, 0.18) !important;
    border-color: rgba(12, 68, 124, 0.3) !important;
}

/* ─── Pagination ─── */
.page-item.active .page-link {
    background-color: #0C447C !important;
    border-color: #0C447C !important;
    color: #ffffff !important;
}

.page-link {
    color: #0C447C !important;
}

    .page-link:hover,
    .page-link:focus {
        color: #093561 !important;
        box-shadow: 0 0 0 0.15rem rgba(12, 68, 124, 0.25) !important;
    }

/* ─── DataTable Pagination ─── */
.dataTables_paginate .paginate_button.current,
.dataTables_paginate .paginate_button.current:hover {
    background: #0C447C !important;
    border-color: #0C447C !important;
    color: #ffffff !important;
}

.dataTables_paginate .paginate_button:hover {
    background: #0C447C !important;
    border-color: #0C447C !important;
    color: #ffffff !important;
}

/* ─── Forms & Inputs ─── */
.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.form-range:focus::-webkit-slider-thumb {
    border-color: #0C447C !important;
    box-shadow: 0 0 0 0.15rem rgba(12, 68, 124, 0.25) !important;
}

.form-check-input:checked {
    background-color: #0C447C !important;
    border-color: #0C447C !important;
}

.form-range::-webkit-slider-thumb,
.form-range::-moz-range-thumb {
    background-color: #0C447C !important;
}

/* ─── Accordion ─── */
.accordion-button:not(.collapsed) {
    color: #0C447C !important;
    background-color: rgba(12, 68, 124, 0.1) !important;
    box-shadow: inset 0 -1px 0 rgba(12, 68, 124, 0.25) !important;
}

.accordion-button:focus {
    box-shadow: 0 0 0 0.15rem rgba(12, 68, 124, 0.25) !important;
}

/* ─── Tabs & Nav Pills ─── */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background-color: #0C447C !important;
    color: #ffffff !important;
}

.nav-link {
    color: #0C447C !important;
}

    .nav-link:hover,
    .nav-link:focus {
        color: #093561 !important;
    }

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    color: #0C447C !important;
    border-color: #0C447C !important;
}

/* ─── Dropdowns ─── */
.dropdown-item.active,
.dropdown-item:active {
    background-color: #0C447C !important;
}

/* ─── Progress Bars ─── */
.progress-bar.bg-primary,
.bg-primary.progress-bar {
    background-color: #0C447C !important;
}

/* ─── Spinners ─── */
.spinner-border.text-primary,
.spinner-grow.text-primary {
    color: #0C447C !important;
}

/* ─── List Group ─── */
.list-group-item.active {
    background-color: #0C447C !important;
    border-color: #0C447C !important;
}

/* ─── Sidebar / Menu Active & Hover States ─── */
.side-nav-item .side-nav-link:hover,
.side-nav-item .side-nav-link:focus,
.side-nav-item.menuitem-active > a,
.side-nav-item.menuitem-active .side-nav-link,
.menu-arrow {
    color: #0C447C !important;
}

/* ─── Focus Rings (Bootstrap 5.3 utility) ─── */
.focus-ring-primary {
    --bs-focus-ring-color: rgba(12, 68, 124, 0.25) !important;
}

/* ─── Close Button focus ─── */
.btn-close:focus {
    box-shadow: 0 0 0 0.15rem rgba(12, 68, 124, 0.25) !important;
}