/* ═══════════════════════════════════════════════════════════════════════════
   ImóvelManager — Custom Stylesheet
   ═══════════════════════════════════════════════════════════════════════════ */

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

/* ── Root variables ──────────────────────────────────────────────────────── */
:root {
    --primary:        #0d6efd;
    --sidebar-width:  225px;
    --topnav-height:  56px;
    --sidebar-bg:     #212529;
    --sidebar-fg:     #adb5bd;
    --body-bg:        #f8f9fc;
    --card-radius:    .75rem;
    --transition:     .2s ease-in-out;
    --shadow-sm:      0 1px 4px rgba(0,0,0,.08);
    --shadow:         0 4px 16px rgba(0,0,0,.1);
    --shadow-lg:      0 8px 32px rgba(0,0,0,.14);
}

/* ── Base ─────────────────────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing: border-box; }

body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    background-color: var(--body-bg);
    font-size: .925rem;
    -webkit-font-smoothing: antialiased;
}

/* ── Scrollbar ────────────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #dee2e6; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #adb5bd; }

/* ── Layout (Sidebar + Top Nav) ──────────────────────────────────────────── */
.sb-nav-fixed #layoutSidenav {
    display: flex;
}

.sb-nav-fixed #layoutSidenav #layoutSidenav_nav {
    flex-basis: var(--sidebar-width);
    flex-shrink: 0;
    transition: transform var(--transition);
    z-index: 1038;
    /* No transform here — transform on an ancestor breaks position:fixed on .sb-sidenav */
}

.sb-nav-fixed #layoutSidenav #layoutSidenav_content {
    flex-grow: 1;
    min-width: 0;
    transition: margin var(--transition);
}

.sb-nav-fixed .sb-topnav {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1039;
    height: var(--topnav-height);
}

body.sb-nav-fixed {
    padding-top: var(--topnav-height);
}

.sb-nav-fixed #layoutSidenav {
    min-height: calc(100vh - var(--topnav-height));
}

.sb-nav-fixed #layoutSidenav_content {
    min-height: calc(100vh - var(--topnav-height));
}

/* ── Sidebar Nav ─────────────────────────────────────────────────────────── */
.sb-sidenav {
    display: flex;
    flex-direction: column;
    height: 100%;
    flex-wrap: nowrap;
    background-color: var(--sidebar-bg);
    position: fixed;
    top: var(--topnav-height);
    width: var(--sidebar-width);
    overflow-y: auto;
    overflow-x: hidden;
}

.sb-sidenav .sb-sidenav-menu { flex-grow: 1; }
.sb-sidenav .sb-sidenav-menu .nav { flex-direction: column; flex-wrap: nowrap; }

.sb-sidenav-dark .sb-sidenav-menu-heading {
    color: #506070;
    font-size: .65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    padding: 1.2rem 1rem .4rem;
}

.sb-sidenav-dark .nav-link {
    color: var(--sidebar-fg);
    padding: .55rem 1rem;
    border-left: 3px solid transparent;
    transition: all var(--transition);
    display: flex;
    align-items: center;
    font-size: .875rem;
}

.sb-sidenav-dark .nav-link:hover {
    color: #fff;
    background: rgba(255,255,255,.06);
}

.sb-sidenav-dark .nav-link.active {
    color: #fff;
    border-left-color: var(--primary);
    background: rgba(13,110,253,.15);
}

.sb-nav-link-icon {
    width: 1.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sb-sidenav-footer {
    padding: 1rem;
    border-top: 1px solid rgba(255,255,255,.08);
    color: #6c757d;
    font-size: .75rem;
}

/* ── Top Nav ─────────────────────────────────────────────────────────────── */
.sb-topnav .navbar-brand { font-size: 1.1rem; font-weight: 800; letter-spacing: -.02em; }

/* ── Cards ───────────────────────────────────────────────────────────────── */
.card {
    border-radius: var(--card-radius);
    transition: box-shadow var(--transition);
}
.card.shadow-sm { box-shadow: var(--shadow-sm) !important; }
.card:hover.unit-card { box-shadow: var(--shadow) !important; }

/* ── Unit Action Cards ───────────────────────────────────────────────────── */
.unit-action-card {
    transition: all var(--transition);
    border-radius: var(--card-radius) !important;
}
.unit-action-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow) !important;
}

/* ── Buttons ─────────────────────────────────────────────────────────────── */
.btn { border-radius: .5rem; font-weight: 500; }
.btn-sm { border-radius: .4rem; }
.btn-lg { border-radius: .65rem; }

/* ── Forms ───────────────────────────────────────────────────────────────── */
.form-control, .form-select {
    border-radius: .5rem;
    border-color: #dee2e6;
    transition: border-color var(--transition), box-shadow var(--transition);
}
.form-control:focus, .form-select:focus {
    border-color: #86b7fe;
    box-shadow: 0 0 0 .25rem rgba(13,110,253,.15);
}

/* ── Auth page ───────────────────────────────────────────────────────────── */
.auth-bg {
    background: linear-gradient(135deg, #0d6efd22 0%, #6f42c122 50%, #198754 200%);
    min-height: 100vh;
}
.auth-card { border-radius: 1.25rem !important; }
.auth-logo i { font-size: 3rem; }

/* ── Checklist ───────────────────────────────────────────────────────────── */
.checklist-row {
    transition: background var(--transition);
}
.checklist-row:hover { background: rgba(13,110,253,.03); }

/* ── Kanban ──────────────────────────────────────────────────────────────── */
.kanban-board { align-items: flex-start; }
.kanban-column .card { border-radius: var(--card-radius) !important; }
.task-card { border-radius: .6rem !important; }
.task-card:active { cursor: grabbing; }

/* ── Progress bar ────────────────────────────────────────────────────────── */
.progress { border-radius: 50px; overflow: hidden; }
.progress-bar { border-radius: 50px; }

/* ── Badges ──────────────────────────────────────────────────────────────── */
.badge { font-weight: 600; border-radius: .4rem; }
.badge-sm { font-size: .65rem; min-width: 16px; min-height: 16px; }

/* ── Tables ──────────────────────────────────────────────────────────────── */
.table > :not(caption) > * > * { padding: .75rem 1rem; vertical-align: middle; }
.table thead th { font-weight: 600; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: #6c757d; }

/* ── Timeline / Activity ─────────────────────────────────────────────────── */
.activity-icon { transition: background var(--transition); }

/* ── Notification dropdown ───────────────────────────────────────────────── */
.dropdown-menu-notifications { min-width: 320px; max-height: 360px; overflow-y: auto; }

/* ── Photo cards ─────────────────────────────────────────────────────────── */
.photo-overlay { transition: opacity var(--transition), background var(--transition); }

/* ── Podium ──────────────────────────────────────────────────────────────── */
.podium-card { transition: transform var(--transition), box-shadow var(--transition); }
.podium-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg) !important; }

/* ── Alerts ──────────────────────────────────────────────────────────────── */
.alert { border-radius: var(--card-radius); border: none; }

/* ── Input group ─────────────────────────────────────────────────────────── */
.input-group .input-group-text { border-radius: .5rem 0 0 .5rem; }
.input-group .form-control:last-child { border-radius: 0 .5rem .5rem 0; }
.input-group .btn:last-child { border-radius: 0 .5rem .5rem 0; }

/* ── Dropdown ────────────────────────────────────────────────────────────── */
.dropdown-menu {
    border: none;
    border-radius: var(--card-radius);
    box-shadow: var(--shadow);
    animation: fadeIn .15s ease;
}
@keyframes fadeIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

.dropdown-item { font-size: .875rem; border-radius: .4rem; margin: 1px .25rem; padding: .4rem .75rem; }
.dropdown-item:hover { background: rgba(13,110,253,.08); color: var(--primary); }
.dropdown-item.text-danger:hover { background: rgba(220,53,69,.08); }

/* ── Modal ───────────────────────────────────────────────────────────────── */
.modal-content { border-radius: 1rem; border: none; }
.modal-header { border-radius: 1rem 1rem 0 0; }

/* ── Spinner loading ─────────────────────────────────────────────────────── */
.loading { opacity: .5; pointer-events: none; }

/* ── Inset helper ────────────────────────────────────────────────────────── */
.inset-0 { top: 0; left: 0; right: 0; bottom: 0; }

/* ── Overflow horizontal scroll ──────────────────────────────────────────── */
.overflow-x-auto { overflow-x: auto; }

/* ── Star rating ─────────────────────────────────────────────────────────── */
.star-label:hover ~ .star-label { opacity: .3; }

/* ── Print ───────────────────────────────────────────────────────────────── */
@media print {
    .sb-topnav, .sb-sidenav, .btn, form { display: none !important; }
    #layoutSidenav_content { padding-top: 0 !important; }
    .card { box-shadow: none !important; border: 1px solid #dee2e6 !important; }
}

/* ── Responsive: collapse sidebar on mobile ──────────────────────────────── */
@media (max-width: 991.98px) {
    .sb-nav-fixed #layoutSidenav #layoutSidenav_nav {
        transform: translateX(calc(-1 * var(--sidebar-width)));
    }

    .sb-nav-fixed #layoutSidenav.toggled #layoutSidenav_nav {
        transform: translateX(0);
    }

    .sb-nav-fixed #layoutSidenav.toggled #layoutSidenav_content::before {
        content: '';
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.5);
        z-index: 1037;
    }
}

/* ── Color utils ─────────────────────────────────────────────────────────── */
.bg-primary-subtle { background-color: rgba(13,110,253,.1); }
.bg-success-subtle { background-color: rgba(25,135,84,.1); }
.bg-warning-subtle { background-color: rgba(255,193,7,.1); }
.bg-danger-subtle  { background-color: rgba(220,53,69,.1); }
.bg-info-subtle    { background-color: rgba(13,202,240,.1); }

.text-purple { color: #6f42c1 !important; }
.bg-purple   { background-color: #6f42c1 !important; }

/* ── Transition utility ──────────────────────────────────────────────────── */
.transition-all { transition: all var(--transition); }

/* ── Quote comparison highlight ──────────────────────────────────────────── */
.quote-best { background: rgba(25,135,84,.06); border-left: 3px solid #198754 !important; }
