/**
 * QuickScores Custom Theme
 * Overrides Material Dashboard default colors with QuickScores branding
 * 
 * Color Palette:
 * Primary: #1C6BB6 (blue)
 * Secondary: #F3A92F (orange)
 * Tertiary: #84C440 (green)
 */

/* ============================================
   PRIMARY COLOR OVERRIDES (Blue)
   ============================================ */

/* Primary Gradients */
.bg-gradient-primary,
.btn-primary,
.btn.bg-gradient-primary {
    background: linear-gradient(195deg, #3D8FD8 0%, #1C6BB6 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 20px 0 rgba(28, 107, 182, 0.4), 0 7px 10px -5px rgba(28, 107, 182, 0.6) !important;
}

.btn-primary:hover,
.btn.bg-gradient-primary:hover {
    background: linear-gradient(195deg, #1C6BB6 0%, #145294 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 6px 25px 0 rgba(28, 107, 182, 0.5), 0 10px 15px -5px rgba(28, 107, 182, 0.7) !important;
}

.btn-primary:active,
.btn-primary:focus,
.btn.bg-gradient-primary:active,
.btn.bg-gradient-primary:focus {
    background: linear-gradient(195deg, #145294 0%, #0F3D6B 100%) !important;
    box-shadow: 0 3px 15px 0 rgba(28, 107, 182, 0.35), 0 5px 8px -5px rgba(28, 107, 182, 0.55) !important;
}

/* Shadow utilities for primary */
.shadow-primary {
    box-shadow: 0 4px 20px 0 rgba(28, 107, 182, 0.4), 0 7px 10px -5px rgba(28, 107, 182, 0.6) !important;
}

/* Primary Badge */
.badge-primary {
    background: linear-gradient(195deg, #3D8FD8 0%, #1C6BB6 100%) !important;
    color: #FFFFFF !important;
}

/* Primary Alert */
.alert-primary {
    background-color: #3D8FD8 !important;
    color: #FFFFFF !important;
}

/* ============================================
   SECONDARY COLOR OVERRIDES (Orange)
   ============================================ */

/* Secondary Gradients */
.bg-gradient-secondary,
.btn-secondary,
.btn.bg-gradient-secondary {
    background: linear-gradient(195deg, #F5BD5F 0%, #F3A92F 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 20px 0 rgba(243, 169, 47, 0.4), 0 7px 10px -5px rgba(243, 169, 47, 0.6) !important;
}

.btn-secondary:hover,
.btn.bg-gradient-secondary:hover {
    background: linear-gradient(195deg, #F3A92F 0%, #D18D1A 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 6px 25px 0 rgba(243, 169, 47, 0.5), 0 10px 15px -5px rgba(243, 169, 47, 0.7) !important;
}

.btn-secondary:active,
.btn-secondary:focus,
.btn.bg-gradient-secondary:active,
.btn.bg-gradient-secondary:focus {
    background: linear-gradient(195deg, #D18D1A 0%, #A66F15 100%) !important;
}

/* Shadow utilities for secondary */
.shadow-secondary {
    box-shadow: 0 4px 20px 0 rgba(243, 169, 47, 0.4), 0 7px 10px -5px rgba(243, 169, 47, 0.6) !important;
}

/* Secondary Badge */
.badge-secondary {
    background: linear-gradient(195deg, #F5BD5F 0%, #F3A92F 100%) !important;
    color: #FFFFFF !important;
}

/* ============================================
   TERTIARY/SUCCESS COLOR OVERRIDES (Green)
   ============================================ */

/* Tertiary/Success Gradients */
.bg-gradient-success,
.btn-success,
.btn.bg-gradient-success {
    background: linear-gradient(195deg, #A0D470 0%, #84C440 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 20px 0 rgba(132, 196, 64, 0.4), 0 7px 10px -5px rgba(132, 196, 64, 0.6) !important;
}

.btn-success:hover,
.btn.bg-gradient-success:hover {
    background: linear-gradient(195deg, #84C440 0%, #6AA52B 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 6px 25px 0 rgba(132, 196, 64, 0.5), 0 10px 15px -5px rgba(132, 196, 64, 0.7) !important;
}

.btn-success:active,
.btn-success:focus,
.btn.bg-gradient-success:active,
.btn.bg-gradient-success:focus {
    background: linear-gradient(195deg, #6AA52B 0%, #558421 100%) !important;
    box-shadow: 0 3px 15px 0 rgba(132, 196, 64, 0.35), 0 5px 8px -5px rgba(132, 196, 64, 0.55) !important;
}

/* Shadow utilities for success */
.shadow-success {
    box-shadow: 0 4px 20px 0 rgba(132, 196, 64, 0.4), 0 7px 10px -5px rgba(132, 196, 64, 0.6) !important;
}

/* Success Badge */
.badge-success {
    background: linear-gradient(195deg, #A0D470 0%, #84C440 100%) !important;
    color: #FFFFFF !important;
}

/* ============================================
   SIDEBAR & NAVIGATION - White Sidebar Design
   ============================================ */

/* Sidebar Background */
.sidenav.bg-white {
    background-color: #FFFFFF !important;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1) !important;
}

/* Sidebar Active State - Primary Blue Background */
.sidenav .nav-link.active {
    background: linear-gradient(195deg, #3D8FD8 0%, #1C6BB6 100%) !important;
    color: #FFFFFF !important;
}

.sidenav .nav-link.active .icon,
.sidenav .nav-link.active i {
    color: #FFFFFF !important;
}

.sidenav .nav-link.active .nav-link-text,
.sidenav .nav-link.active .sidenav-normal {
    color: #FFFFFF !important;
}

/* Sidebar Hover State - Light Blue */
.sidenav .nav-link:hover:not(.active) {
    background-color: rgba(28, 107, 182, 0.08) !important;
}

/* Sidebar Text Colors (for non-active links) */
.sidenav .nav-link:not(.active) {
    color: #344767 !important;
}

.sidenav .nav-link:not(.active) i {
    color: #344767 !important;
}

/* HR dividers - dark color for white background */
.sidenav hr.horizontal.dark {
    background-color: rgba(0, 0, 0, 0.1) !important;
}

/* ============================================
   GENERAL LINKS & TEXT
   ============================================ */

/* Standard Links (neutral blue) */
a {
    color: #344767;
}

a:hover {
    color: #1C6BB6;
}

/* Links in cards/content (slightly blue) */
.card-body a:not(.btn) {
    color: #5e72e4;
}

.card-body a:not(.btn):hover {
    color: #3a50d9;
}

/* Text Colors - Keep only for explicit utility classes */
.text-primary {
    color: #1C6BB6 !important;
}

.text-secondary {
    color: #6c757d !important; /* Standard gray for secondary text */
}

.text-success {
    color: #82d616 !important; /* Softer green for text */
}

.text-info {
    color: #17a2b8 !important; /* Standard info color */
}

.text-warning {
    color: #fb6340 !important; /* Standard warning color */
}

.text-danger {
    color: #ea0606 !important; /* Standard danger color */
}

/* ============================================
   HEADERS & TYPOGRAPHY
   ============================================ */

/* Remove excessive text shadows */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    color: #344767;
}

/* ============================================
   CARDS & COMPONENTS
   ============================================ */

/* Card Headers */
.card-header.bg-gradient-primary {
    background: linear-gradient(195deg, #3D8FD8 0%, #1C6BB6 100%) !important;
}

.card-header.bg-gradient-secondary {
    background: linear-gradient(195deg, #F5BD5F 0%, #F3A92F 100%) !important;
}

.card-header.bg-gradient-success {
    background: linear-gradient(195deg, #A0D470 0%, #84C440 100%) !important;
}

/* ============================================
   CLEAN DESIGN - NO BACKGROUND IMAGES
   ============================================ */

/* Remove background images from page headers */
.page-header {
    background-image: none !important;
    background-color: #f8f9fa !important;
}

/* Remove background images from card headers */
.card-header {
    background-image: none !important;
}

/* Remove background images from sections */
section[style*="background-image"] {
    background-image: none !important;
}

/* Clean login/auth pages */
.page-header.min-vh-100 {
    background-image: none !important;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important;
}

/* ============================================
   FORMS & INPUTS
   ============================================ */

/* ============================================
   MATERIAL DASHBOARD INPUT OUTLINE OVERRIDE
   Complete override of pink (#e91e63) to gray/blue
   ============================================ */

/* NUCLEAR OPTION: Target ALL possible pink border states */
/* This targets the exact CSS that Material Dashboard uses */

/* Override the ::before and ::after pseudo-elements (THE FIX FOR PINK BORDER!) */
.input-group.input-group-outline.is-filled .form-label::after,
.input-group.input-group-outline.is-filled .form-label::before,
.input-group.input-group-outline.is-focused .form-label::after,
.input-group.input-group-outline.is-focused .form-label::before {
    border-top-color: #d2d6da !important;
    box-shadow: inset 0 1px #d2d6da !important;
}

/* When focused, use blue for ::before and ::after */
.input-group.input-group-outline.is-focused .form-label::after,
.input-group.input-group-outline.is-focused .form-label::before {
    border-top-color: #1C6BB6 !important;
    box-shadow: inset 0 1px #1C6BB6 !important;
}

/* Override form control borders */
.input-group-outline.is-filled .form-label + .form-control,
.input-group-outline.is-focused .form-label + .form-control,
.input-group.input-group-outline.is-filled .form-label + .form-control,
.input-group.input-group-outline.is-focused .form-label + .form-control {
    border-color: #d2d6da !important;
    border-top-color: transparent !important;
    box-shadow: inset 1px 0 #d2d6da, inset -1px 0 #d2d6da, inset 0 -1px #d2d6da !important;
}

/* When focused, use blue */
.input-group-outline.is-focused .form-label + .form-control,
.input-group.input-group-outline.is-focused .form-label + .form-control {
    border-color: #1C6BB6 !important;
    box-shadow: inset 1px 0 #1C6BB6, inset -1px 0 #1C6BB6, inset 0 -1px #1C6BB6 !important;
}

/* Default/Filled state - neutral gray */
.input-group.input-group-outline .form-label+.form-control,
.input-group.input-group-outline.is-filled .form-label+.form-control {
    border-color: #d2d6da !important; /* Neutral gray */
    border-top-color: transparent !important;
    box-shadow: inset 1px 0 #d2d6da, inset -1px 0 #d2d6da, inset 0 -1px #d2d6da !important;
}

/* Focused state - use QuickScores blue */
.input-group.input-group-outline.is-focused .form-label+.form-control {
    border-color: #1C6BB6 !important;
    border-top-color: transparent !important;
    box-shadow: inset 1px 0 #1C6BB6, inset -1px 0 #1C6BB6, inset 0 -1px #1C6BB6 !important;
}

/* Override label colors */
.input-group.input-group-outline .form-label,
.input-group.input-group-outline.is-filled .form-label {
    color: #495057 !important; /* Dark gray for filled labels */
}

.input-group.input-group-outline.is-focused .form-label {
    color: #1C6BB6 !important; /* Blue for focused labels */
}

/* Override any remaining pink/magenta borders - all states */
.input-group-outline .form-control {
    border-color: #d2d6da !important;
}

.input-group-outline.is-focused .form-control {
    border-color: #1C6BB6 !important;
}

/* Aggressive override for top border specifically */
.input-group.input-group-outline .form-control::before,
.input-group.input-group-outline.is-filled .form-control::before,
.input-group.input-group-outline.is-focused .form-control::before {
    border-top-color: transparent !important;
}

/* Target the actual border rendering */
.input-group-outline.is-filled::before,
.input-group-outline.is-focused::before {
    border-color: #d2d6da !important;
}

.input-group-outline.is-focused::before {
    border-color: #1C6BB6 !important;
}

/* Catch-all for any remaining pink (#1C6BB6) - Nuclear override */
.input-group-outline [style*="border-color: rgb(233, 30, 99)"],
.input-group-outline [style*="border-color: #1C6BB6"] {
    border-color: #d2d6da !important;
}

/* Override Material Dashboard's default pink for ALL input outline states */
.input-group-outline.is-filled .form-label::after,
.input-group-outline.is-focused .form-label::after {
    border-top-color: #d2d6da !important;
}

.input-group-outline.is-focused .form-label::after {
    border-top-color: #1C6BB6 !important;
}

/* Override the fieldset border (this is what creates the outline effect) */
.input-group-outline .form-control:not(textarea),
.input-group-outline.is-filled .form-control:not(textarea),
.input-group-outline.is-focused .form-control:not(textarea) {
    border: 1px solid #d2d6da !important;
    border-top-color: transparent !important;
}

.input-group-outline.is-focused .form-control:not(textarea) {
    border-color: #1C6BB6 !important;
    border-top-color: transparent !important;
}

/* Input Focus States (general) */
.input-group.focused .form-control,
.input-group.is-focused .form-control {
    border-color: #1C6BB6 !important;
}

.input-group.focused label,
.input-group.is-focused label {
    color: #1C6BB6 !important;
}

.form-control:focus {
    border-color: #1C6BB6 !important;
    box-shadow: 0 0 0 0.2rem rgba(28, 107, 182, 0.25) !important;
}

/* Select dropdowns */
.form-select:focus {
    border-color: #1C6BB6 !important;
    box-shadow: 0 0 0 0.2rem rgba(28, 107, 182, 0.25) !important;
}

/* Form Check (Checkboxes/Radio) */
.form-check-input:checked {
    background-color: #1C6BB6 !important;
    border-color: #1C6BB6 !important;
}

.form-check-input:focus {
    border-color: #1C6BB6 !important;
    box-shadow: 0 0 0 0.2rem rgba(28, 107, 182, 0.25) !important;
}

/* ============================================
   TABLES
   ============================================ */

/* Table Headers */
.table thead th {
    background-color: #f8f9fa;
    color: #1C6BB6;
    font-weight: 600;
}

/* Table Hover */
.table-hover tbody tr:hover {
    background-color: rgba(28, 107, 182, 0.05) !important;
}

/* ============================================
   PAGINATION
   ============================================ */

.page-item.active .page-link {
    background: linear-gradient(195deg, #3D8FD8 0%, #1C6BB6 100%) !important;
    border-color: #1C6BB6 !important;
}

.page-link {
    color: #1C6BB6 !important;
}

.page-link:hover {
    color: #145294 !important;
    background-color: rgba(28, 107, 182, 0.1) !important;
}

/* ============================================
   PROGRESS BARS
   ============================================ */

.progress-bar {
    background: linear-gradient(195deg, #3D8FD8 0%, #1C6BB6 100%) !important;
}

/* ============================================
   SPINNERS & LOADERS
   ============================================ */

.spinner-border-primary,
.spinner-border.text-primary {
    color: #1C6BB6 !important;
}

/* ============================================
   UTILITIES
   ============================================ */

/* Background Colors */
.bg-primary {
    background-color: #1C6BB6 !important;
}

.bg-secondary {
    background-color: #F3A92F !important;
}

.bg-success {
    background-color: #84C440 !important;
}

/* Border Colors */
.border-primary {
    border-color: #1C6BB6 !important;
}

.border-secondary {
    border-color: #F3A92F !important;
}

.border-success {
    border-color: #84C440 !important;
}