/* ═══════════════════════════════════════════════════════════════
   CORPORATE THEME - MHP / MP ANALYZE
   Tipografias: SYNE (titulos) + MANROPE (body)
   Paleta: #18192d #c9de77 #014e44 #ffffff
   Botones CTA: #c9de77 (lima) con texto #18192d
   ═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&family=Manrope:wght@300;400;500;600;700;800&display=swap');

:root {
    --font-heading: 'Syne', sans-serif;
    --font-body: 'Manrope', sans-serif;
    --corp-navy: #18192d;
    --corp-green: #014e44;
    --corp-lime: #c9de77;
    --corp-white: #ffffff;
    --corp-btn-bg: #c9de77;
    --corp-btn-hover: #b5cc5e;
    --corp-btn-text: #18192d;
}

/* === TIPOGRAFIA BASE === */

body {
    font-family: 'Manrope', sans-serif !important;
    color: #18192d;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .corp-heading {
    font-family: 'Syne', sans-serif !important;
    letter-spacing: -0.02em;
}

/* Syne SOLO para títulos/headings grandes, NO para números/stats */
h1[class*="text-2xl"], h2[class*="text-2xl"], h3[class*="text-2xl"],
h1[class*="text-3xl"], h2[class*="text-3xl"], h3[class*="text-3xl"],
h1[class*="text-4xl"], h2[class*="text-4xl"], h3[class*="text-4xl"],
h1[class*="text-5xl"], h2[class*="text-5xl"], h3[class*="text-5xl"],
h1[class*="text-6xl"], h2[class*="text-6xl"], h3[class*="text-6xl"] {
    font-family: 'Syne', sans-serif !important;
}

h1.font-bold, h1.font-semibold,
h2.font-bold, h2.font-semibold,
h3.font-bold, h3.font-semibold {
    font-family: 'Syne', sans-serif !important;
}

p, span, a, li, td, th, label, input, select, textarea, button, .corp-body {
    font-family: 'Manrope', sans-serif !important;
}

/* === GRISES -> NAVY (#18192d) === */

.bg-gray-900, .bg-slate-900 { background-color: #0d0e1a !important; }
.bg-gray-800, .bg-slate-800 { background-color: #18192d !important; }
.bg-gray-700, .bg-slate-700 { background-color: #1f2042 !important; }
.bg-gray-600, .bg-slate-600 { background-color: #282a54 !important; }
.bg-gray-500, .bg-slate-500 { background-color: #353768 !important; }
.bg-gray-200, .bg-slate-200 { background-color: #d1d2e0 !important; }
.bg-gray-100, .bg-slate-100 { background-color: #eeeef4 !important; }
.bg-gray-50, .bg-slate-50 { background-color: #eeeef4 !important; }

.text-gray-900, .text-slate-900 { color: #18192d !important; }
.text-gray-800, .text-slate-800 { color: #18192d !important; }
.text-gray-700, .text-slate-700 { color: #1f2042 !important; }
.text-gray-600, .text-slate-600 { color: #353768 !important; }
.text-gray-500, .text-slate-500 { color: #4d5080 !important; }
.text-gray-400, .text-slate-400 { color: #7275a0 !important; }

.border-gray-100, .border-slate-100 { border-color: #eeeef4 !important; }
.border-gray-200, .border-slate-200 { border-color: #d1d2e0 !important; }
.border-gray-300, .border-slate-300 { border-color: #a3a5c2 !important; }

/* === AZULES TAILWIND -> NAVY === */

.bg-blue-700 { background-color: #0d0e1a !important; }
.bg-blue-600 { background-color: #18192d !important; }
.bg-blue-500 { background-color: #1f2042 !important; }
.text-blue-600 { color: #18192d !important; }
.text-blue-500 { color: #1f2042 !important; }
.text-blue-400 { color: #353768 !important; }
.border-blue-600 { border-color: #18192d !important; }
.bg-blue-50 { background-color: #eeeef4 !important; }
.bg-blue-100 { background-color: #d1d2e0 !important; }

/* === VERDES TAILWIND -> VERDE OSCURO === */

.bg-green-600, .bg-emerald-600 { background-color: #014e44 !important; }
.bg-green-500, .bg-emerald-500 { background-color: #026558 !important; }
.text-green-600, .text-emerald-600 { color: #014e44 !important; }
.text-green-500, .text-emerald-500 { color: #026558 !important; }
.bg-green-50, .bg-emerald-50 { background-color: #ecfaf8 !important; }
.bg-green-100, .bg-emerald-100 { background-color: #d0f1ec !important; }

/* === GRADIENTES CORPORATIVOS === */

.hero-gradient, .corp-hero {
    background: linear-gradient(135deg, #0d0e1a 0%, #18192d 50%, #282a54 100%) !important;
}

/* ═══════════════════════════════════════════════════════════════
   BOTONES CTA: #c9de77 (LIMA) + TEXTO #18192d (NAVY)
   ═══════════════════════════════════════════════════════════════ */

.corp-btn-primary, .analyze-btn,
.corp-btn-cta, .corp-btn-success {
    background: #c9de77 !important;
    color: #18192d !important;
    font-family: 'Manrope', sans-serif !important;
    font-weight: 700;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: all 150ms ease;
}

.corp-btn-primary:hover, .analyze-btn:hover,
.corp-btn-cta:hover, .corp-btn-success:hover {
    background: #b5cc5e !important;
    color: #18192d !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(201, 222, 119, 0.4);
}

.corp-btn-secondary {
    background: transparent !important;
    color: #18192d !important;
    font-family: 'Manrope', sans-serif !important;
    font-weight: 500;
    border: 1.5px solid #a3a5c2 !important;
    border-radius: 8px;
    cursor: pointer;
    transition: all 150ms ease;
}

.corp-btn-secondary:hover {
    background: #eeeef4 !important;
    border-color: #18192d !important;
}

/* --- Botones grises oscuros -> Lima --- */
button.bg-gray-900, button.bg-gray-800, button.bg-gray-700,
button[class*="bg-gray-900"], button[class*="bg-gray-800"], button[class*="bg-gray-700"],
a.bg-gray-900, a.bg-gray-800, a.bg-gray-700,
input[type="submit"].bg-gray-900, input[type="submit"].bg-gray-800 {
    background-color: #c9de77 !important;
    background-image: none !important;
    color: #18192d !important;
}

button.bg-gray-900:hover, button.bg-gray-800:hover, button.bg-gray-700:hover,
button[class*="bg-gray-900"]:hover, button[class*="bg-gray-800"]:hover, button[class*="bg-gray-700"]:hover,
a.bg-gray-900:hover, a.bg-gray-800:hover, a.bg-gray-700:hover {
    background-color: #b5cc5e !important;
    color: #18192d !important;
}

/* --- Botones azules -> Lima --- */
button.bg-blue-600, button.bg-blue-500,
button[class*="bg-blue-600"], button[class*="bg-blue-500"],
a.bg-blue-600, a.bg-blue-500 {
    background-color: #c9de77 !important;
    background-image: none !important;
    color: #18192d !important;
}

button.bg-blue-600:hover, button.bg-blue-500:hover,
button[class*="bg-blue-600"]:hover, button[class*="bg-blue-500"]:hover,
a.bg-blue-600:hover, a.bg-blue-500:hover {
    background-color: #b5cc5e !important;
    color: #18192d !important;
}

/* --- Botones cyan -> Lima --- */
button.bg-cyan-500, button.bg-cyan-600,
button[class*="bg-cyan-500"], button[class*="bg-cyan-600"] {
    background-color: #c9de77 !important;
    background-image: none !important;
    color: #18192d !important;
}

button.bg-cyan-500:hover, button.bg-cyan-600:hover {
    background-color: #b5cc5e !important;
    color: #18192d !important;
}

/* --- Botones indigo -> Lima --- */
button.bg-indigo-600, button.bg-indigo-500,
button[class*="bg-indigo-600"], button[class*="bg-indigo-500"] {
    background-color: #c9de77 !important;
    background-image: none !important;
    color: #18192d !important;
}

button.bg-indigo-600:hover, button.bg-indigo-500:hover {
    background-color: #b5cc5e !important;
    color: #18192d !important;
}

/* --- Gradientes en botones -> Lima solido --- */
button[class*="from-cyan-"], button[class*="from-blue-"],
button[class*="from-emerald-"], button[class*="from-green-"],
button[class*="from-indigo-"], button[class*="from-purple-"] {
    background: #c9de77 !important;
    background-image: none !important;
    color: #18192d !important;
}

button[class*="from-cyan-"]:hover, button[class*="from-blue-"]:hover,
button[class*="from-emerald-"]:hover, button[class*="from-green-"]:hover,
button[class*="from-indigo-"]:hover, button[class*="from-purple-"]:hover {
    background: #b5cc5e !important;
    background-image: none !important;
    color: #18192d !important;
}

/* --- Botones verdes Tailwind -> Lima --- */
button.bg-green-600, button.bg-green-500,
button[class*="bg-green-600"], button[class*="bg-green-500"],
button.bg-emerald-600, button.bg-emerald-500 {
    background-color: #c9de77 !important;
    color: #18192d !important;
}

button.bg-green-600:hover, button.bg-green-500:hover,
button.bg-emerald-600:hover, button.bg-emerald-500:hover {
    background-color: #b5cc5e !important;
    color: #18192d !important;
}

/* --- Shadows de botones --- */
button[class*="shadow-cyan"] { --tw-shadow-color: rgba(201, 222, 119, 0.3) !important; }
button[class*="shadow-blue"] { --tw-shadow-color: rgba(201, 222, 119, 0.3) !important; }
button[class*="shadow-gray-300"] { --tw-shadow-color: rgba(201, 222, 119, 0.25) !important; }
button[class*="shadow-emerald"] { --tw-shadow-color: rgba(201, 222, 119, 0.3) !important; }
button[class*="shadow-green"] { --tw-shadow-color: rgba(201, 222, 119, 0.3) !important; }

/* --- .btn-primary global --- */
.btn-primary, button.btn-primary, a.btn-primary, input[type="submit"].btn-primary {
    background: #c9de77 !important;
    background-image: none !important;
    color: #18192d !important;
}

.btn-primary:hover, button.btn-primary:hover, a.btn-primary:hover {
    background: #b5cc5e !important;
    background-image: none !important;
    color: #18192d !important;
}

/* --- continue-btn, register-btn, login-btn, submit-btn --- */
.continue-btn, .register-btn, .submit-btn, .login-btn,
button[type="submit"]:not(.btn-secondary):not(.btn-cancel) {
    background: #c9de77 !important;
    background-image: none !important;
    color: #18192d !important;
}

.continue-btn:hover, .register-btn:hover, .submit-btn:hover, .login-btn:hover,
button[type="submit"]:not(.btn-secondary):not(.btn-cancel):hover {
    background: #b5cc5e !important;
    background-image: none !important;
    color: #18192d !important;
}

/* === SIDEBAR === */

.analyze-sidebar {
    background: #ffffff !important;
    border-right: 1px solid #e5e7eb !important;
}

.analyze-sidebar .sidebar-item,
.analyze-sidebar a,
.analyze-sidebar .nav-link {
    color: #18192d !important;
    font-family: 'Manrope', sans-serif !important;
    transition: all 150ms ease;
}

.analyze-sidebar .sidebar-item:hover,
.analyze-sidebar a:hover,
.analyze-sidebar .nav-link:hover {
    color: #18192d !important;
    background: #f3f4f6 !important;
}

.analyze-sidebar .sidebar-item.active,
.analyze-sidebar .nav-link.active {
    color: #18192d !important;
    background: #f0f5d8 !important;
    border-left: 3px solid #c9de77 !important;
}

.analyze-sidebar i,
.analyze-sidebar .fa,
.analyze-sidebar [class*="fa-"] {
    color: #014e44 !important;
    opacity: 0.8;
}

.analyze-sidebar .sidebar-item:hover i,
.analyze-sidebar .sidebar-item.active i {
    color: #014e44 !important;
    opacity: 1;
}

/* === HEADER === */

header .text-xl.font-bold,
header .text-lg.font-bold,
nav .text-xl.font-bold {
    font-family: 'Syne', sans-serif !important;
    color: #18192d !important;
}

/* === CARDS === */

.analyze-card, .corp-card {
    background: #ffffff;
    border: 1px solid #d1d2e0;
    border-radius: 10px;
    box-shadow: 0 1px 2px 0 rgba(24, 25, 45, 0.06);
    transition: all 250ms ease;
}

.analyze-card:hover, .corp-card:hover {
    box-shadow: 0 4px 6px -1px rgba(24, 25, 45, 0.08);
    border-color: #a3a5c2;
}

/* === INPUTS === */

input[type="text"], input[type="email"], input[type="password"],
input[type="number"], input[type="tel"], input[type="search"],
textarea, select {
    font-family: 'Manrope', sans-serif !important;
    border-color: #d1d2e0 !important;
    border-radius: 6px !important;
    transition: all 150ms ease;
}

input:focus, textarea:focus, select:focus {
    border-color: #c9de77 !important;
    box-shadow: 0 0 0 3px rgba(201, 222, 119, 0.2) !important;
    outline: none !important;
}

/* === BADGES === */

[class*="bg-amber-"], [class*="bg-yellow-"] {
    background-color: #c9de77 !important;
    color: #18192d !important;
}

.text-yellow-400, .text-amber-400, .text-yellow-500 {
    color: #abc43d !important;
}

/* === INDIGO -> NAVY === */

.bg-indigo-600, .bg-indigo-500 { background-color: #1f2042 !important; }
.text-indigo-600, .text-indigo-500 { color: #1f2042 !important; }
.bg-indigo-50 { background-color: #eeeef4 !important; }

/* === LINKS === */

a { color: #014e44; transition: color 150ms ease; }
a:hover { color: #026558; }

/* === TABLAS === */

table th {
    font-family: 'Syne', sans-serif !important;
    font-weight: 600;
    color: #1f2042;
    background: #eeeef4;
}

table td {
    font-family: 'Manrope', sans-serif !important;
    color: #18192d;
}

/* === MODALES === */

.modal-header, .modal-title { font-family: 'Syne', sans-serif !important; }
.modal-body { font-family: 'Manrope', sans-serif !important; }

/* === PACKAGE GRID - EQUAL HEIGHT BUTTONS === */

/* Each column stretches to fill the grid row */
.grid.lg\:grid-cols-4 > div.rounded-2xl {
    display: flex;
    flex-direction: column;
}

/* The inner container with buttons stretches to fill the column */
.grid.lg\:grid-cols-4 > div.rounded-2xl > .p-3.space-y-3 {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* All package buttons equal height within their column */
.grid.lg\:grid-cols-4 > div.rounded-2xl > .p-3.space-y-3 > .package-btn {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* === UTILIDADES === */

.corp-bg-navy { background-color: #18192d !important; }
.corp-bg-green { background-color: #014e44 !important; }
.corp-bg-lime { background-color: #c9de77 !important; }
.corp-text-navy { color: #18192d !important; }
.corp-text-green { color: #014e44 !important; }
.corp-text-lime { color: #c9de77 !important; }

/* === SCROLLBAR === */

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #eeeef4; }
::-webkit-scrollbar-thumb { background: #a3a5c2; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #4d5080; }

/* === RESPONSIVE === */

@media (max-width: 768px) {
    h1 { font-size: 1.75rem !important; }
    h2 { font-size: 1.5rem !important; }
    h3 { font-size: 1.25rem !important; }
}

@media print {
    body { font-family: 'Manrope', sans-serif !important; }
    h1, h2, h3, h4, h5, h6 { font-family: 'Syne', sans-serif !important; }
}
