/*
Theme Name: Cosiato Hub
Theme URI: https://cosiato.com/
Author: Cosiato Apps
Author URI: https://cosiato.com/
Description: Plantilla oficial estilo dark glassmorphism para el ecosistema de aplicaciones y servicios de Cosiato.
Version: 1.0.1
*/

:root {
  --cosiato-bg: #090b14;
  --cosiato-surface: rgba(18, 24, 38, 0.7);
  --cosiato-border: rgba(255, 255, 255, 0.08);
  --cosiato-accent: #00f0ff;
  --cosiato-magenta: #d946ef;
  --cosiato-primary: #8b5cf6;
  --cosiato-text: #f8fafc;
  --cosiato-muted: #94a3b8;
}

/* 1. Reset Global Forzado a Ancho Completo */
html,
body {
  width: 100vw !important;
  min-width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  background-color: var(--cosiato-bg);
  color: var(--cosiato-text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  min-height: 100vh;
  box-sizing: border-box;
}

*, *::before, *::after {
  box-sizing: inherit;
}

/* 2. Anulación de Contenedores Restrictivos de WordPress */
.wp-site-blocks,
#page,
.site,
.site-content,
.entry-content,
.wp-block-group {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block;
}

/* Prevenir que el Admin Bar de WordPress corte el layout */
html {
  margin-top: 0 !important;
}
body.admin-bar {
  min-height: calc(100vh - 32px);
}

/* 3. Componentes Glassmorphism */
.glass-nav {
  background: rgba(9, 11, 20, 0.85);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--cosiato-border);
}

.glass-card {
  background: var(--cosiato-surface);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--cosiato-border);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.glass-card:hover {
  border-color: var(--cosiato-accent);
  box-shadow: 0 0 25px rgba(0, 240, 255, 0.15);
  transform: translateY(-4px);
}

/* 4. Envoltorio Fluido */
.full-width-section {
  width: 100% !important;
  max-width: 100% !important;
  display: flex;
  justify-content: center;
}