/* =========================================================
   Responsividade — Banco de Currículos PcD
   Breakpoints: XS <576 | SM ≥576 | MD ≥768 | LG ≥992 | XL ≥1200
   ========================================================= */

/* --- Base: evita zoom iOS em inputs (sem overflow no html — preserva sticky/dropdowns) --- */
img,
svg,
video,
canvas {
    max-width: 100%;
    height: auto;
}

@media (max-width: 767.98px) {
    input.form-control,
    select.form-select,
    textarea.form-control {
        font-size: 16px !important;
    }

    main .container.py-5,
    section.container.py-5,
    .container.py-5 {
        padding-top: 1.25rem !important;
        padding-bottom: 1.25rem !important;
    }

    .btn-mobile-block,
    .auth-page .btn-brand,
    .auth-page .btn-outline-danger,
    .auth-page button[type="submit"].btn,
    .auth-page .btn-primary {
        width: 100%;
    }
}

/* --- Navbar / brand --- */
.navbar-nav {
    flex-wrap: wrap;
    row-gap: 0.25rem;
}

.navbar-nav > .nav-item {
    flex-shrink: 0;
}

.navbar-nav .nav-link {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    line-height: 1.35;
}

.navbar-nav .nav-link .bi {
    flex-shrink: 0;
}

.navbar-nav .btn-gerir-link {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.navbar-nav .btn.btn-sm {
    width: auto !important;
    white-space: nowrap;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 991.98px) {
    .navbar > .container {
        row-gap: 0.5rem;
    }

    .navbar-brand-portal {
        flex-wrap: wrap;
        max-width: calc(100% - 3.5rem);
        min-width: 0;
    }

    .navbar-brand-title {
        font-size: 0.95rem;
        word-break: break-word;
    }

    .navbar-brand-logo-wrap {
        max-width: 5.5rem;
        height: 2.15rem;
    }

    .app-manage-menu-panel {
        max-width: min(22rem, calc(100vw - 2rem));
        max-height: min(70vh, 28rem);
        overflow-y: auto;
        overflow-x: hidden;
    }

    /* Accordion: submenus fechados até toque (.is-open) — evita corte e clutter */
    .app-manage-menu-panel .submenu-flyout {
        display: none;
        position: static;
        margin: 0 0 0.35rem 0.75rem;
        padding-left: 0.5rem;
        border-left: 2px solid rgba(192, 0, 0, 0.25);
        box-shadow: none;
        min-width: 0;
        max-width: 100%;
    }

    .app-manage-menu-panel .submenu-chevron {
        transform: rotate(90deg);
        transition: transform 0.15s ease;
    }

    .app-manage-menu-panel .dropdown-submenu.is-open > .submenu-trigger .submenu-chevron {
        transform: rotate(-90deg);
    }

    .app-manage-menu-panel .dropdown-submenu.is-open > .submenu-flyout,
    .app-manage-menu-panel .dropdown-submenu:focus-within > .submenu-flyout {
        display: block;
    }

    .navbar .btn.btn-sm {
        width: auto;
        white-space: nowrap;
        flex-shrink: 0;
    }
}

@media (max-width: 575.98px) {
    .navbar-brand-text .navbar-brand-icon {
        font-size: 1.1rem;
    }

    .navbar-brand-title {
        font-size: 0.85rem;
    }

    .navbar-toggler {
        min-width: 2.75rem;
        min-height: 2.75rem;
    }
}

/* Notificações — largura viewport + scroll */
.notificacoes-sino-panel {
    width: min(22rem, calc(100vw - 1.5rem)) !important;
    max-width: calc(100vw - 1.5rem);
    max-height: min(70vh, 24rem);
}

.notificacoes-sino-lista {
    max-height: min(50vh, 16rem);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.notificacoes-sino-btn {
    min-width: 2.75rem;
    min-height: 2.75rem;
}

/* EqualWeb — widget flutuante; não forçar padding extra no body (preserva layout do footer) */

/* --- Landing / Hero --- */
@media (max-width: 767.98px) {
    .hero .display-6 {
        font-size: 1.65rem;
    }

    .hero .lead {
        font-size: 1rem;
    }

    .hero .d-flex.flex-wrap.gap-2 {
        flex-direction: column;
        align-items: stretch;
    }

    .hero .d-flex.flex-wrap.gap-2 > .btn {
        width: 100%;
    }

    .hero .d-flex.flex-wrap.gap-2 > img {
        align-self: center;
        margin-top: 0.5rem;
    }

    .hero .kpi .display-6 {
        font-size: 1.75rem;
    }

    .hero .kpi.p-4 {
        padding: 1rem !important;
    }

    .filter-chip {
        font-size: 0.8rem;
        padding: 0.3rem 0.6rem;
        max-width: 100%;
        word-break: break-word;
    }
}

@media (max-width: 575.98px) {
    .hero-kpi-col {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* --- Auth --- */
.auth-page .card {
    width: 100%;
}

@media (max-width: 767.98px) {
    .auth-page .col-md-5,
    .auth-page .col-md-6,
    .auth-page .col-md-8,
    .auth-page .col-lg-7 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .auth-page .text-break,
    .auth-page .small,
    .auth-page .alert {
        overflow-wrap: anywhere;
        word-break: break-word;
    }
}

/* --- Paginação --- */
@media (max-width: 575.98px) {
    .paginacao-consulta > .d-flex {
        flex-direction: column;
        align-items: stretch !important;
    }

    .paginacao-consulta .pagination {
        justify-content: center;
        flex-wrap: wrap;
        row-gap: 0.25rem;
    }

    .paginacao-consulta .page-link {
        min-width: 2.5rem;
        min-height: 2.5rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .paginacao-consulta .page-item:not(.active):not(:first-child):not(:last-child):not(.disabled) {
        /* mantém páginas; CSS só melhora toque */
    }
}

/* --- Coluna ordenável / toque --- */
.th-ordenavel a,
a.coluna-ordenavel,
.table th a {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    padding: 0.25rem 0.15rem;
}

/* --- Áreas de interesse --- */
.areas-interesse-checkboxes .form-check-label,
#areasInteresse .form-check-label {
    word-break: break-word;
    white-space: normal;
}

@media (max-width: 767.98px) {
    .areas-interesse-scroll {
        max-height: 14rem;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        border: 1px solid #eee;
        border-radius: 0.5rem;
        padding: 0.75rem;
    }
}

/* --- Alertas --- */
.alert {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.alert .btn {
    margin-top: 0.25rem;
}

@media (max-width: 575.98px) {
    .alert .d-flex {
        flex-direction: column;
        align-items: stretch !important;
    }
}

/* --- Tabelas / grids com scroll + indicação --- */
.table-responsive,
.vagas-api-grid-wrap,
.estat-mensal-wrap,
.chart-table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    position: relative;
}

.table-responsive.has-scroll-hint,
.vagas-api-grid-wrap.has-scroll-hint,
.estat-mensal-wrap {
    background:
        linear-gradient(90deg, #fff 30%, rgba(255, 255, 255, 0)) left center / 2rem 100% no-repeat local,
        linear-gradient(90deg, rgba(255, 255, 255, 0), #fff 70%) right center / 2rem 100% no-repeat local,
        radial-gradient(farthest-side at 0 50%, rgba(0, 0, 0, 0.12), transparent) left center / 0.75rem 100% no-repeat local,
        radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, 0.12), transparent) right center / 0.75rem 100% no-repeat local;
    background-color: #fff;
}

.scroll-hint-label {
    display: none;
    font-size: 0.75rem;
    color: #6c757d;
    margin-bottom: 0.35rem;
}

@media (max-width: 991.98px) {
    .scroll-hint-label {
        display: block;
    }

    .vagas-api-grid th.vagas-api-col-acoes,
    .vagas-api-grid td.vagas-api-col-acoes {
        min-width: 8.5rem;
    }

    .vagas-api-grid td.vagas-api-col-acoes .btn {
        min-height: 2.5rem;
        font-size: 0.8rem;
        padding: 0.35rem 0.5rem;
    }

    .btn-cadastrar-vagas {
        min-width: 0;
        width: 100%;
    }
}

/* Colunas secundárias em tabelas densas (marcar com .col-sec) */
@media (max-width: 767.98px) {
    table.table-dense-responsive .col-sec,
    table.table-dense-responsive th.col-sec,
    table.table-dense-responsive td.col-sec {
        display: none;
    }
}

/* --- Filtro lateral admin/empresa: stack natural; accordion helper --- */
@media (max-width: 991.98px) {
    .filtro-lateral-responsivo .card-header {
        cursor: pointer;
    }

    .admin-filtro-stack > [class*="col-lg-4"],
    .admin-filtro-stack > [class*="col-lg-3"] {
        margin-bottom: 1rem;
    }
}

/* --- Charts fluidos --- */
.chart-wrap {
    width: 100% !important;
    max-width: 100% !important;
    position: relative;
}

.chart-wrap canvas {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
}

@media (max-width: 767.98px) {
    .chart-wrap {
        min-height: 220px !important;
    }

    .dashboard-kpi-row > [class*="col-lg-2"],
    .dashboard-kpi-row > [class*="col-md-4"] {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

@media (max-width: 575.98px) {
    .dashboard-kpi-row > [class*="col-lg-2"],
    .dashboard-kpi-row > [class*="col-md-4"] {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .btn-group-responsive {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    .btn-group-responsive > .btn {
        width: 100%;
        border-radius: 0.375rem !important;
        margin-bottom: 0.35rem;
    }
}

/* --- Modal vaga --- */
@media (max-width: 575.98px) {
    #modalVagaDetalhe .modal-dialog {
        margin: 0.5rem;
        max-width: calc(100% - 1rem);
    }

    #modalVagaDetalhe .modal-footer {
        flex-direction: column;
        align-items: stretch;
    }

    #modalVagaDetalhe .modal-footer .btn {
        width: 100%;
    }

    .vaga-detalhe-modal__bloco {
        margin-bottom: 0.75rem;
    }
}

/* --- Currículo / formulários multilinha --- */
@media (max-width: 767.98px) {
    .cv-form-grid .col-md-3,
    .cv-form-grid .col-md-4,
    .cv-form-grid .col-md-6,
    .cv-form-grid .col-md-8,
    .candidato-form .col-md-3,
    .candidato-form .col-md-4,
    .candidato-form .col-md-6,
    .candidato-form .col-md-8,
    .empresa-form .col-md-4,
    .empresa-form .col-md-5,
    .empresa-form .col-md-7,
    .empresa-form .col-md-8 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .cv-preferencias .form-check,
    .cv-preferencias .col-md-4.form-check {
        width: 100%;
        margin-bottom: 0.5rem;
    }

    .curriculo-painel-lateral.sticky-lg-top {
        position: static !important;
        margin-top: 1rem;
    }
}

/* Editores currículo (experiência / formação / cursos / idiomas) */
@media (max-width: 576px) {
    .exp-prof-card,
    .formacao-card,
    .curso-card,
    .idioma-card,
    .cv-editor-card {
        padding: 0.85rem;
    }

    .exp-prof-card__top,
    .formacao-card__top,
    .curso-card__top,
    .idioma-card__top,
    .cv-editor-card__top {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .exp-prof-card .btn,
    .formacao-card .btn,
    .curso-card .btn,
    .idioma-card .btn,
    .cv-editor-card .btn {
        width: 100%;
    }
}

/* --- Empresa pesquisa: filtros collapse --- */
@media (max-width: 991.98px) {
    .empresa-pesquisa-filtros-toggle {
        display: flex !important;
        width: 100%;
        margin-bottom: 0.75rem;
    }
}

@media (min-width: 992px) {
    .empresa-pesquisa-filtros-toggle {
        display: none !important;
    }

    #empresaPesquisaFiltrosCollapse {
        display: block !important;
        height: auto !important;
        visibility: visible !important;
    }
}

/* --- Contato solicitado / cards --- */
@media (max-width: 575.98px) {
    .empresa-contato-solicitado,
    .contato-solicitado-badge,
    .empresa-contato-box {
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100%;
    }

    .candidato-vaga-card .btn,
    .vagas-cards-toolbar .form-select {
        width: 100%;
    }

    .vagas-cards-toolbar .d-flex {
        flex-direction: column;
        align-items: stretch !important;
    }

    .breadcrumb {
        flex-wrap: wrap;
        row-gap: 0.15rem;
        font-size: 0.8rem;
    }
}

/* --- Preview currículo modal --- */
@media (max-width: 575.98px) {
    .empresa-curriculo-preview-modal .modal-dialog,
    #modalCurriculoPreview .modal-dialog {
        margin: 0.35rem;
        max-width: calc(100% - 0.7rem);
    }

    .curriculo-preview,
    .cv-preview {
        padding: 0.75rem !important;
    }
}

/* --- Estatísticas mensais --- */
.estat-mensal-wrap {
    position: relative;
}

.estat-mensal-table th:first-child,
.estat-mensal-table td:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background: #fff;
    box-shadow: 2px 0 6px rgba(0, 0, 0, 0.06);
}

.estat-mensal-table thead th:first-child {
    z-index: 3;
    background: #f8f9fa;
}

/* --- Painel automações / admin index --- */
@media (max-width: 767.98px) {
    .admin-index-card a,
    .admin-index-card .card {
        min-height: 2.75rem;
    }

    .painel-automacoes .btn {
        min-height: 2.75rem;
    }
}

/* --- Liberar acessos btn-group --- */
@media (max-width: 575.98px) {
    .liberar-acessos-tipo.btn-group {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    .liberar-acessos-tipo.btn-group > .btn {
        width: 100%;
        border-radius: 0.375rem !important;
        margin-bottom: 0.35rem;
    }
}
