/* ==========================================================
   INMOBLO DESIGN SYSTEM V1
   Tipografía: Bootstrap / system-ui
   Iconografía: Bootstrap Icons
   Branding derivado del logotipo Inmoblo
   ========================================================== */

:root {
    --inmoblo-teal: #2fbd99;
    --inmoblo-teal-dark: #24977c;
    --inmoblo-teal-soft: #e9f8f4;

    --inmoblo-orange: #f49a1f;
    --inmoblo-orange-soft: #fff3e2;

    --inmoblo-magenta: #ea1551;
    --inmoblo-magenta-soft: #fdeaf0;

    --inmoblo-ink: #263548;
    --inmoblo-muted: #6f7a89;
    --inmoblo-page: #f7f9fb;
    --inmoblo-border: #e6ebef;

    --inmoblo-radius-sm: .65rem;
    --inmoblo-radius: 1rem;
    --inmoblo-radius-lg: 1.35rem;

    --inmoblo-shadow-sm: 0 .25rem 1rem rgba(38,53,72,.055);
    --inmoblo-shadow: 0 .75rem 2rem rgba(38,53,72,.08);

    --bs-primary: var(--inmoblo-teal);
    --bs-primary-rgb: 47, 189, 153;
    --bs-link-color: var(--inmoblo-teal-dark);
    --bs-link-hover-color: var(--inmoblo-teal);
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-color: var(--inmoblo-ink);
    --bs-body-bg: var(--inmoblo-page);
}

body {
    font-family: var(--bs-font-sans-serif);
}

.btn {
    --bs-btn-border-radius: .75rem;
    font-weight: 600;
}

.btn-primary {
    --bs-btn-bg: var(--inmoblo-teal);
    --bs-btn-border-color: var(--inmoblo-teal);
    --bs-btn-hover-bg: var(--inmoblo-teal-dark);
    --bs-btn-hover-border-color: var(--inmoblo-teal-dark);
    --bs-btn-active-bg: var(--inmoblo-teal-dark);
    --bs-btn-active-border-color: var(--inmoblo-teal-dark);
}

.btn-inmoblo-orange {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--inmoblo-orange);
    --bs-btn-border-color: var(--inmoblo-orange);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #df8612;
    --bs-btn-hover-border-color: #df8612;
}

.btn-inmoblo-magenta {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--inmoblo-magenta);
    --bs-btn-border-color: var(--inmoblo-magenta);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #ca0f43;
    --bs-btn-hover-border-color: #ca0f43;
}

.form-control,
.form-select {
    border-radius: .75rem;
    border-color: var(--inmoblo-border);
    min-height: 46px;
}

textarea.form-control {
    min-height: auto;
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(47,189,153,.75);
    box-shadow: 0 0 0 .25rem rgba(47,189,153,.13);
}

.card {
    border-radius: var(--inmoblo-radius);
}

.inmoblo-logo {
    display: block;
    width: auto;
    max-width: 180px;
    height: 46px;
    object-fit: contain;
}

.inmoblo-logo-lg {
    max-width: 240px;
    height: auto;
}

.inmoblo-brand-panel {
    min-height: 100%;
    background:
        radial-gradient(circle at 18% 15%, rgba(244,154,31,.22), transparent 24%),
        radial-gradient(circle at 88% 22%, rgba(234,21,81,.17), transparent 24%),
        linear-gradient(145deg, #f3fffb 0%, #e8f8f3 45%, #ffffff 100%);
}

.inmoblo-auth-page {
    min-height: 100vh;
    background: #fff;
}

.inmoblo-auth-card {
    border: 1px solid var(--inmoblo-border);
    box-shadow: var(--inmoblo-shadow);
    border-radius: var(--inmoblo-radius-lg);
}

.inmoblo-auth-icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    background: var(--inmoblo-teal-soft);
    color: var(--inmoblo-teal-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
}

.inmoblo-kicker {
    color: var(--inmoblo-teal-dark);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    font-size: .75rem;
}

.inmoblo-soft-teal {
    background: var(--inmoblo-teal-soft);
}

.inmoblo-soft-orange {
    background: var(--inmoblo-orange-soft);
}

.inmoblo-soft-magenta {
    background: var(--inmoblo-magenta-soft);
}

.inmoblo-accent-line {
    width: 58px;
    height: 5px;
    border-radius: 99px;
    background: linear-gradient(
        90deg,
        var(--inmoblo-magenta) 0 34%,
        var(--inmoblo-orange) 34% 66%,
        var(--inmoblo-teal) 66% 100%
    );
}

.inmoblo-brand-bullet {
    display: flex;
    gap: .9rem;
    align-items: flex-start;
}

.inmoblo-brand-bullet .icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    box-shadow: var(--inmoblo-shadow-sm);
    color: var(--inmoblo-teal-dark);
}

.alert {
    border-radius: .85rem;
}

.badge {
    border-radius: .55rem;
}

@media (max-width: 991.98px) {
    .inmoblo-brand-panel {
        min-height: auto;
    }
}