/* ==========================================
   CAR RENTAL ODISHA - LOGO COLOR THEME
   Primary Blue  : #006EBE  (car + icon)
   Primary Green : #2EAA47  (rental + odisha.com)
   Dark Blue     : #004A82  (hover states)
   Dark Green    : #1E8035  (hover states)
   Light Blue    : #E8F4FC  (backgrounds)
   Light Green   : #E8F7EC  (backgrounds)
   ==========================================*/

/* ---- CSS Variables for the whole theme ---- */
:root {
    --primary-blue:    #006EBE;
    --primary-green:   #2EAA47;
    --dark-blue:       #004A82;
    --dark-green:      #1E8035;
    --light-blue:      #E8F4FC;
    --light-green:     #E8F7EC;
    --text-dark:       #1A2B3C;
    --text-muted:      #6C7A89;
    --white:           #FFFFFF;
    --shadow-blue:     rgba(0, 110, 190, 0.15);
    --shadow-green:    rgba(46, 170, 71, 0.15);
}

/* ---- Global Body & Base ---- */
body {
    font-family: 'Plus Jakarta Sans', sans-serif;
    color: var(--text-dark);
    background: #F5F9FF;
}

/* ---- Headings ---- */
h1, h2, h3, h4, h5, h6 {
    color: var(--text-dark);
}

/* ---- Links ---- */
a {
    color: var(--primary-blue);
    transition: all 0.3s ease;
}
a:hover {
    color: var(--primary-green);
}

/* ---- Primary Buttons (Blue) ---- */
.btn-primary,
.btn-primary:visited {
    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--dark-blue) 100%);
    border: none;
    color: var(--white) !important;
    border-radius: 8px;
    font-weight: 600;
    padding: 10px 24px;
    box-shadow: 0 4px 15px var(--shadow-blue);
    transition: all 0.3s ease;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background: linear-gradient(135deg, var(--dark-blue) 0%, var(--primary-blue) 100%) !important;
    color: var(--white) !important;
    background-color: var(--dark-blue) !important;
    border-color: var(--dark-blue) !important;
    box-shadow: 0 6px 20px var(--shadow-blue);
    transform: translateY(-1px);
}

/* ---- Secondary Buttons (Green) ---- */
.btn-secondary,
.btn-secondary:visited {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--dark-green) 100%);
    border: none;
    color: var(--white) !important;
    border-radius: 8px;
    font-weight: 600;
    padding: 10px 24px;
    box-shadow: 0 4px 15px var(--shadow-green);
    transition: all 0.3s ease;
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary.active {
    background: linear-gradient(135deg, var(--dark-green) 0%, var(--primary-green) 100%) !important;
    color: var(--white) !important;
    background-color: var(--dark-green) !important;
    border-color: var(--dark-green) !important;
    box-shadow: 0 6px 20px var(--shadow-green);
    transform: translateY(-1px);
}

/* ---- Text Color Utilities ---- */
.text-primary { color: var(--primary-blue) !important; }
.text-success, .text-green { color: var(--primary-green) !important; }

/* ---- Background Utilities ---- */
.bg-primary  { background-color: var(--primary-blue) !important; }
.bg-success, .bg-green  { background-color: var(--primary-green) !important; }
.bg-light-blue { background-color: var(--light-blue) !important; }
.bg-light-green { background-color: var(--light-green) !important; }

/* ---- Cards - Modern Frosted Look ---- */
.card {
    border: none !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06) !important;
    background: var(--white);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 30px var(--shadow-blue) !important;
}

/* ---- Form Inputs ---- */
.form-control {
    border: 1px solid #D0DCE8;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 15px;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.form-control:focus {
    border-color: var(--primary-blue);
    box-shadow: 0 0 0 3px rgba(0, 110, 190, 0.12);
    outline: none;
}

/* ---- Header ---- */
.header, .cr-header-modern {
    background: linear-gradient(90deg, #003F72 0%, var(--primary-blue) 60%, #006EBE 100%) !important;
    box-shadow: 0 2px 20px rgba(0,0,0,0.15);
}
.header .main-nav > li > a {
    color: rgba(255,255,255,0.9) !important;
    font-weight: 500;
    transition: color 0.3s ease;
}
.header .main-nav > li > a:hover,
.header .main-nav > li.active > a {
    color: #A8DFFF !important;
}

/* ---- Header Buttons (Sign In / Sign Up) ---- */
.header .header-navbar-rht li .btn {
    font-size: 13px !important;
    padding: 7px 16px !important;
    border-radius: 20px !important;
}
.header .header-navbar-rht li .btn-primary {
    background: var(--white) !important;
    color: var(--primary-blue) !important;
    font-weight: 600;
}
.header .header-navbar-rht li .btn-primary:hover {
    background: var(--light-blue) !important;
}
.header .header-navbar-rht li .btn-secondary {
    background: var(--primary-green) !important;
    color: var(--white) !important;
}
.header .header-navbar-rht li .btn-secondary:hover {
    background: var(--dark-green) !important;
}

/* ---- Footer ---- */
.footer {
    background: linear-gradient(135deg, #001F3D 0%, #003F72 100%) !important;
    color: rgba(255,255,255,0.85);
}
.footer h3, .footer h4, .footer h5, .footer .footer-title {
    color: var(--white) !important;
}
.footer a {
    color: rgba(255,255,255,0.7) !important;
}
.footer a:hover {
    color: #A8DFFF !important;
}

/* ---- Hero/Banner Section ---- */
.banner-section, .hero-section, .home-banner {
    background: linear-gradient(135deg, #002D5C 0%, var(--primary-blue) 100%) !important;
}

/* ---- Section Headings ---- */
.section-heading h2 {
    position: relative;
    display: inline-block;
}
.section-heading h2::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, var(--primary-blue), var(--primary-green));
    margin: 10px auto 0;
    border-radius: 2px;
}

/* ---- Navigation Active States ---- */
.nav-pills .nav-link.active,
.nav-tabs .nav-link.active {
    background: var(--primary-blue) !important;
    color: var(--white) !important;
    border-color: var(--primary-blue) !important;
}

/* ---- Badges / Tags ---- */
.badge-primary, .badge.primary {
    background: var(--primary-blue) !important;
}
.badge-success, .badge.success, .badge-green {
    background: var(--primary-green) !important;
}

/* ---- Pagination ---- */
.pagination .page-item.active .page-link {
    background: var(--primary-blue) !important;
    border-color: var(--primary-blue) !important;
}
.pagination .page-link {
    color: var(--primary-blue) !important;
}
.pagination .page-link:hover {
    background: var(--light-blue) !important;
}

/* ---- Car Cards & Booking Cards ---- */
.product-custom .profile-widget {
    border-radius: 14px !important;
    overflow: hidden;
    box-shadow: 0 4px 18px rgba(0,0,0,0.07);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.product-custom .profile-widget:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px var(--shadow-blue) !important;
}

/* ---- Price / Fare Highlight ---- */
.fare-price, .price-highlight, .amount {
    color: var(--primary-green) !important;
    font-weight: 700;
}

/* ---- Dashboard Summary Cards ---- */
.stat-card, .dash-card {
    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--dark-blue) 100%);
    color: var(--white);
    border-radius: 12px;
    padding: 20px;
}

/* ---- Tables ---- */
.table thead th {
    background: linear-gradient(90deg, var(--primary-blue), #0082DA);
    color: var(--white) !important;
    font-weight: 600;
    border: none;
}
.table-striped tbody tr:nth-of-type(odd) {
    background-color: var(--light-blue) !important;
}
.table tbody tr:hover {
    background-color: rgba(0, 110, 190, 0.06) !important;
}

/* ---- Status Badges ---- */
.status-completed, .badge-completed { color: var(--primary-green) !important; background: var(--light-green) !important; border-radius: 20px; padding: 4px 12px; font-weight: 600; }
.status-cancelled, .badge-cancelled { color: #E53935 !important; background: #FDECEA !important; border-radius: 20px; padding: 4px 12px; font-weight: 600; }
.status-pending, .badge-pending     { color: #F57C00 !important; background: #FFF3E0 !important; border-radius: 20px; padding: 4px 12px; font-weight: 600; }
.status-confirmed, .badge-confirmed { color: var(--primary-blue) !important; background: var(--light-blue) !important; border-radius: 20px; padding: 4px 12px; font-weight: 600; }

/* ---- Sign In / Sign Up Pages ---- */
.login-wrapper, .signup-wrapper {
    background: linear-gradient(135deg, var(--light-blue) 0%, var(--light-green) 100%) !important;
    min-height: 100vh;
}
.login-wrapper .card, .signup-wrapper .card {
    border-radius: 18px !important;
    box-shadow: 0 8px 40px rgba(0,0,0,0.10) !important;
}

/* ---- Booking Steps / Progress ---- */
.booking-step.active, .step-active {
    color: var(--primary-blue) !important;
    border-color: var(--primary-blue) !important;
}
.booking-progress-bar { background: var(--primary-green) !important; }

/* ---- Search Box ---- */
.banner-search .form-control:focus {
    border-color: var(--primary-blue);
    box-shadow: 0 0 0 3px rgba(0,110,190,0.15);
}
.banner-search .btn,
.banner-search .search-btn {
    background: var(--primary-green) !important;
    border-color: var(--primary-green) !important;
    color: var(--white) !important;
    font-weight: 700;
}
.banner-search .btn:hover {
    background: var(--dark-green) !important;
}

/* ---- Alert / Toast Colors ---- */
.alert-success { background: var(--light-green); color: var(--dark-green); border-color: var(--primary-green); }
.alert-info    { background: var(--light-blue);  color: var(--dark-blue);  border-color: var(--primary-blue); }

/* ---- Scrollbar ---- */
::-webkit-scrollbar { width: 7px; }
::-webkit-scrollbar-track { background: #f1f5fb; }
::-webkit-scrollbar-thumb { background: var(--primary-blue); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--dark-blue); }

/* ---- Selection highlight ---- */
::selection { background: rgba(0, 110, 190, 0.2); color: var(--text-dark); }