/*
 * Admin Panel — theme improvements
 * Loaded globally via app.blade.php (after argon.min.css and app.css).
 * Additive-only: extends Argon, does not replace it.
 */

/* ----------------------------------------------------------------
   Sidebar brand — text fallback when no logo image is configured
   ---------------------------------------------------------------- */

.navbar-vertical .navbar-brand .lw-brand-text {
    font-weight: 800;
    font-size: 1.25rem;
    letter-spacing: -0.02em;
    color: var(--wj-green-deep, #0b4a3c);
    text-decoration: none;
    display: block;
    padding: 0.5rem 0;
}

/* Hide broken-image placeholder for any img with empty src in brand */
.navbar-vertical .navbar-brand img[src=""],
.navbar-vertical .navbar-brand img:not([src]) {
    display: none;
}

/* ----------------------------------------------------------------
   Sidebar container
   ---------------------------------------------------------------- */

.navbar-vertical.navbar-light.bg-white.lw-sidebar-container {
    border-right: 1px solid #e2e8e4;
    box-shadow: 2px 0 8px rgba(15, 36, 29, 0.05);
}

/* Brand area padding */
.navbar-vertical .navbar-brand {
    padding: 1rem 1rem 0.75rem;
}

/* ----------------------------------------------------------------
   Nav items
   ---------------------------------------------------------------- */

.navbar-vertical .navbar-nav .nav-item .nav-link {
    font-size: 0.875rem;
    font-weight: 500;
    color: #475569;
    border-radius: 8px;
    margin: 1px 8px;
    padding: 0.55rem 0.85rem;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.navbar-vertical .navbar-nav .nav-item .nav-link:hover {
    background-color: var(--wj-green-soft, #e7f5ec);
    color: var(--wj-green-deep, #0b4a3c);
}

.navbar-vertical .navbar-nav .nav-item .nav-link.active,
.navbar-vertical .navbar-nav .nav-item.active > .nav-link {
    background-color: var(--wj-green-soft, #e7f5ec);
    color: var(--wj-green-deep, #0b4a3c);
    font-weight: 600;
}

/* Sub-menu items */
.navbar-vertical .navbar-nav .nav-sm .nav-link {
    font-size: 0.82rem;
    padding: 0.4rem 0.75rem;
    color: #64748b;
    border-radius: 6px;
    margin: 1px 8px;
}

.navbar-vertical .navbar-nav .nav-sm .nav-link:hover,
.navbar-vertical .navbar-nav .nav-sm .nav-link.active {
    background-color: var(--wj-green-soft, #e7f5ec);
    color: var(--wj-green-deep, #0b4a3c);
}

/* Override the heavier indent baked into app.css's compiled .lw-expandable-nav
   rule — the connector line (custom-styles.blade.php) already indents the
   whole sub-menu block, so the link itself doesn't need extra padding-left. */
.navbar-nav .lw-expandable-nav .nav .nav-item .nav-link {
    padding-left: 0.75rem !important;
}

/* Icons in nav links */
.navbar-vertical .navbar-nav .nav-link i,
.navbar-vertical .navbar-nav .nav-link .fa,
.navbar-vertical .navbar-nav .nav-link .fas,
.navbar-vertical .navbar-nav .nav-link .fab {
    width: 1.25rem;
    text-align: center;
    color: inherit;
    opacity: 0.75;
}

/* ----------------------------------------------------------------
   Top auth navbar (the green header bar)
   ---------------------------------------------------------------- */

#navbar-main {
    background: linear-gradient(90deg, var(--wj-green-deep, #0b4a3c) 0%, var(--wj-green, #1fae5b) 100%) !important;
}

/* ----------------------------------------------------------------
   Sidebar brand text fallback — also applies to the collapsed brand
   ---------------------------------------------------------------- */

.lw-sidebar-logo-normal,
.lw-sidebar-logo-small {
    max-height: 40px;
    width: auto;
}

/* ----------------------------------------------------------------
   Responsividade — 1366–1440px
   ---------------------------------------------------------------- */

/*
 * Nos cards de estatísticas (painel do vendor), o .h2 padrão do Argon (~2rem)
 * quebra "R$ 13.335,00" em 3 linhas quando a sidebar ocupa ~250px e os
 * cards ficam com ~260-280px de largura. Reduzindo para 1.3rem resolve
 * sem alterar o design em telas grandes.
 */
@media (max-width: 1440px) {
    .card-stats .h2,
    .card-stats span.h2 {
        font-size: 1.3rem !important;
        line-height: 1.25;
        word-break: break-word;
    }

    /* Título do card (uppercase label) — reduz e permite 2 linhas */
    .card-stats .card-title {
        font-size: 0.6rem !important;
        line-height: 1.3;
    }

    /* Ícone circular — reduz levemente */
    .card-stats .icon.icon-shape {
        width: 2.5rem !important;
        height: 2.5rem !important;
        font-size: 0.85rem;
    }

    /* Padding interno dos cards */
    .card-stats .card-body {
        padding: 0.85rem 1rem !important;
    }

    /*
     * Saudação "Olá Dra X," — o Argon usa display-2 = 3.5rem nesta classe,
     * o que consome ~120px de altura preciosa em 768px de viewport.
     * Reduzir para 1.75rem libera espaço sem perder a hierarquia visual.
     */
    .lw-page-title.display-2,
    h1.lw-page-title {
        font-size: 1.75rem !important;
        margin-top: 0.5rem !important;
        margin-bottom: 0.5rem !important;
    }

    /*
     * Header do painel de stats (cards.blade.php) — reduz só o padding BOTTOM.
     * NÃO tocamos no padding-top: ele serve para clarear a navbar fixa/sticky
     * (pt-5 = 3rem, pt-lg-6 = 4.5rem). Removê-lo causa sobreposição de título.
     */
    .header.pb-5 {
        padding-bottom: 1.5rem !important;
    }

    /* "header-body" abriga os cards — remove margem extra */
    .header-body .mb-4 {
        margin-bottom: 0.75rem !important;
    }
}

/* Em telas <= 1280px, comprime ainda mais */
@media (max-width: 1280px) {
    .card-stats .h2,
    .card-stats span.h2 {
        font-size: 1.15rem !important;
    }
    .card-stats .card-title {
        font-size: 0.55rem !important;
    }
    .lw-page-title.display-2,
    h1.lw-page-title {
        font-size: 1.5rem !important;
    }
}

/* ----------------------------------------------------------------
   Chat — painel de mensagens expande quando CRM está oculto
   ---------------------------------------------------------------- */

/*
 * A expansão do col do chat é feita via Alpine.js :class bind no chat.blade.php.
 * Aqui apenas garantimos que o card do chat não transborde verticalmente
 * em viewports de 768px de altura.
 */
@media (max-height: 800px) {
    .lw-whatsapp-chat-window .chat-container .conversation {
        max-height: calc(100vh - 260px) !important;
    }
}

/* ----------------------------------------------------------------
   Tabelas — font-size compacto em telas <= 1440px
   ---------------------------------------------------------------- */

/*
 * Reduz fonte das células mas mantém white-space normal para não
 * causar overflow horizontal nas tabelas DataTable.
 */
@media (max-width: 1440px) {
    .table th {
        font-size: 0.72rem;
        padding: 0.6rem 0.75rem;
    }
    .table td {
        font-size: 0.82rem;
        padding: 0.55rem 0.75rem;
    }
}

/* ----------------------------------------------------------------
   Topbar (navbar) — comprime em telas menores
   ---------------------------------------------------------------- */

@media (max-width: 1366px) {
    #navbar-main .navbar-nav .nav-link {
        padding: 0.5rem 0.6rem;
        font-size: 0.82rem;
    }
}