/**
 * Blue Theme for TANKORA ENERGY - Raleway Font Enforced
 * This theme replaces the orange color scheme with blue tones
 * Font: Raleway site-wide
 */

/* Enforce Raleway font */
body, h1, h2, h3, h4, h5, h6, p, a, li, button, input, textarea {
    font-family: 'Raleway', sans-serif !important;
}

:root {
    /* Primary color */
    --primary-color: #1a73e8;
    --primary-color-dark: #0d47a1;
    --primary-color-light: #42a5f5;
    
    /* Secondary/Accent color */
    --accent-color: #0288d1;
    --accent-color-dark: #01579b;
    --accent-color-light: #4fc3f7;
    
    /* Text colors */
    --text-primary: #212121;
    --text-secondary: #455a64;
    --text-light: #78909c;
    --text-on-primary: #ffffff;
    
    /* Background colors */
    --bg-light: #f5f7fa;
    --bg-dark: #263238;
    
    /* Other colors */
    --success-color: #00897b;
    --warning-color: #ffa000;
    --error-color: #d32f2f;
}

/* Buttons */
.btn {
    background-color: var(--primary-color);
    color: var(--text-on-primary);
    text-decoration: none;
}

.btn:hover {
    background-color: var(--primary-color-dark);
}

.btn-outline {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.btn-outline:hover {
    background-color: var(--primary-color);
    color: var(--text-on-primary);
}

/* Light outline button for dark backgrounds (like hero section) */
.btn-light {
    border-color: #ffffff;
    color: #ffffff;
}

.btn-outline.btn-light:hover {
    background-color: #ffffff;
    color: var(--primary-color-dark);
}

/* Hero Section */
.hero {
    background: url('../img/hero-bg.jpg') no-repeat center center;
    background-size: cover;
}

/* Separator/Divider */
.separator {
    background-color: var(--primary-color);
}

/* Navigation */
.nav-menu .active {
    color: var(--primary-color);
}

.nav-menu li a:hover {
    color: var(--primary-color);
}

.dropdown-menu li a:hover {
    background-color: var(--primary-color-light);
    color: var(--text-on-primary);
}

/* Headers */
.section-header h2:after {
    background-color: var(--primary-color);
}

/* Services Cards */
.service-card-detailed:hover {
    border-color: var(--primary-color);
}

.service-card-detailed:before {
    background-color: var(--primary-color-light);
}

/* Stats & Key Facts */
.key-facts {
    background: linear-gradient(rgba(13, 71, 161, 0.9), rgba(21, 101, 192, 0.9)), url('../img/stats-bg.jpg') no-repeat fixed center;
}

.stat-box {
    border-color: var(--primary-color-light);
}

.stat-number {
    color: var(--primary-color);
}

/* Terminal Cards */
.terminal-card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 10px 30px rgba(26, 115, 232, 0.15);
}

/* Fuel Products */
.fuel-card:hover {
    border-color: var(--primary-color);
}

/* Footer */
footer {
    background-color: var(--bg-dark);
}

footer h3:after {
    background-color: var(--primary-color);
}

.footer-links ul li a:hover {
    color: var(--primary-color-light);
}

/* Contact section */
.contact-cta {
    background: linear-gradient(135deg, var(--primary-color-dark), var(--primary-color));
}

/* Form elements */
input:focus, 
textarea:focus, 
select:focus {
    border-color: var(--primary-color);
}

.form-control:focus {
    box-shadow: 0 0 0 0.2rem rgba(26, 115, 232, 0.25);
}

/* Scroll indicator */
.scroll-indicator i {
    color: var(--primary-color-light);
}