/*
 * Loop Gestão — tema por cima do Filament.
 * Identidade Loopmarcas: lima #DAFC00 sobre escuro #0E100C, claro #F4F4EF.
 * Letras: Plus Jakarta Sans (texto) e Instrument Serif itálico (destaques).
 */

:root {
    --lg-lime: #dafc00;
    --lg-ink: #0e100c;
    --lg-paper: #f4f4ef;
    --lg-radius: 1rem;
    --lg-surface: #ffffff;
    --lg-line: rgb(14 16 12 / .08);
    --lg-muted: #6b6e62;
}
.dark {
    --lg-surface: #16180f;
    --lg-line: rgb(255 255 255 / .07);
    --lg-muted: #9a9d90;
}

/* ---------- Base ---------- */
.fi-body { background: var(--lg-paper); }
.dark .fi-body { background: var(--lg-ink); }
.fi-body, .fi-body input, .fi-body button, .fi-body select, .fi-body textarea { letter-spacing: -.005em; }

.lg-serif {
    font-family: 'Instrument Serif', Georgia, serif;
    font-style: italic;
    font-weight: 400;
    letter-spacing: 0;
}

/* ---------- Marca no topo ---------- */
.lg-brand { display: inline-flex; align-items: center; gap: .6rem; font-weight: 800; font-size: 1.15rem; letter-spacing: -.02em; color: var(--lg-ink); white-space: nowrap; }
.dark .lg-brand { color: #fff; }
.lg-brand img { height: 1.35rem; width: auto; }
.lg-brand .lg-serif { font-size: 1.3rem; color: #6b7d00; margin-left: .1rem; }
.dark .lg-brand .lg-serif { color: var(--lg-lime); }
/* Logótipo da agência: direto na barra lateral, sem fundo, ajustado à largura. */
.lg-tenant-logo { display: flex; align-items: center; height: 2.5rem; width: 100%; background: none; padding: 0; }
.lg-tenant-logo img { display: block; height: 100%; width: auto; max-width: 100%; object-fit: contain; object-position: left center; }

/* Seletor de agências: só o nome, sem imagem. */
.fi-tenant-menu .fi-tenant-avatar,
.fi-tenant-menu-item .fi-dropdown-list-item-image { display: none !important; }
.fi-tenant-menu-trigger-tenant-name { font-weight: 700; }
/* A barra lateral é sempre escura: o texto do seletor fica claro também no modo claro. */
.fi-sidebar .fi-tenant-menu-trigger,
.fi-sidebar .fi-tenant-menu-trigger-tenant-name { color: #fff !important; }
.fi-sidebar .fi-tenant-menu-trigger-current-tenant-label,
.fi-sidebar .fi-tenant-menu-trigger svg { color: rgb(255 255 255 / .5) !important; }

/* ---------- Barra lateral (sempre escura, como a marca) ---------- */
.fi-sidebar { background: var(--lg-ink) !important; border-right: 1px solid rgb(255 255 255 / .06); }
.fi-sidebar .fi-sidebar-header { background: transparent !important; box-shadow: none !important; border-bottom: 1px solid rgb(255 255 255 / .06); }
.fi-sidebar .lg-brand { color: #fff; }
.fi-sidebar .lg-brand .lg-serif { color: var(--lg-lime); }
.fi-sidebar .fi-sidebar-group-label { color: rgb(255 255 255 / .38) !important; text-transform: uppercase; font-size: .68rem; letter-spacing: .09em; font-weight: 700; }
.fi-sidebar .fi-sidebar-item-btn { border-radius: .7rem; color: rgb(255 255 255 / .72); transition: background .15s, color .15s; }
.fi-sidebar .fi-sidebar-item-btn :is(.fi-sidebar-item-label, svg) { color: inherit !important; }
.fi-sidebar .fi-sidebar-item-btn:hover { background: rgb(255 255 255 / .06) !important; color: #fff; }
.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn { background: var(--lg-lime) !important; color: var(--lg-ink) !important; font-weight: 700; }
.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn :is(.fi-sidebar-item-label, svg) { color: var(--lg-ink) !important; }
.fi-sidebar .fi-tenant-menu-trigger { color: #fff; border-radius: .8rem; }
.fi-sidebar .fi-tenant-menu-trigger:hover { background: rgb(255 255 255 / .06); }
.fi-sidebar :is(.fi-icon-btn, .fi-sidebar-group-collapse-btn) { color: rgb(255 255 255 / .45); }
.fi-sidebar-nav { scrollbar-color: rgb(255 255 255 / .15) transparent; }

/* Cabeçalho da barra lateral com o logótipo */
.fi-sidebar .fi-sidebar-header { min-height: 4.5rem; padding-top: 1rem; padding-bottom: 1rem; }
.fi-sidebar .fi-sidebar-header-logo-ctn { flex: 1; min-width: 0; }
.fi-sidebar .fi-sidebar-header-logo-ctn > a { display: block; }

/* Seta de encolher à direita do logótipo. */
.fi-sidebar.fi-sidebar-open .fi-sidebar-header { display: flex; align-items: center; gap: .5rem; }
.fi-sidebar .fi-sidebar-close-collapse-sidebar-btn { order: 99; margin-left: auto; flex-shrink: 0; }

/* Barra recolhida: logótipo compacto por cima do botão de abrir. */
.fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-header { flex-direction: column; align-items: center; justify-content: center; gap: .6rem; padding-left: .5rem; padding-right: .5rem; }
.lg-logo-mini { order: -1; display: flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; }
.lg-logo-mini img { max-width: 100%; max-height: 100%; object-fit: contain; }
.fi-sidebar .lg-tenant-logo { height: 2.6rem; }

/* Pesquisa e menu do utilizador (agora na barra lateral) */
.fi-sidebar .fi-input-wrp { background: rgb(255 255 255 / .06) !important; box-shadow: 0 0 0 1px rgb(255 255 255 / .08) !important; }
.fi-sidebar .fi-input-wrp input { color: #fff !important; }
.fi-sidebar .fi-input-wrp input::placeholder, .fi-sidebar .fi-input-wrp svg { color: rgb(255 255 255 / .45) !important; }
.fi-sidebar .fi-sidebar-footer { border-top: 1px solid rgb(255 255 255 / .06); }
.fi-sidebar .fi-user-menu-trigger, .fi-sidebar .fi-user-menu-trigger-text { color: rgb(255 255 255 / .85) !important; }
.fi-sidebar .fi-user-menu-trigger:hover { background: rgb(255 255 255 / .06); }

/* ---------- Topo ---------- */
.fi-topbar, .fi-topbar > nav {
    background: color-mix(in srgb, var(--lg-paper) 82%, transparent) !important;
    backdrop-filter: saturate(1.4) blur(10px);
    box-shadow: none !important;
    border-bottom: 1px solid var(--lg-line);
}
.dark .fi-topbar, .dark .fi-topbar > nav { background: color-mix(in srgb, var(--lg-ink) 82%, transparent) !important; }

/* ---------- Cabeçalhos ---------- */
.fi-header-heading { font-weight: 800; letter-spacing: -.035em; font-size: clamp(1.75rem, 2.6vw, 2.35rem); line-height: 1.1; }
.fi-header-heading .lg-serif { font-size: 1.12em; color: #6b7d00; }
.dark .fi-header-heading .lg-serif { color: var(--lg-lime); }
.fi-header-subheading { color: var(--lg-muted); font-size: 1rem; }

/* ---------- Cartões, secções e tabelas ---------- */
:is(.fi-section, .fi-ta-ctn, .fi-wi-stats-overview-stat) {
    border-radius: var(--lg-radius) !important;
    background: var(--lg-surface);
    box-shadow: 0 0 0 1px var(--lg-line), 0 1px 2px rgb(14 16 12 / .04) !important;
}
.dark :is(.fi-section, .fi-ta-ctn, .fi-wi-stats-overview-stat) { box-shadow: 0 0 0 1px var(--lg-line) !important; }

/* Indicadores do "Hoje" */
.fi-wi-stats-overview-stat { position: relative; overflow: hidden; transition: transform .15s, box-shadow .15s; }
.fi-wi-stats-overview-stat:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px var(--lg-line), 0 10px 24px rgb(14 16 12 / .08) !important; }
.fi-wi-stats-overview-stat-value { font-weight: 800; letter-spacing: -.04em; font-size: 2.4rem !important; }
.fi-wi-stats-overview-stat:first-child::after {
    content: ""; position: absolute; inset: auto -30% -60% auto; width: 9rem; height: 9rem; border-radius: 999px;
    background: radial-gradient(circle, rgb(218 252 0 / .28), transparent 70%); pointer-events: none;
}

/* Botões */
.fi-btn { border-radius: .75rem; font-weight: 700; }

/* ---------- Página de entrada / registo ---------- */
.fi-simple-layout {
    background:
        radial-gradient(60rem 30rem at 85% -10%, rgb(218 252 0 / .22), transparent 60%),
        radial-gradient(40rem 30rem at -10% 110%, rgb(218 252 0 / .10), transparent 60%),
        var(--lg-ink) !important;
}
.fi-simple-main {
    border-radius: 1.5rem !important;
    background: #16180f !important;
    box-shadow: 0 0 0 1px rgb(255 255 255 / .08), 0 30px 80px rgb(0 0 0 / .45) !important;
}
.fi-simple-main .lg-brand { color: #fff; font-size: 1.35rem; }
.fi-simple-main .lg-brand img { height: 1.6rem; }
.fi-simple-main .lg-brand .lg-serif { color: var(--lg-lime); font-size: 1.55rem; }
.fi-simple-header-heading { font-weight: 800; letter-spacing: -.03em; }

/* ---------- Publicações em cartões ---------- */
.lg-post-card { border-left: 4px solid var(--lg-c, var(--primary-500)); padding-left: .85rem; min-height: 9.5rem; }
.lg-post-caption { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Fila horizontal: os cartões deslizam para o lado. */
.fi-ta-content-grid:has(.lg-post-card) {
    display: flex !important;
    flex-wrap: nowrap;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    padding: 1rem !important;
    scrollbar-width: thin;
    scrollbar-color: rgb(127 127 127 / .35) transparent;
}
.fi-ta-content-grid:has(.lg-post-card) > .fi-ta-record {
    flex: 0 0 19rem;
    scroll-snap-align: start;
    border-radius: var(--lg-radius);
    box-shadow: 0 0 0 1px var(--lg-line);
}
@media (max-width: 640px) {
    .fi-ta-content-grid:has(.lg-post-card) > .fi-ta-record { flex-basis: 85%; }
}

/* ---------- Quadro e calendário: acertos com a marca ---------- */
.lg-col { border-radius: 1.1rem !important; }
.lg-card { border-radius: .8rem !important; }
.lg-day.is-today .lg-day-num { background: var(--lg-lime) !important; color: var(--lg-ink) !important; }
.lg-avatar { background: var(--lg-lime) !important; color: var(--lg-ink) !important; }
