/* Tema GlobalChat - Basado en los colores y estilos de www.globalchat.org */

/* Variables de color GlobalChat - Se definen dinámicamente en theme-colors.php */
/* NO definir valores aquí - se definen en theme-colors.php */
:root {
    /* Variables de color se definen en theme-colors.php */
    --gc-bg-light: rgba(255, 255, 255, 0.98);
    --gc-bg-card: rgba(255, 255, 255, 0.95);
    --gc-text-dark: #2c3e50;
    --gc-text-light: #ffffff;
    --gc-text-muted: #6c757d;
    --gc-border-radius: 16px;
    --gc-border-radius-sm: 8px;
    --gc-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    /* Shadow usa var(--gc-primary) que se define en theme-colors.php */
    --gc-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    --gc-shadow-hover: 0 8px 30px rgba(0, 0, 0, 0.25);
}

/* Aplicar tema GlobalChat cuando está activo */
body[data-theme="globalchat"] {
    background-image: url('../img/photo-1462331940025-496dfbfc7564.avif');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    min-height: 100vh;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
    color: var(--gc-text-dark);
    position: relative;
}

/* Overlay para mejorar legibilidad si la imagen es muy clara */
body[data-theme="globalchat"]::after {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.1);
    pointer-events: none;
    z-index: -1;
}

body[data-theme="globalchat"] .container-fluid,
body[data-theme="globalchat"] .container {
    background: transparent;
    padding: 20px;
}

body[data-theme="globalchat"] #main_contain {
    background: transparent;
}

/* Navbar GlobalChat */
body[data-theme="globalchat"] .navbar {
    background: linear-gradient(135deg, var(--gc-primary-dark) 0%, var(--gc-primary) 100%) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

body[data-theme="globalchat"] .navbar-brand {
    color: var(--gc-text-light) !important;
    font-weight: 600;
}

body[data-theme="globalchat"] .nav-link {
    color: rgba(255, 255, 255, 0.9) !important;
    transition: all 0.3s ease;
}

body[data-theme="globalchat"] .nav-link:hover {
    color: var(--gc-accent) !important;
    transform: translateY(-1px);
}

body[data-theme="globalchat"] .nav-link.active {
    color: var(--gc-accent) !important;
    font-weight: 600;
}

/* Cards GlobalChat */
body[data-theme="globalchat"] .card {
    background: var(--gc-bg-card);
    border-radius: var(--gc-border-radius);
    border: 1px solid rgba(111, 66, 193, 0.15);
    box-shadow: var(--gc-shadow);
    transition: var(--gc-transition);
    backdrop-filter: blur(10px);
}

body[data-theme="globalchat"] .card:hover {
    transform: translateY(-4px);
    box-shadow: var(--gc-shadow-hover);
    border-color: rgba(111, 66, 193, 0.3);
}

body[data-theme="globalchat"] .card-header {
    background: linear-gradient(45deg, var(--gc-primary), var(--gc-primary-light));
    color: var(--gc-text-light);
    border-radius: var(--gc-border-radius) var(--gc-border-radius) 0 0;
    font-weight: 600;
}

/* Botones GlobalChat */
body[data-theme="globalchat"] .btn-primary {
    background: linear-gradient(45deg, var(--gc-primary), var(--gc-primary-light));
    border: none;
    border-radius: var(--gc-border-radius);
    color: var(--gc-text-light);
    font-weight: 600;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(111, 66, 193, 0.3);
}

body[data-theme="globalchat"] .btn-primary:hover {
    background: linear-gradient(45deg, var(--gc-primary-dark), var(--gc-primary));
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(111, 66, 193, 0.4);
}

body[data-theme="globalchat"] .btn-success {
    background: linear-gradient(45deg, #28a745, #20c997);
    border: none;
    border-radius: var(--gc-border-radius);
    color: var(--gc-text-light);
    font-weight: 600;
}

body[data-theme="globalchat"] .btn-info {
    background: linear-gradient(45deg, #17a2b8, #138496);
    border: none;
    border-radius: var(--gc-border-radius);
    color: var(--gc-text-light);
    font-weight: 600;
}

body[data-theme="globalchat"] .btn-warning {
    background: linear-gradient(45deg, var(--gc-accent), var(--gc-accent-dark));
    border: none;
    border-radius: var(--gc-border-radius);
    color: var(--gc-text-dark);
    font-weight: 600;
    box-shadow: 0 4px 15px rgba(255, 193, 7, 0.3);
}

body[data-theme="globalchat"] .btn-danger {
    background: linear-gradient(45deg, #dc3545, #c82333);
    border: none;
    border-radius: var(--gc-border-radius);
    color: var(--gc-text-light);
    font-weight: 600;
    box-shadow: 0 4px 15px rgba(220, 53, 69, 0.3);
}

body[data-theme="globalchat"] .btn-danger:hover {
    background: linear-gradient(45deg, #c82333, #bd2130);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(220, 53, 69, 0.4);
}

/* Frosted Glass Cards con colores GlobalChat */
body[data-theme="globalchat"] .frosted-glass-success {
    background: rgba(40, 167, 69, 0.85);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

body[data-theme="globalchat"] .frosted-glass-info {
    background: rgba(23, 162, 184, 0.85);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

body[data-theme="globalchat"] .frosted-glass-danger {
    background: rgba(220, 53, 69, 0.85);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

body[data-theme="globalchat"] .frosted-glass-warning {
    background: rgba(255, 193, 7, 0.85);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

body[data-theme="globalchat"] .frosted-glass-secondary {
    background: rgba(108, 117, 125, 0.85);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

body[data-theme="globalchat"] .frosted-glass-orange {
    background: rgba(255, 152, 0, 0.85);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

/* Formularios GlobalChat */
body[data-theme="globalchat"] .form-control {
    border: 2px solid rgba(111, 66, 193, 0.2);
    border-radius: var(--gc-border-radius);
    padding: 12px 16px;
    transition: all 0.3s ease;
}

body[data-theme="globalchat"] .form-control:focus {
    border-color: var(--gc-accent);
    box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25);
    outline: none;
}

/* Tablas GlobalChat */
body[data-theme="globalchat"] .table {
    background: var(--gc-bg-light);
    border-radius: var(--gc-border-radius);
}

body[data-theme="globalchat"] .table thead {
    background: linear-gradient(135deg, var(--gc-primary-dark) 0%, var(--gc-primary) 50%, var(--gc-primary-light) 100%);
    color: var(--gc-text-light);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
}

body[data-theme="globalchat"] .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(111, 66, 193, 0.05);
}

body[data-theme="globalchat"] .table-hover tbody tr:hover {
    background-color: rgba(111, 66, 193, 0.1);
    transform: scale(1.01);
    transition: all 0.2s ease;
}

/* Alertas GlobalChat */
body[data-theme="globalchat"] .alert {
    border-radius: var(--gc-border-radius);
    border: none;
    box-shadow: var(--gc-shadow);
}

body[data-theme="globalchat"] .alert-info {
    background: linear-gradient(45deg, rgba(23, 162, 184, 0.9), rgba(17, 132, 150, 0.9));
    color: var(--gc-text-light);
}

body[data-theme="globalchat"] .alert-success {
    background: linear-gradient(45deg, rgba(40, 167, 69, 0.9), rgba(32, 201, 151, 0.9));
    color: var(--gc-text-light);
}

body[data-theme="globalchat"] .alert-warning {
    background: linear-gradient(45deg, rgba(255, 193, 7, 0.9), rgba(255, 143, 0, 0.9));
    color: var(--gc-text-dark);
}

body[data-theme="globalchat"] .alert-danger {
    background: linear-gradient(45deg, rgba(220, 53, 69, 0.9), rgba(200, 35, 51, 0.9));
    color: var(--gc-text-light);
}

/* Badges GlobalChat */
body[data-theme="globalchat"] .badge-primary {
    background: var(--gc-primary);
    color: var(--gc-text-light);
}

body[data-theme="globalchat"] .badge-warning {
    background: var(--gc-accent);
    color: var(--gc-text-dark);
}

body[data-theme="globalchat"] .badge-success {
    background: #28a745;
    color: var(--gc-text-light);
}

body[data-theme="globalchat"] .badge-info {
    background: #17a2b8;
    color: var(--gc-text-light);
}

body[data-theme="globalchat"] .badge-danger {
    background: #dc3545;
    color: var(--gc-text-light);
}

/* Sidebar GlobalChat - Colores dinámicos */
body[data-theme="globalchat"] .w3-sidebar {
    background: linear-gradient(180deg, var(--gc-primary-dark) 0%, var(--gc-primary) 50%, var(--gc-primary-light) 100%) !important;
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.3);
}

body[data-theme="globalchat"] .list-group-item,
body[data-theme="globalchat"] .list-group-item-action,
body[data-theme="globalchat"] .big-page-item {
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.95) !important;
    transition: all 0.3s ease;
}

body[data-theme="globalchat"] .list-group-item:hover,
body[data-theme="globalchat"] .list-group-item-action:hover,
body[data-theme="globalchat"] .big-page-item:hover {
    background: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
    transform: translateX(5px);
    border-left: 3px solid var(--gc-accent);
}

body[data-theme="globalchat"] .list-group-item.active,
body[data-theme="globalchat"] .list-group-item-action.active {
    background: linear-gradient(90deg, var(--gc-accent) 0%, var(--gc-primary) 100%) !important;
    color: #2c3e50 !important;
    font-weight: 700;
    border-left: 4px solid var(--gc-primary-dark);
}

/* Navbar superior - Colores dinámicos */
body[data-theme="globalchat"] .navbar {
    background: linear-gradient(135deg, var(--gc-primary-dark) 0%, var(--gc-primary) 100%) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

body[data-theme="globalchat"] .navbar-brand {
    color: var(--gc-text-light) !important;
    font-weight: 600;
}

body[data-theme="globalchat"] .nav-link {
    color: rgba(255, 255, 255, 0.9) !important;
    transition: all 0.3s ease;
}

body[data-theme="globalchat"] .nav-link:hover {
    color: var(--gc-accent) !important;
    transform: translateY(-1px);
}

body[data-theme="globalchat"] .nav-link.active {
    color: var(--gc-accent) !important;
    font-weight: 600;
    border-bottom: 2px solid var(--gc-accent);
}

/* Links GlobalChat */
body[data-theme="globalchat"] a {
    color: var(--gc-primary);
    transition: all 0.3s ease;
}

body[data-theme="globalchat"] a:hover {
    color: var(--gc-accent-dark);
    text-decoration: none;
}

/* Títulos GlobalChat */
body[data-theme="globalchat"] h1,
body[data-theme="globalchat"] h2,
body[data-theme="globalchat"] h3,
body[data-theme="globalchat"] h4,
body[data-theme="globalchat"] h5 {
    color: var(--gc-primary-dark);
    font-weight: 600;
}

/* Scrollbar personalizado */
body[data-theme="globalchat"] ::-webkit-scrollbar {
    width: 10px;
}

body[data-theme="globalchat"] ::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 10px;
}

body[data-theme="globalchat"] ::-webkit-scrollbar-thumb {
    background: var(--gc-primary);
    border-radius: 10px;
}

body[data-theme="globalchat"] ::-webkit-scrollbar-thumb:hover {
    background: var(--gc-primary-dark);
}

/* Footer GlobalChat */
body[data-theme="globalchat"] footer {
    background: linear-gradient(135deg, var(--gc-primary-dark) 0%, var(--gc-primary) 100%) !important;
    border-top: 3px solid var(--gc-accent);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.2);
}

body[data-theme="globalchat"] footer small {
    color: rgba(255, 255, 255, 0.9) !important;
}

body[data-theme="globalchat"] footer code {
    background: rgba(255, 255, 255, 0.2);
    color: var(--gc-accent-light);
    padding: 2px 8px;
    border-radius: 4px;
}

/* Inputs y selects mejorados */
body[data-theme="globalchat"] select.form-control,
body[data-theme="globalchat"] textarea.form-control {
    border: 2px solid rgba(111, 66, 193, 0.2);
    border-radius: var(--gc-border-radius-sm);
    transition: var(--gc-transition);
}

body[data-theme="globalchat"] select.form-control:focus,
body[data-theme="globalchat"] textarea.form-control:focus {
    border-color: var(--gc-accent);
    box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25);
}

/* Dropdowns */
body[data-theme="globalchat"] .dropdown-menu {
    background: var(--gc-bg-card);
    border: 1px solid rgba(111, 66, 193, 0.2);
    border-radius: var(--gc-border-radius-sm);
    box-shadow: var(--gc-shadow);
    backdrop-filter: blur(10px);
}

body[data-theme="globalchat"] .dropdown-item {
    color: var(--gc-text-dark);
    transition: var(--gc-transition);
}

body[data-theme="globalchat"] .dropdown-item:hover {
    background: rgba(111, 66, 193, 0.1);
    color: var(--gc-primary-dark);
}

body[data-theme="globalchat"] .dropdown-item.active {
    background: linear-gradient(45deg, var(--gc-primary), var(--gc-primary-light));
    color: var(--gc-text-light);
}

/* Modales */
body[data-theme="globalchat"] .modal-content {
    background: var(--gc-bg-card);
    border-radius: var(--gc-border-radius);
    border: 1px solid rgba(111, 66, 193, 0.2);
    box-shadow: var(--gc-shadow-hover);
}

body[data-theme="globalchat"] .modal-header {
    background: linear-gradient(135deg, var(--gc-primary-dark) 0%, var(--gc-primary) 100%);
    color: var(--gc-text-light);
    border-radius: var(--gc-border-radius) var(--gc-border-radius) 0 0;
    border-bottom: 2px solid var(--gc-accent);
}

body[data-theme="globalchat"] .modal-header .close {
    color: var(--gc-text-light);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

/* Paginación */
body[data-theme="globalchat"] .page-link {
    color: var(--gc-primary);
    border-color: rgba(111, 66, 193, 0.2);
    transition: var(--gc-transition);
}

body[data-theme="globalchat"] .page-link:hover {
    background: rgba(111, 66, 193, 0.1);
    border-color: var(--gc-primary);
    color: var(--gc-primary-dark);
}

body[data-theme="globalchat"] .page-item.active .page-link {
    background: linear-gradient(45deg, var(--gc-primary), var(--gc-primary-light));
    border-color: var(--gc-primary);
    color: var(--gc-text-light);
}

/* Tooltips */
body[data-theme="globalchat"] .tooltip-inner {
    background: var(--gc-primary-dark);
    color: var(--gc-text-light);
    border-radius: var(--gc-border-radius-sm);
}

body[data-theme="globalchat"] .tooltip.bs-tooltip-top .arrow::before {
    border-top-color: var(--gc-primary-dark);
}

/* Búsqueda */
body[data-theme="globalchat"] #search_box {
    background: rgba(255, 255, 255, 0.95);
    border: 2px solid rgba(111, 66, 193, 0.2);
    border-radius: 25px;
    padding: 8px 20px;
    transition: var(--gc-transition);
}

body[data-theme="globalchat"] #search_box:focus {
    border-color: var(--gc-accent);
    box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25);
    background: var(--gc-bg-light);
}

/* Card container del dashboard */
body[data-theme="globalchat"] .card-container {
    background: transparent;
}

/* Mejoras para el fondo con efecto bokeh naranja */
body[data-theme="globalchat"]::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        radial-gradient(circle at 20% 50%, rgba(255, 152, 0, 0.2) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(255, 193, 7, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 40% 20%, rgba(255, 111, 0, 0.2) 0%, transparent 50%);
    pointer-events: none;
    z-index: -2;
}