
/* Bootstrap 5 Custom Properties Override for DNA Romance */
/* Theme Style: apps */

:root {
    /* Primary brand colors */
    --bs-primary: #0F75BD;
    --bs-primary-rgb: 15, 117, 189;
    --bs-secondary: #F72C93;
    --bs-secondary-rgb: 247, 44, 147;
    --bs-info: #50E3C2;
    --bs-info-rgb: 80, 227, 194;

    /* Component specific overrides */
    --bs-link-color: #0F75BD;
    --bs-link-hover-color: #0c63a0;

    /* Button variations */
    --bs-btn-border-radius: 1rem;

    /* Card customizations */
    --bs-card-border-radius: 1rem;
    --bs-card-box-shadow: 0 0.75rem 2rem rgba(15, 117, 189, 0.11);

    /* Form controls */
    --bs-border-radius: 1rem;
    --bs-border-radius-sm: calc(1rem * 0.75);
    --bs-border-radius-lg: calc(1rem * 1.5);
    --bs-border-radius-xl: calc(1rem * 2);
    --bs-border-radius-2xl: calc(1rem * 3);

    /* Focus states */
    --bs-focus-ring-color: rgba(15, 117, 189, 0.25);

    /* Body and text */
    --bs-body-font-family: 'Poppins', 'Segoe UI', Tahoma, sans-serif;
    --bs-body-line-height: 1.6;
    --bs-headings-font-weight: 600;

    /* Gradients */
    --bs-gradient: linear-gradient(45deg, #0F75BD 0%, #F72C93 50%, #50E3C2 100%);
}

/* Primary button override */
.btn-primary {
    --bs-btn-bg: #0F75BD;
    --bs-btn-border-color: #0F75BD;
    --bs-btn-hover-bg: #0d69aa;
    --bs-btn-hover-border-color: #0d66a6;
    --bs-btn-active-bg: #0c63a0;
    --bs-btn-active-border-color: #0c5f9a;
    --bs-btn-disabled-bg: #0F75BD;
    --bs-btn-disabled-border-color: #0F75BD;
}

/* Secondary button override */
.btn-secondary {
    --bs-btn-bg: #F72C93;
    --bs-btn-border-color: #F72C93;
    --bs-btn-hover-bg: #de2784;
    --bs-btn-hover-border-color: #d92681;
}

/* Outline button variants */
.btn-outline-primary {
    --bs-btn-color: #0F75BD;
    --bs-btn-border-color: #0F75BD;
    --bs-btn-hover-bg: #0F75BD;
    --bs-btn-hover-border-color: #0F75BD;
    --bs-btn-active-bg: #0F75BD;
    --bs-btn-active-border-color: #0F75BD;
}

/* Cards with gradient borders */
.card {
    border: 1px solid transparent;
    background-image: linear-gradient(white, white),
                      linear-gradient(135deg, #0F75BD 0%, #F72C93 100%);
    background-origin: border-box;
    background-clip: padding-box, border-box;
}

/* Gradient text utility */
.text-gradient {
    background: linear-gradient(135deg, #0F75BD 0%, #F72C93 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Custom shadow utilities using brand colors */
.shadow-primary {
    box-shadow: 0 0.5rem 1rem rgba(15, 117, 189, 0.15) !important;
}

.shadow-primary-lg {
    box-shadow: 0 1rem 3rem rgba(15, 117, 189, 0.175) !important;
}

/* Navbar customization */
.navbar {
    backdrop-filter: blur(10px);
    background-color: rgba(255, 255, 255, 0.9) !important;
    border-bottom: 1px solid rgba(15, 117, 189, 0.1);
}

/* Form control focus states */
.form-control:focus {
    border-color: #0F75BD;
    box-shadow: 0 0 0 0.25rem rgba(15, 117, 189, 0.25);
}

/* Custom badge styles */
.badge {
    border-radius: 50rem;
    padding: 0.35em 0.65em;
}

/* Progress bar */
.progress-bar {
    background: linear-gradient(90deg, #0F75BD 0%, #F72C93 100%);
}

/* Alerts with brand colors */
.alert-primary {
    --bs-alert-bg: rgba(15, 117, 189, 0.1);
    --bs-alert-border-color: rgba(15, 117, 189, 0.2);
    --bs-alert-color: #0a5184;
}

/* List group active state */
.list-group-item.active {
    background-color: #0F75BD;
    border-color: #0F75BD;
}

/* Pagination */
.page-link {
    color: #0F75BD;
}

.page-link:hover {
    color: #0c63a0;
}

.page-item.active .page-link {
    background-color: #0F75BD;
    border-color: #0F75BD;
}

/* Dropdown items */
.dropdown-item:hover,
.dropdown-item:focus {
    background-color: rgba(15, 117, 189, 0.1);
    color: #0F75BD;
}

/* Switches and checks */
.form-check-input:checked {
    background-color: #0F75BD;
    border-color: #0F75BD;
}

/* Range inputs */
.form-range::-webkit-slider-thumb {
    background-color: #0F75BD;
}

.form-range::-moz-range-thumb {
    background-color: #0F75BD;
}

/* Tooltips */
.tooltip-inner {
    background-color: #0F75BD;
}

.bs-tooltip-top .tooltip-arrow::before {
    border-top-color: #0F75BD;
}

/* Spinners */
.spinner-border-primary {
    color: #0F75BD;
}

/* Offcanvas */
.offcanvas {
    backdrop-filter: blur(10px);
}

/* Modal backdrop blur */
.modal {
    backdrop-filter: blur(5px);
}

/* Accordion */
.accordion-button:not(.collapsed) {
    background-color: rgba(15, 117, 189, 0.05);
    color: #0F75BD;
}

/* Custom utilities for DNA Romance */
.bg-gradient-primary {
    background: linear-gradient(135deg, #0F75BD 0%, #F72C93 100%) !important;
}

.bg-gradient-soft {
    background: linear-gradient(135deg, rgba(15, 117, 189, 0.1) 0%, rgba(247, 44, 147, 0.1) 100%) !important;
}

.border-gradient {
    border-image: linear-gradient(135deg, #0F75BD 0%, #F72C93 100%) 1 !important;
}

/* Hover effects */
.hover-lift {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-lift:hover {
    transform: translateY(-0.25rem);
    box-shadow: 0 1rem 2.5rem rgba(15, 117, 189, 0.15);
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: #0F75BD;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #0c63a0;
}
