/* Ceiba Foods - Sistema de diseño moderno */
:root {
  --ceiba-primary: #06b6d4;
  --ceiba-primary-hover: #0891b2;
  --ceiba-primary-light: #ecfeff;
  --ceiba-primary-glow: rgba(6, 182, 212, 0.25);
  --ceiba-green: #10b981;
  --ceiba-green-hover: #059669;
  --ceiba-green-light: #d1fae5;
  --ceiba-accent: #34d399;
  --ceiba-accent-hover: #10b981;
  --ceiba-sidebar: #0f172a;
  --ceiba-sidebar-hover: #1e293b;
  --ceiba-sidebar-accent: linear-gradient(135deg, #06b6d4 0%, #10b981 100%);
  --font-montserrat: 'Montserrat', -apple-system, sans-serif;
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.07), 0 2px 4px -2px rgb(0 0 0 / 0.05);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.08), 0 4px 6px -4px rgb(0 0 0 / 0.05);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.06), 0 8px 10px -6px rgb(0 0 0 / 0.04);
  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.25rem;
  --transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

body {
  font-family: var(--font-montserrat) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Utilidades Ceiba */
.text-ceiba-blue { color: var(--ceiba-primary) !important; }
.hover\:text-ceiba-blue:hover { color: var(--ceiba-primary) !important; }
.bg-ceiba-blue { background-color: var(--ceiba-primary) !important; }
.bg-ceiba-green-light { background-color: var(--ceiba-green-light) !important; }
.bg-ceiba-green-light\/10 { background-color: rgba(16, 185, 129, 0.1) !important; }
.text-ceiba-green-light { color: var(--ceiba-green) !important; }
.text-ceiba-green-dark { color: var(--ceiba-green) !important; }
.border-ceiba-green-light { border-color: var(--ceiba-accent) !important; }
.border-ceiba-green-light\/40 { border-color: rgba(52, 211, 153, 0.4) !important; }
.hover\:bg-ceiba-green-dark:hover { background-color: var(--ceiba-green-hover) !important; }
.hover\:bg-ceiba-blue:hover { background-color: var(--ceiba-primary-hover) !important; }

/* Animaciones suaves */
.ceiba-transition {
  transition: all var(--transition);
}

/* Cards elevadas con hover */
.ceiba-card {
  transition: box-shadow var(--transition), transform var(--transition);
}
.ceiba-card:hover {
  box-shadow: var(--shadow-lg);
}