/* =====================================================
   KANBAN MOBILE - SISGCOE
===================================================== */

/* =====================================================
   MOBILE PREMIUM FINAL - KANBAN
   Ajustes leves, sem alterar fluxo operacional
===================================================== */

@media(max-width:480px){

    .topo-sistema{
        padding:8px 10px !important;
        min-height:52px !important;
    }

    .topo-sistema img{
        height:36px !important;
    }

    .titulo-sistema{
        font-size:18px !important;
    }

    .subtitulo-sistema{
        font-size:8px !important;
    }

    .barra-gestao h2{
        font-size:17px !important;
    }

    .filtros-operacionais{
        gap:6px !important;
        padding:8px 10px 10px !important;
    }

    .filtro-btn{
        padding:7px 10px !important;
        font-size:.68rem !important;
    }

    .kanban-executivo{
        gap:8px !important;
    }

    .kpi-kanban{
        min-height:58px !important;
        padding:9px 12px !important;
    }

    .kpi-kanban strong{
        font-size:1.15rem !important;
    }

    .kpi-kanban span{
        font-size:.6rem !important;
    }

    .modal-enterprise{
        padding:14px !important;
    }

    .grid-operacional{
        gap:12px !important;
    }

    .bloco{
        padding:14px !important;
        border-radius:16px !important;
    }

    .grid-checkbox{
        gap:8px !important;
    }

    .grid-checkbox label{
        min-height:44px !important;
        padding:10px !important;
        font-size:.75rem !important;
    }

    .linha{
        gap:8px !important;
    }
}

/* =====================================================
   CORREÇÃO MOBILE - MODAL FINALIZAÇÃO KANBAN
===================================================== */

@media(max-width:480px){

    #modalConclusao{
        align-items:flex-start !important;
        justify-content:center !important;
        padding:12px !important;
        overflow-y:auto !important;
    }

    #modalConclusao .modal-conteudo,
    #modalConclusao .modal-enterprise{
        width:100% !important;
        max-width:100% !important;
        margin:0 auto !important;
        max-height:none !important;
        border-radius:20px !important;
        box-sizing:border-box !important;
    }

    #modalConclusao .grid-operacional{
        grid-template-columns:1fr !important;
    }

    #modalConclusao .grid-checkbox{
        grid-template-columns:1fr 1fr !important;
    }

    #modalConclusao .linha{
        display:grid !important;
        grid-template-columns:1fr !important;
        justify-items:center !important;
    }

    #modalConclusao input,
    #modalConclusao textarea,
    #modalConclusao select{
        max-width:100% !important;
        box-sizing:border-box !important;
    }

    #modalConclusao .acoes{
        display:grid !important;
        grid-template-columns:1fr 1fr !important;
        gap:8px !important;
    }

    #modalConclusao .acoes .btn{
        width:100% !important;
    }
}

@media(max-width:480px){

    #modalConclusao{
        padding-top:48px !important;
    }

    #modalConclusao .modal-conteudo,
    #modalConclusao .modal-enterprise{
        transform:none !important;
    }

    #modalConclusao .resumo-os{
        overflow-x:auto !important;
        padding-bottom:8px !important;
    }

    #modalConclusao .info-os{
        min-width:110px !important;
    }

    #modalConclusao .bloco h3{
        font-size:15px !important;
    }

    #modalConclusao input[name="percentual"]{
        width:90px !important;
        text-align:center !important;
    }

    #modalConclusao #valor_total{
        width:170px !important;
        text-align:center !important;
    }
}

/* =====================================================
   AJUSTE FINAL MOBILE - MODAL CONCLUSÃO
===================================================== */

@media(max-width:480px){

    #modalConclusao{
        padding-top:140px !important;
        padding-left:10px !important;
        padding-right:10px !important;
        align-items:flex-start !important;
    }

    #modalConclusao .modal-enterprise{
        width:calc(100vw - 24px) !important;
        max-width:calc(100vw - 24px) !important;
        margin:0 auto 24px !important;
        overflow:visible !important;
    }

    #modalConclusao .header-modal-enterprise{
        padding:28px 22px 24px !important;
        border-radius:18px 18px 0 0 !important;
    }

    #modalConclusao .header-modal-enterprise h2{
        font-size:30px !important;
        line-height:1.05 !important;
    }

    #modalConclusao .linha input[name="percentual"]{
        width:120px !important;
        min-width:120px !important;
        text-align:center !important;
    }

    #modalConclusao #valor_total{
        width:190px !important;
        min-width:190px !important;
        text-align:center !important;
    }
}
@media(max-width:480px){

    #modalConclusao .resumo-os{
        display:grid !important;
        grid-template-columns:1fr 1fr !important;
        gap:10px !important;
        overflow:visible !important;
    }

    #modalConclusao .info-os{
        min-width:unset !important;
        width:100% !important;
    }
}

/* =====================================================
   AJUSTE PREMIUM - BOTÕES DOS CARDS CONCLUÍDOS
   ===================================================== */

.card-actions,
.kanban-card-actions,
.card-botoes,
.acoes-card {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.card-actions button,
.card-actions a,
.kanban-card-actions button,
.kanban-card-actions a,
.card-botoes button,
.card-botoes a,
.acoes-card button,
.acoes-card a {
    min-height: 34px;
    padding: 8px 11px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

/* Botões da coluna concluído: 4 botões na mesma linha quando couber */
.kanban-column[data-status="concluido"] .card-actions,
.kanban-column[data-status="concluido"] .kanban-card-actions,
.kanban-column[data-status="concluido"] .card-botoes,
.kanban-column[data-status="concluido"] .acoes-card {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
}

.kanban-column[data-status="concluido"] .card-actions button,
.kanban-column[data-status="concluido"] .card-actions a,
.kanban-column[data-status="concluido"] .kanban-card-actions button,
.kanban-column[data-status="concluido"] .kanban-card-actions a,
.kanban-column[data-status="concluido"] .card-botoes button,
.kanban-column[data-status="concluido"] .card-botoes a,
.kanban-column[data-status="concluido"] .acoes-card button,
.kanban-column[data-status="concluido"] .acoes-card a {
    width: 100%;
    min-width: 0;
    padding: 8px 6px;
    font-size: 11.5px;
}

/* Em telas menores: mantém bonito sem esmagar texto */
@media (max-width: 1400px) {
    .kanban-column[data-status="concluido"] .card-actions,
    .kanban-column[data-status="concluido"] .kanban-card-actions,
    .kanban-column[data-status="concluido"] .card-botoes,
    .kanban-column[data-status="concluido"] .acoes-card {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .kanban-column[data-status="concluido"] .card-actions,
    .kanban-column[data-status="concluido"] .kanban-card-actions,
    .kanban-column[data-status="concluido"] .card-botoes,
    .kanban-column[data-status="concluido"] .acoes-card {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Botões dos cards concluídos - 4 na mesma linha */
.card[data-status="concluido"] .acoes-card,
.kanban-card.concluido .acoes-card,
.kanban-card[data-status="concluido"] .acoes-card {
    display: flex;
    flex-wrap: nowrap;
    gap: 4px;
    align-items: center;
    width: 100%;
}

.card[data-status="concluido"] .acoes-card a,
.card[data-status="concluido"] .acoes-card button,
.kanban-card.concluido .acoes-card a,
.kanban-card.concluido .acoes-card button,
.kanban-card[data-status="concluido"] .acoes-card a,
.kanban-card[data-status="concluido"] .acoes-card button {
    flex: 1 1 0;
    min-width: 0;
    height: 28px;
    padding: 5px 4px;
    font-size: 10.5px;
    line-height: 1;
    white-space: nowrap;
    border-radius: 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
}

/* =====================================================
   CORREÇÃO DEFINITIVA - BOTÕES DOS CARDS CONCLUÍDOS
   4 botões na mesma linha
   ===================================================== */

.kanban-card.concluido .botoes,
.card.concluido .botoes,
.kanban-card[data-status="concluido"] .botoes,
.card[data-status="concluido"] .botoes {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    width: 100% !important;
}

.kanban-card.concluido .botoes .btn,
.card.concluido .botoes .btn,
.kanban-card[data-status="concluido"] .botoes .btn,
.card[data-status="concluido"] .botoes .btn,
.kanban-card.concluido .botoes .upload-premium,
.card.concluido .botoes .upload-premium {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    height: 28px !important;
    padding: 5px 3px !important;
    font-size: 10px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    border-radius: 7px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
}

.kanban-card.concluido .botoes .nome-arquivo,
.kanban-card.concluido .botoes .preview-upload,
.card.concluido .botoes .nome-arquivo,
.card.concluido .botoes .preview-upload {
    display: none !important;
}

/* =====================================================
   EFEITOS PREMIUM - BOTÃO INICIAR EXECUÇÃO
   ===================================================== */

.btn-iniciar-execucao{

    position: relative;
    overflow: hidden;

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        filter .18s ease;

    box-shadow:
        0 4px 14px rgba(37,99,235,.28);

}

/* Hover */
.btn-iniciar-execucao:hover{

    transform: translateY(-2px);

    filter: brightness(1.06);

    box-shadow:
        0 10px 24px rgba(37,99,235,.42);

}

/* Clique */
.btn-iniciar-execucao:active{

    transform: scale(.98);

}

/* Shine */
.btn-iniciar-execucao::before{

    content: "";

    position: absolute;

    top: 0;
    left: -120%;

    width: 60%;
    height: 100%;

    background:
        linear-gradient(
            120deg,
            transparent,
            rgba(255,255,255,.20),
            transparent
        );

    transition: left .45s ease;

}

.btn-iniciar-execucao:hover::before{

    left: 140%;

}

/* =====================================================
   BOTÕES WHATSAPP / COPIAR
   ===================================================== */

.modal-conteudo button,
.modal-conteudo a{

    position: relative;
    overflow: hidden;

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        filter .18s ease;

}

.modal-conteudo button:hover,
.modal-conteudo a:hover{

    transform: translateY(-2px);

    filter: brightness(1.05);

}

.modal-conteudo button:active,
.modal-conteudo a:active{

    transform: scale(.98);

}

/* =====================================================
   KPIs DASHBOARDS - VALORES GRANDES
   ===================================================== */

.kpi-valor,
.kpi-value,
.valor-kpi,
.metric-value,
.card-kpi h2,
.card-kpi .valor{

    white-space: nowrap;
    overflow: visible;

    font-size: clamp(22px, 2vw, 38px);

    line-height: 1.1;
}

/* Card custo maior */
.card-custo,
.kpi-custo{

    min-width: 320px;

}