/* Ajustes do Sistema Atos sobre o design system .bi-* compartilhado com o WP.
   O nome do arquivo e o prefixo .ronda-* são identificadores técnicos legados. */

/* O design system do WP some com a marca no sidebar recolhido; no Sistema Atos mantemos simples. */
.bi-sidebar-brand { color: var(--bi-primary); font-weight: var(--bi-font-weight-bold); font-size: var(--bi-font-size-xl); }

/* Ícone de nav sozinho (sem submenu) alinhado com o texto. */
.bi-nav-item .bi-nav-icon { width: 20px; text-align: center; margin-right: var(--bi-space-2); }

/* Formulários: inputs e textareas ocupam a largura toda dentro de cards estreitos. */
.bi-form-control, .bi-form-select, .bi-form-textarea { width: 100%; }
/* No design system, .bi-form-textarea sozinha não traz padding/borda (espera .bi-form-control
   junto). Damos a ela os mesmos estilos base para não ficar um campo cru e espremido. */
.bi-form-textarea {
    display: block;
    padding: 9px 12px;
    font-family: var(--bi-font-family);
    font-size: var(--bi-font-size-base);
    color: var(--bi-text-primary);
    background: var(--bi-bg-input);
    border: 1.5px solid #CBD5E1;
    border-radius: var(--bi-border-radius-sm);
    line-height: 1.5;
    min-height: 110px;
    resize: vertical;
}
.bi-form-textarea:focus {
    outline: none;
    border-color: var(--bi-primary);
    box-shadow: 0 0 0 3px var(--bi-primary-bg);
}

/* Tabela: ações à direita não quebram linha. */
.bi-table td .bi-flex { flex-wrap: nowrap; }

/* Pequeno respiro entre cards empilhados. */
.bi-card + .bi-card { margin-top: var(--bi-space-5); }

/* Banner de impersonação (modo visualização) — âmbar, no topo do conteúdo. */
.impersonar-banner {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
    background: var(--bi-warning, #d97706); color: #fff;
    padding: 0.6rem 1.25rem; font-size: 0.9rem; font-weight: 600;
}

/* --- Contrato mobile-first (líder/gerente no celular, chão de loja) --- */
.ronda-tracking { margin-bottom: var(--bi-space-5); }
.ronda-tracking .bi-card-header { display: flex; align-items: center; }
.ronda-tracking-scroll {
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding: 28px 20px 24px;
}
.ronda-tracking-scroll:focus-visible { outline: 2px solid var(--bi-primary); outline-offset: -3px; }
.ronda-tracking .ronda-timeline {
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
    list-style: none;
    padding: 0;
    margin: 0;
    min-width: max-content;
    width: 100%;
}
.ronda-tracking .ronda-timeline-etapa {
    --timeline-color: var(--bi-text-muted);
    --timeline-bg: var(--bi-gray-50);
    --timeline-border: var(--bi-border-color);
    position: relative;
    flex: 1 0 158px;
    min-width: 158px;
    text-align: center;
    padding: 0 10px;
    scroll-snap-align: start;
}
.ronda-timeline-etapa::marker { content: ''; }
.ronda-timeline-etapa::before {
    content: '';
    position: absolute;
    height: 3px;
    background: var(--timeline-border);
    top: 18px;
    left: -50%;
    width: 100%;
}
.ronda-timeline-etapa:first-child::before { display: none; }
.ronda-timeline-marcador {
    position: relative;
    z-index: 1;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 38px;
    height: 38px;
    border: 2px solid var(--timeline-color);
    border-radius: 50%;
    background: var(--timeline-bg);
    color: var(--timeline-color);
    box-shadow: 0 0 0 5px var(--bi-bg-card);
}
.ronda-timeline-info { display: flex; flex-direction: column; gap: 4px; margin-top: 13px; overflow-wrap: anywhere; }
.ronda-timeline-info strong { font-size: 13px; line-height: 1.4; color: var(--bi-text-primary); }
.ronda-timeline-info time { font-size: 12px; color: var(--bi-text-secondary); white-space: nowrap; }
.ronda-timeline-etapa.is-info { --timeline-color: var(--bi-info); --timeline-bg: var(--bi-info-bg); --timeline-border: var(--bi-info-border); }
.ronda-timeline-etapa.is-warning { --timeline-color: var(--bi-warning); --timeline-bg: var(--bi-warning-bg); --timeline-border: var(--bi-warning-border); }
.ronda-timeline-etapa.is-danger { --timeline-color: var(--bi-danger); --timeline-bg: var(--bi-danger-bg); --timeline-border: var(--bi-danger-border); }
.ronda-timeline-etapa.is-primary { --timeline-color: var(--bi-primary); --timeline-bg: var(--bi-primary-bg); --timeline-border: var(--bi-primary-border); }
.ronda-timeline-etapa.is-success { --timeline-color: var(--bi-success); --timeline-bg: var(--bi-success-bg); --timeline-border: var(--bi-success-border); }

/* Progresso do envio de fotos (registro do líder). No 4G da loja o upload leva minutos:
   a barra existe para a tela não parecer travada e o líder não fechar o app no meio. */
#box-progresso { margin-top: var(--bi-space-3); }
.ronda-progresso-barra {
    height: 10px;
    background: var(--bi-gray-100, #f1f5f9);
    border-radius: 999px;
    overflow: hidden;
}
.ronda-progresso-barra > div {
    height: 100%;
    width: 0;
    background: var(--bi-primary);
    border-radius: 999px;
    transition: width .2s ease;
}
#box-progresso .bi-form-hint { margin-top: 6px; }

/* Cadastro e gestão das atividades criadas pelos mercados. */
.atividade-local-grid,
.atividade-filtros {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--bi-space-4);
}
.atividade-filtros { align-items: end; }
.atividade-filtros-acoes {
    display: flex;
    align-items: center;
    gap: var(--bi-space-2);
}
.atividade-gestao-lista {
    display: grid;
    gap: var(--bi-space-5);
}
.atividade-gestao-card + .atividade-gestao-card { margin-top: 0; }
.atividade-gestao-cabecalho {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 0.55fr);
    gap: var(--bi-space-6);
}
.atividade-gestao-titulo {
    margin: var(--bi-space-2) 0 0;
    color: var(--bi-text-primary);
    font-size: var(--bi-font-size-xl);
}
.atividade-gestao-descricao {
    margin: var(--bi-space-2) 0 0;
    color: var(--bi-text-muted);
}
.atividade-gestao-meta {
    display: grid;
    align-content: start;
    gap: var(--bi-space-2);
    color: var(--bi-text-secondary);
    font-size: var(--bi-font-size-sm);
}
.atividade-gestao-meta i { width: 18px; color: var(--bi-text-muted); text-align: center; }
.atividade-gestao-historico {
    display: flex;
    overflow-x: auto;
    gap: 0;
    margin-top: var(--bi-space-6);
    padding: var(--bi-space-3) 0 var(--bi-space-2);
}
.atividade-gestao-evento {
    position: relative;
    display: grid;
    grid-template-columns: 32px minmax(160px, 1fr);
    gap: var(--bi-space-2);
    flex: 1 0 235px;
    min-width: 235px;
    padding-right: var(--bi-space-4);
    color: var(--bi-text-muted);
    font-size: var(--bi-font-size-xs);
}
.atividade-gestao-evento:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 15px;
    left: 30px;
    right: 0;
    height: 2px;
    background: var(--bi-border-color);
}
.atividade-gestao-evento > div { position: relative; z-index: 1; background: var(--bi-bg-card); }
.atividade-gestao-evento strong { color: var(--bi-text-primary); font-size: var(--bi-font-size-sm); }
.atividade-gestao-evento-icone {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid var(--bi-primary-border);
    border-radius: var(--bi-border-radius-full);
    color: var(--bi-primary);
    background: var(--bi-primary-bg);
}
.atividade-gestao-evento-icone.is-success {
    color: var(--bi-success);
    border-color: var(--bi-success-border);
    background: var(--bi-success-bg);
}
.atividade-gestao-evento-icone.is-danger {
    color: var(--bi-danger);
    border-color: var(--bi-danger-border);
    background: var(--bi-danger-bg);
}
.atividade-gestao-motivo {
    margin: var(--bi-space-2) 0 0;
    padding: var(--bi-space-2);
    border-left: 3px solid var(--bi-danger-border);
    border-radius: var(--bi-border-radius-xs);
    color: var(--bi-text-secondary);
    background: var(--bi-danger-bg);
}
.atividade-gestao-acoes {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: var(--bi-space-3);
    margin-top: var(--bi-space-5);
    padding-top: var(--bi-space-4);
    border-top: 1px solid var(--bi-border-color);
}
.atividade-rejeicao > summary { list-style: none; }
.atividade-rejeicao > summary::-webkit-details-marker { display: none; }
.atividade-rejeicao[open] {
    width: min(100%, 520px);
    padding: var(--bi-space-4);
    border: 1px solid var(--bi-danger-border);
    border-radius: var(--bi-border-radius);
    background: var(--bi-danger-bg);
}
.atividade-rejeicao[open] > summary { margin-bottom: var(--bi-space-4); }

@media (max-width: 768px) {
    .ronda-tracking-scroll { padding: 22px 16px 20px; scroll-snap-type: x proximity; }
    .ronda-tracking .ronda-timeline-etapa { flex-basis: 148px; min-width: 148px; padding-inline: 8px; }
    /* 16px evita o zoom automático do iOS Safari ao focar campos. */
    .bi-form-control, .bi-form-select, .bi-form-textarea { font-size: 16px; }
    /* Alvo de toque confortável na ação principal de cada linha/lista. */
    .bi-btn, .bi-btn-sm { min-height: 44px; }
    .bi-form-check { padding: 0.35rem 0; }  /* radios/checkboxes mais fáceis de tocar */
    .atividade-local-grid,
    .atividade-filtros,
    .atividade-gestao-cabecalho { grid-template-columns: 1fr; }
    .atividade-filtros-acoes .bi-btn { flex: 1; }
    .atividade-gestao-evento { flex-basis: 210px; min-width: 210px; }
}