/* UNIPLIM-WORKFORCE-CATALOG-BOOKING-01 (Corte 7) — Agendamentos, Serviços, Equipe e escalas, Comissões e metas.
   Só tokens --uni-*: claro/escuro vêm dos próprios tokens (nada de cor literal). Prefixos: bk- (agendamentos), wf- (equipe/jornada),
   sv- (serviços), ic- (comissões e metas). */

/* UNIPLIM-V2-OVV-CORRECTIONS-01 (OVV-F02) — /equipe e /metas: `.uni-tabs` não tem margem inferior (uni-components.css), e o
   cartão de estado vazio que vem logo depois das abas ("Nenhuma meta em andamento", avisos de acesso) encostava nelas.
   Respiro só nesse encontro, nas duas páginas; demais superfícies com abas não mudam. */
.wf-page > .uni-tabs + .crm-empty-state,
.ic-page > .uni-tabs + .crm-empty-state { margin-top: var(--uni-space-4); }

/* UNIPLIM-V2-OVV-CORRECTIONS-01 (OVV-F01) — "Minha escala": o conteúdo da seção respira abaixo das abas (mesmo ritmo do drawer
   do profissional, que usa --uni-space-4). */
.wf-own-schedule-body { margin-top: var(--uni-space-4); }

/* UNIPLIM-V2-OVV-CORRECTIONS-01 (OVV-F06) — "membro da equipe": selos da linha do profissional e a seção "Acesso ao UniPlim" do editor. */
.wf-item-badges { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--uni-space-1); }
/* OVV-F06 — em Usuários (o painel compartilha o programa de equipe): o selo "Atua na agenda" não estica na coluna do nome, e o
   bloco "Atua na agenda" do editor segue o ritmo do formulário. Ficam aqui para não disputar crm-settings.css com outras frentes. */
.crm-users-schedule-badge { align-self: flex-start; margin-top: var(--uni-space-1); }
.crm-users-schedule {
    display: flex; flex-direction: column; gap: var(--uni-space-1);
    margin-top: var(--uni-space-4); padding: var(--uni-space-3); border: 1px solid var(--uni-color-border); border-radius: var(--uni-radius-md);
}
.crm-users-schedule small { color: var(--uni-color-text-muted); font-size: var(--uni-font-size-sm); }
.crm-users-schedule-link { align-self: flex-start; color: var(--uni-color-primary); font-weight: 600; }
.wf-access-section {
    display: flex; flex-direction: column; gap: var(--uni-space-3);
    margin-top: var(--uni-space-4); padding-top: var(--uni-space-4); border-top: 1px solid var(--uni-color-border);
}

/* ---------- utilitários de leitura ---------- */
.bk-muted { color: var(--uni-color-text-muted); font-size: var(--uni-font-size-sm); }
.bk-section-title { font-size: var(--uni-font-size-md); font-weight: 700; margin: var(--uni-space-5) 0 var(--uni-space-2); color: var(--uni-color-text); }
.bk-badge {
    display: inline-flex; align-items: center; gap: var(--uni-space-1);
    padding: var(--uni-space-1) var(--uni-space-2); border-radius: var(--uni-radius-pill);
    font-size: var(--uni-font-size-xs); font-weight: 600; white-space: nowrap;
    background: var(--uni-color-neutral-soft); color: var(--uni-color-text);
}
.bk-badge-ok { background: var(--uni-color-success-soft); color: var(--uni-color-text); }
.bk-badge-wait { background: var(--uni-color-warning-soft); color: var(--uni-color-text); }
.bk-badge-done { background: var(--uni-color-info-soft); color: var(--uni-color-text); }
.bk-badge-off { background: var(--uni-color-neutral-soft); color: var(--uni-color-text-muted); }

/* ---------- barra de ferramentas ---------- */
.bk-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--uni-space-3); margin: var(--uni-space-4) 0; }
.bk-daynav { display: flex; align-items: center; gap: var(--uni-space-2); flex-wrap: wrap; }
.bk-date { width: auto; }
.bk-dayname { color: var(--uni-color-text-muted); font-size: var(--uni-font-size-sm); }
.bk-filter { min-width: 0; flex: 1 1 calc(var(--uni-space-8) * 6); max-width: calc(var(--uni-space-8) * 10); }

/* ---------- agenda do dia (desktop): colunas por profissional ---------- */
.bk-day {
    --bk-hour: calc(var(--uni-space-8) * 1.75);
    --bk-hours: 15; /* sobrescrito inline pela página (faixa de horas do dia) */
    display: grid; grid-auto-flow: column; grid-template-columns: calc(var(--uni-space-8) * 1.5); grid-auto-columns: minmax(calc(var(--uni-space-8) * 5), 1fr);
    border: 1px solid var(--uni-color-border); border-radius: var(--uni-radius-lg); background: var(--uni-color-surface); overflow-x: auto;
}
.bk-day-times { padding-top: calc(var(--uni-space-8)); border-right: 1px solid var(--uni-color-border); }
.bk-day-time { display: block; height: var(--bk-hour); font-size: var(--uni-font-size-xs); color: var(--uni-color-text-muted); padding: 0 var(--uni-space-2); }
.bk-day-col { border-right: 1px solid var(--uni-color-border); min-width: 0; }
.bk-day-col:last-child { border-right: 0; }
.bk-day-col-head {
    height: var(--uni-space-8); display: flex; align-items: center; padding: 0 var(--uni-space-3);
    font-weight: 600; font-size: var(--uni-font-size-sm); border-bottom: 1px solid var(--uni-color-border);
    position: sticky; top: 0; background: var(--uni-color-surface);
}
/* Profissional fora da jornada no dia (feriado, folga, exceção): motivo no cabeçalho e coluna hachurada. */
.bk-day-col-off { margin-left: var(--uni-space-2); font-weight: 400; font-size: var(--uni-font-size-xs); color: var(--uni-color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bk-day-col.is-off .bk-day-col-body { background-color: var(--uni-color-neutral-soft); }
/* UNIPLIM-MVP-V2 TC-03 (RES-UI-01) — intervalo fora da jornada dentro do dia. */
.bk-gap {
    --bk-top: 0;
    --bk-height: 0;
    position: absolute; left: 0; right: 0; pointer-events: none;
    top: calc(var(--bk-top) * var(--bk-hour)); height: calc(var(--bk-height) * var(--bk-hour));
    background-color: var(--uni-color-neutral-soft);
}
.bk-day-col-body {
    position: relative; height: calc(var(--bk-hour) * var(--bk-hours));
    background-image: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--bk-hour) - 1px), var(--uni-color-border) calc(var(--bk-hour) - 1px), var(--uni-color-border) var(--bk-hour));
}
.bk-block {
    /* posição e altura vêm inline (horário da reserva) */
    --bk-top: 0;
    --bk-height: 0;
    position: absolute; left: var(--uni-space-1); right: var(--uni-space-1);
    top: calc(var(--bk-top) * var(--bk-hour)); height: calc(var(--bk-height) * var(--bk-hour));
    display: flex; flex-direction: column; align-items: flex-start; gap: 0; overflow: hidden; text-align: left;
    padding: var(--uni-space-1) var(--uni-space-2); border-radius: var(--uni-radius-md); border: 1px solid var(--uni-color-border);
    cursor: pointer; font-size: var(--uni-font-size-xs);
}
.bk-block:focus-visible { outline: 2px solid var(--uni-color-focus-ring); outline-offset: 1px; }
.bk-block-time { font-weight: 700; }
.bk-block-title { font-weight: 600; color: var(--uni-color-text); }
.bk-block-sub { color: var(--uni-color-text-muted); }
.bk-block > span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* UNIPLIM-V2-COR-01 (OVV-F97) — reservas que se cruzam dividem a largura da coluna em raias (--bk-lane/--bk-lanes vêm inline,
   BookingDayLayout), lado a lado, com a borda esquerda de conflito; antes o bloco de cima escondia o de baixo inteiro. */
.bk-block {
    --bk-lane: 0;
    --bk-lanes: 1;
    left: calc(var(--uni-space-1) + (100% - var(--uni-space-2)) * var(--bk-lane) / var(--bk-lanes));
    right: auto;
    width: calc((100% - var(--uni-space-2)) / var(--bk-lanes));
}
.bk-block.is-overlap {
    width: calc((100% - var(--uni-space-2)) / var(--bk-lanes) - 2px);
    border-left: 3px solid var(--uni-color-warning);
    z-index: 1;
}
.bk-block.is-overlap:hover, .bk-block.is-overlap:focus-visible { z-index: 2; }
/* Bloco curto (menos de 45 min): uma linha "início–fim nome", sem quebrar; o detalhe completo fica no title/aria-label. */
.bk-block.is-short { justify-content: center; padding-top: 0; padding-bottom: 0; }
.bk-block-line { display: block; }
/* OVV-F95 — conclusão aguardando validação: borda tracejada no bloco e o selo em texto. */
.bk-block.is-review-pending { border-style: dashed; border-color: var(--uni-color-warning); }
.bk-block-flag { font-weight: 600; color: var(--uni-color-text); }
.bk-badge-conflict { background: var(--uni-color-danger-soft); color: var(--uni-color-text); }
.bk-row-badges { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--uni-space-1); }
.bk-row-end { display: block; font-weight: 400; color: var(--uni-color-text-muted); font-size: var(--uni-font-size-sm); }
.bk-toolbar[aria-busy="true"] ~ .bk-day, .bk-toolbar[aria-busy="true"] ~ .bk-list { opacity: .7; transition: opacity .15s; }

/* ---------- lista / celular ---------- */
.bk-list, .bk-day-mobile { display: flex; flex-direction: column; gap: var(--uni-space-2); }
.bk-list-day { font-size: var(--uni-font-size-sm); color: var(--uni-color-text-muted); margin: var(--uni-space-4) 0 var(--uni-space-1); }
.bk-row {
    display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--uni-space-3); width: 100%;
    min-height: calc(var(--uni-space-8) * 1.4); padding: var(--uni-space-3); text-align: left;
    background: var(--uni-color-surface); border: 1px solid var(--uni-color-border); border-radius: var(--uni-radius-md); color: var(--uni-color-text);
}
.bk-row:hover { border-color: var(--uni-color-border-strong); }
.bk-row:focus-visible { outline: 2px solid var(--uni-color-focus-ring); }
.bk-row-time { font-weight: 700; font-variant-numeric: tabular-nums; }
.bk-row-main { display: flex; flex-direction: column; min-width: 0; }
.bk-row-sub { color: var(--uni-color-text-muted); font-size: var(--uni-font-size-sm); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 767px) {
    .bk-day-mobile.uni-mobile-only { display: flex !important; }
    .bk-row { grid-template-columns: auto 1fr; }
    .bk-row .bk-badge { grid-column: 2; justify-self: start; }
    .bk-row .bk-row-badges { grid-column: 2; justify-content: flex-start; }
    .bk-row .bk-row-badges .bk-badge { grid-column: auto; }
}

/* ---------- horários livres ---------- */
.bk-slots { margin-top: var(--uni-space-5); }
.bk-slots-title { font-size: var(--uni-font-size-sm); font-weight: 700; margin-bottom: var(--uni-space-2); }
.bk-slot-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(calc(var(--uni-space-8) * 2.2), 1fr)); gap: var(--uni-space-2); }
.bk-slot {
    display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: calc(var(--uni-space-8) * 1.1);
    padding: var(--uni-space-2); border-radius: var(--uni-radius-md); border: 1px solid var(--uni-color-border);
    background: var(--uni-color-surface); color: var(--uni-color-text); cursor: pointer;
}
.bk-slot:hover { border-color: var(--uni-color-primary); }
.bk-slot.is-selected { background: var(--uni-color-primary); border-color: var(--uni-color-primary); color: var(--uni-color-on-primary); }
.bk-slot-time { font-weight: 700; font-variant-numeric: tabular-nums; }
.bk-slot-pro { font-size: var(--uni-font-size-xs); opacity: .85; }
.bk-summary { display: flex; flex-direction: column; gap: var(--uni-space-2); margin-top: var(--uni-space-4); padding: var(--uni-space-3); border-radius: var(--uni-radius-md); background: var(--uni-color-neutral-soft); }

/* ---------- detalhe ---------- */
.bk-detail { display: flex; flex-direction: column; gap: var(--uni-space-3); }
.bk-detail-badges { display: flex; flex-wrap: wrap; align-items: center; gap: var(--uni-space-2); }
.bk-detail-item { display: flex; flex-direction: column; gap: var(--uni-space-1); padding: var(--uni-space-3); border: 1px solid var(--uni-color-border); border-radius: var(--uni-radius-md); }
.bk-money { display: grid; grid-template-columns: repeat(auto-fit, minmax(calc(var(--uni-space-8) * 3), 1fr)); gap: var(--uni-space-2); margin: 0; }
.bk-money div { padding: var(--uni-space-2) var(--uni-space-3); border-radius: var(--uni-radius-md); background: var(--uni-color-neutral-soft); }
.bk-money dt { font-size: var(--uni-font-size-xs); color: var(--uni-color-text-muted); font-weight: 500; }
.bk-money dd { margin: 0; font-weight: 700; font-variant-numeric: tabular-nums; }
.bk-notes { white-space: pre-wrap; color: var(--uni-color-text); }
.bk-charge { display: flex; flex-wrap: wrap; align-items: center; gap: var(--uni-space-2); padding: var(--uni-space-2) 0; border-bottom: 1px solid var(--uni-color-border); }
.bk-charge-actions { display: flex; flex-wrap: wrap; gap: var(--uni-space-2); margin-top: var(--uni-space-2); }
/* UNIPLIM-MVP-V2 TC-03 (OD-05=C) — condições da reserva apresentadas/aceitas. */
.bk-terms { margin: 0; padding-left: var(--uni-space-5); display: grid; gap: var(--uni-space-1); font-size: var(--uni-font-size-sm); color: var(--uni-color-text); }
.bk-pix { display: block; width: 100%; word-break: break-all; font-size: var(--uni-font-size-xs); padding: var(--uni-space-2); border-radius: var(--uni-radius-sm); background: var(--uni-color-neutral-soft); }
.bk-timeline { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--uni-space-2); font-size: var(--uni-font-size-sm); }

/* ---------- jornada semanal ---------- */
.wf-week { display: flex; flex-direction: column; gap: var(--uni-space-2); }
.wf-week-day { padding: var(--uni-space-3); border: 1px solid var(--uni-color-border); border-radius: var(--uni-radius-md); background: var(--uni-color-surface); }
.wf-week-day.is-off { background: var(--uni-color-neutral-soft); }
.wf-week-day-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--uni-space-2); }
.wf-week-day-closed { color: var(--uni-color-text-muted); font-size: var(--uni-font-size-sm); }
.wf-week-day-actions { display: flex; align-items: center; gap: var(--uni-space-1); }
.wf-week-periods { display: flex; flex-direction: column; gap: var(--uni-space-2); margin-top: var(--uni-space-2); }
.wf-week-period { display: flex; flex-wrap: wrap; align-items: center; gap: var(--uni-space-2); }
.wf-time-input { width: calc(var(--uni-space-8) * 2.2); text-align: center; font-variant-numeric: tabular-nums; }
.wf-time-sep, .wf-week-hint { color: var(--uni-color-text-muted); font-size: var(--uni-font-size-sm); }
.wf-week-overnight { font-size: var(--uni-font-size-xs); color: var(--uni-color-text); background: var(--uni-color-info-soft); padding: var(--uni-space-1) var(--uni-space-2); border-radius: var(--uni-radius-pill); }
.wf-origin { display: inline-flex; align-items: center; gap: var(--uni-space-1); font-size: var(--uni-font-size-sm); color: var(--uni-color-text-muted); margin-bottom: var(--uni-space-3); }

/* ---------- calendário mensal do profissional ---------- */
.wf-month { width: 100%; table-layout: fixed; border-spacing: var(--uni-space-1); }
.wf-month td { padding: 0; vertical-align: top; }
.wf-month-head { font-size: var(--uni-font-size-xs); color: var(--uni-color-text-muted); text-align: center; padding: var(--uni-space-1); }
.wf-month-day { width: 100%; min-width: 0; text-align: start; cursor: pointer; min-height: var(--uni-space-8); padding: var(--uni-space-1); border-radius: var(--uni-radius-sm); border: 1px solid var(--uni-color-border); font-size: var(--uni-font-size-xs); display: flex; flex-direction: column; gap: 0; }
.wf-month-day.is-work { background: var(--uni-color-success-soft); }
.wf-month-day.is-off { background: var(--uni-color-neutral-soft); color: var(--uni-color-text-muted); }
.wf-month-day.is-event { border-color: var(--uni-color-warning); }
.wf-month-day > span { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wf-month-day.is-adjacent { color: var(--uni-color-text-muted); background: var(--uni-color-neutral-soft); }
.wf-month-day:focus-visible { outline: var(--uni-space-1) solid var(--uni-color-primary); }
.wf-day-details { display: flex; flex-direction: column; gap: var(--uni-space-3); overflow-wrap: anywhere; }
.wf-month-num { font-weight: 700; }

/* ---------- listas de cadastro ---------- */
.wf-list { display: flex; flex-direction: column; gap: var(--uni-space-2); }
.wf-item {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--uni-space-3);
    padding: var(--uni-space-3); border: 1px solid var(--uni-color-border); border-radius: var(--uni-radius-md); background: var(--uni-color-surface);
}
.wf-item-main { display: flex; flex-direction: column; min-width: 0; }
.wf-item-title { font-weight: 600; color: var(--uni-color-text); }
.wf-item-sub { color: var(--uni-color-text-muted); font-size: var(--uni-font-size-sm); overflow: hidden; text-overflow: ellipsis; }
.wf-item-open { all: unset; cursor: pointer; display: flex; flex-direction: column; min-width: 0; }

/* UNIPLIM-V2-J6-STRUCTURAL-N2 (OVV-F82) — aviso de localidade incompleta (a unidade não fecha num tipo de feriado) e o quadro
   "unidades alcançadas" do cadastro de feriado. Tokens semânticos: claro e escuro. */
.wf-locality-issue { display: inline-flex; align-items: flex-start; gap: var(--uni-space-1); margin-top: var(--uni-space-1); padding: 2px var(--uni-space-2); border-radius: var(--uni-radius-sm); background: var(--uni-color-warning-soft); color: var(--uni-color-text); font-size: var(--uni-font-size-sm); white-space: normal; }
.wf-locality-issue .crm-icon { flex: none; color: var(--uni-color-warning); }
.wf-holiday-reach { margin-top: var(--uni-space-4); padding: var(--uni-space-3); border: 1px solid var(--uni-color-border); border-radius: var(--uni-radius-md); background: var(--uni-color-surface); }
.wf-holiday-reach-title { margin: 0 0 var(--uni-space-2); font-size: var(--uni-font-size-sm); font-weight: 700; color: var(--uni-color-text); }
.wf-holiday-reach ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--uni-space-1); }
.wf-holiday-reach li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--uni-space-2); font-size: var(--uni-font-size-sm); color: var(--uni-color-text); }
.wf-holiday-reach .is-open { color: var(--uni-color-text-muted); }
.wf-holiday-reach-empty { margin: 0; font-size: var(--uni-font-size-sm); color: var(--uni-color-text-muted); }
.wf-item-open:focus-visible { outline: 2px solid var(--uni-color-focus-ring); border-radius: var(--uni-radius-sm); }
.wf-card-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--uni-space-2); margin: var(--uni-space-4) 0 var(--uni-space-2); }
.wf-card-title { font-size: var(--uni-font-size-md); font-weight: 700; margin: 0; }
.wf-conflicts { list-style: none; padding: 0; margin: var(--uni-space-2) 0 0; display: flex; flex-direction: column; gap: var(--uni-space-1); font-size: var(--uni-font-size-sm); }

/* ---------- comissões e metas ---------- */
.ic-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(calc(var(--uni-space-8) * 4), 1fr)); gap: var(--uni-space-3); margin: var(--uni-space-4) 0; }
.ic-kpi { padding: var(--uni-space-3) var(--uni-space-4); border: 1px solid var(--uni-color-border); border-radius: var(--uni-radius-md); background: var(--uni-color-surface); }
.ic-kpi-label { font-size: var(--uni-font-size-xs); color: var(--uni-color-text-muted); }
.ic-kpi-value { font-size: var(--uni-font-size-xl); font-weight: 700; font-variant-numeric: tabular-nums; color: var(--uni-color-text); }
.ic-progress { height: var(--uni-space-2); border-radius: var(--uni-radius-pill); background: var(--uni-color-neutral-soft); overflow: hidden; }
.ic-progress > span { display: block; height: 100%; background: var(--uni-color-primary); }
.ic-amount { font-weight: 700; font-variant-numeric: tabular-nums; }
.ic-amount.is-negative { color: var(--uni-color-danger); }
.ic-tier { display: grid; grid-template-columns: 1fr 1fr 1fr auto; gap: var(--uni-space-2); align-items: end; }
@media (max-width: 767px) {
    .ic-tier { grid-template-columns: 1fr 1fr; }
    .wf-item { grid-template-columns: 1fr; }
}

/* OVV2 F10: exceção local autorizada; Cancelar permanece no formulário de Nova meta. */
@media (max-width: 767px) {
    .ic-goal-modal > .uni-modal-footer { flex-direction: row; flex-wrap: wrap; align-items: center; }
    .ic-goal-modal > .uni-modal-footer > .app-button { flex: 1 1 auto; min-width: 0; min-height: var(--uni-space-8); white-space: normal; overflow-wrap: anywhere; }
}

/* OVV2 F11: respiro somente das listas que começam logo abaixo das abas (Progresso preenchido e Configuração —
   LAUNCH-CLOSURE-01 GUIDED-F11). Regras/Metas/Comissões já começam com bloco que tem margem própria. */
.ic-progress-list,
.ic-config-list { margin-block-start: var(--uni-space-4); }

/* LAUNCH-CLOSURE-01 GUIDED-F23 — aviso de conclusões pendentes no celular: as ações descem para baixo do texto e quebram
   em linhas, em vez de disputar a largura com ele (local à Agenda; a primitiva UniSectionAlert não muda). */
@media (max-width: 767px) {
    .bk-pending-alert { flex-wrap: wrap; }
    .bk-pending-alert .uni-section-alert-action { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: var(--uni-space-2); }
    .bk-pending-alert .uni-section-alert-action .app-button { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
}