/* Tema compartido por el portal público. Se carga después de los estilos aislados
   de Blazor para que el selector cambie la experiencia completa del Home. */
:root {
    --public-primary: var(--app-primary, #2563eb);
    --public-secondary: var(--app-secondary, #7c3aed);
    --public-bg: var(--app-bg, #f8fafc);
    --public-surface: var(--app-surface, #ffffff);
    --public-soft: var(--app-sidebar, #f1f5f9);
    --public-text: var(--app-text, #0f172a);
    --public-muted: var(--app-muted, #64748b);
    --public-border: var(--app-border, #e2e8f0);
    --public-footer: color-mix(in srgb, var(--app-gradient-end, #0f172a) 78%, #020617 22%);
    --public-header: color-mix(in srgb, var(--public-surface) 94%, transparent);
    --public-shadow: color-mix(in srgb, var(--public-text) 14%, transparent);
    --public-primary-soft: color-mix(in srgb, var(--public-primary) 11%, transparent);
    --public-secondary-soft: color-mix(in srgb, var(--public-secondary) 10%, transparent);
}

html,
body,
.lsoftmove-public-shell {
    background: var(--public-bg);
    color: var(--public-text);
}

.lsoftmove-public-header {
    border-bottom-color: var(--public-border);
    background: var(--public-header);
    box-shadow: 0 10px 34px var(--public-shadow);
}

.lsoftmove-public-nav a,
.lsoftmove-link-button {
    color: var(--public-text);
}

.lsoftmove-public-nav a::after,
.lsoftmove-gradient-button,
.lsoftmove-card-icon,
.lsoftmove-step-number,
.lsoftmove-application-info-icon,
.lsoftmove-back-to-top {
    background: linear-gradient(135deg, var(--public-primary), var(--public-secondary));
}

.lsoftmove-public-nav a:hover,
.lsoftmove-link-button:hover,
.lsoftmove-project-link,
.lsoftmove-contact-method .mud-icon-root,
.lsoftmove-reason .mud-icon-root {
    color: var(--public-primary);
}

.lsoftmove-outline-button {
    color: var(--public-text);
    border-color: color-mix(in srgb, var(--public-primary) 30%, var(--public-border));
    background: var(--public-surface);
}

.lsoftmove-hero {
    background:
        linear-gradient(90deg, var(--public-primary-soft) 1px, transparent 1px),
        linear-gradient(0deg, var(--public-primary-soft) 1px, transparent 1px),
        linear-gradient(135deg, var(--public-bg) 0%, var(--public-soft) 52%, color-mix(in srgb, var(--public-secondary) 9%, var(--public-bg)) 100%);
    background-size: 44px 44px, 44px 44px, auto;
}

.lsoftmove-hero::after {
    background: linear-gradient(135deg, transparent, var(--public-secondary-soft));
}

.lsoftmove-badge,
.lsoftmove-section-eyebrow {
    color: var(--public-primary);
    background: var(--public-primary-soft);
}

.lsoftmove-hero-title,
.lsoftmove-section-title,
.lsoftmove-section-dark .lsoftmove-section-title,
.lsoftmove-card h3,
.lsoftmove-contact-card h3,
.lsoftmove-contact-method strong,
.lsoftmove-stat strong,
.lsoftmove-sector-list li,
.lsoftmove-feature-list li,
.lsoftmove-reason,
.lsoftmove-step h3,
.lsoftmove-application-info-card strong {
    color: var(--public-text);
}

.lsoftmove-gradient-text {
    background: linear-gradient(135deg, var(--public-primary), var(--public-secondary));
    -webkit-background-clip: text;
    background-clip: text;
}

.lsoftmove-hero-subtitle,
.lsoftmove-section-description,
.lsoftmove-section-dark .lsoftmove-section-description,
.lsoftmove-card p,
.lsoftmove-stat span,
.lsoftmove-step p,
.lsoftmove-application-info-card span {
    color: var(--public-muted);
}

.lsoftmove-stat,
.lsoftmove-card,
.lsoftmove-sector-list li,
.lsoftmove-feature-list li,
.lsoftmove-reason,
.lsoftmove-step,
.lsoftmove-contact-card,
.lsoftmove-contact-method,
.lsoftmove-application-info-card {
    color: var(--public-text);
    border-color: var(--public-border);
    background: var(--public-surface);
    box-shadow: 0 16px 36px var(--public-shadow);
}

.lsoftmove-section-dark,
.lsoftmove-application-info {
    color: var(--public-text);
    border-color: var(--public-border);
    background:
        radial-gradient(circle at 10% 0%, var(--public-primary-soft), transparent 36%),
        radial-gradient(circle at 92% 18%, var(--public-secondary-soft), transparent 38%),
        var(--public-soft);
}

.lsoftmove-financing {
    background:
        radial-gradient(circle at 12% 28%, color-mix(in srgb, var(--public-primary) 48%, transparent), transparent 38%),
        radial-gradient(circle at 88% 18%, color-mix(in srgb, var(--public-secondary) 44%, transparent), transparent 42%),
        linear-gradient(135deg, var(--public-footer), color-mix(in srgb, var(--public-footer) 72%, var(--public-secondary) 28%));
}

.lsoftmove-contact-form input,
.lsoftmove-contact-form textarea {
    color: var(--public-text);
    border-color: var(--public-border);
    background: var(--public-surface);
}

.lsoftmove-contact-form input:focus,
.lsoftmove-contact-form textarea:focus {
    border-color: var(--public-primary);
    outline-color: var(--public-primary-soft);
}

.lsoftmove-chip-list span {
    color: var(--public-text);
    background: var(--public-primary-soft);
}

.lsoftmove-footer {
    background: var(--public-footer);
}

.lsoftmove-public-theme-selector {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: var(--public-primary);
}

.lsoftmove-public-theme-selector .theme-selector-trigger {
    width: 46px;
    height: 46px;
    color: var(--public-primary) !important;
    border: 1px solid var(--public-border);
    border-radius: 12px;
    background: var(--public-surface);
    box-shadow: 0 10px 24px var(--public-shadow);
}

.lsoftmove-public-theme-selector .theme-selector-trigger:hover {
    color: #fff !important;
    background: linear-gradient(135deg, var(--public-primary), var(--public-secondary));
}

.lsoftmove-public-quote-short {
    display: none;
}

/* El atributo adicional aumenta la especificidad frente a los estilos CSS
   aislados de Home.razor, evitando tarjetas blancas con texto claro. */
:root[data-theme="lsoftmove-dark"] .lsoftmove-stat,
:root[data-theme="lsoftmove-dark"] .lsoftmove-card,
:root[data-theme="lsoftmove-dark"] .lsoftmove-sector-list li,
:root[data-theme="lsoftmove-dark"] .lsoftmove-feature-list li,
:root[data-theme="lsoftmove-dark"] .lsoftmove-reason,
:root[data-theme="lsoftmove-dark"] .lsoftmove-step,
:root[data-theme="lsoftmove-dark"] .lsoftmove-contact-card,
:root[data-theme="lsoftmove-dark"] .lsoftmove-contact-method,
:root[data-theme="lsoftmove-dark"] .lsoftmove-application-info-card {
    color: #e8f0fb;
    border-color: #1a2d48;
    background: #0d1829;
    box-shadow: 0 18px 42px rgba(0, 0, 0, .30);
}

:root[data-theme="lsoftmove-dark"] .lsoftmove-card h3,
:root[data-theme="lsoftmove-dark"] .lsoftmove-contact-card h3,
:root[data-theme="lsoftmove-dark"] .lsoftmove-contact-method strong,
:root[data-theme="lsoftmove-dark"] .lsoftmove-stat strong,
:root[data-theme="lsoftmove-dark"] .lsoftmove-sector-list li,
:root[data-theme="lsoftmove-dark"] .lsoftmove-feature-list li,
:root[data-theme="lsoftmove-dark"] .lsoftmove-reason,
:root[data-theme="lsoftmove-dark"] .lsoftmove-step h3,
:root[data-theme="lsoftmove-dark"] .lsoftmove-application-info-card strong {
    color: #e8f0fb;
}

:root[data-theme="lsoftmove-dark"] .lsoftmove-card p,
:root[data-theme="lsoftmove-dark"] .lsoftmove-stat span,
:root[data-theme="lsoftmove-dark"] .lsoftmove-step p,
:root[data-theme="lsoftmove-dark"] .lsoftmove-application-info-card span {
    color: #9fb3ca;
}

:root[data-theme="lsoftmove-dark"] .lsoftmove-card-icon,
:root[data-theme="lsoftmove-dark"] .lsoftmove-step-number,
:root[data-theme="lsoftmove-dark"] .lsoftmove-application-info-icon {
    color: #ffffff;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    box-shadow: 0 10px 28px rgba(59, 130, 246, .28);
}

:root[data-theme="lsoftmove-dark"] .lsoftmove-project-link,
:root[data-theme="lsoftmove-dark"] .lsoftmove-contact-method .mud-icon-root,
:root[data-theme="lsoftmove-dark"] .lsoftmove-reason .mud-icon-root {
    color: #60a5fa;
}

:root[data-theme="lsoftmove-dark"] .lsoftmove-chip-list span {
    color: #dbeafe;
    border: 1px solid rgba(96, 165, 250, .20);
    background: rgba(59, 130, 246, .13);
}

:root[data-theme="lsoftmove-dark"] .lsoftmove-contact-form input,
:root[data-theme="lsoftmove-dark"] .lsoftmove-contact-form textarea {
    color: #e8f0fb;
    border-color: #1a2d48;
    background: #101d31;
}

:root[data-theme="lsoftmove-dark"] .lsoftmove-contact-form input::placeholder,
:root[data-theme="lsoftmove-dark"] .lsoftmove-contact-form textarea::placeholder {
    color: #7892ae;
}

:root[data-theme="lsoftmove-dark"] .lsoftmove-section-dark,
:root[data-theme="lsoftmove-dark"] .lsoftmove-application-info {
    border-color: #1a2d48;
    background:
        radial-gradient(circle at 10% 0%, rgba(59, 130, 246, .12), transparent 36%),
        radial-gradient(circle at 92% 18%, rgba(139, 92, 246, .12), transparent 38%),
        #091426;
}

@media (max-width: 680px) {
    .lsoftmove-public-actions {
        gap: 8px;
    }

    .lsoftmove-public-actions .lsoftmove-link-button {
        font-size: .88rem;
    }

    .lsoftmove-public-quote {
        min-height: 42px;
        padding: 10px 14px;
        font-size: .88rem;
    }

    .lsoftmove-public-theme-selector .theme-selector-trigger {
        width: 42px;
        height: 42px;
    }
}

@media (max-width: 430px) {
    .lsoftmove-public-quote-full {
        display: none;
    }

    .lsoftmove-public-quote-short {
        display: inline;
    }
}