/* =============================================================
   Emprendapp · UI v5 — ajustes de ubicación + modo claro renovado
   Se carga último: solo sobreescribe.
   ============================================================= */

/* ---------- 1. Botón de tema con su propio espacio ---------- */
.landing-nav__acciones { gap: 12px; }
.landing-nav__acciones .boton-tema { margin-left: 10px; }
.landing-nav__acciones .boton-tema::before {
    content: ""; position: absolute; left: -12px; top: 20%; height: 60%;
    width: 1px; background: var(--panel-borde);
}
.boton-tema { position: relative; flex-shrink: 0; }
/* En la app: a la otra punta de la barra, no pegado al título */
.topbar { gap: 16px; }
.topbar .boton-tema { margin-left: auto; }

/* ---------- 2. Pie de página: textos a la izquierda, logo abajo a la derecha ---------- */
.landing-footer { text-align: left; padding: 36px 0; }
.landing-footer__inner {
    flex-direction: row !important; align-items: flex-end !important;
    justify-content: space-between; gap: 24px;
}
.landing-footer__texto { display: flex; flex-direction: column; gap: 6px; }
img.landing-footer__logo { margin: 0 !important; height: 32px !important; }

/* ---------- 3. Celular: encabezado con aire ---------- */
@media (max-width: 640px) {
    .landing-nav { padding: 12px 0; }
    .landing-nav__inner {
        display: grid !important; grid-template-columns: 1fr;
        row-gap: 12px; padding: 0 16px !important;
    }
    img.landing-nav__logo { height: 28px !important; max-width: 160px; justify-self: start; }
    .landing-nav__acciones { display: grid !important; grid-template-columns: 1fr 1fr auto; gap: 10px !important; width: 100%; }
    .landing-nav__acciones .boton { justify-content: center; padding: 10px 12px !important; font-size: 14px !important; }
    .landing-nav__acciones .boton-tema { margin-left: 8px; width: 42px; height: 42px; }
    .landing-nav__acciones .boton-tema::before { left: -10px; }
    .landing-hero { padding-top: 150px !important; }

    .landing-footer__inner { flex-direction: column !important; align-items: flex-start !important; }
    img.landing-footer__logo { align-self: flex-end; }
}

/* ---------- 4. Modo claro con personalidad ---------- */
:root[data-theme="light"] {
    --fondo:        #eef4fa;
    --fondo-2:      #f8fbfe;
    --panel:        rgba(255, 255, 255, 0.78);
    --panel-solido: #ffffff;
    --panel-borde:  rgba(31, 111, 120, 0.16);
    --texto:        #13203a;
    --texto-tenue:  #475570;
    --acento:       #1677b8;
    --acento-2:     #12a3b4;
    --gradiente:    linear-gradient(135deg, #1f6f78 0%, #1a7fc0 55%, #19b4c6 100%);
    --acento-tenue: rgba(25, 150, 190, 0.12);
    --glass-blur:   14px;
    --glass-sombra: 0 1px 2px rgba(22, 60, 100, .06), 0 14px 34px -12px rgba(26, 110, 170, .22);
}
:root[data-theme="light"] body {
    background:
        radial-gradient(900px 520px at 100% -5%, rgba(51, 214, 230, .22), transparent 60%),
        radial-gradient(800px 500px at -10% 30%, rgba(244, 167, 185, .18), transparent 60%),
        radial-gradient(900px 600px at 50% 110%, rgba(45, 156, 219, .14), transparent 60%),
        var(--fondo);
    background-attachment: fixed;
}
/* Paneles tipo vidrio con un filo de color arriba */
:root[data-theme="light"] .panel,
:root[data-theme="light"] .auth-card,
:root[data-theme="light"] .tarjeta-landing,
:root[data-theme="light"] .tarjeta-diseno,
:root[data-theme="light"] .modal {
    border: 1px solid rgba(255, 255, 255, .9);
    box-shadow: var(--glass-sombra), inset 0 1px 0 rgba(255, 255, 255, .9);
    position: relative;
}
:root[data-theme="light"] .panel::before,
:root[data-theme="light"] .tarjeta-landing::before {
    content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
    border-radius: inherit; border-bottom-left-radius: 0; border-bottom-right-radius: 0;
    background: var(--gradiente); opacity: .85; pointer-events: none;
}
:root[data-theme="light"] .tarjeta-landing { transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
:root[data-theme="light"] .tarjeta-landing:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 44px -16px rgba(26, 127, 192, .35);
}
/* Campos con fondo suave y foco cian */
:root[data-theme="light"] .campo input,
:root[data-theme="light"] .campo select,
:root[data-theme="light"] .campo textarea {
    background: #f6fafd; border-color: #cfdcea;
}
:root[data-theme="light"] .campo input:focus,
:root[data-theme="light"] .campo select:focus {
    background: #fff; border-color: #19a7c0; box-shadow: 0 0 0 4px rgba(25, 167, 192, .16);
}
/* Etiquetas flotantes: el recorte toma el color del panel */
:root[data-theme="light"] .campo--flotante label { background: #fff; }
/* Botones */
:root[data-theme="light"] .boton--primario {
    background: var(--gradiente); background-size: 160% 100%;
    box-shadow: 0 10px 24px -10px rgba(26, 127, 192, .7);
    transition: background-position .5s var(--ease), transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
:root[data-theme="light"] .boton--primario:hover { background-position: 100% 0; box-shadow: 0 14px 30px -10px rgba(25, 167, 192, .75); }
:root[data-theme="light"] .boton--secundario { background: rgba(255, 255, 255, .7); border-color: #c9d8e8; }
:root[data-theme="light"] .boton-tema { background: #fff; border-color: #cfdcea; box-shadow: 0 4px 14px -6px rgba(26, 127, 192, .4); }
/* Barra superior, menú lateral y encabezado al hacer scroll */
:root[data-theme="light"] .landing-nav.landing-nav--scrolled,
:root[data-theme="light"] .topbar {
    background: rgba(248, 251, 254, .82); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
:root[data-theme="light"] .sidebar {
    background: linear-gradient(180deg, #ffffff 0%, #eaf3fa 100%);
    border-right: 1px solid var(--panel-borde);
}
:root[data-theme="light"] .sidebar__link.is-active {
    background: linear-gradient(90deg, rgba(25, 167, 192, .16), rgba(25, 167, 192, 0));
    color: #136a9e; font-weight: 600;
}
:root[data-theme="light"] .sidebar__link:hover { background: rgba(25, 150, 190, .07); }
/* Destellos del inicio más visibles */
:root[data-theme="light"] .landing-hero__glow { opacity: 1; filter: saturate(1.4); }
:root[data-theme="light"] .texto-gradiente {
    background: linear-gradient(120deg, #1f6f78, #1a7fc0 50%, #19b4c6);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}
/* Pie oscuro-suave para cerrar la página */
:root[data-theme="light"] .landing-footer {
    background: linear-gradient(180deg, rgba(255,255,255,.5), #e3eef7); border-top-color: #cfdcea;
}
/* Precio sugerido destacado */
:root[data-theme="light"] .precio, :root[data-theme="light"] [class*="precio-final"] {
    background: linear-gradient(120deg, #1f6f78, #1a7fc0); -webkit-background-clip: text; background-clip: text; color: transparent;
}