/* Gorillaa AI - Color Theme Variables */
:root {
    /* Primary Brand Colors */
    --primary-orange: #FF4901;
    --primary-orange-hover: #E63F00;
    --primary-orange-light: #FF6B2B;

    /* Secondary Colors - Orange Shades (no blue) */
    --secondary-indigo: #FF6B2B;
    --secondary-indigo-hover: #FF4901;
    --secondary-indigo-light: #FF8C52;

    /* Text Colors */
    --text-dark: #1a1a1a;
    --text-medium: #4a4a4a;
    --text-light: #6b7280;
    --text-muted: #a0a0a0;
    --text-white: #ffffff;

    /* Background Colors */
    --bg-white: #FCFCFA;
    --bg-light: #FCFCFA;
    --bg-gray: #f3f4f6;
    --bg-dark: #1a1a1a;
    --bg-darker: #111827;

    /* Border Colors */
    --border-light: #e5e7eb;
    --border-medium: #d1d5db;
    --border-dark: #9ca3af;

    /* Accent Colors - Updated info to orange */
    --accent-success: #10b981;
    --accent-warning: #f59e0b;
    --accent-error: #ef4444;
    --accent-info: #FF4901;

    /* Shadow Colors */
    --shadow-sm: rgba(0, 0, 0, 0.05);
    --shadow-md: rgba(0, 0, 0, 0.1);
    --shadow-lg: rgba(0, 0, 0, 0.15);
    --shadow-xl: rgba(0, 0, 0, 0.2);

    /* Overlay Colors */
    --overlay-light: rgba(255, 255, 255, 0.9);
    --overlay-dark: rgba(0, 0, 0, 0.5);
    --overlay-darker: rgba(0, 0, 0, 0.75);
}

/* Dark Mode Override (Optional) */
@media (prefers-color-scheme: dark) {
    :root {
        --bg-white: #1a1a1a;
        --bg-light: #1f2937;
        --bg-gray: #111827;
        --text-dark: #f9fafb;
        --text-medium: #e5e7eb;
        --text-light: #d1d5db;
        --border-light: #374151;
        --border-medium: #4b5563;
    }
}

/* Color Utility Classes */
.text-primary {
    color: var(--primary-orange) !important;
}

.text-secondary {
    color: var(--secondary-indigo) !important;
}

.text-dark {
    color: var(--text-dark) !important;
}

.text-medium {
    color: var(--text-medium) !important;
}

.text-light {
    color: var(--text-light) !important;
}

.text-muted {
    color: var(--text-muted) !important;
}

.text-white {
    color: var(--text-white) !important;
}

.bg-primary {
    background-color: var(--primary-orange) !important;
}

.bg-secondary {
    background-color: var(--secondary-indigo) !important;
}

.bg-white {
    background-color: var(--bg-white) !important;
}

.bg-light {
    background-color: var(--bg-light) !important;
}

.bg-gray {
    background-color: var(--bg-gray) !important;
}

.bg-dark {
    background-color: var(--bg-dark) !important;
}

.border-primary {
    border-color: var(--primary-orange) !important;
}

.border-light {
    border-color: var(--border-light) !important;
}

.border-medium {
    border-color: var(--border-medium) !important;
}

.border-dark {
    border-color: var(--border-dark) !important;
}

/* Button Color Classes */
.btn-primary {
    background-color: var(--primary-orange) !important;
    color: var(--text-white) !important;
}

.btn-primary:hover {
    background-color: var(--primary-orange-hover) !important;
}

.btn-secondary {
    background-color: var(--secondary-indigo) !important;
    color: var(--text-white) !important;
}

.btn-secondary:hover {
    background-color: var(--secondary-indigo-hover) !important;
}

/* Link Color Classes */
.link-primary {
    color: var(--primary-orange) !important;
}

.link-primary:hover {
    color: var(--primary-orange-hover) !important;
}

.link-secondary {
    color: var(--secondary-indigo) !important;
}

.link-secondary:hover {
    color: var(--secondary-indigo-hover) !important;
}

/* Reusable Waitlist Button Styles */
.waitlist-button-primary {
    background: #FF5722;
    padding: 14px 32px;
    border-radius: 8px;
    color: white;
    font-weight: 600;
    font-size: 16px;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(255, 87, 34, 0.3);
    transition: all 0.3s ease;
    white-space: nowrap;
}

.waitlist-button-primary:hover {
    background: #E64A19;
    box-shadow: 0 6px 16px rgba(255, 87, 34, 0.4);
    transform: translateY(-1px);
}

.waitlist-button-primary:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(255, 87, 34, 0.3);
}

/* Larger variant for hero section */
.waitlist-button-hero {
    background: #FF5722;
    padding: 14px 32px;
    border-radius: 8px;
    color: white;
    font-weight: 600;
    font-size: 18px;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(255, 87, 34, 0.4);
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.waitlist-button-hero:hover {
    background: #E64A19;
    box-shadow: 0 6px 20px rgba(255, 87, 34, 0.5);
    transform: translateY(-2px);
}

.waitlist-button-hero:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(255, 87, 34, 0.3);
}