/*
Theme Name: Heme Laooz Polla
Theme URI: https://laooz.com
Author: Laooz Studios
Author URI: https://laooz.com
Description: Tema personalizado para la Polla Mundial 2026
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: heme-laooz-polla
Domain Path: /languages

Este tema utiliza Tailwind CSS via CDN para el diseño.
*/

/* Colores Codensa */
:root {
    --codensa-primary: #a81e22;
    --codensa-primary-dark: #8a181c;
    --codensa-primary-darker: #701416;
    --codensa-primary-light: #fce8e9;
    --codensa-primary-lighter: #fdf5f5;
}

/* Estilos básicos y utilidades */
body {
    font-family: 'Inter', sans-serif;
}

/* Header y áreas principales con color de marca */
.site-header-codensa {
    background-color: var(--codensa-primary);
    border-bottom: 1px solid var(--codensa-primary-dark);
}

.site-footer-codensa {
    background-color: var(--codensa-primary);
}

/* Dropdown menú de usuario (Mi Cuenta) */
.user-menu-dropdown {
    background-color: var(--codensa-primary-dark);
    border: 1px solid var(--codensa-primary-darker);
}

.user-menu-dropdown__link {
    color: #f3f4f6;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.user-menu-dropdown__link:hover {
    background-color: var(--codensa-primary-darker);
    color: #fff;
}

.user-menu-dropdown__divider {
    border-top: 1px solid var(--codensa-primary-darker);
}

.user-menu-mobile__link {
    color: #e5e7eb;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.user-menu-mobile__link:hover {
    background-color: var(--codensa-primary-dark);
    color: #fff;
}

.user-menu-mobile__button:hover {
    background-color: var(--codensa-primary-dark);
    color: #fff;
}

/* Sustituir amarillo (color secundario anterior) por Codensa en UI principal */
.border-yellow-500,
.border-yellow-400,
.border-yellow-300 {
    border-color: var(--codensa-primary) !important;
}

.bg-yellow-500,
.bg-yellow-600 {
    background-color: var(--codensa-primary) !important;
}

.hover\:bg-yellow-600:hover,
.hover\:bg-yellow-700:hover,
.active\:bg-yellow-700:active {
    background-color: var(--codensa-primary-dark) !important;
}

.from-yellow-500,
.from-yellow-400 {
    --tw-gradient-from: var(--codensa-primary) var(--tw-gradient-from-position) !important;
}

.to-yellow-600,
.to-yellow-700 {
    --tw-gradient-to: var(--codensa-primary-dark) var(--tw-gradient-to-position) !important;
}

.hover\:from-yellow-600:hover {
    --tw-gradient-from: var(--codensa-primary-dark) var(--tw-gradient-from-position) !important;
}

.hover\:to-yellow-700:hover {
    --tw-gradient-to: var(--codensa-primary-darker) var(--tw-gradient-to-position) !important;
}

.text-yellow-500,
.text-yellow-600,
.text-yellow-700 {
    color: var(--codensa-primary) !important;
}

.hover\:text-yellow-700:hover,
.hover\:text-yellow-600:hover,
.hover\:text-yellow-400:hover {
    color: var(--codensa-primary-dark) !important;
}

.bg-yellow-50,
.from-yellow-50 {
    background-color: var(--codensa-primary-lighter) !important;
}

.bg-yellow-100 {
    background-color: var(--codensa-primary-light) !important;
}

.text-yellow-700.bg-yellow-100 {
    color: var(--codensa-primary-dark) !important;
}

.focus\:border-yellow-500:focus,
.focus\:ring-yellow-500:focus {
    border-color: var(--codensa-primary) !important;
    --tw-ring-color: var(--codensa-primary) !important;
}

.file\:bg-yellow-500::file-selector-button {
    background-color: var(--codensa-primary) !important;
}

.hover\:file\:bg-yellow-600:hover::file-selector-button {
    background-color: var(--codensa-primary-dark) !important;
}

.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.scrollbar-hide::-webkit-scrollbar {
    display: none;
}