/*
Theme Name: Broker Alert
Theme URI: https://brokeralert.com
Author: Broker Alert Team
Author URI: https://brokeralert.com
Description: A financial broker review and scam alert theme. Exposes fraudulent trading platforms and highlights regulated, trustworthy brokers.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: broker-alert
Tags: finance, reviews, custom-post-types, tailwind
*/

/* Theme styles are handled via Tailwind CSS loaded in functions.php */
/* Custom overrides below */

:root {
    --color-navy: #0a1628;
    --color-crimson: #dc143c;
    --color-emerald: #10b981;
    --color-gold: #f59e0b;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Inter', sans-serif;
    background-color: #f9fafb;
    color: #111827;
}

/* Line clamp utility */
.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Shadow utilities */
.shadow-soft {
    box-shadow: 0 2px 15px -3px rgba(0, 0, 0, 0.07), 0 10px 20px -2px rgba(0, 0, 0, 0.04);
}

/* Star rating */
.star-filled { color: var(--color-gold); }
.star-empty  { color: #d1d5db; }

/* Status badges */
.badge-scam {
    background-color: rgba(220, 20, 60, 0.1);
    color: var(--color-crimson);
}
.badge-trusted {
    background-color: rgba(16, 185, 129, 0.1);
    color: var(--color-emerald);
}

/* Broker card hover */
.broker-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.broker-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.12);
}

/* Nav active link */
.nav-link.active,
.nav-link:hover {
    color: var(--color-gold);
}

/* Form focus ring */
input:focus,
textarea:focus,
select:focus {
    outline: none;
    ring: 2px solid var(--color-gold);
}

/* Mobile menu */
#mobile-menu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}
#mobile-menu.open {
    max-height: 400px;
}