/**
 * RECITTY THEME - Estilos Principales
 * Archivo unificado que importa todos los módulos del tema
 * 
 * Este tema implementa la identidad corporativa de Recitty para CKAN
 * usando la paleta de colores: #FF9800 (naranja), #D8C3A5 (beige)
 * 
 * @author Recitty Team
 * @version 1.0.0
 */

/* Importar Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* ========================================
   MÓDULOS DEL TEMA
   ======================================== */

/* Variables CSS y sistema de diseño */
@import url('recitty-variables.css');

/* Estilos base (reset, tipografía, utilidades) */
@import url('recitty-base.css');

/* Componentes reutilizables (botones, cards, badges, forms) */
@import url('recitty-components.css');

/* Header corporativo y navegación */
@import url('recitty-header.css');

/* Home page (hero, stats, featured) */
@import url('recitty-home.css');

/* Footer corporativo */
@import url('recitty-footer.css');

/* ========================================
   ESTILOS ESPECÍFICOS DE CKAN
   ======================================== */

/* Ocultar versión de CKAN */
.footer .ckan-version,
.footer .ckan-footer-logo,
.footer-links li:last-child {
  display: none !important;
}

/* Aplicar tipografía Recitty a elementos CKAN */
.account-masthead,
.masthead,
.site-footer {
  font-family: var(--recitty-font-body);
}

/* Estilizar el buscador de CKAN */
.search-form {
  background: var(--recitty-bg-primary);
  border: 2px solid var(--recitty-gray-200);
  border-radius: var(--recitty-radius-lg);
  padding: var(--recitty-space-4);
}

.search-form .search-input {
  border: 2px solid var(--recitty-gray-300);
  border-radius: var(--recitty-radius-md);
  padding: var(--recitty-space-3) var(--recitty-space-4);
  font-family: var(--recitty-font-body);
}

.search-form .search-input:focus {
  border-color: var(--recitty-primary);
  box-shadow: 0 0 0 3px rgba(255, 152, 0, 0.15);
}

.search-form .btn-primary {
  background-color: var(--recitty-primary);
  border-color: var(--recitty-primary);
  border-radius: var(--recitty-radius-md);
  font-weight: var(--recitty-font-medium);
}

.search-form .btn-primary:hover {
  background-color: var(--recitty-primary-dark);
  border-color: var(--recitty-primary-dark);
}

/* Estilizar facetes */
.nav-facet .nav-item a {
  color: var(--recitty-gray-600);
  border-radius: var(--recitty-radius-md);
  padding: var(--recitty-space-2) var(--recitty-space-3);
}

.nav-facet .nav-item a:hover {
  background-color: var(--recitty-primary-50);
  color: var(--recitty-primary-dark);
}

.nav-facet .nav-item.active a {
  background-color: var(--recitty-primary);
  color: var(--recitty-white);
}

/* Estilizar tags */
.tag {
  display: inline-flex;
  align-items: center;
  padding: var(--recitty-space-1) var(--recitty-space-3);
  background-color: var(--recitty-primary-50);
  color: var(--recitty-primary-dark);
  border-radius: var(--recitty-radius-full);
  font-size: var(--recitty-text-xs);
  font-weight: var(--recitty-font-medium);
  text-decoration: none;
  transition: all var(--recitty-transition-fast);
}

.tag:hover {
  background-color: var(--recitty-primary);
  color: var(--recitty-white);
}

/* Estilizar modulos/datasets */
.module-content {
  background-color: var(--recitty-white);
  border-radius: var(--recitty-radius-lg);
  border: 1px solid var(--recitty-gray-200);
  box-shadow: var(--recitty-shadow-sm);
  margin: var(--recitty-space-4) var(--recitty-space-2);
}

.module-heading {
  background-color: var(--recitty-gray-50);
  border-bottom: 1px solid var(--recitty-gray-200);
  padding: var(--recitty-space-4) var(--recitty-space-6);
  font-weight: var(--recitty-font-semibold);
  color: var(--recitty-dark);
}

/* Estilizar items de dataset */
.dataset-item {
  border-bottom: 1px solid var(--recitty-gray-200);
  padding: var(--recitty-space-6);
  transition: background-color var(--recitty-transition-fast);
}

.dataset-item:hover {
  background-color: var(--recitty-gray-50);
}

.dataset-heading a {
  color: var(--recitty-dark);
  font-weight: var(--recitty-font-semibold);
}

.dataset-heading a:hover {
  color: var(--recitty-primary);
  text-decoration: none;
}

/* Estilizar organizaciones */
.media-item {
  border: 1px solid var(--recitty-gray-200);
  border-radius: var(--recitty-radius-lg);
  transition: all var(--recitty-transition-normal);
}

.media-item:hover {
  border-color: var(--recitty-primary);
  box-shadow: var(--recitty-shadow-md);
  transform: translateY(-2px);
}

.media-view-heading {
  font-weight: var(--recitty-font-semibold);
  color: var(--recitty-dark);
}

/* Estilizar paginación */
.pagination ul li a {
  color: var(--recitty-gray-600);
  border: 1px solid var(--recitty-gray-300);
  border-radius: var(--recitty-radius-md);
  padding: var(--recitty-space-2) var(--recitty-space-4);
  margin: 0 var(--recitty-space-1);
  transition: all var(--recitty-transition-fast);
}

.pagination ul li a:hover {
  background-color: var(--recitty-primary-50);
  border-color: var(--recitty-primary);
  color: var(--recitty-primary-dark);
}

.pagination ul li.active a {
  background-color: var(--recitty-primary);
  border-color: var(--recitty-primary);
  color: var(--recitty-white);
}

/* Estilizar breadcrumbs */
.breadcrumb {
  background-color: transparent;
  padding: var(--recitty-space-4) 0;
  font-size: var(--recitty-text-sm);
}

.breadcrumb li a {
  color: var(--recitty-gray-500);
}

.breadcrumb li a:hover {
  color: var(--recitty-primary);
}

.breadcrumb li.active {
  color: var(--recitty-dark);
  font-weight: var(--recitty-font-medium);
}

/* Estilizar flash messages */
.flash-messages .alert {
  border-radius: var(--recitty-radius-lg);
  border-left: 4px solid;
  padding: var(--recitty-space-4) var(--recitty-space-6);
}

.flash-messages .alert-success {
  background-color: var(--recitty-success-light);
  border-color: var(--recitty-success);
  color: #2E7D32;
}

.flash-messages .alert-error {
  background-color: var(--recitty-error-light);
  border-color: var(--recitty-error);
  color: #C62828;
}

.flash-messages .alert-warning {
  background-color: var(--recitty-warning-light);
  border-color: var(--recitty-warning);
  color: #B78B00;
}

.flash-messages .alert-info {
  background-color: var(--recitty-info-light);
  border-color: var(--recitty-info);
  color: #1565C0;
}

/* Estilizar dropdowns */
.dropdown-menu {
  border: 1px solid var(--recitty-gray-200);
  border-radius: var(--recitty-radius-lg);
  box-shadow: var(--recitty-shadow-lg);
  padding: var(--recitty-space-2);
}

.dropdown-menu li a {
  padding: var(--recitty-space-3) var(--recitty-space-4);
  border-radius: var(--recitty-radius-md);
  color: var(--recitty-gray-700);
  font-size: var(--recitty-text-sm);
}

.dropdown-menu li a:hover {
  background-color: var(--recitty-gray-100);
  color: var(--recitty-dark);
}

/* Estilizar modales */
.modal-content {
  border: none;
  border-radius: var(--recitty-radius-xl);
  box-shadow: var(--recitty-shadow-2xl);
}

.modal-header {
  border-bottom: 1px solid var(--recitty-gray-200);
  padding: var(--recitty-space-6);
}

.modal-title {
  font-weight: var(--recitty-font-semibold);
  color: var(--recitty-dark);
}

.modal-body {
  padding: var(--recitty-space-6);
}

.modal-footer {
  border-top: 1px solid var(--recitty-gray-200);
  padding: var(--recitty-space-4) var(--recitty-space-6);
}

/* Estilizar tabs */
.nav-tabs {
  border-bottom: 2px solid var(--recitty-gray-200);
}

.nav-tabs li a {
  padding: var(--recitty-space-3) var(--recitty-space-6);
  color: var(--recitty-gray-600);
  font-weight: var(--recitty-font-medium);
  border: none;
  border-bottom: 2px solid transparent;
  margin-right: var(--recitty-space-2);
}

.nav-tabs li a:hover {
  background-color: var(--recitty-gray-50);
  color: var(--recitty-dark);
  border-bottom-color: var(--recitty-gray-300);
}

.nav-tabs li.active a {
  color: var(--recitty-primary);
  border-bottom-color: var(--recitty-primary);
  background-color: transparent;
}

/* Estilizar tooltips */
.tooltip-inner {
  background-color: var(--recitty-dark);
  color: var(--recitty-white);
  border-radius: var(--recitty-radius-md);
  padding: var(--recitty-space-2) var(--recitty-space-3);
  font-size: var(--recitty-text-xs);
}

/* ========================================
   RESPONSIVE OVERRIDES
   ======================================== */
@media (max-width: 768px) {
  /* Ajustar padding en móvil */
  .module-content {
    border-radius: 0;
    border-left: none;
    border-right: none;
  }
  
  /* Ajustar dataset items */
  .dataset-item {
    padding: var(--recitty-space-4);
  }
  
  /* Ajustar paginación */
  .pagination ul li a {
    padding: var(--recitty-space-2);
    margin: 0 2px;
  }
}
