/*
Theme Name: CallBot Insight
Theme URI: https://callbot-insight.lovable.app/
Description: 100% Pixel Perfect Clone of CallBot Insight. Brutalist design with Oswald and Source Sans 3 fonts.
Author: Antigravity
Version: 1.0.0
Text Domain: callbot-insight
*/

/* --- 100% Design Parity Overrides --- */

:root {
    /* Exact Brand Colors from User Requirements */
    --primary-hex: #ff382e;
    --secondary-hex: #ffdd00;
    
    /* Override Tailwind HSL variables used in lovable-all.css */
    --primary: 3 100% 59%; /* Fallback */
    --secondary: 52 100% 50%; /* Fallback */
    
    /* Force HSL variables to use the exact Hex codes if needed by Tailwind */
    /* Note: Tailwind usually expects HSL components, but we can override the utility classes below */
}

/* Force Primary Color Utilities to 100% Match */
.bg-primary {
    background-color: var(--primary-hex) !important;
}
.text-primary {
    color: var(--primary-hex) !important;
}
.border-primary {
    border-color: var(--primary-hex) !important;
}

/* Force Secondary Color Utilities to 100% Match */
.bg-secondary {
    background-color: var(--secondary-hex) !important;
}
.text-secondary {
    color: var(--secondary-hex) !important;
}
.border-secondary {
    border-color: var(--secondary-hex) !important;
}

/* Brutalist Component Defaults */
.brutal-card {
    border: 3px solid #000 !important;
    box-shadow: 6px 6px 0px 0px #000 !important;
    transition: all 0.2s ease-in-out !important;
}

.brutal-card:hover {
    transform: translate(-2px, -2px) !important;
    box-shadow: 8px 8px 0px 0px #000 !important;
}

.brutal-badge {
    background-color: var(--secondary-hex) !important;
    border: 2px solid #000 !important;
    padding: 4px 12px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    font-family: 'Oswald', sans-serif !important;
}

/* Section Backgrounds */
.brutal-section-red {
    background-color: var(--primary-hex) !important;
    color: #fff !important;
}

.brutal-section-yellow {
    background-color: var(--secondary-hex) !important;
    color: #000 !important;
}

.brutal-section-dark {
    background-color: #000 !important;
    color: #fff !important;
}

/* Custom shadow token matching Lovable */
:root {
    --shadow-brutal: 6px 6px 0px 0px #000;
    --shadow-brutal-hover: 8px 8px 0px 0px #000;
}

/* Global Typography Tweaks */
body {
    font-family: 'Source Sans 3', sans-serif;
    color: #1a1a1a;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Oswald', sans-serif;
    font-weight: 700;
}

/* --- Elementor Pro Form Brutalist Styling --- */

.brutal-contact-form-container .elementor-field-group {
    margin-bottom: 20px !important;
}

.brutal-contact-form-container .elementor-field-label {
    font-family: 'Oswald', sans-serif !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em !important;
    font-size: 14px !important;
    margin-bottom: 8px !important;
}

.brutal-contact-form-container .elementor-field-textual {
    border: 3px solid #000 !important;
    border-radius: 0px !important;
    padding: 12px 16px !important;
    font-family: 'Source Sans 3', sans-serif !important;
    background-color: #fff !important;
    transition: all 0.2s ease-in-out !important;
    box-shadow: none !important;
}

.brutal-contact-form-container .elementor-field-textual:focus {
    background-color: #fff !important;
    box-shadow: 4px 4px 0px 0px #000 !important;
    transform: translate(-2px, -2px) !important;
    outline: none !important;
}

.brutal-contact-form-container .elementor-button {
    background-color: var(--primary-hex) !important;
    color: #fff !important;
    border: 2px solid #000 !important;
    border-radius: 0px !important;
    padding: 16px 32px !important;
    font-family: 'Oswald', sans-serif !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 16px !important;
    letter-spacing: 0.1em !important;
    box-shadow: 6px 6px 0px 0px #000 !important;
    transition: all 0.2s ease-in-out !important;
    width: 100% !important;
}

.brutal-contact-form-container .elementor-button:hover {
    background-color: var(--secondary-hex) !important;
    color: #000 !important;
    box-shadow: 8px 8px 0px 0px #000 !important;
    transform: translate(-2px, -2px) !important;
}

.brutal-contact-form-container .elementor-button:active {
    box-shadow: 2px 2px 0px 0px #000 !important;
    transform: translate(2px, 2px) !important;
}

/* Success/Error Message Styling */
.elementor-message {
    border: 3px solid #000 !important;
    border-radius: 0px !important;
    font-family: 'Source Sans 3', sans-serif !important;
    font-weight: 700 !important;
    padding: 15px !important;
    margin-top: 20px !important;
}

.elementor-message-success {
    background-color: #d4edda !important;
    color: #155724 !important;
}

.elementor-message-danger {
    background-color: #f8d7da !important;
    color: #721c24 !important;
}
