/* =========================================================
   MODELIC — Identidade visual
   ========================================================= */
:root {
  --color-primary: #7C00F5;
  --color-primary-dark: #5A00B0;
  --color-primary-light: #C8A4FF;
  --color-primary-soft: #E9D7FF;
  --color-bg: #ffffff;
  --color-bg-soft: #f1f1f3;
  --color-bg-dark: #1a1a1a;
  --color-text: #1c1c1e;
  --color-text-muted: #6b6b73;
  --color-border: #d6d6dc;
  --color-error: #e23b3b;
  --color-success: #1aaa61;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 22px;
  --radius-pill: 999px;
  --shadow-md: 0 10px 40px rgba(0,0,0,0.18);
  --shadow-card: 0 20px 60px rgba(0,0,0,0.25);
  --font-base: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
}





/*FORMULARIOS DE TESTE*/
.test-fill{
    display: none !important;
}




/* =========================================================
   Reset + Mobile-Safety Layer (global)
   - Previne scroll horizontal acidental no mobile
   - Garante box-sizing em todo elemento (inclusive pseudo)
   - Quebra palavras/URLs longas dentro de qualquer container
   - Typography fluida via clamp() escalando entre mobile e desktop
   - Inputs >=16px (iOS Safari não dá zoom automático)
   - Respeita safe-area-inset (iPhone notch)
   ========================================================= */
*, *::before, *::after { box-sizing: border-box; min-width: 0; }
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
}
html, body {
  margin: 0;
  padding: 0;
  max-width: 100%;
  overflow-x: hidden;
}
body {
  font-family: var(--font-base);
  color: var(--color-text);
  background: var(--color-bg);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* fonte-base fluida: 14px mobile → 16px desktop, sem saltos */
  font-size: clamp(14px, 0.85rem + 0.25vw, 16px);
  line-height: 1.45;
  overflow-wrap: break-word;
  word-wrap: break-word;
  -webkit-tap-highlight-color: rgba(124, 0, 245, 0.15);
}
img, svg, video, canvas, picture, iframe, object, embed {
  max-width: 100%;
  height: auto;
  display: block;
}
iframe { border: 0; }
table {
  max-width: 100%;
  border-collapse: collapse;
}
/* Conteúdo longo (URLs, código, pre) nunca estoura container */
pre, code, kbd, samp { max-width: 100%; overflow: auto; word-break: break-word; }
p, li, dd, dt, h1, h2, h3, h4, h5, h6, span, a, label, td, th, div {
  overflow-wrap: break-word;
  word-wrap: break-word;
}
/* Inputs/labels herdam font p/ consistência */
input, select, textarea, button { font-family: inherit; color: inherit; }
/* iOS Safari: input < 16px causa zoom automático no focus — bloquear */
input[type="text"], input[type="email"], input[type="tel"], input[type="password"],
input[type="number"], input[type="search"], input[type="url"], input[type="date"],
input[type="datetime-local"], input[type="time"], input[type="month"], input[type="week"],
select, textarea {
  font-size: max(16px, 1rem);
}
@media (min-width: 768px) {
  input[type="text"], input[type="email"], input[type="tel"], input[type="password"],
  input[type="number"], input[type="search"], input[type="url"], input[type="date"],
  input[type="datetime-local"], input[type="time"], input[type="month"], input[type="week"],
  select, textarea {
    font-size: 0.95rem;
  }
}
a { color: var(--color-primary); text-decoration: none; }
button { font-family: inherit; cursor: pointer; background: none; border: 0; padding: 0; color: inherit; }

/* Safe-area iOS (notch / home indicator) */
@supports (padding: env(safe-area-inset-top)) {
  body {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
}

/* Helper utilitárias mobile-safety (opcional, podem ser aplicadas em containers críticos) */
.ms-clip { overflow: hidden; }
.ms-fit  { max-width: 100%; width: 100%; }
.ms-stack { display: flex; flex-direction: column; gap: 12px; }
@media (min-width: 768px) { .ms-stack { gap: 16px; } }

/* =========================================================
   DIAS DO EVENTO — chips selecionáveis no add-modelo/staff
   ========================================================= */
.dias-evento-bar { display: flex; flex-direction: column; gap: 8px; align-items: stretch; }
.dias-evento-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.dia-chip {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 7px 12px; border-radius: 999px;
  background: #f5f3fa; color: #555;
  border: 1.5px solid transparent;
  font-size: 12.5px; font-weight: 700;
  font-family: inherit; cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .1s ease;
  min-width: 0;
}
.dia-chip:hover { background: #ede9fe; color: var(--color-primary-dark, #5A00B0); }
.dia-chip.is-on {
  background: linear-gradient(135deg, #7C00F5 0%, #5A00B0 100%);
  color: #fff; border-color: var(--color-primary-dark, #5A00B0);
  box-shadow: 0 3px 10px rgba(124,0,245,.25);
}
.dia-chip.is-on:hover { transform: translateY(-1px); }
.dias-evento-actions {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11.5px; color: #888;
}
.dias-evento-sep { color: #ccc; }
.btn-link-mini {
  background: none; border: 0; padding: 0;
  color: var(--color-primary, #7C00F5);
  font-family: inherit; font-size: 11.5px; font-weight: 700;
  cursor: pointer; text-decoration: underline;
}
.btn-link-mini:hover { color: var(--color-primary-dark, #5A00B0); }

/* =========================================================
   CALENDAR MODAL — abre quando o usuário clica o primeiro dia
   ========================================================= */
.cal-modal {
  position: fixed; inset: 0;
  z-index: 999999999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.cal-modal.is-open { display: flex; }
.cal-modal-backdrop {
  position: absolute; inset: 0;
  background: rgba(0, 0, 0, 0.78);
  backdrop-filter: blur(3px);
}
.cal-modal-dialog {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 720px;
  max-height: calc(100vh - 32px);
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 30px 80px rgba(0,0,0,0.45);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.cal-modal-head {
  padding: 18px 22px;
  border-bottom: 1px solid #ece9f7;
  background: linear-gradient(135deg, #7C00F5 0%, #5A00B0 100%);
  color: #fff;
}
.cal-modal-head h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-align: center;
}
.cal-modal-head h3 strong { font-weight: 900; }
.cal-modal-body {
  padding: 20px 18px;
  overflow-y: auto;
  flex: 1;
  background: #fafaff;
}
body.cal-modal-open { overflow: hidden !important; }

/* =========================================================
   Header / Topo
   ========================================================= */


#form-evento{
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    transition: max-width .3s ease;
}
#form-evento[data-step="2"]{ max-width: 1200px; }

.topbar {
  position: relative;
  width: 100%;
  background: var(--color-bg-dark);
  color: #fff;
  overflow: hidden;
}
.topbar .topbar-bg {
  position: absolute;
  inset: 0;
  background: url('../img/header-bg.svg') center / cover no-repeat;
  filter: grayscale(100%) brightness(0.55);
  z-index: 0;
}
.topbar-inner {
  position: relative;
  z-index: 1;
  padding: 28px 40px 80px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  min-height: 220px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
}
.brand-logo {
  width: 56px;
  height: auto;
}
.brand-name {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: 2px;
  color: #fff;
}
.topbar-actions {
  display: flex;
  gap: 10px;
}
.icon-btn {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--color-bg-dark);
  border: none;
  border-radius: var(--radius-sm);
  transition: transform .15s ease, background .15s ease;
}
.icon-btn:hover { background: var(--color-primary-soft); transform: translateY(-1px); }
.icon-btn svg { width: 20px; height: 20px; }

.page-title {
  position: relative;
  z-index: 1;
  color: #fff;
  font-size: clamp(28px, 5vw, 48px);
  font-weight: 300;
  letter-spacing: 4px;
  margin: 0;
  padding: 0 40px 30px;
}

/* =========================================================
   Container / Layout
   ========================================================= */
.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}
.page-wrap {
  background: var(--color-bg);
  padding-bottom: 60px;
}
.form-wrapper {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 40px;
  align-items: start;
  margin-top: -50px;
  position: relative;
  z-index: 2;
}
.form-card {
  background: var(--color-bg-soft);
  padding: 36px 32px;
  border-radius: var(--radius-md);
}
.form-aside {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 30px;
}
.form-aside img {
  max-width: 100%;
  opacity: .8;
}

/* =========================================================
   Tipo de conta (radio cards)
   ========================================================= */
.account-type {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 32px;
}
.type-option {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  background: #fff;
  border-radius: var(--radius-pill);
  border: 1px solid transparent;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
  font-weight: 600;
  font-size: 14px;
}
.type-option:hover { background: #f7f0ff; }
.type-option input { display: none; }
.type-option .radio-dot {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid var(--color-text-muted);
  position: relative;
  flex-shrink: 0;
  background: #fff;
}
.type-option input:checked + .radio-dot {
  border-color: var(--color-primary);
}
.type-option input:checked + .radio-dot::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--color-primary);
}
.type-option.is-active {
  background: var(--color-primary-light);
  border-color: var(--color-primary);
}

/* =========================================================
   Form sections (CONTATO, DADOS, etc.)
   ========================================================= */
.form-section { margin-bottom: 26px; }
.form-section h3 {
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 1px;
  margin: 0 0 14px;
  text-transform: uppercase;
}
.form-row {
  display: grid;
  grid-template-columns: 140px 1fr;
  align-items: center;
  gap: 10px;
  padding: 0px;
  border-radius: var(--radius-sm);
  background: #fff;
  margin-bottom: 8px;
}
.form-row label {
  font-size: 13px;
  font-weight: 700;
  text-align: right;
  padding-right: 10px;
  color: var(--color-text);
}
.form-row input,
.form-row select {
  width: 100%;
  height: 38px;
  padding: 0 12px;
  border: 1px solid #222;
  border-radius: var(--radius-sm);
  font-size: 14px;
  font-family: inherit;
  background: #fff;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.form-row input:focus,
.form-row select:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(124,0,245,.15);
}
.form-row .field-error,
.form-row .field-msg {
  grid-column: 2;
  font-size: 12px;
  color: var(--color-error);
  padding: 0 4px;
    font-weight: 900;
}
.form-row.has-error input,
.form-row.has-error select,
.form-row.has-error textarea { border: 2px solid var(--color-error); }
.form-row.has-error label { color: var(--color-error); }
.form-row.has-error .field-error { display: block; }

/* Botão de cadastro bloqueado (e-mail/usuário/CNPJ em uso) */
.btn.is-blocked,
.btn.is-blocked:hover {
  background: #cfc9dd;
  color: #fff;
  box-shadow: none;
  cursor: not-allowed;
}

/* ==========================================================
   FORM LOADING OVERLAY — login + cadastro
   Aparece em cima dos campos enquanto o servidor processa.
   ========================================================== */
form { position: relative; }
.form-loading {
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, .88);
  backdrop-filter: blur(2px);
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 14px;
  z-index: 10;
  border-radius: 14px;
  opacity: 0;
  transition: opacity .15s ease;
}
form.is-loading > .form-loading {
  display: flex;
  opacity: 1;
  animation: formLoadingFade .15s ease forwards;
}
.form-loading-spinner {
  width: 44px;
  height: 44px;
  border: 4px solid rgba(124, 0, 245, .15);
  border-top-color: var(--color-primary);
  border-radius: 50%;
  animation: formLoadingSpin .8s linear infinite;
}
.form-loading-text {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--color-primary);
  letter-spacing: .02em;
  text-align: center;
  padding: 0 16px;
  max-width: 280px;
}
@keyframes formLoadingSpin {
  to { transform: rotate(360deg); }
}
@keyframes formLoadingFade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
/* Bloqueia interação enquanto carregando */
form.is-loading input,
form.is-loading select,
form.is-loading button,
form.is-loading textarea {
  pointer-events: none;
  user-select: none;
}
/* Lista de motivos ao tentar cadastrar com pendências */
.cad-reasons {
  background: #fdf2f2;
  border: 1.5px solid #e23b3b;
  border-radius: 12px;
  padding: 14px 16px;
  margin: 8px 0 16px;
  color: #991b1b;
  font-size: 13.5px;
  box-shadow: 0 4px 14px rgba(226,59,59,.10);
}
.cad-reasons strong { display: block; margin-bottom: 6px; font-size: 14px; color: #7c0a0a; }
.cad-reasons ul { margin: 0; padding-left: 20px; }
.cad-reasons li { margin: 3px 0; }
/* Flash de atenção ao clicar no botão bloqueado */
@keyframes cadFlash {
  0%   { transform: scale(1);    box-shadow: 0 0 0 0 rgba(226,59,59,.0); }
  30%  { transform: scale(1.02); box-shadow: 0 0 0 10px rgba(226,59,59,.18); }
  100% { transform: scale(1);    box-shadow: 0 4px 14px rgba(226,59,59,.10); }
}
.cad-reasons.cad-flash { animation: cadFlash .55s ease-out; }
.form-row .double {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 8px;
}

/* Seção empresas de teste */
.test-fill {
  background: #fff4d6;
  border: 1px dashed #d8b94a;
  padding: 14px 16px 6px;
  border-radius: var(--radius-sm);
}
.test-fill h3 { color: #8a6a00; }
.test-fill .form-row { background: #fffbe9; }

/* CNPJ helper message style (inline) */
.cnpj-msg {
  font-size: 13px;
  color: var(--color-error);
  font-weight: 600;
  padding: 0 6px;
}
.cnpj-msg.is-ok { color: var(--color-success); }

/* =========================================================
   Botões
   ========================================================= */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: none;
  border-radius: var(--radius-pill);
  padding: 14px 28px;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  transition: transform .12s ease, background .15s ease, color .15s ease, box-shadow .15s ease;
}
.btn-primary {
  background: var(--color-primary);
  color: #fff;
}
.btn-primary:hover { background: var(--color-primary-dark); }
.btn-primary:active { transform: translateY(1px); }
.btn-outline {
  background: transparent;
  color: var(--color-primary);
  border: 2px solid var(--color-primary);
}
.btn-outline:hover { background: var(--color-primary); color: #fff; }
.btn-block { width: 100%; }

.actions-bottom {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px dashed #b9b9c1;
  /* sombra superior sutil para destacar da área de conteúdo */
  box-shadow: 0 -8px 20px rgba(20,0,60,.06);
  background: #fff;
}

/* =========================================================
   Tela de Login (Mobile First) — 2 sessões: LOGIN e CADASTRE-SE
   Mobile: tabs alternam as seções → Desktop ≥900px: lado-a-lado
   ========================================================= */
.login-page {
  min-height: 100vh;
  background: #f4f4f4;
  padding: 0;
  margin: 0;
}

.login-shell {
  min-height: 100vh;
  max-width: 1180px;
  margin: 0 auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Topbar com logo */
.login-topbar {
  padding: 6px 6px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.login-topbar .dash-logo .name { display: none; }
.login-topbar .dash-logo .logo-icon { background: transparent; }

/* Tabs (visíveis em todas as telas) */
.login-tabs {
  background: #fff;
  border-radius: 14px;
  padding: 6px;
  box-shadow: 0 4px 14px rgba(20,0,60,.05);
  margin-bottom: 14px;
}

  .login-tabs { max-width: 520px; margin-left: auto; margin-right: auto; }


.login-tab {
  flex: 1;
  border: none;
  background: transparent;
  padding: 12px 20px;
  font-family: inherit;
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--color-text-muted);
  border-radius: 10px;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.login-tab:hover { color: var(--color-primary); }
.login-tab.is-active {
  background: var(--color-primary);
  color: #fff;
  box-shadow: 0 4px 14px rgba(124,0,245,.25);
}

/* Grid das duas seções */
.login-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

/* Cada seção é um card branco */
.login-panel {
  background: #fff;
  border-radius: 22px;
  padding: 28px 22px 32px;
  box-shadow: 0 8px 30px rgba(20,0,60,.05);
  display: none;
}
.login-panel.is-active { display: block; }
.login-panel h1 {
  font-size: 26px;
  font-weight: 800;
  margin: 0 0 6px;
  letter-spacing: -.5px;
}
.login-panel .small { font-size: 13px; margin: 0 0 22px; }
.login-panel .muted { color: var(--color-text-muted); }

/* Cards do picker dentro do CADASTRE-SE — herdam .picker-card já existente */
.login-panel--signup .picker-cards { grid-template-columns: 1fr; }

.login-foot {
  text-align: center;
  font-size: 11px;
  color: var(--color-text-muted);
  margin-top: auto;
  padding: 8px;
}





@media screen and (max-width: 768px) {
  input, select, textarea {
    font-size: 16px !important;
  }
}




@media (max-width: 900px) {

    body {
        /*zoom: 0.6 !important;*/
    }
    /* Em mobile real (iOS/Android) o JS força viewport "virtual" — adiciona .vp-scaled.
       Nesse caso o zoom CSS vira no-op (senão fica duplicado). */
    html.vp-scaled body { zoom: 1 !important; }
    
    .dash-sidebar {
          width: 360px !important;
          height: 100%;
          overflow-y: auto;
        }


  .login-grid {
    grid-template-columns: 1fr;
    gap: 0;
    max-width: 520px;
    margin: 0 auto;
    width: 100%;
  }
  .login-panel {
    padding: 40px 40px 36px;
  }
  .login-panel.is-active { display: block; }
  .login-panel:not(.is-active) { display: none; }
  .login-panel h1 { font-size: 30px; }
  .login-topbar { padding: 16px 6px 8px; }
}

@media (min-width: 1100px) {
  .login-panel { padding: 52px 56px 44px; }
  .login-panel h1 { font-size: 34px; }
}

/* Botão Google */
.btn-google {
  background: #fff;
  color: var(--color-primary);
  border: 2px solid var(--color-primary);
  font-weight: 700;
  letter-spacing: 1px;
  width: 100%;
}
.btn-google:hover { background: var(--color-primary-soft); }
.btn-google img { width: 22px; height: 22px; }

/* Separator OU */
.separator {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--color-text-muted);
  font-size: 12px;
  margin: 22px 0;
}
.separator::before,
.separator::after {
  content: '';
  flex: 1;
  height: 1px;
  background: #c5c5cc;
}

/* Inputs login */
.field {
  position: relative;
  margin-bottom: 18px;
}
.field input {
  width: 100%;
  border: none;
  border-bottom: 1px solid var(--color-border);
  background: transparent;
  padding: 16px 0 8px;
  font-size: 14px;
  font-family: inherit;
  outline: none;
  transition: border-color .2s ease;
}
.field input:focus { border-bottom-color: var(--color-primary); }
.field label {
  position: absolute;
  top: 16px;
  left: 0;
  color: var(--color-text-muted);
  pointer-events: none;
  transition: all .2s ease;
  font-size: 14px;
}
.field input:focus ~ label,
.field input:not(:placeholder-shown) ~ label {
  top: 0;
  font-size: 11px;
  color: var(--color-primary);
}
.field .toggle-pass {
  position: absolute;
  right: 0;
  top: 14px;
  border: none;
  background: none;
  color: var(--color-text);
  padding: 4px;
}
.field .toggle-pass svg { width: 22px; height: 22px; }
.field .toggle-pass .eye-on { display: none; }
.field .toggle-pass.is-open .eye-off { display: none; }
.field .toggle-pass.is-open .eye-on { display: block; }
.field .toggle-pass.is-open { color: var(--color-primary); }

.forgot {
  display: block;
  width: 100%;
  text-align: center;
  color: var(--color-text);
  font-size: 14px;
  margin: 18px 0 22px;
  background: none;
  border: none;
  font-family: inherit;
  cursor: pointer;
}
.forgot:hover { color: var(--color-primary); }

/* Recuperar senha — sucesso */
.rec-check {
  width: 56px; height: 56px; border-radius: 50%;
  background: #eafaf1; color: var(--color-success, #2bb673);
  display: inline-flex; align-items: center; justify-content: center;
}
.rec-check--mail { background: var(--color-primary-soft); color: var(--color-primary-dark); }

/* =========================================================
   Mensagens flash
   ========================================================= */
.flash {
  padding: 12px 18px;
  border-radius: var(--radius-sm);
  font-size: 14px;
  margin-bottom: 16px;
}
.flash.success { background: #ddf6e9; color: #157a48; }
.flash.error   { background: #fde2e2; color: #a82424; }

/* =========================================================
   Botões auxiliares
   ========================================================= */
.btn-sm { padding: 9px 16px; font-size: 12px; }
.btn-light {
  background: rgba(255,255,255,.92);
  color: var(--color-primary);
  border: none;
}
.btn-light:hover { background: #fff; }
.btn-ghost-light {
  background: transparent;
  color: rgba(255,255,255,.85);
  border: 1.5px solid rgba(255,255,255,.4);
}
.btn-ghost-light:hover { background: rgba(255,255,255,.12); color: #fff; }
.btn-ghost {
  background: transparent;
  color: var(--color-text-muted);
  border: 1.5px solid var(--color-border);
}
.btn-ghost:hover { color: var(--color-primary); border-color: var(--color-primary); }
.btn-dark {
  background: #232323;
  color: #fff;
}
.btn-dark:hover { background: #000; }
.btn-danger {
  background: #e23b3b;
  color: #fff;
}
.btn-danger:hover { background: #c12727; }

/* Section note (legenda dentro de seção do form) */
.section-note {
  font-size: 12px;
  color: var(--color-text-muted);
  margin: -8px 0 12px;
}

/* Textarea como o restante dos inputs */
.form-row textarea {
  width: 100%;
  min-height: 80px;
  padding: 10px 12px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-size: 14px;
  font-family: inherit;
  resize: vertical;
  outline: none;
}
.form-row textarea:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(124,0,245,.15);
}

/* =========================================================
   MODAL — Mobile First
   ========================================================= */
.modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: none;
  align-items: stretch;
  justify-content: center;
}
.modal.is-open { display: flex; }
.modal-backdrop {
  position: absolute; inset: 0;
  background: rgba(20,0,60,.55);
  backdrop-filter: blur(2px);
}
/* Modal de seleção de perfis: backdrop opaco e z-index alto */
#modal-slot-picker { z-index: 9000 !important; }
#modal-slot-picker .modal-backdrop { background: rgba(20,0,60,.92); backdrop-filter: blur(4px); }
/* Modal Ver Perfil precisa abrir POR CIMA do .ctr-select-modal (z-index 9000) */
#modal-perfil-view { z-index: 9500 !important; }
.modal-dialog {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  background: #fff;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 0;
}
.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 18px;
  border-bottom: 1px solid #eee;
  background: #fff;
  position: sticky;
  top: 0;
  z-index: 2;
}
.modal-header h2 {
  font-size: 18px;
  font-weight: 800;
  margin: 0;
}
.modal-close {
  width: 36px; height: 36px;
  border-radius: 50%;
  border: none;
  background: #f3eefe;
  color: var(--color-primary);
  font-size: 22px;
  font-weight: 700;
  cursor: pointer;
}
.modal-body {
  padding: 18px;
    padding-bottom: 0px;
  overflow-y: auto;
  flex: 1;
  background: #fafaff;
}

/* === Regra obrigatória: barra de ações sempre fixa na base do modal === */
.modal-body .actions-bottom {
  position: sticky;
  bottom: 0;
  background: #fff;
  margin: 18px -18px -18px;   /* quebra o padding do modal-body */
  padding: 16px 18px;
  border-top: 1px solid #eee;
  box-shadow: 0 -8px 20px rgba(20,0,60,.06);
  z-index: 2;
}

/* Form de cadastro dentro do modal usa o mesmo visual dos demais forms */
.modal-body #form-cadastro,
.modal-body .test-fill {
  margin-top: 0;
}
.modal-body .account-type {
  margin-top: 6px;
}

/* =========================================================
   EVENTO — formulário 2 etapas
   ========================================================= */
.evento-stepper {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 22px;
}
.step-pill {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 9px 14px;
  border-radius: 999px;
  background: #f5f3fa;
  color: var(--color-text-muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .2px;
  transition: background .18s ease, color .18s ease, box-shadow .18s ease;
  user-select: none;
    color: rgba(0,0,0,0.4);
}
.step-pill span {
  position: relative;
  flex: 0 0 auto;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: #fff;
  color: var(--color-text-muted);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  box-shadow: inset 0 0 0 1.5px #e3dff0;
  transition: background .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

/* === ATUAL === */
.step-pill.is-current {
  background: var(--color-primary-soft);
  color: var(--color-primary);
  cursor: default;
  box-shadow: 0 0 0 3px rgba(124, 0, 245, .08);
}
.step-pill.is-current span {
  background: var(--color-primary);
  color: #fff;
  box-shadow: inset 0 0 0 0 transparent, 0 2px 6px rgba(124, 0, 245, .35);
}

/* === CONCLUÍDA === */
.step-pill.is-done {
  cursor: pointer;
  background: #f5f3fa;
  color: #166534;
}
.step-pill.is-done:hover { background: #d8f7e3; }
.step-pill.is-done:hover span { transform: scale(1.05); }
.step-pill.is-done span {
  background: var(--color-success);
  color: transparent;          /* esconde número de forma acessível */
  font-size: 0;
  box-shadow: inset 0 0 0 0 transparent, 0 2px 6px rgba(21, 163, 74, .28);
}
/* Check SVG inline (sem font-icon, sem hack de unicode) */
.step-pill.is-done span::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='5 12 10 17 19 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

@media (max-width: 599px) {
  /* Mobile: mostra labels de todos os steps em fonte menor (mais informativo) */
  .step-pill { padding: 6px 8px; gap: 6px; font-size: 11px; }
  .step-pill.is-current { padding: 6px 10px 6px 6px; font-size: 11.5px; gap: 6px; flex: 1.2; }
}

/* Tag pill — usado em destino, modais nested e confirmação */
.tag-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  background: #fff;
  color: #222;
  border: 1px solid #ece9f7;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  margin: 3px 4px 3px 0;
}
.tag-pill--strong {
  background: #fff;
  color: #222;
  border: 2px solid #222;
}

.OA{
    font-weight: 500;
}

.tag-pill .tag-rm {
  background: rgba(0,0,0,.12);
  border: none;
  border-radius: 50%;
  width: 16px; height: 16px;
  font-size: 11px;
  line-height: 0;
  padding: 0;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.tag-pill .tag-rm:hover { background: rgba(0,0,0,.25); }
.destino-tags { margin-top: 8px; grid-column: 2; }

/* Confirmação — lista objetiva + total */
.cs-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.cs-list li {
  background: #fafbfc;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
  border-left: 3px solid #222;
  color: #222;
}
.cs-list li strong { color: #222; font-weight: 800; }

/* Total geral — destaque neutro com borda preta (não roxo) */
.cs-block.cs-total {
  background: #fff;
  border: 2px solid #222;
  text-align: center;
}
.cs-block.cs-total h4 { color: #222; }
.cs-big {
  font-size: 16px;
  font-weight: 600;
  color: #222;
  letter-spacing: -.2px;
}
.cs-big strong {
  font-size: 36px;
  font-weight: 800;
  margin-right: 8px;
  color: #222;
}

/* Show/hide das etapas (suporta 4 etapas) */
.evento-step { display: none; }
.evento-form[data-step="1"] .evento-step-1,
.evento-form[data-step="2"] .evento-step-2,
.evento-form[data-step="3"] .evento-step-3,
.evento-form[data-step="4"] .evento-step-4 { display: block; }

/* Step 3 — Destino */
.destino-options { display: flex; flex-direction: column; gap: 10px; margin: 10px 0; }
.destino-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 14px;
  padding: 14px 16px;
  border: 2px solid #ece9f7;
  border-radius: 12px;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
  background: #fff;
}
.destino-card:hover { border-color: var(--color-primary-light); background: #faf9fc; }
.destino-card input[type="radio"] { width: 18px; height: 18px; cursor: pointer; align-self: center; }
.destino-card strong { font-size: 14px; }
.destino-card span { font-size: 12px; color: #222; grid-column: 2; }
.destino-card:has(input:checked) { border-color: var(--color-primary); background: #f7f0ff; font-weight: 400 }
.destino-extra-btn {
  grid-column: 2;
  margin-top: 6px;
  font-size: 11px !important;
  padding: 6px 12px !important;
}
.destino-extra-btn .destino-summary {
  text-transform: none;
  letter-spacing: normal;
  font-weight: 600;
}

/* Grid de estados */
.estados-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(60px, 1fr));
  gap: 8px;
  margin-bottom: 14px;
}
.estado-chip {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 4px;
  border: 1.5px solid var(--color-border);
  border-radius: 8px;
  cursor: pointer;
  font-weight: 700;
  font-size: 13px;
  transition: all .15s ease;
}
.estado-chip:has(input:checked) {
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
}
.estado-chip input { display: none; }

/* Lista de agências (filtro) */
.ag-filtros {
  display: grid;
  grid-template-columns: 1fr 110px;
  gap: 8px;
  margin-bottom: 10px;
}
.ag-filtros input, .ag-filtros select {
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--color-border);
  border-radius: 7px;
  font: inherit;
  font-size: 13px;
}
.ag-lista {
  max-height: 360px;
  overflow-y: auto;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  background: #fff;
  margin-bottom: 14px;
}
.ag-item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid #f3f0fa;
  cursor: pointer;
  align-items: center;
}
.ag-item:last-child { border-bottom: none; }
.ag-item:hover { background: #faf9fc; }
.ag-item:has(input:checked) { background: #f7f0ff; }
.ag-item strong { display: block; font-size: 14px; }
.ag-item span { font-size: 12px; color: var(--color-text-muted); }

/* Step 4 — Confirmação */
.confirm-summary { display: flex; flex-direction: column; gap: 14px; margin-bottom: 10px; }
.cs-block {
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 12px;
  padding: 14px 16px;
}
.cs-block h4 {
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1px;
  color: #222;
  text-transform: uppercase;
}
.cs-block div { font-size: 13px; margin-bottom: 4px; }
.cs-block b { color: var(--color-text-muted); font-weight: 700; margin-right: 4px; }
.cs-sobre .cs-richtext {
  margin-top: 6px;
  padding: 10px 12px;
  background: #faf9fc;
  border-radius: 8px;
  font-size: 13px;
}
.cs-empty { color: var(--color-text-muted); font-style: italic; }
.cs-item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  background: #faf9fc;
  border-radius: 8px;
  margin-bottom: 6px;
}
.cs-num {
  background: var(--color-primary-soft);
  color: var(--color-primary);
  width: 36px; height: 36px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 800;
}
.cs-num--staff { background: #ffe1ee; color: #c93366; }
.cs-body strong { display: block; font-size: 13px; }
.cs-body span { display: block; font-size: 11px; color: var(--color-text-muted); }
.cs-obs { font-style: italic; }

/* ===== Calendário em RANGE (estilo Voegol — para o form de evento) ===== */
.cal-range {
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 14px;
  padding: 14px;
  position: relative;
  user-select: none;
  overflow: hidden;
}
.cal-range-viewport {
  overflow: hidden;
  position: relative;
}
.cal-range-body {
  display: flex;
  gap: 18px;
  width: 100%;
}
.cal-range-body > .cal-month-pane {
  flex: 0 0 calc(50% - 9px);
  min-width: 0;
}
.cal-month-pane { display: flex; flex-direction: column; }
.cal-month-header {
  display: grid;
  grid-template-columns: 36px 1fr 36px;
  align-items: center;
  margin-bottom: 8px;
}
.cal-nav-spacer { width: 36px; height: 32px; }
.cal-month-header .cal-title {
  text-align: center;
  font-weight: 800;
  font-size: 14px;
}
.cal-month-header .cal-title span {
  color: var(--color-text-muted);
  font-weight: 600;
  margin-left: 4px;
}
.cal-range .cal-day.is-selected,
.cal-range .cal-day.is-selected:hover {
  background: var(--color-primary);
  color: #fff;
  border-radius: 50%;
}
.cal-range .cal-day.is-in-range {
  background: var(--color-primary-soft);
  color: var(--color-primary);
  border-radius: 0;
}
.cal-range .cal-day.is-start { border-radius: 50% 0 0 50%; }
.cal-range .cal-day.is-end   { border-radius: 0 50% 50% 0; }
.cal-range .cal-day.is-start.is-end { border-radius: 50%; }

/* Preview do range durante hover (entre start e dia hovered) */
.cal-range .cal-day.is-hover-range {
  background: var(--color-primary-soft);
  color: var(--color-primary);
  border-radius: 0;
}
/* O próprio dia hovered (será o "fim" se clicado) */
.cal-range .cal-day.is-hover-end {
  background: transparent;
  color: var(--color-primary);
  border: 2px solid var(--color-primary);
  border-radius: 50%;
}
.cal-range .cal-day:hover:not(.is-disabled):not(.is-empty):not(.is-selected):not(.is-hover-end) {
  background: var(--color-primary-soft);
  color: var(--color-primary);
}

/* Tooltip flutuante "X Dias" durante hover do fim */
.cal-tooltip {
  position: absolute;
  transform: translate(-50%, -100%);
  background: #fff;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 8px;
  box-shadow: 0 6px 20px rgba(20,0,60,.18);
  border: 1px solid #ece9f7;
  pointer-events: none;
  z-index: 5;
  white-space: nowrap;
}
.cal-tooltip::after {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  width: 10px; height: 10px;
  background: #fff;
  border-right: 1px solid #ece9f7;
  border-bottom: 1px solid #ece9f7;
}

/* Hint pequeno "máximo 15 dias" ao lado da label */
.muted-hint {
  font-size: 11px;
  font-weight: 600;
  color: var(--color-text-muted);
  margin-left: 6px;
  text-transform: none;
  letter-spacing: 0;
}



.meta-row-agencia strong{
    color: var(--color-primary) !important;
    font-size: 18px !important;
}

.ck-line-agencia strong{
    color: var(--color-primary) !important;
}


/* Mobile: cal-range-body fica em coluna única (flex-wrap) — exibe um pane por vez */
@media (max-width: 600px) {
  .cal-range-body > .cal-month-pane { flex: 0 0 100%; }
}

/* ===== Calendário inline (cal-pair) — usado no form de evento ===== */
.cal-pair {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin: 6px 0 8px;
}
.cal {
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 14px;
  padding: 12px;
  user-select: none;
}
.cal.is-disabled {
  opacity: .55;
  filter: grayscale(.2);
}
.cal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
  gap: 8px;
}
.cal-title {
  font-weight: 800;
  font-size: 14px;
  text-transform: capitalize;
  flex: 1;
  text-align: center;
  letter-spacing: .3px;
}
.cal-nav {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--color-primary-soft);
  color: var(--color-primary);
  border: none;
  font-size: 18px;
  line-height: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.cal-nav:hover { background: var(--color-primary); color: #fff; }
.cal-nav:disabled { background: #f1f1f3; color: #c7c5d2; cursor: not-allowed; }
.cal-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  text-align: center;
  font-size: 10px;
  font-weight: 800;
  color: var(--color-text-muted);
  letter-spacing: .8px;
  text-transform: uppercase;
  padding: 4px 0 6px;
}
.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
}
.cal-day {
  aspect-ratio: 1;
  border: none;
  background: transparent;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-text);
  border-radius: 8px;
  cursor: pointer;
  transition: background .12s ease, color .12s ease;
}
.cal-day:hover:not(.is-disabled):not(.is-empty):not(.is-selected) { background: var(--color-primary-soft); }
.cal-day.is-today {
  outline: 1.5px dashed #e1e1e1;
  outline-offset: -2px;
}
.cal-day.is-selected,
.cal-day.is-selected:hover {
  background: var(--color-primary);
  color: #fff;
}
.cal-day.is-disabled {
  color: #c7c5d2;
  cursor: not-allowed;
}
.cal-day.is-empty { cursor: default; background: transparent; }

.cal-days-count {
  margin-top: 8px;
  background: #e1e1e1;
  color: #222;
  text-align: center;
  padding: 10px 14px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}
.cal-days-count .cdc-dates {
  font-weight: 700;
  letter-spacing: .5px;
}
.cal-days-count .cdc-sep {
  opacity: .6;
}
.cal-days-count .cdc-count {
  font-weight: 800;
  letter-spacing: 1.2px;
}
.cal-days-count.is-empty {
  background: #f5f3fa;
  color: var(--color-text-muted);
  letter-spacing: .3px;
  text-transform: none;
  font-weight: 600;
}

@media (min-width: 720px) {
  .cal-pair { grid-template-columns: 1fr 1fr; }
}

/* Padronizar larguras dos campos do form de evento — sem inline */
.evento-form .form-row input[type="text"],
.evento-form .form-row input[type="number"],
.evento-form .form-row input[type="email"],
.evento-form .form-row input[type="url"],
.evento-form .form-row select {
  width: 100%;
}
.evento-form .form-row .double { grid-template-columns: 1fr 1fr; }

/* ===== Wrapper do segundo período (toggle) ===== */
.periodo-2-wrap {
  margin: 4px 0 8px;
}
.periodo-2-wrap .js-add-periodo {
  margin: 4px 0 8px;
  letter-spacing: .4px;
  text-transform: none;
  font-weight: 700;
}
.periodo-2-wrap .periodo-2 {
  border-left: 3px solid var(--color-primary-soft);
  padding-left: 10px;
  margin-top: 4px;
}

/* Linha do Período 2: [.double | botão lixeira] */
.periodo-row-wrap {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
}

/* Botão lixeira para remover Período 2 */
.periodo-rm-btn {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  background: #fff;
  color: var(--color-text-muted);
  border: 1px solid var(--color-border);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.periodo-rm-btn:hover {
  background: #e23b3b;
  color: #fff;
  border-color: #e23b3b;
}
.periodo-rm-btn svg { display: block; }

/* ===== Modal fullscreen ===== */
.modal.modal-fullscreen .modal-dialog {
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  margin: 0;
  border-radius: 0;
}

/* Modal aninhado: sobe z-index, backdrop quase transparente para ver o modal pai */
.modal.modal-nested { z-index: 200; }
.modal.modal-nested .modal-backdrop { background: rgba(0,0,0,.8); }
.modal.modal-nested .modal-dialog { max-width: 900px !important; }

/* Modal grande (ver / editar evento) */
.modal.modal-large .modal-dialog {
  max-width: 1000px !important;
  width: calc(100% - 24px);
  max-height: calc(100% - 24px);
}
@media (min-width: 720px) {
  .modal.modal-large .modal-dialog {
    width: 100%;
    max-height: calc(100% - 48px);
  }
}

/* Em modais aninhados (add-modelo / add-staff), .double = 1fr 1fr (campos iguais) */
.modal.modal-nested .form-row .double { grid-template-columns: 1fr 1fr; }
.modal.modal-nested .form-row input,
.modal.modal-nested .form-row select { width: 100%; }

/* ===== Rich text editor ===== */
.richtext {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: #fff;
  overflow: hidden;
}
.richtext-toolbar {
  display: flex;
  gap: 4px;
  padding: 6px 8px;
  border-bottom: 1px solid #eee;
  background: #faf9fc;
}
.rt-btn {
  border: none;
  background: transparent;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 13px;
  font-family: inherit;
  color: var(--color-text);
  cursor: pointer;
}
.rt-btn:hover { background: var(--color-primary-soft); color: var(--color-primary); }
.richtext-area {
  min-height: 110px;
  padding: 10px 12px;
  outline: none;
  font-size: 14px;
  line-height: 1.5;
}
.richtext-area:empty::before {
  content: attr(data-placeholder);
  color: #aaa;
  pointer-events: none;
}
.richtext-area a { color: var(--color-primary); text-decoration: underline; }
.richtext-area ul { padding-left: 20px; margin: 6px 0; }
.richtext-area b, .richtext-area strong { font-weight: 800; }

/* form-row vertical (label em cima, campo embaixo) — útil para richtext e textarea */
.form-row.form-row-stack {
  display: block;
  padding-top: 12px;
}
.form-row.form-row-stack > label {
  display: block;
  text-align: left;
  padding: 0 0 8px;
  font-size: 12px;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: .5px;
}

/* Botões de adição de perfis (versão antiga — mantida) */
.perfis-add-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}
.perfis-add-buttons .btn {
  flex: 1;
  min-width: 220px;
}

/* =========================================================
   ETAPA 2 do evento — Seções claras Modelos / Staff
   ========================================================= */

/* Chip de contexto do evento (datas) */
.evento-context {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #f5f3fa;
  color: var(--color-text);
  font-size: 13px;
  padding: 8px 14px;
  border-radius: 999px;
  margin-bottom: 14px;
  border: 1px solid #ece9f7;
}
.evento-context svg { color: var(--color-primary); flex-shrink: 0; }
.evento-context strong { color: var(--color-text); font-weight: 700; }

/* Intro mais leve */
.step2-intro {
  background: #fff;
  border: 2px solid #222;
  border-radius: 12px;
  padding: 14px 18px;
  margin-bottom: 22px;
}
.step2-intro h3 {
  margin: 0 0 4px;
  font-size: 15px;
  font-weight: 800;
  color: #222;
  letter-spacing: -.2px;
}
.step2-intro p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--color-text-muted);
}
.step2-intro strong { color: #222; font-weight: 800; }

/* Seção (Modelos / Staff) — separadas e neutras */
.perfis-section {
  background: #fff;
  border-radius: 14px;
  border: 1px solid #ece9f7;
  margin-bottom: 18px;
  overflow: hidden;
}
.perfis-section[data-kind="modelo"] { border-top: 3px solid var(--color-primary); }
.perfis-section[data-kind="staff"]  { border-top: 3px solid #f472b6; }

.perfis-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
}
.perfis-section-title {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
}
.perfis-section-title h4 {
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -.2px;
}
.perfis-section-icon {
  width: 36px; height: 36px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--color-primary-soft);
  color: var(--color-primary);
  flex-shrink: 0;
}
.perfis-section-icon--staff {
  background: #ffe1ee;
  color: #c93366;
}
.perfis-count {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: .8px;
  margin-top: 2px;
}
.perfis-section-head .btn-sm {
  flex-shrink: 0;
  white-space: nowrap;
}

/* Lista */
.perfis-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  border-top: 1px solid #f3f0fa;
}

/* Linha "vazia" dentro da lista (some quando há cards) */
.prc-empty-row {
  padding: 18px 16px 4px;
  text-align: center;
  font-size: 13px;
  color: var(--color-text-muted);
  font-style: italic;
}

/* Linha do botão "+ Adicionar" sempre no fim da lista */
.prc-add-row {
  padding: 12px 16px 14px;
  background: #fafbfc;
  border-top: 1px dashed #ece9f7;
}
.prc-add-row .btn-outline {
  width: 100%;
  font-size: 12px;
  letter-spacing: .6px;
}

/* Card do perfil — sem badge grande, info inline no título */
.perfil-row-card {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border-top: 1px solid #f3f0fa;
  transition: background .15s ease;
}
.perfil-row-card:hover { background: #fafbfc; }
.perfil-row-card:first-child { border-top: none; }

.prc-body { min-width: 0; }
.prc-title {
  font-size: 15px;
  font-weight: 800;
  color: var(--color-text);
  line-height: 1.3;
  margin-bottom: 4px;
  letter-spacing: -.2px;
}
.prc-meta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--color-text-muted);
  line-height: 1.4;
}
.prc-meta svg { color: var(--color-primary); flex-shrink: 0; }

/* Botões de ação no card (editar + excluir) */
.prc-actions {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}
.prc-action {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: #fff;
  color: var(--color-text-muted);
  border: 1px solid #ece9f7;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.prc-action.prc-edit:hover {
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
}
.prc-action.prc-rm:hover {
  background: #e23b3b;
  color: #fff;
  border-color: #e23b3b;
}

/* Resumo final — verde quando tem perfis, cinza quando vazio */
.perfis-resumo {
  margin: 18px 0 14px;
  padding: 12px 16px;
  background: #f5f3fa;
  border-radius: 12px;
  font-size: 13px;
  color: var(--color-text-muted);
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.perfis-resumo svg { color: var(--color-text-muted); flex-shrink: 0; }
.perfis-resumo strong { color: var(--color-text); font-weight: 800; }
.perfis-resumo.is-ok {
  background: #e0f8ec;
  color: #157a48;
  border: 1px solid #c6f0d6;
}
.perfis-resumo.is-ok svg { color: #1aaa61; }
.perfis-resumo.is-ok strong { color: #0f6940; }

/* =========================================================
   ETAPA 2 — Abas + Tabelas
   ========================================================= */
.perfis-tabs {
  display: flex;
  gap: 6px;
  background: #f3f0fa;
  border-radius: 12px;
  padding: 6px;
  margin-bottom: 14px;
}
.perfis-tab {
  flex: 1;
  border: none;
  background: transparent;
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  color: var(--color-text-muted);
  padding: 10px 14px;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  transition: background .15s ease, color .15s ease;
}
.perfis-tab:hover { color: var(--color-primary); }
.perfis-tab.is-active {
  background: #fff;
  color: var(--color-primary);
  box-shadow: 0 4px 12px rgba(124,0,245,.12);
}
.perfis-tab .ptab-label {
  font-size: 13px;
  letter-spacing: .5px;
  text-transform: uppercase;
}
.perfis-tab .ptab-count {
  font-size: 11px;
  font-weight: 700;
  color: var(--color-text-muted);
  letter-spacing: .3px;
}
.perfis-tab.is-active .ptab-count { color: var(--color-primary); opacity: .85; }

.perfis-tab-content { display: none; }
.perfis-tab-content.is-active { display: block; }

/* ===== Cabeçalho da seção de perfis (unificada) ===== */
.perfis-h { font-size: 18px; font-weight: 800; margin: 0 0 6px; letter-spacing: -.01em; color: #0a0a0a; }
.perfis-sub { font-size: 13.5px; color: #6b6b73; margin: 0 0 14px; line-height: 1.5; }
.perfis-actions { display: flex; gap: 8px; align-items: center; margin-bottom: 14px; flex-wrap: wrap; }
.perfis-actions .btn { display: inline-flex; align-items: center; gap: 6px; }
.perfis-cnt-wrap { display: inline-flex; gap: 6px; margin-left: auto; flex-wrap: wrap; }
.perfis-cnt { background: #fff; border: 1px solid #ece9f7; color: #444; font-weight: 800; font-size: 12px; padding: 6px 12px; border-radius: 999px; }

/* Badge do tipo Modelo na coluna Função */
.ptbl-kind { display: inline-flex; align-items: center; padding: 5px 10px; border-radius: 999px; font-size: 13px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.ptbl-kind--modelo { background: #ede9fe; color: #5b21b6; }
.ptbl-kind--staff  { background: #fef3c7; color: #92400e; }

/* Dropdown de função do staff — cor específica quando selecionado */
.ptbl-funcao-sel.has-value {
  background: #fef3c7 !important;
  color: #92400e !important;
  border-color: #f59e0b !important;
  font-weight: 800;
}

/* Célula "Sem idade" para staff */
.ptbl-cell-sem-idade { text-align: center; }
.ptbl-naopossui { color: #c4c0d4; font-weight: 700; letter-spacing: 2px; }

/* Estado vazio: nenhum profissional adicionado */
.ptbl-empty {
  background: #fafbfc;
  border: 1px dashed #d9d4ec;
  border-radius: 12px;
  padding: 22px 16px;
  text-align: center;
  color: #6b6b73;
  font-size: 13.5px;
  line-height: 1.55;
  margin-bottom: 10px;
}
.ptbl-empty strong { color: #222; font-weight: 800; }

/* Tabela */
.ptbl-wrap {
  background: #fff;
  border-radius: 12px;
  border: 1px solid #ece9f7;
  overflow: hidden;
  margin-bottom: 10px;
}
.ptbl {
  width: 100%;
  border-collapse: collapse;
}
.ptbl thead {
  background: #faf9fc;
  border-bottom: 1px solid #ece9f7;
}
.ptbl th {
  text-align: left;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .8px;
  color: var(--color-text-muted);
  text-transform: uppercase;
  padding: 10px 8px;
}
.ptbl-col-qtd { width: 78px; }
.ptbl-col-rm  { width: 40px; }
/* Coluna Tipo (tabela unificada) — só largura suficiente para o badge */
.ptbl-unificada thead th:first-child,
.ptbl-unificada td:first-child { width: 190px; }

.ptbl td {
  padding: 10px 8px;
  border-bottom: 1px solid #f3f0fa;
  border-right: 1px solid #f3f0fa;
  vertical-align: middle;
}
.ptbl td:last-child { border-right: none; }
.ptbl thead th { border-right: 1px solid #ece9f7; }
.ptbl thead th:last-child { border-right: none; }
.ptbl tr:last-child td { border-bottom: none; }
.ptbl tbody tr:nth-child(even) td { background: #fdfcff; }

.ptbl input,
.ptbl select {
  width: 100%;
  height: 36px;
  padding: 0 8px;
  font-size: 13px;
  font-family: inherit;
  border: 1px solid var(--color-border);
  border-radius: 7px;
  background: #fff;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.ptbl input:focus,
.ptbl select:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(124,0,245,.12);
}
.ptbl input[type="number"] { font-weight: 700; text-align: center; }
.ptbl .cell-pair {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 6px;
  align-items: center;
}
.ptbl .cell-pair-sep {
  font-size: 11px;
  font-weight: 700;
  color: var(--color-text-muted);
  letter-spacing: .5px;
  text-transform: lowercase;
}

/* Linha vazia (qty=0) — destaca a célula de quantidade para o usuário preencher */
.ptbl-row.is-empty td:not(:first-child):not(:last-child) {
  opacity: .55;
}
.ptbl-row.is-empty .js-qtd {
  background: #fff4d6;
  border-color: #d8b94a;
  color: #b18800;
  font-weight: 800;
  animation: ptbl-pulse 1.6s ease-in-out infinite;
}
@keyframes ptbl-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(216,185,74,.5); }
  50%      { box-shadow: 0 0 0 5px rgba(216,185,74,0); }
}
/* Linha staff "travada" (sem função) — opaca total; função recebe pulso amarelo (mesma identidade do qtd zerada) */
.ptbl-row.is-locked td:not(:first-child) { opacity: .4; }
.ptbl-row.is-locked .js-qtd { animation: none; background: #f5f3fa; border-color: var(--color-border); color: var(--color-text-muted); }
.ptbl-row.is-locked .js-funcao,
.ptbl-row.is-locked[data-kind="modelo"] .js-sexo {
  background: #fff4d6;
  border-color: #d8b94a;
  color: #b18800;
  font-weight: 800;
  animation: ptbl-pulse 1.6s ease-in-out infinite;
}

/* === Linhas e colunas mais visíveis === */
.ptbl td,
.ptbl th {
  border-right: 1px solid #e6e2f0;
  border-bottom: 1px solid #ece9f7;
}
.ptbl td:last-child,
.ptbl th:last-child { border-right: none; }
.ptbl tr:last-child td { border-bottom: none; }

/* Hover na linha — destaca a linha inteira */
.ptbl tbody tr:hover td { background: #f7f0ff; }
.ptbl tbody tr.ptbl-row.is-locked:hover td { background: #fffbe9; }

/* Hover na coluna — bordas laterais roxas via .col-hover (aplicada por JS) */
.ptbl td.col-hover,
.ptbl th.col-hover {
  box-shadow: inset 2px 0 0 var(--color-primary), inset -2px 0 0 var(--color-primary);
}
.ptbl thead th.col-hover {
  background: var(--color-primary-soft);
  color: var(--color-primary);
}

/* Botão de observações inline na tabela */
.ptbl-obs-btn {
  width: 100%;
  border: 1px dashed var(--color-border);
  background: #fff;
  color: var(--color-text-muted);
  height: 36px;
  padding: 0 10px;
  border-radius: 7px;
  font-family: inherit;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  text-align: left;
  transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.ptbl-obs-btn:hover:not(:disabled) { border-color: var(--color-primary); color: var(--color-primary); border-style: solid; }
.ptbl-obs-btn:disabled { cursor: not-allowed; opacity: .5; }


.ptbl-obs-btn.has-content {
  border: 1px solid var(--color-border);
  background: #fff;
}
.ptbl-obs-btn .ptbl-obs-preview {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}

/* Validação de linha incompleta */
.ptbl-row.row-incomplete td { background: #fff5f5; }
.ptbl .invalid,
.ptbl select.invalid,
.ptbl input.invalid {
  border-color: #e23b3b !important;
  background: #fff8f8 !important;
  box-shadow: 0 0 0 2px rgba(226,59,59,.15);
}

/* Header de grupo na lista de agências */
.ag-group-header {
  background: #faf9fc;
  color: var(--color-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 8px 12px;
  border-bottom: 1px solid #ece9f7;
}

/* invalid universal (form-row inputs) */
.form-row .invalid,
#form-evento .invalid {
  border-color: #e23b3b !important;
  box-shadow: 0 0 0 2px rgba(226,59,59,.15);
}

/* Aviso de campos obrigatórios da Etapa 1 */
.ev-erro-box {
  background: #fdecec;
  border: 1px solid #f5c2c2;
  color: #b02a2a;
  border-radius: 10px;
  padding: 11px 14px;
  margin: 0 0 16px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
}

/* Botão remover linha */
.ptbl-rm {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: transparent;
  color: var(--color-text-muted);
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease, color .15s ease;
}
.ptbl-rm:hover { background: #fde2e2; color: #e23b3b; }

/* Responsivo: em telas pequenas → cards stacked */
@media (max-width: 900px) {
  .ptbl thead { display: none; }
  .ptbl, .ptbl tbody, .ptbl tr, .ptbl td { display: block; width: 100%; }
  .ptbl tr {
    padding: 12px;
    border-bottom: 1px solid #f3f0fa;
    background: #fff;
    position: relative;
  }
  .ptbl tr:last-child { border-bottom: none; }
  .ptbl td {
    padding: 6px 0;
    border-bottom: none;
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .ptbl td::before {
    content: attr(data-label);
    flex-shrink: 0;
    width: 110px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .5px;
    color: var(--color-text-muted);
    text-transform: uppercase;
  }
  .ptbl td[data-label=""]::before { display: none; }
  .ptbl-col-rm {
    position: absolute;
    top: 8px; right: 8px;
    padding: 0;
  }

  /* =========================================================
     VIEW-ROW (linha já preenchida) — card moderno no mobile
     ========================================================= */
  .ptbl-view-row {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 14px !important;
    margin-bottom: 10px;
    background: #fff !important;
    border: 1px solid #ece9f7 !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(20,0,60,.04);
    transition: border-color .15s ease, transform .12s ease, box-shadow .15s ease;
  }
  .ptbl-view-row:active { transform: scale(.99); }
  .ptbl-view-row:hover { border-color: var(--color-primary, #7C00F5) !important; box-shadow: 0 6px 16px rgba(124,0,245,.08); }
  .ptbl-view-row > td { display: inline-flex !important; }
  .ptbl-view-row > td::before { display: inline !important; width: auto !important; }

  /* Ordem visual */
  .ptbl-view-row .vw-funcao { order: 1; flex: 1 1 auto; }
  .ptbl-view-row .ptbl-col-actions { order: 2; flex: 0 0 auto; position: static !important; padding: 0 !important; }
  .ptbl-view-row .vw-qtd      { order: 3; }
  .ptbl-view-row .vw-sexo     { order: 4; }
  .ptbl-view-row .vw-idade    { order: 5; }
  .ptbl-view-row .vw-periodo  { order: 6; }
  .ptbl-view-row .vw-obs      { order: 99; flex: 1 1 100%; }

  /* "Função" = pill destacado (título do card) */
  .ptbl-view-row .vw-funcao {
    padding: 6px 12px !important;
    font-size: 12.5px !important;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--color-primary-dark, #5A00B0);
    background: linear-gradient(135deg, #ede9fe 0%, #f5f3ff 100%);
    border-radius: 999px !important;
    max-width: max-content;
  }
  .ptbl-view-row .vw-funcao::before { display: none !important; }

  /* Chips de dados (sexo/qtd/idade/período) */
  .ptbl-view-row .vw-sexo,
  .ptbl-view-row .vw-qtd,
  .ptbl-view-row .vw-idade,
  .ptbl-view-row .vw-periodo {
    align-items: center;
    gap: 4px;
    padding: 4px 9px !important;
    background: #faf9fc;
    border: 1px solid #f0ecf7;
    border-radius: 8px;
    font-size: 12.5px !important;
    font-weight: 700;
    color: #222;
  }
  .ptbl-view-row .vw-sexo::before,
  .ptbl-view-row .vw-qtd::before,
  .ptbl-view-row .vw-idade::before,
  .ptbl-view-row .vw-periodo::before {
    content: attr(data-label);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    color: #888;
    text-transform: uppercase;
    margin-right: 2px;
  }
  .ptbl-view-row .vw-sexo:empty,
  .ptbl-view-row .vw-qtd:empty,
  .ptbl-view-row .vw-idade:empty,
  .ptbl-view-row .vw-periodo:empty,
  .ptbl-view-row .vw-obs:empty { display: none !important; }

  /* Observação compacta numa linha completa */
  .ptbl-view-row .vw-obs {
    padding: 8px 10px !important;
    background: #fafafd;
    border: 1px dashed #ece9f7;
    border-radius: 8px;
    font-size: 12px !important;
    font-weight: 500;
    color: #555;
    line-height: 1.4;
    margin-top: 2px;
    align-items: flex-start !important;
  }
  .ptbl-view-row .vw-obs::before {
    content: 'Obs:';
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    color: #888;
    text-transform: uppercase;
    margin-right: 6px;
    flex-shrink: 0;
  }

  /* Ações: editar e remover compactos lado a lado */
  .ptbl-view-row .ptbl-col-actions { display: inline-flex !important; gap: 4px; }
  .ptbl-view-row .ptbl-rm {
    width: 30px !important;
    height: 30px !important;
    border-radius: 8px !important;
    background: #f5f3fa !important;
    color: #555 !important;
    border: 1px solid #ece9f7 !important;
  }
  .ptbl-view-row .ptbl-rm:hover { background: var(--color-primary, #7C00F5) !important; color: #fff !important; border-color: var(--color-primary, #7C00F5) !important; }
  .ptbl-view-row .ptbl-rm.js-rm-perfil:hover { background: #e23b3b !important; color: #fff !important; border-color: #e23b3b !important; }
}



.prop-md-detail{
    background: #f4f4f4;
    border: 1px solid #222;
    border-radius: 20px;
    padding: 10px;
    padding-bottom: 0px;
    margin-bottom: 0px;
}


/* =========================================================
   MEUS EVENTOS — layout 2-col: calendário esquerda + lista direita
   ========================================================= */
.meus-eventos-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}
@media (min-width: 900px) {
  .meus-eventos-layout { grid-template-columns: 300px 1fr; }
}

/* Calendário lateral */
.me-cal {
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 14px;
  padding: 14px;
  height: fit-content;
  position: sticky;
  top: 14px;
}
.me-cal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.me-cal-header .cal-title { text-align: center; font-weight: 800; font-size: 14px; }
.me-cal-header .cal-title span { color: var(--color-text-muted); font-weight: 600; margin-left: 4px; }
.me-cal-header .cal-nav {
  width: 30px; height: 30px;
  border-radius: 50%;
  background: #f5f3fa;
  color: #222;
  font-size: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.me-cal-header .cal-nav:hover { background: #222; color: #fff; }

.me-cal .cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.me-cal .cal-weekdays {
  display: grid; grid-template-columns: repeat(7, 1fr);
  text-align: center; font-size: 10px; font-weight: 800;
  color: var(--color-text-muted);
  letter-spacing: .8px; padding: 4px 0 6px;
}
.me-cal .cal-day {
  aspect-ratio: 1;
  display: flex; align-items: center; justify-content: center;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--color-text);
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  font-family: inherit;
  transition: background .12s ease, color .12s ease;
}
.me-cal .cal-day.has-event {
  background: #fff;
  border: 2px solid #222;
  color: #222;
  font-weight: 800;
}
.me-cal .cal-day.has-event:hover {
  background: #222;
  color: #fff;
}
.me-cal .cal-day.is-disabled {
  color: #c9c5d4;
  cursor: not-allowed;
  font-weight: 500;
}
.me-cal .cal-day.is-disabled:hover { background: #fafbfc; }

/* Tooltip flutuante (hover de dia no calendário) */
.me-cal-tip {
  background: #222;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 8px 12px;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,.22);
  z-index: 1000;
  pointer-events: none;
  min-width: 120px;
  max-width: 240px;
  white-space: normal;
}
.me-cal-tip::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -5px;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: #222;
  border-bottom: 0;
}
.me-cal-tip .me-tip-head {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: rgba(255,255,255,.65);
  margin-bottom: 4px;
}
.me-cal-tip .me-tip-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.me-cal-tip .me-tip-list li {
  padding: 2px 0;
  position: relative;
  padding-left: 10px;
  line-height: 1.35;
}
.me-cal-tip .me-tip-list li::before {
  content: '';
  position: absolute;
  left: 0; top: 9px;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: #fff;
}
.me-cal-tip .me-tip-empty {
  font-size: 12px;
  font-weight: 700;
  color: rgba(255,255,255,.85);
}

/* Filter bar */
.me-filterbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 12px;
  padding: 10px 14px;
  margin: 0 0 16px;
}
.me-filter-nav {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.me-filter-nav .me-nav-arrow {
  width: 30px; height: 30px;
  border-radius: 50%;
  background: #f5f3fa;
  color: #222;
  font-size: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background .12s ease, color .12s ease;
}
.me-filter-nav .me-nav-arrow:hover { background: #222; color: #fff; }
.me-filter-nav .me-nav-arrow.is-disabled {
  background: #fafbfc;
  color: #c9c5d4;
  pointer-events: none;
}
.me-filter-select {
  background: #fff;
  color: #222;
  border: 1px solid #ece9f7;
  border-radius: 8px;
  padding: 7px 28px 7px 12px;
  font-size: 13px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23222' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 12px 12px;
}
.me-filter-select:hover { border-color: #c9c5d4; }
.me-filter-select:disabled {
  color: #c9c5d4;
  cursor: not-allowed;
  background-color: #fafbfc;
}
.me-filter-select--year { padding-right: 26px; }
.me-filter-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  color: #222;
  cursor: pointer;
  user-select: none;
}
.me-filter-check input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 18px; height: 18px;
  border: 2px solid #c9c5d4;
  border-radius: 5px;
  background: #fff;
  cursor: pointer;
  position: relative;
  transition: background .12s ease, border-color .12s ease;
  flex: 0 0 auto;
}
.me-filter-check input[type="checkbox"]:hover { border-color: #222; }
.me-filter-check input[type="checkbox"]:checked {
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.me-filter-check input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='5 12 10 17 19 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}

/* Layout "Todos os meses": esconde calendário e usa 1 coluna */
.meus-eventos-layout.is-all-months { grid-template-columns: 1fr !important; }

.empty-state--inline {
  background: #fafbfc;
  border: 1px dashed #ece9f7;
  border-radius: 10px;
  padding: 24px;
  text-align: center;
  color: var(--color-text-muted);
}

/* Container das checkboxes do filterbar */
.me-filter-checks {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
/* Checkbox primária ("Todos os meses") — leve destaque */
.me-filter-check--primary {
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 999px;
  padding: 7px 14px 7px 10px;
  transition: border-color .12s ease, background .12s ease;
}
.me-filter-check--primary:hover { border-color: #c9c5d4; }
.me-filter-check--primary:has(input:checked) {
  border-color: #222;
  background: #fafbfc;
}

/* Tabs (Próximos / Anteriores) */
.me-tabs {
  display: inline-flex;
  background: #f5f3fa;
  padding: 4px;
  border-radius: 999px;
  margin-bottom: 18px;
  gap: 2px;
}
.me-tab {
  background: transparent;
  border: none;
  padding: 8px 16px;
  border-radius: 999px;
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: background .15s ease, color .15s ease;
}
.me-tab:hover { color: #222; }
.me-tab.is-active {
  background: #fff;
  color: #222;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.me-tab-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  background: rgba(0,0,0,.08);
  color: inherit;
  font-size: 11px;
  font-weight: 800;
}
.me-tab.is-active .me-tab-count { background: #222; color: #fff; }

.me-tab-panel { display: none; }
.me-tab-panel.is-active { display: block; }
.me-tab-panel[hidden] { display: none !important; }

/* Header de mês (agrupamento) */
.me-month-header {
  position: sticky;
  top: 0;
  z-index: 5;
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  color: #fff;
  background: #222;
  margin: 22px 0 12px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 0;
  box-shadow: 0 4px 12px rgba(0,0,0,.12);
}
.me-tab-panel > .me-month-header:first-child { margin-top: 0; }

/* ======= VIEW EVENTO: Destino ======= */
.ve-destino {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ve-destino-head { display: flex; }
.ve-destino-pill {
  display: inline-flex;
  align-items: center;
  background: #fff;
  color: #222;
  border: 2px solid #222;
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 800;
}
.ve-destino-msg {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--color-text);
}
.ve-destino-msg strong { font-weight: 800; color: #222; }

.ve-destino-chips {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ve-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 8px;
  padding: 6px 10px;
}
.ve-chip-uf {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #222;
  color: #fff;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 800;
  padding: 2px 6px;
  letter-spacing: .4px;
  min-width: 26px;
}
.ve-chip-label {
  font-size: 13px;
  color: #222;
  font-weight: 600;
}

.ve-destino-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ve-ag-row {
  display: flex;
  gap: 10px;
  align-items: center;
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  padding: 10px 12px;
}
.ve-ag-icon {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #ece9f7;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #222;
  flex: 0 0 auto;
}
.ve-ag-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  min-width: 0;
}
.ve-ag-info strong {
  font-size: 14px;
  font-weight: 800;
  color: #222;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ve-ag-local {
  font-size: 12px;
  color: var(--color-text-muted);
}

/* =========================================================
   CASTINGS — lista (castings.php)
   ========================================================= */
.casting-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
@media (min-width: 720px) { .casting-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1200px) { .casting-grid { grid-template-columns: 1fr 1fr 1fr; } }
.casting-card {
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 14px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.casting-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}
.casting-card-head h3 { margin: 0 0 4px; font-size: 16px; font-weight: 800; color: #222; }
.casting-local { margin: 0; font-size: 12px; color: var(--color-text-muted); }
.casting-prop-tag {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .4px;
  text-transform: uppercase;
  padding: 4px 8px;
  border-radius: 6px;
  border: 2px solid #222;
  background: #fff;
  color: #222;
  white-space: nowrap;
}
.casting-prop-tag--enviada { background: #fff7e6; border: 1px solid #f3d9a6; color: #b9770a; }
.casting-prop-tag--aguardando_pagamento { background: #fff7ed; border: 1px solid #fed7aa; color: #9a3412; }
.casting-card-data {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #222;
  font-size: 13px;
}
.casting-card-data strong { font-weight: 800; }
.casting-card-reqs {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 0;
  border-top: 1px dashed #ece9f7;
  border-bottom: 1px dashed #ece9f7;
}
.casting-req {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
}
.casting-req-num {
  background: #fff;
  border: 2px solid #222;
  color: #222;
  font-weight: 800;
  border-radius: 6px;
  padding: 2px 8px;
  min-width: 32px;
  text-align: center;
}
.casting-req-label { color: #222; font-weight: 700; flex: 1; }
.casting-req-prop {
  font-size: 11px;
  font-weight: 700;
  color: var(--color-success);
  background: #ecfdf3;
  border-radius: 6px;
  padding: 2px 8px;
}
.casting-card-foot { display: flex; justify-content: flex-end; }
.empty-state-sub { font-size: 13px; color: var(--color-text-muted); }

/* =========================================================
   CASTING — proposta builder (casting-evento.php)
   ========================================================= */
.cp-evento-card {
  margin-bottom: 18px;
  background: #fff;
}
.cp-evento-head h2 { margin: 0; font-size: 18px; font-weight: 800; color: #222; }
.cp-evento-head p  { margin: 4px 0 0; color: var(--color-text-muted); font-size: 13px; }
.cp-evento-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 0px;
}
@media (min-width: 720px) {
  .cp-evento-meta {
    flex-direction: row;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
  }
}
.cp-meta-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 6px 0;
}
.cp-meta-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px; height: 30px;
  border-radius: 50%;
  background: #fafbfc;
  color: #222;
  flex: 0 0 auto;
}
.cp-meta-body { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.cp-meta-label {
  display: block;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: var(--color-text-muted);
}
.cp-meta-body strong { color: #222; font-weight: 800; font-size: 14px; line-height: 1.3; }
.cp-meta-sub { font-size: 12px; color: var(--color-text-muted); margin-top: 2px; }
.cp-meta-row--status { margin-left: auto; padding: 0; }

/* Variante: stacked (uma info embaixo da outra) — usado em view-casting-evento */
.cp-evento-meta.cp-evento-meta--stacked {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  align-items: stretch !important;
}
.cp-evento-meta.cp-evento-meta--stacked .cp-meta-row {
  padding: 8px 12px;
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 8px;
}
.cp-meta-status {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .5px;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 999px;
}
.cp-meta-status--rascunho {
  background: #fff;
  color: #222;
  border: 2px solid #222;
}
.cp-meta-status--enviada {
  background: var(--color-success);
  color: #fff;
}

.cp-section {
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 14px;
  padding: 18px;
  margin-bottom: 18px;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.cp-section-head h3 { margin: 0; font-size: 15px; font-weight: 800; color: #222; display: inline-flex; align-items: center; gap: 10px; }
.cp-section-cnt {
  background: #fff;
  border: 2px solid #222;
  color: #222;
  border-radius: 8px;
  padding: 2px 10px;
  font-size: 12px;
  font-weight: 800;
}
.cp-section-sub { margin: 6px 0 0; color: var(--color-text-muted); font-size: 13px; }

.cp-sub-head {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: var(--color-text-muted);
  margin: 18px 0 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.cp-mini-cnt { color: #222; font-weight: 800; font-size: 11px; }

.cp-empty {
  background: #fafbfc;
  border: 1px dashed #ece9f7;
  border-radius: 10px;
  padding: 14px;
  font-size: 13px;
  color: var(--color-text-muted);
  text-align: center;
}
.cp-empty a { color: var(--color-primary); text-decoration: none; font-weight: 700; }
.cp-empty a:hover { text-decoration: underline; }

.cp-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
@media (min-width: 720px) { .cp-list { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1200px) { .cp-list--disponiveis { grid-template-columns: 1fr 1fr 1fr; } }

.cp-item {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  padding: 10px;
  transition: border-color .12s ease, background .12s ease;
}
.cp-item--disponivel { cursor: pointer; }
.cp-item--disponivel:hover { border-color: #c9c5d4; }
.cp-item--disponivel:has(.js-cp-add-sel:checked) {
  border-color: var(--color-primary);
  background: var(--color-primary-soft);
}
.cp-item--incluido:has(.js-cp-sel:checked) {
  border-color: #222;
  background: #fafbfc;
}
.cp-check { display: inline-flex; flex: 0 0 auto; }
.cp-check input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 18px; height: 18px;
  border: 2px solid #c9c5d4;
  border-radius: 5px;
  background: #fff;
  cursor: pointer;
  position: relative;
}
.cp-check input[type="checkbox"]:checked {
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.cp-check input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='5 12 10 17 19 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}
.cp-thumb {
  width: 44px; height: 44px;
  border-radius: 8px;
  background: #f5f3fa center/cover no-repeat;
  flex: 0 0 auto;
}
.cp-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.cp-info strong { font-size: 13px; font-weight: 800; color: #222; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cp-info-meta { font-size: 11px; color: var(--color-text-muted); }
/* Compatibilidade legada (não usado no novo fluxo, mantido caso reapareça) */
.cp-valor { display: none !important; }
.cp-valor-sufix { display: none !important; }

/* Orçamento + descrição */
.cp-meta-grid { display: grid; grid-template-columns: 1fr; gap: 14px; margin-bottom: 12px; }
@media (min-width: 720px) { .cp-meta-grid { grid-template-columns: 280px; } }
#cp-orcamento {
  font-size: 22px;
  font-weight: 800;
  color: #222;
  letter-spacing: -0.5px;
}
.cp-help { font-size: 11px; color: var(--color-text-muted); margin-top: 2px; }

/* Render readonly do richtext (proposta enviada) */
.cp-readonly-rt {
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.55;
}
.cp-readonly-rt p { margin: 0 0 8px; }
.cp-readonly-rt ul, .cp-readonly-rt ol { margin: 0 0 8px; padding-left: 20px; }

/* Chips de requisitos */
.cp-reqs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}
.cp-req-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 999px;
  padding: 4px 12px 4px 4px;
  font-size: 12px;
  font-weight: 700;
  color: #222;
  transition: background .12s ease, border-color .12s ease;
}
.cp-req-qty {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 2px solid #222;
  color: #222;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 800;
  min-width: 36px;
}
.cp-req-chip.is-ok {
  background: #ecfdf3;
  border-color: var(--color-success);
  color: #166534;
}
.cp-req-chip.is-ok .cp-req-qty {
  background: var(--color-success);
  border-color: var(--color-success);
  color: #fff;
}
.cp-req-chip.is-pending .cp-req-qty {
  background: #fff;
  border-color: #222;
  color: #222;
}
.cp-req-label { font-weight: 700; }

/* Sobre do evento na proposta */
.cp-evento-sobre {
  margin-top: 14px;
  padding: 12px 14px;
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--color-text);
}
.cp-evento-sobre p { margin: 0 0 6px; }
.cp-evento-sobre ul, .cp-evento-sobre ol { margin: 0 0 6px; padding-left: 20px; }

/* =========================================================
   SLOT CARDS — cada solicitação do contratante vira um card
   ========================================================= */
.slot-list { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.slot-card {
  background: #fff;
  border: 1px solid #ece9f7;
  border-left: 4px solid #c9c5d4;
  border-radius: 12px;
  padding: 14px 16px;
  transition: border-color .15s ease;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
.slot-card.is-ok { border-left-color: var(--color-success); }

.slot-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: nowrap;
  min-width: 0;
  max-width: 100%;
}
.slot-qty {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #222;
  color: #fff;
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 14px;
  font-weight: 800;
  min-width: 42px;
  flex: 0 0 auto;
  transition: background .15s ease;
}
.slot-card.is-ok .slot-qty {
  background: var(--color-success);
}
.slot-head-info {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  max-width: 100%;
}
.slot-head-title {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .8px;
  color: #222;
}
.slot-head-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.slot-field {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #222;
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 6px;
  padding: 3px 10px;
}
.slot-field em {
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: var(--color-text-muted);
}
.slot-meta {
  font-size: 11px;
  font-weight: 700;
  color: var(--color-text-muted);
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 6px;
  padding: 2px 8px;
}
.slot-progress {
  font-size: 12px;
  font-weight: 800;
  color: #222;
  background: #fff;
  border: 2px solid #222;
  border-radius: 999px;
  padding: 2px 10px;
  min-width: 50px;
  text-align: center;
}
.slot-progress.is-ok {
  background: var(--color-success);
  border-color: var(--color-success);
  color: #fff;
}
.slot-obs {
  font-size: 13px;
  color: var(--color-text);
  margin-top: 10px;
  padding: 8px 10px;
  background: #fafbfc;
  border-radius: 8px;
  line-height: 1.45;
}
.slot-obs p { margin: 0 0 4px; }
.slot-obs ul, .slot-obs ol { margin: 0 0 4px; padding-left: 18px; }

.slot-tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed #ece9f7;
}

/* Tag de perfil dentro de slot-tags — escopado para evitar conflito com .perfil-tag (elenco) */
.slot-tags .perfil-tag {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  background: #C8A4FF;
  border: 1px solid #ece9f7;
  border-radius: 999px;
  color: #222;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  max-width: 100%;
  height: 40px;                /* mesma altura, com ou sem foto */
  padding: 0 14px;
  text-transform: none;        /* sobrescreve uppercase do .perfil-tag base */
  letter-spacing: 0;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.slot-tags .perfil-tag:hover {
  border-color: #c9c5d4;
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.slot-tags .perfil-tag.has-thumb {
  padding: 0 14px 0 4px;
  gap: 8px;
}
.slot-tags .perfil-tag-thumb {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: #ece9f7 center/cover no-repeat;
  flex: 0 0 auto;
  box-shadow: 0 0 0 1px rgba(0,0,0,.04) inset;
}
.slot-tags .perfil-tag-nome {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 200px;
  display: inline-flex;
  align-items: center;
}

.slot-add-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  color: #222;
  border: 1.5px solid #222;
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  font-family: inherit;
  transition: background .15s ease, color .15s ease;
}
.slot-add-btn:hover { background: #222; color: #fff; }

/* Datas+horários dos perfis solicitados */
.slot-dias {
  margin-top: 10px;
  padding: 10px 12px;
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.slot-dias-lbl {
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: var(--color-text-muted);
}
.slot-dias-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.slot-dia-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}
.slot-dia-data { color: var(--color-primary, #7C00F5); font-weight: 800; }
.slot-dia-hora { color: #0a0a0a; font-weight: 700; }

/* Linha de observação (1 linha + ellipsis + abre modal) */
.slot-obs-line {
  margin-top: 10px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 8px;
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 8px;
  padding: 8px 12px;
  font-family: inherit;
  font-size: 13px;
  color: var(--color-text);
  cursor: pointer;
  text-align: left;
  transition: border-color .12s ease, background .12s ease;
  min-width: 0;
  overflow: hidden;
}
.slot-obs-line:hover:not([disabled]) { border-color: #c9c5d4; background: #fff; }
.slot-obs-line[disabled] { cursor: default; color: var(--color-text-muted); }
.slot-obs-label {
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: var(--color-text-muted);
  flex: 0 0 auto;
}
.slot-obs-text {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}
.slot-obs-link {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: #222;
  flex: 0 0 auto;
}
.slot-obs-data { display: none; }

/* Modal de observação completa */
.modal-obs-body {
  background: #fafbfc;
  border-radius: 10px;
  padding: 14px 16px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--color-text);
}
.modal-obs-body p { margin: 0 0 8px; }
.modal-obs-body ul, .modal-obs-body ol { margin: 0 0 8px; padding-left: 20px; }
.modal-obs-body a { color: var(--color-primary); }

/* Contador + toolbar no modal do picker */
.msp-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 4px 10px;
  flex-wrap: wrap;
}
.msp-counter {
  font-size: 11px;
  font-weight: 700;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: .6px;
}
.msp-counter strong { color: #222; font-weight: 800; }
/* Chip de destaque no título do modal "Selecionar perfis" */
.msp-title-chip {
  display: inline-block;
  background: #f1eff7;
  border: 1px solid #ece9f7;
  color: #222;
  font-weight: 800;
  border-radius: 8px;
  padding: 2px 10px;
  margin: 0 2px;
}
.msp-show-all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #222;
  cursor: pointer;
}
.msp-show-all input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 16px; height: 16px;
  border: 2px solid #c9c5d4;
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
  position: relative;
}
.msp-show-all input[type="checkbox"]:checked {
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.msp-show-all input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='5 12 10 17 19 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 11px 11px;
}

/* Info acima do botão de confirmar */
.msp-confirm-info {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: center;
  padding: 8px 0;
  font-size: 12px;
  color: var(--color-text-muted);
  font-weight: 700;
}
.msp-confirm-info strong { color: #222; font-weight: 800; }
.msp-info-sep { opacity: .4; }
.msp-info-min { color: #92400e; }
.msp-info-min.is-ok { color: #166534; }
.msp-info-min.is-ok strong { color: #166534; }

/* Botão de confirmar — estado desabilitado */
#msp-confirm:disabled,
#msp-confirm.is-disabled {
  background: #ece9f7 !important;
  color: #a6a3b3 !important;
  cursor: not-allowed;
  box-shadow: none;
}
#msp-confirm:disabled:hover,
#msp-confirm.is-disabled:hover {
  background: #ece9f7 !important;
}

/* Ações da lista: Marcar / Desmarcar todos */
.msp-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 4px 8px;
}
.msp-action {
  background: transparent;
  border: none;
  color: #222;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .6px;
  cursor: pointer;
  font-family: inherit;
  padding: 4px 8px;
  border-radius: 6px;
  transition: background .12s ease;
}
.msp-action:hover { background: #f5f3fa; }

/* Badges de compatibilidade na lista */
.msp-badge {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 3px 8px;
  border-radius: 999px;
  white-space: nowrap;
  flex: 0 0 auto;
}
.msp-badge--ok {
  background: #ecfdf3;
  color: #166534;
  border: 1px solid #bbf2cd;
}
.msp-badge--warn {
  background: #fff7ed;
  color: #92400e;
  border: 1px solid #fde0a8;
}
.msp-row.is-warn { opacity: .85; }

/* =========================================================
   MODAL PICKER (slot)
   ========================================================= */
/* Bloco com info da solicitação no topo do modal */
.msp-slot-info {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 14px;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.msp-slot-qty {
  background: #222;
  color: #fff;
  font-size: 18px;
  font-weight: 800;
  padding: 8px 14px;
  border-radius: 8px;
  min-width: 56px;
  text-align: center;
  letter-spacing: .5px;
  flex: 0 0 auto;
}
.msp-slot-meta { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.msp-slot-meta strong {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .8px;
  color: #222;
}
.msp-slot-meta-detail {
  font-size: 12px;
  color: var(--color-text-muted);
  font-weight: 700;
}
.msp-slot-obs {
  font-size: 12px;
  color: var(--color-text);
  line-height: 1.4;
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.msp-slot-rest {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: #222;
  background: #fff;
  border: 2px solid #222;
  border-radius: 999px;
  padding: 4px 12px;
  white-space: nowrap;
  flex: 0 0 auto;
}
.msp-sub {
  margin: 0 0 12px;
  color: var(--color-text-muted);
  font-size: 13px;
}
.msp-search {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  font-size: 14px;
  margin-bottom: 12px;
  font-family: inherit;
}
.msp-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 50vh;
  overflow-y: auto;
  padding: 2px;
}
.msp-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  cursor: pointer;
  transition: border-color .12s, background .12s;
}
.msp-row:hover { border-color: #c9c5d4; }
.msp-row:has(.msp-chk:checked) {
  border-color: var(--color-primary);
  background: var(--color-primary-soft);
}
.msp-chk {
  appearance: none;
  -webkit-appearance: none;
  width: 18px; height: 18px;
  border: 2px solid #c9c5d4;
  border-radius: 5px;
  background: #fff;
  cursor: pointer;
  position: relative;
  flex: 0 0 auto;
}
.msp-chk:checked { background: var(--color-primary); border-color: var(--color-primary); }
.msp-chk:checked::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='5 12 10 17 19 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}
.msp-thumb {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: #f5f3fa center/cover no-repeat;
  flex: 0 0 auto;
}
.msp-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.msp-info strong { font-size: 13px; font-weight: 800; color: #222; }
.msp-info span { font-size: 11px; color: var(--color-text-muted); }
.cp-item-rm {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid #ece9f7;
  color: #2a2a2a;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.cp-item-rm:hover { background: #e23b3b; color: #fff; border-color: #e23b3b; }

/* Toolbars de bulk */
.cp-bulk, .cp-add-bulk {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  padding: 8px 12px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.cp-bulk-count, .cp-add-count {
  font-size: 12px;
  font-weight: 800;
  color: #222;
  flex: 1;
}
.cp-bulk-num, .cp-add-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  background: #222;
  color: #fff;
  font-size: 11px;
  margin-right: 4px;
}

/* Footer sticky com Enviar */
.cp-footer {
  position: sticky;
  bottom: 0;
  background: #fff;
  border-top: 1px solid #ece9f7;
  padding: 12px 16px;
  margin: 18px -18px -18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  z-index: 2;
  box-shadow: 0 -6px 18px rgba(0,0,0,.04);
}
.cp-footer-total span { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; color: var(--color-text-muted); }
.cp-footer-total strong { font-size: 18px; font-weight: 800; color: #222; }

/* Status bar de proposta enviada (com ações) */
.cp-status-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: #ecfdf3;
  border: 1px solid #bbf2cd;
  border-radius: 12px;
  padding: 12px 16px;
  margin: 12px 0 14px;
  flex-wrap: wrap;
}
.cp-status-info {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #166534;
  min-width: 0;
}
.cp-status-info svg { color: #166534; flex: 0 0 auto; }
.cp-status-info div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cp-status-info strong { font-size: 13px; font-weight: 800; color: #166534; }
.cp-status-info span { font-size: 12px; color: #15803d; }
.cp-status-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

/* Botão "Enviar Casting" desabilitado (clicável para mostrar erros) */
.btn.btn-disabled,
.btn.btn-disabled:hover {
  background: #ece9f7 !important;
  color: #a6a3b3 !important;
  border-color: transparent !important;
  cursor: help !important;
  box-shadow: none !important;
}

/* Checkbox de aceitar termos no modal de confirmação */
.termos-check {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  margin: 0 0 16px;
  font-size: 13px;
  color: #222;
  cursor: pointer;
}
.termos-check input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 18px; height: 18px;
  border: 2px solid #c9c5d4;
  border-radius: 5px;
  background: #fff;
  cursor: pointer;
  position: relative;
  flex: 0 0 auto;
}
.termos-check input[type="checkbox"]:checked {
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.termos-check input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='5 12 10 17 19 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}
.termos-link {
  color: var(--color-primary);
  text-decoration: underline;
  font-weight: 700;
}
.termos-link:hover { color: var(--color-primary-dark); }

/* Conteúdo do modal de termos */
.termos-body { font-size: 14px; line-height: 1.6; color: var(--color-text); }
.termos-body h3 {
  margin: 16px 0 6px;
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: #222;
}
.termos-body h3:first-child { margin-top: 0; }
.termos-body p { margin: 0 0 10px; }
.termos-body ul { margin: 0 0 10px; padding-left: 20px; }
.termos-body li { margin-bottom: 4px; }
.termos-rodape {
  margin-top: 18px;
  padding-top: 12px;
  border-top: 1px dashed #ece9f7;
  font-size: 12px;
  color: var(--color-text-muted);
  font-style: italic;
}

/* Lista de pendências no modal */
.erros-envio-list {
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.erros-envio-list li {
  background: #fff7ed;
  border: 1px solid #fde0a8;
  color: #92400e;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.erros-envio-list li::before {
  content: '⚠';
  font-size: 14px;
  flex: 0 0 auto;
}
.erros-envio-list li strong { font-weight: 800; }

.dash-pagebar-info { display: flex; flex-direction: column; gap: 4px; }
.dash-subtitle { margin: 0; font-size: 13px; color: var(--color-text-muted); }

/* =========================================================
   VIEW CASTING EVENTO — tabs e mensagens
   ========================================================= */
/* Abas em formato "pastas": a aba ativa conecta-se ao painel abaixo */
.vce-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0;
  padding: 0 4px 0 0;
  position: relative;
  z-index: 2;
}
.vce-tab {
  background: transparent;         /* inativa: sem destaque */
  border: 1px solid transparent;
  border-bottom: none;
  border-radius: 12px 12px 0 0;
  padding: 11px 18px;
  margin-bottom: -1px;             /* sobrepõe a borda do painel (efeito pasta) */
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  opacity: .8;
  transition: background .15s ease, color .15s ease, opacity .15s ease;
}
.vce-tab:hover { color: #222; opacity: 1; background: #f2effa; }
.vce-tab.is-active {
  background: #fbfaff;             /* mesma cor do painel ativo (mescla) */
  border-color: #e4e0f0;
  color: var(--color-primary-dark);
  opacity: 1;
  position: relative;
  z-index: 3;
}
.vce-panel { display: none; }
.vce-panel.is-active {
  display: block;
  background: #fbfaff;
  border: 1px solid #e4e0f0;
  border-radius: 0 16px 16px 16px;
  padding: 16px;
  /* Sem z-index aqui: position:relative + z-index criaria stacking context
     e aprisionaria modais position:fixed dentro do painel. */
}
.vce-panel[hidden] { display: none !important; }
@media (max-width: 600px) {
  .vce-tab { padding: 10px 14px; font-size: 12.5px; }
  .vce-panel.is-active { padding: 12px; }
}

/* Botão "Casting Enviado" (verde discreto) */
.btn-success-soft {
  background: #ecfdf3;
  color: #166534;
  border: 1px solid #bbf2cd;
  font-weight: 800;
  cursor: pointer;
  transition: background .12s ease;
}
.btn-success-soft:hover { background: #d8f7e3; }

/* Mensagens */
.vce-msg-card { padding: 16px 18px; }
.vce-msg-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 460px;
  overflow-y: auto;
  margin-bottom: 14px;
  padding: 4px;
}
.vce-msg {
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  padding: 10px 12px;
  max-width: 80%;
  align-self: flex-start;
}
.vce-msg.is-mine {
  background: #f4f4f4;
  border-color: var(--color-primary-soft);
  align-self: flex-end;
}
.vce-msg-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: var(--color-text-muted);
  margin-bottom: 4px;
}
.vce-msg-meta strong { color: #222; font-weight: 800; }
.vce-msg-text { font-size: 13px; line-height: 1.45; color: var(--color-text); white-space: pre-wrap; word-break: break-word; }
.vce-msg-form {
  display: flex;
  gap: 8px;
  align-items: flex-end;
}
.vce-msg-form textarea {
  flex: 1;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 13px;
  font-family: inherit;
  resize: vertical;
  min-height: 44px;
}
.vce-msg-form button { flex: 0 0 auto; }
/* Botão de enviar mensagem — secundário (não compete com o CTA roxo de contratar) */
.btn.vce-msg-send { background: #fff; border: 1.5px solid #222; color: #222; font-weight: 800; }
.btn.vce-msg-send:hover { background: #222; color: #fff; }
/* Formulário de mensagem (richtext em bloco, botão à direita) */
.vce-msg-form { flex-direction: column; align-items: stretch; gap: 10px; }
.vce-msg-form-actions { display: flex; justify-content: flex-end; }
.vce-msg-rt .richtext-area { min-height: 70px; }

/* Sub-abas dentro de cada proposta (Casting / Mensagens) — barra fixa no scroll */
.prop-subtabs {
  position: sticky;
  top: 0;
  z-index: 6;
  display: flex; gap: 6px;
  background: #f4f4f4;
  padding: 10px 0;
  margin-bottom: 14px;
  border-bottom: 1px solid #ece9f7;
}
.prop-subtab {
  border: none; background: #f5f3fa; color: #555;
  font-family: inherit; font-size: 13px; font-weight: 800;
  padding: 9px 18px; border-radius: 999px; cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  transition: background .15s ease, color .15s ease;
}
.prop-subtab:hover { background: #ece9f7; }
.prop-subtab.is-active { background: var(--color-primary); color: #fff; }
.prop-subtab.is-active .me-tab-count { background: #fff; color: var(--color-primary); }

/* Cabeçalho da seção de mensagens */
.vce-msg-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.vce-msg-head-ic {
  flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%;
  background: var(--color-primary-soft); color: var(--color-primary-dark);
  display: inline-flex; align-items: center; justify-content: center;
}
.vce-msg-head-tx h3 { margin: 0; font-size: 15px; font-weight: 800; color: #222; }
.vce-msg-head-tx p { margin: 2px 0 0; font-size: 12px; color: var(--color-text-muted); line-height: 1.4; }

/* Card de contratação — total + CTA primário único, com nota de segurança */
.d-card.contratar-card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 24px;
  border: 2px solid #222;
  /* Fica fixo no rodapé enquanto rola a aba Casting */
  position: sticky;
  bottom: 0px;
  z-index: 5;
  box-shadow: 0 10px 30px rgba(20,0,60,.16);
  overflow: visible;
  width: calc(100% + 20px);
  margin-left: -10px;
}
.contratar-card-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.contratar-card-label { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; color: var(--color-text-muted); }
.contratar-card-total { font-size: 26px; font-weight: 800; color: #222; line-height: 1.1; }
.contratar-card-note { display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 12px; font-weight: 600; color: var(--color-text-muted); }
.contratar-card-action { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.btn-contratar { padding: 15px 30px; font-size: 14px; }
.contratar-hint { font-size: 11px; font-weight: 600; color: var(--color-text-muted); max-width: 240px; text-align: right; }
@media (max-width: 600px) {
  .contratar-card-action { align-items: stretch; width: 100%; }
  .btn-contratar { width: 100%; }
  .contratar-hint { text-align: center; max-width: none; }
}

/* =========================================================
   CONTRATAR CASTING — seleção pelo contratante
   ========================================================= */
.ctr-slot-list { display: flex; flex-direction: column; gap: 18px; overflow: visible; }
/* Garante que ancestrais não bloqueiem o position:sticky do slot-head */
.vce-panel .d-card,
.vce-panel .vce-panel-body,
.vce-panel,
.d-card:has(.ctr-slot-list) { overflow: visible !important; }
.ctr-slot {
  background: #fff;
  border: 1px solid #ece9f7;
  border-left: 4px solid #c9c5d4;
  border-radius: 0;
  padding: 0;
  /* overflow precisa ser visible (não hidden/auto) para sticky funcionar */
  overflow: visible;
  transition: border-color .15s ease;
}
.ctr-slot.is-ok { border-left-color: var(--color-success); }

/* Header escuro sticky no topo do slot */
.ctr-slot .slot-head {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #222;
  color: #fff;
  align-items: center;
  padding: 12px 16px;
  margin: 0;
  gap: 12px;
}
.ctr-slot .slot-head .slot-qty {
  background: #fff;
  color: #222;
}
.ctr-slot .slot-head .slot-head-title { color: #fff; }
.ctr-slot .slot-head .slot-field {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  color: #fff;
}
.ctr-slot .slot-head .slot-field em { color: rgba(255,255,255,.6); }
.ctr-slot .slot-head .ctr-progress {
  background: #fff;
  color: #222;
  border-color: #fff;
}
.ctr-slot.is-ok .slot-head { background: #166534; }
.ctr-slot.is-ok .slot-head .slot-qty { background: var(--color-success); color: #fff; }
.ctr-slot.is-ok .slot-head .ctr-progress {
  background: rgba(255,255,255,.15);
  color: #fff;
  border-color: rgba(255,255,255,.3);
}
.ctr-slot .ctr-list { padding: 14px 16px; margin-top: 0; }
.ctr-slot > .cp-empty { margin: 14px 16px; }

.ctr-progress {
  font-size: 12px;
  font-weight: 800;
  color: #222;
  background: #fff;
  border: 2px solid #222;
  border-radius: 999px;
  padding: 4px 12px;
  min-width: 56px;
  text-align: center;
}
.ctr-progress.is-ok {
  background: var(--color-success);
  border-color: var(--color-success);
  color: #fff;
}
.ctr-current { display: inline; }
.ctr-target { display: inline; }
.ctr-done-badge {
  display: inline-flex;
  align-items: center;
  background: var(--color-success);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 999px;
  margin-left: 8px;
}

.ctr-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: 14px;
}
@media (min-width: 600px) { .ctr-list { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .ctr-list { grid-template-columns: 1fr 1fr 1fr; } }

.ctr-perfil {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: #fff;
  border: 1.5px solid #ece9f7;
  border-radius: 17px;
  padding: 10px;
  box-shadow: 0 2px 10px rgba(20,0,60,.05);
  transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.ctr-perfil:hover { box-shadow: 0 8px 24px rgba(20,0,60,.09); }
.ctr-perfil.is-selected {
  border:2px solid var(--color-success);
}
/* Selo "selecionado" sobre a foto — afordância clara e leve */
.ctr-perfil.is-selected .ctr-photo-slider::after {
  content: "✓";
  position: absolute;
  top: 8px; left: 8px;
  width: 26px; height: 26px;
  display: flex; align-items: center; justify-content: center;
  background: var(--color-success); color: #fff;
  border-radius: 50%;
  font-size: 14px; font-weight: 900;
  box-shadow: 0 2px 6px rgba(0,0,0,.22);
  z-index: 3;
}
.ctr-perfil.is-disabled { opacity: .45; pointer-events: none; }

/* Slider de fotos (setas laterais) */
.ctr-photo-slider {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  border-radius: 16px;
  overflow: hidden;
  background: #ece9f7;
}
.ctr-slide {
  position: absolute;
  inset: 0;
  background: #ece9f7 center/cover no-repeat;
  opacity: 0;
  transition: opacity .3s ease;
}
.ctr-slide.is-active { opacity: 1; }
/* Placeholder amigável quando o perfil não tem foto */
.ctr-photo-slider.no-photo::before {
  content: "";
  position: absolute;
  inset: 0;
  background: center / 46px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b3a9d6' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21v-1a6 6 0 0 1 6-6h4a6 6 0 0 1 6 6v1'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 1;
}
.ctr-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 38px; height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  border-radius: 10px;
  background: rgba(255,255,255,.9);
  color: #222;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
  transition: background .12s ease, transform .12s ease;
  z-index: 2;
}
.ctr-arrow:hover { background: #fff; transform: translateY(-50%) scale(1.06); }
.ctr-arrow--prev { left: 8px; }
.ctr-arrow--next { right: 8px; }
.ctr-dots {
  position: absolute;
  left: 0; right: 0; bottom: 8px;
  display: flex;
  justify-content: center;
  gap: 5px;
  z-index: 2;
}
.ctr-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,.55);
  box-shadow: 0 1px 2px rgba(0,0,0,.3);
}
.ctr-dot.is-active { background: #fff; }

/* Nome + cidade/idade */
.ctr-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  text-align: center;
  padding: 2px 6px;
}
.ctr-name {
  font-size: 16px;
  font-weight: 800;
  color: #222;
  line-height: 1.2;
  letter-spacing: .2px;
}
.ctr-sub {
  font-size: 11px;
  font-weight: 700;
  color: var(--color-text-muted);
  letter-spacing: .3px;
}

/* Botões Ver Perfil (escuro) / Selecionar (roxo → verde quando selecionado) */
.ctr-actions {
  display: flex;
  gap: 8px;
  margin-top: auto;
}
.ctr-actions .btn {
  flex: 1;
  padding: 12px 10px;
  font-size: 12px;
  letter-spacing: .4px;
  border-radius: 12px;
  white-space: nowrap;
}
.ctr-btn-ver { background: #f1eef9; color: #444; border: 1px solid #e7defc; }
.ctr-btn-ver:hover { background: #222; color: #fff; border-color: #222; }
.ctr-btn-sel { background: none; color: #777; border:2px solid #777; }


.ctr-btn-sel:hover { background: #fff;border:2px solid #222; color: #222 }
.ctr-sel-check { display: none; }
/* Selecionado: estado calmo (verde suave + check), não o verde cheio */
.ctr-perfil.is-selected .ctr-btn-sel { background: #e7f7ee; color: #0f7a44; border: 1px solid #aee3c6; }
.ctr-perfil.is-selected .ctr-btn-sel:hover { background: #d7f0e2; color: #0f7a44; }
.ctr-perfil.is-selected .ctr-sel-check { display: inline-block; }

/* ===== Prévia compacta do slot (miniatura + nome + idade) ===== */
.ctr-preview {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 14px 16px;
  background: #fff;
  border: none;
  border-top: 1px solid #f0eef7;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  transition: background .15s ease;
}
.ctr-preview:hover { background: #faf8ff; }
.ctr-preview-items {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  flex: 1;
  min-width: 0;
}
.ctr-preview-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 64px;
  gap: 4px;
}
.ctr-preview-thumb {
  position: relative;
  width: 56px;
  height: 56px;
  border-radius: 12px;
  background: #ece9f7 center/cover no-repeat;
  border: 2px solid #ece9f7;
  transition: border-color .15s ease;
}
.ctr-preview-item.is-selected .ctr-preview-thumb { border-color: var(--color-success); }
.ctr-preview-check {
  position: absolute;
  top: -6px; right: -6px;
  width: 20px; height: 20px;
  border-radius: 50%;
  background: var(--color-success);
  color: #fff;
  display: none;
  align-items: center;
  justify-content: center;
  border: 2px solid #fff;
  box-shadow: 0 1px 4px rgba(0,0,0,.2);
}
.ctr-preview-item.is-selected .ctr-preview-check { display: inline-flex; }
.ctr-preview-name {
  font-size: 11px;
  font-weight: 700;
  color: #222;
  text-align: center;
  line-height: 1.15;
  max-width: 64px;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ctr-preview-age { font-size: 10px; font-weight: 600; color: var(--color-text-muted); }
.ctr-preview-cta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  flex: 0 0 auto;
  white-space: nowrap;
}
.ctr-preview-count { font-size: 11px; font-weight: 700; color: var(--color-text-muted); }
.ctr-preview-action { font-size: 13px; font-weight: 800; color: var(--color-primary); }
@media (max-width: 600px) {
  .ctr-preview { flex-direction: column; align-items: stretch; }
  .ctr-preview-cta { flex-direction: row; align-items: center; justify-content: space-between; }
}

/* ===== Modal de seleção (fica abaixo do modal de perfil) ===== */
.modal.ctr-select-modal { z-index: 9000; }
.modal.ctr-select-modal .modal-backdrop { background: rgba(20,0,60,.92); backdrop-filter: blur(4px); }
.ctr-select-modal .ctr-list { padding: 0; margin-top: 0; }
.ctr-select-req {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
.ctr-select-actions { display: flex; gap: 10px; }
.ctr-select-actions .js-ctr-cancel { flex: 0 0 auto; min-width: 120px; }
.ctr-select-actions .js-ctr-concluir { flex: 1; }

/* ===== Layout dividido: Disponíveis (esq) × Selecionados (dir) ===== */
.ctr-split { display: flex; flex-direction: column; gap: 16px; }
.ctr-split-col { display: flex; flex-direction: column; min-width: 0; }
.ctr-col-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 800;
  color: #222;
  text-transform: uppercase;
  letter-spacing: .4px;
  padding: 0 2px 10px;
}
.ctr-col-sub {
  font-size: 12px;
  font-weight: 800;
  color: #222;
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 999px;
  padding: 2px 10px;
}
.ctr-split-right .ctr-col-sub { border-color: var(--color-success); color: var(--color-success); }
.ctr-split .ctr-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin: 0;
  padding: 0;
}
.ctr-split .ctr-name { font-size: 18px; }
.ctr-split .ctr-actions .btn { padding: 12px 8px; font-size: 11px; }
/* "Ver Perfil" vira ícone (olho) — botão quadrado; "Selecionar" ocupa o resto */
.ctr-actions .ctr-btn-ver { flex: 0 0 46px; gap: 0; }
.ctr-split .ctr-actions .ctr-btn-ver { padding: 12px 0; }
.ctr-actions .ctr-btn-sel { flex: 1 1 auto; }

/* Coluna "Selecionados": painel com cor própria e scroll próprio */
.ctr-split-right {
  background: #f5f3fa;
  border: 1px solid #ece9f7;
  border-radius: 14px;
  padding: 12px;
}
.ctr-picks {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin: 0;
  padding: 0;
  scrollbar-width: thin;
  scrollbar-color: var(--color-primary-light) #ece9f7;
}
.ctr-picks::-webkit-scrollbar { width: 8px; }
.ctr-picks::-webkit-scrollbar-track { background: #ece9f7; border-radius: 8px; }
.ctr-picks::-webkit-scrollbar-thumb { background: var(--color-primary-light); border-radius: 8px; }
@media (min-width: 760px) {
  .ctr-split { flex-direction: row; align-items: flex-start; }
  .ctr-split-left { flex: 1 1 auto; }
  .ctr-split-right { flex: 0 0 200px; max-width: 200px; }
  .ctr-split-left .ctr-list { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); max-height: 66vh; overflow-y: auto; padding-right: 4px; }
  .ctr-picks { max-height: 62vh; overflow-y: auto; padding-right: 4px; }
}

/* Mini-card do selecionado: foto quadrada + nome dentro + lixeira no topo */
.ctr-pick { display: block; }
.ctr-pick-photo {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 12px;
  overflow: hidden;
  background: #ece9f7 center/cover no-repeat;
    border: 2px solid var(--color-success);
}
.ctr-pick-photo.no-photo { background: #ece9f7; }
.ctr-pick-name {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 18px 6px 6px;
  background: linear-gradient(to top, rgba(0,0,0,.78), rgba(0,0,0,0));
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .2px;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Lixeira (remover) no canto superior direito da foto — ícone circular discreto */
.ctr-pick-remove {
  position: absolute;
  top: 6px; right: 6px;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: #fff;
  color: #444;
  border: 1px solid #ece9f7;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  box-shadow: 0 1px 5px rgba(0,0,0,.22);
  transition: background .12s ease, color .12s ease, transform .12s ease;
  z-index: 2;
}
.ctr-pick-remove:hover { background: #e23b3b; color: #fff; border-color: #e23b3b; transform: scale(1.06); }
.ctr-pick.is-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  border: 2px dashed #cfc9e6;
  border-radius: 12px;
  background: #fff;
}
.ctr-pick-ph-ico {
  width: 34px; height: 34px;
  border-radius: 50%;
  border: 2px dashed #cfc9e6;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
  color: #b3acce;
}

/* =========================================================
   ABA PROPOSTAS — lista + master-detail + triagem
   ========================================================= */
.prop-lista { display: flex; flex-direction: column; gap: 12px; }
.prop-card {
  display: flex;
  align-items: center;
  gap: 14px;
  background: #fff;
  border: 1px solid #ece9f7;
  border-left: 4px solid #ece9f7;
  border-radius: 14px;
  padding: 14px 16px;
  cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, opacity .15s ease;
}
.prop-card:hover { box-shadow: 0 6px 22px rgba(20,0,60,.08); transform: translateY(-1px); }
.prop-card.is-favorito { border-left-color: var(--color-primary-light); }
.prop-card.is-current {
  border-color: var(--color-primary);
  border-left-color: var(--color-primary);
  box-shadow: 0 0 0 2px rgba(124,0,245,.12);
}
.prop-card.is-descartado { opacity: .5; }
.prop-card-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.prop-card-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.prop-card-ag { margin: 0; font-size: 16px; font-weight: 800; color: #222; line-height: 1.2; }
.prop-badge { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; padding: 2px 8px; border-radius: 999px; }
.prop-badge--ok { background: #e6f7ee; color: #128a52; }
.prop-badge--no { background: #fdecec; color: #c0392b; }
.prop-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; font-size: 12px; color: var(--color-text-muted); font-weight: 600; }
.prop-card-date { font-weight: 700; }
.prop-chip { background: #fff; border: 1px solid #ece9f7; color: #222; font-weight: 800; font-size: 11px; padding: 2px 8px; border-radius: 999px; }
.prop-people { display: inline-flex; align-items: center; gap: 4px; font-weight: 800; color: #222; }
.prop-card-total { font-size: 18px; font-weight: 800; color: #222; }
/* Lista de contatos da aba Mensagens (uma conversa por agência) */
.msg-contatos { display: flex; flex-direction: column; gap: 8px; }
.msg-contato {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px;
  background: #fff; border: 1px solid #ece9f7; border-radius: 12px;
  text-decoration: none; color: inherit;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.msg-contato:hover { box-shadow: 0 6px 18px rgba(20,0,60,.07); transform: translateY(-1px); border-color: #d9d2f0; }
.msg-contato-av {
  flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%;
  background: var(--color-primary-soft); color: var(--color-primary-dark);
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 16px;
}
.msg-contato-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.msg-contato-body strong { font-size: 15px; font-weight: 800; color: #222; }
.msg-contato-meta { font-size: 12px; color: var(--color-text-muted); font-weight: 600; }
.vce-msg-conversa { margin-top: 16px; padding-top: 16px; border-top: 1px solid #ece9f7; }
.vce-msg-conversa-head { font-size: 13px; font-weight: 700; color: var(--color-text-muted); margin-bottom: 10px; }

/* Contador "X/Y selecionados" (tempo real) */
.prop-selcount { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 800; color: var(--color-text-muted); }
.prop-selcount .num { color: #222; }
.prop-selcount.is-complete { color: var(--color-success); }
.prop-selcount.is-complete .num { color: var(--color-success); }
.prop-card--compact .prop-selcount { font-size: 12px; }
.prop-c-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 2px; }

/* Mensagens no card da proposta + alerta de não lidas */
.prop-msgs {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 800;
    color: #222;
    background: #f4f4f4;
    border: 1px solid #999;
    padding-left: 7px;
    padding-right: 7px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 7px;
    
}



.prop-msgs .num { color: #222; }
.prop-msgs.has-novas { color: #e23b3b; }
.prop-msgs-alert {
  background: #e23b3b; color: #fff;
  border-radius: 999px; padding: 1px 7px;
  font-size: 10px; font-weight: 800; line-height: 1.5;
}
/* Badge ÚNICO de status (estado da proposta) */
.prop-stbadge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .4px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid transparent;
  white-space: nowrap;
}
.prop-stbadge.st--nova       { background: #e23b3b; color: #fff; border-color: transparent; }
.prop-stbadge.st--visto      { background: #f1f1f4; color: #5f6470; }
.prop-stbadge.st--favorita   { background: #fdeaf3; color: #c2185b; }
.prop-stbadge.st--descartada { background: #f3f3f5; color: #8a8a93; }
.prop-stbadge.st--contratada { background: #e6f7ee; color: #128a52; border-color: #a7e3c4; }

/* Estados do card */
.prop-card.is-contratada { border-color: var(--color-success); border-left-color: var(--color-success); box-shadow: 0 0 0 2px rgba(26,170,97,.14); }
.prop-card.is-locked { opacity: .4; pointer-events: none; filter: grayscale(.4); cursor: default; }

/* Barra de triagem dentro do detalhe da proposta */
.prop-detail-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; margin-top: 10px; }
.prop-detail-back { font-size: 13px; font-weight: 800; color: var(--color-primary); text-decoration: none; }
.prop-detail-tri { display: flex; gap: 4px; margin-left: auto; }
.prop-tri-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 10px;
  border: none; background: transparent; color: #9a96a8;
  border-radius: 999px; cursor: pointer;
  font-family: inherit; font-size: 11px; font-weight: 800;
  text-transform: uppercase; letter-spacing: .4px;
  transition: background .12s ease, color .12s ease;
}
.prop-tri-btn:hover { background: #f5f3fa; color: #6b6b73; }
.prop-tri-btn.is-on[data-acao="favorito"]   { color: #ec4899; }
.prop-tri-btn.is-on[data-acao="descartado"] { color: #e23b3b; }

/* No card compacto, o status segue a MESMA identidade do prop-detail-tri
   (ícone + texto discreto, sem pílula preenchida, cor por estado) */
.prop-card--compact .prop-stbadge {
  background: transparent;
  border: none;
  padding: 0;
  gap: 5px;
}
.prop-card--compact .prop-stbadge.st--nova       { color: var(--color-primary); }
.prop-card--compact .prop-stbadge.st--visto      { color: #9a96a8; }
.prop-card--compact .prop-stbadge.st--favorita   { color: #ec4899; }
.prop-card--compact .prop-stbadge.st--descartada { color: #e23b3b; }
.prop-card--compact .prop-stbadge.st--contratada { color: #128a52; }
.prop-md { display: flex; flex-direction: column; gap: 14px; }
.prop-md-back { display: inline-block; font-size: 13px; font-weight: 800; color: var(--color-primary); text-decoration: none; }
.prop-md-aside { display: flex; flex-direction: column; gap: 10px; }
/* Card compacto (sidebar) — layout rico tipo referência */
.prop-card--compact {
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  padding: 14px;
}
.prop-c-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.prop-card--compact .prop-card-ag { font-size: 16px; }
.prop-c-sub { font-size: 12px; font-weight: 600; color: var(--color-text-muted); }
.prop-c-total { display: flex; align-items: center; gap: 8px; color: #222; }
.prop-c-total strong { font-size: 17px; font-weight: 800; color: #222; }
.prop-c-sep { border-top: 1px dashed #d9d5ea; margin: 2px 0; }
.prop-c-reqs { display: flex; flex-direction: column; gap: 8px; }
.prop-c-req { display: flex; align-items: center; gap: 10px; }
.prop-c-num {
  flex: 0 0 auto;
  min-width: 34px; height: 34px; padding: 0 6px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 2px solid #222; border-radius: 8px;
  font-size: 14px; font-weight: 800; color: #222;
}
.prop-c-lbl { font-size: 14px; font-weight: 800; color: #222; }

/* Barra de filtro da lista de propostas */
.prop-toolbar { display: flex; justify-content: flex-end; margin-bottom: 12px; }
.prop-filtro { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .4px; }
.prop-filtro select { font-family: inherit; font-size: 13px; font-weight: 700; color: #222; border: 1.5px solid #ece9f7; border-radius: 10px; padding: 8px 12px; background: #fff; cursor: pointer; }
/* Filtro dentro da sidebar do master-detail: ocupa a largura toda */
.prop-md-aside .prop-toolbar { margin-bottom: 0; }
.prop-md-aside .prop-filtro { width: 100%; justify-content: space-between; }
.prop-md-aside .prop-filtro select { flex: 1; }
@media (min-width: 900px) {
  .prop-md { flex-direction: row; align-items: flex-start; }
  .prop-md-aside { flex: 0 0 300px; max-width: 300px; max-height: 72vh; overflow-y: auto; padding-right: 4px; }
  .prop-md-detail { flex: 1 1 auto; min-width: 0; }
}

/* Setas de navegação FORA do modal de perfil — nas laterais da viewport */
#modal-perfil-view .vp-nav {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  width: 48px; height: 48px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid #ece9f7;
  color: #222;
  font-size: 28px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 6px 20px rgba(0,0,0,.18);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 110;
  font-family: inherit;
  line-height: 1;
}
#modal-perfil-view .vp-nav:hover { background: #222; color: #fff; border-color: #222; }
#modal-perfil-view .vp-nav:disabled {
  opacity: .35;
  cursor: not-allowed;
  background: #fff;
  color: #c9c5d4;
}
#modal-perfil-view .vp-nav--prev { left: 24px; }
#modal-perfil-view .vp-nav--next { right: 24px; }
@media (max-width: 720px) {
  #modal-perfil-view .vp-nav { width: 38px; height: 38px; font-size: 22px; }
  #modal-perfil-view .vp-nav--prev { left: 6px; }
  #modal-perfil-view .vp-nav--next { right: 6px; }
}
/* Esconde as setas quando o modal não está aberto */
#modal-perfil-view:not(.is-open) .vp-nav { display: none; }

/* Label de role na mensagem (Agência/Contratante) */
.vce-msg-role {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .5px;
  background: rgba(0,0,0,.06);
  color: #222;
  padding: 2px 6px;
  border-radius: 4px;
}
.vce-msg.is-mine .vce-msg-role { background: rgba(255,255,255,.4); }

/* Badge de mensagens não-lidas */
.msg-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--color-primary);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  padding: 2px 8px;
  border-radius: 999px;
  margin-left: 4px;
  min-width: 18px;
  height: 18px;
}
.msg-badge--sm { font-size: 10px; padding: 1px 6px; min-width: 16px; height: 16px; }

/* Status de leitura e excluir mensagem */
.vce-msg-meta { flex-wrap: wrap; }
.vce-msg-status {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .4px;
  padding: 2px 6px;
  border-radius: 4px;
  margin-left: auto;
}
.vce-msg-status.is-unread { background: #fff; color: var(--color-text-muted); border: 1px solid #ece9f7; }
.vce-msg-status.is-read { background: #ecfdf3; color: #166534; }
.vce-msg-del-form { margin: 0; display: inline-flex; }
.vce-msg-del {
  background: rgba(0,0,0,.08);
  border: none;
  width: 18px; height: 18px;
  border-radius: 50%;
  color: #444;
  cursor: pointer;
  font-size: 12px;
  line-height: 0;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.vce-msg-del:hover { background: #e23b3b; color: #fff; }
.evento-card-foot { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.me-cal .cal-day.is-today {
  outline: 1.5px dashed var(--color-primary);
  outline-offset: -2px;
}
.me-cal .cal-day.has-event.is-today { background: #222; color: #fff; outline: none; }
.me-cal .cal-day.is-empty { background: transparent; }
.me-cal-legend {
  margin-top: 10px;
  font-size: 11px;
  color: var(--color-text-muted);
  display: flex;
  align-items: center;
  gap: 6px;
}
.me-legend-dot {
  width: 12px; height: 12px;
  border: 2px solid #222;
  border-radius: 4px;
  background: #fff;
}

/* Lista de eventos em coluna única (do lado direito) */
.meus-eventos-layout .eventos-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Ações do evento-card */
.evento-card { position: relative; }
.evento-card-actions {
  display: flex;
  gap: 6px;
  position: absolute;
  top: 14px;
  right: 14px;
}
.ev-action,
.ev-action-form button {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: #fff;
  color: #2a2a2a;
  border: 1px solid #ece9f7;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.ev-action:hover { background: #222; color: #fff; border-color: #222; }
.ev-action--danger:hover { background: #e23b3b; color: #fff; border-color: #e23b3b; }
.ev-action-form { margin: 0; padding: 0; line-height: 0; }
.evento-card-head { padding-right: 120px; }

/* =========================================================
   VIEW EVENTO (modal)
   ========================================================= */
.view-evento-head {
  padding-bottom: 14px;
  border-bottom: 1px solid #ece9f7;
  margin-bottom: 16px;
}
.view-evento-head h2 {
  font-size: 22px;
  font-weight: 800;
  margin: 6px 0 4px;
}
.view-evento-head .ve-local {
  color: var(--color-text-muted);
  font-size: 13px;
  margin: 0;
}
.ve-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.ve-cell {
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  padding: 10px 12px;
}
.ve-cell-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: var(--color-text-muted);
  margin-bottom: 2px;
}
.ve-cell strong { font-size: 15px; font-weight: 800; color: #222; }
.ve-richtext {
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.55;
}
.ve-richtext p { margin: 0 0 8px; }
.ve-richtext ul, .ve-richtext ol { margin: 0 0 8px; padding-left: 20px; }
.ve-totais {
  display: flex;
  gap: 10px;
  margin-bottom: 14px;
}
.ve-totais-item {
  flex: 1;
  background: #fff;
  border: 2px solid #222;
  border-radius: 10px;
  padding: 12px;
  text-align: center;
}
.ve-totais-num {
  display: block;
  font-size: 24px;
  font-weight: 800;
  color: #222;
}
.ve-totais-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: var(--color-text-muted);
}
.ve-subhead {
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: var(--color-text-muted);
  margin: 14px 0 8px;
}
.ve-perfis {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ve-perfil-row {
  display: flex;
  gap: 12px;
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  padding: 10px 12px;
}
.ve-perfil-qty {
  font-size: 18px;
  font-weight: 800;
  color: #222;
  min-width: 38px;
}
.ve-perfil-info { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.ve-perfil-info strong { font-size: 14px; font-weight: 800; color: #222; }
.ve-perfil-meta { font-size: 12px; color: var(--color-text-muted); }
.ve-perfil-obs {
  font-size: 13px;
  color: var(--color-text);
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed #ece9f7;
}
.view-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}
@media (max-width: 599px) {
  .view-actions { flex-direction: column; }
  .ve-grid { grid-template-columns: 1fr; }
  .ve-totais { flex-direction: column; }
}

/* =========================================================
   MEUS EVENTOS — grid de cards (antigo, mantido)
   ========================================================= */
.eventos-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
@media (min-width: 720px)  { .eventos-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .eventos-grid { grid-template-columns: 1fr 1fr 1fr; gap: 18px; } }

.evento-card {
  background: #fff;
  border-radius: 16px;
  border: 1px solid #ece9f7;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.evento-card:hover {
  transform: translateY(-2px);
  border-color: var(--color-primary-light);
  box-shadow: 0 14px 36px rgba(20,0,60,.08);
}

.evento-card-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
}
.evento-card-title h3 {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -.3px;
  line-height: 1.2;
}
.evento-card-local {
  font-size: 12px;
  color: var(--color-text-muted);
}
.evento-status {
  display: inline-block;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .5px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
  background: #e0f8ec;
  color: #157a48;
  flex-shrink: 0;
  white-space: nowrap;
}
.evento-status--rascunho  { background: #f1f1f3; color: #6b6b73; }
.evento-status--encerrado { background: #fde2e2; color: #a82424; }
.evento-status--publicado { background: #fff7e6; color: #b9770a; border: 1px solid #f3d9a6; }
/* Status na ótica do contratante (meus-eventos) */
.evento-status--aguardando { background: #fff7e6; color: #b9770a; border: 1px solid #f3d9a6; }
.evento-status--aguardando_pagamento { background: #fff7ed; color: #9a3412; border: 1px solid #fed7aa; }
.evento-status--propostas  { background: var(--color-primary-soft); color: var(--color-primary-dark); border: 1px solid var(--color-primary-light); }
.evento-status--contratado,
.evento-status--fechado {
  background: var(--color-success); color: #fff;
  box-shadow: 0 2px 8px rgba(43,182,115,.35);
  padding: 5px 12px; font-size: 10.5px;
}

.evento-card-row {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #faf9fc;
  padding: 10px 12px;
  border-radius: 10px;
}
.evento-card-row svg { color: var(--color-primary); flex-shrink: 0; }
.evento-card-row strong {
  display: block;
  font-size: 13px;
  font-weight: 800;
}
.evento-card-dias {
  display: block;
  font-size: 11px;
  color: var(--color-text-muted);
  margin-top: 2px;
}

.evento-card-perfis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.evento-perfil-stat {
  background: var(--color-primary-soft);
  color: var(--color-primary);
  padding: 12px;
  border-radius: 12px;
  text-align: center;
}
.evento-perfil-stat--staff {
  background: #ffe1ee;
  color: #c93366;
}
.evento-perfil-num {
  display: block;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -1px;
  line-height: 1;
  margin-bottom: 4px;
}
.evento-perfil-label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .8px;
  text-transform: uppercase;
  opacity: .9;
}

.evento-card-foot {
  margin-top: auto;
  padding-top: 6px;
  border-top: 1px solid #f3f0fa;
  display: flex;
  justify-content: flex-end;
}
.evento-card-foot .btn { padding: 8px 14px; font-size: 12px; }

/* Lista única de perfis adicionados */
.perfis-lista {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 14px;
}
.perfis-empty {
  text-align: center;
  font-size: 12px;
  color: var(--color-text-muted);
  padding: 18px 8px;
  background: #fff;
  border: 1px dashed #d6d4e0;
  border-radius: 10px;
}
.perfil-item {
  background: #fff;
  border-radius: 12px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 2px 8px rgba(20,0,60,.04);
}
.perfil-item-tag {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .6px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--color-primary-soft);
  color: var(--color-primary);
  white-space: nowrap;
}
.perfil-item-tag.staff { background: #ffe1ee; color: #c93366; }
.perfil-item-info { flex: 1; min-width: 0; }
.perfil-item-info strong { display: block; font-size: 14px; }
.perfil-item-info span {
  font-size: 12px;
  color: var(--color-text-muted);
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.perfil-item-rm {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: #f5f3fa;
  color: var(--color-text-muted);
  border: none;
  font-size: 18px;
  font-weight: 700;
  line-height: 0;
  cursor: pointer;
  flex-shrink: 0;
}
.perfil-item-rm:hover { background: #e23b3b; color: #fff; }

/* (Mantém estilos legados de perfis-grid / perfil-row caso ainda existam em outro lugar) */
.perfis-rows { display: flex; flex-direction: column; gap: 10px; margin-bottom: 10px; }
.perfis-empty {
  text-align: center;
  font-size: 12px;
  color: var(--color-text-muted);
  padding: 12px 8px;
  background: #fff;
  border: 1px dashed #d6d4e0;
  border-radius: 10px;
  margin-bottom: 10px;
}

/* Cada linha de perfil */
.perfil-row {
  background: #fff;
  border-radius: 12px;
  padding: 12px;
  box-shadow: 0 2px 8px rgba(20,0,60,.04);
}
.perfil-row-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 8px;
}
.perfil-row-title {
  font-size: 12px;
  font-weight: 800;
  color: var(--color-text-muted);
  letter-spacing: .5px;
  text-transform: uppercase;
}
.perfil-row-rm {
  width: 26px; height: 26px;
  border-radius: 50%;
  background: #f5f3fa;
  color: var(--color-text-muted);
  border: none;
  font-size: 18px;
  font-weight: 700;
  cursor: pointer;
  line-height: 0;
}
.perfil-row-rm:hover { background: #e23b3b; color: #fff; }
.perfil-row-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 8px;
}
.perfil-row label {
  display: flex;
  flex-direction: column;
  font-size: 11px;
  font-weight: 700;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: .3px;
  gap: 4px;
}
.perfil-row label.full { grid-column: 1 / -1; }
.perfil-row input,
.perfil-row select,
.perfil-row textarea {
  font-family: inherit;
  font-size: 13px;
  color: var(--color-text);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  padding: 8px 10px;
  outline: none;
  background: #fff;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
}
.perfil-row input:focus,
.perfil-row select:focus,
.perfil-row textarea:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(124,0,245,.12);
}

/* Espaço entre voltar e cadastrar na etapa 2 */
.evento-actions-2 {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

/* Colunas lado a lado no desktop */
@media (min-width: 720px) {
  .perfis-grid { grid-template-columns: 1fr 1fr; gap: 18px; }
  .perfil-row-grid { grid-template-columns: repeat(3, 1fr); }
}

/* =========================================================
   CADASTRO — Etapa 1 (seletor de tipo)
   ========================================================= */
.cadastro-picker { padding: 4px 0 4px; }
.cadastro-picker .picker-lead {
  font-size: 14px;
  color: var(--color-text-muted);
  text-align: center;
  margin: 4px 0 22px;
}
.picker-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.picker-card {
  background: #fff;
  border: 2px solid #ece9f7;
  border-radius: 18px;
  padding: 22px 22px 20px;
  text-align: left;
  cursor: pointer;
  transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease, background .14s ease;
  font-family: inherit;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.picker-card:hover {
  border-color: var(--color-primary);
  background: #faf5ff;
  transform: translateY(-2px);
  box-shadow: 0 14px 36px rgba(124,0,245,.12);
}
.picker-icon {
  width: 54px;
  height: 54px;
  border-radius: 16px;
  background: var(--color-primary-soft);
  color: var(--color-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.picker-icon svg { width: 28px; height: 28px; }
.picker-card h3 {
  font-size: 18px;
  font-weight: 800;
  margin: 4px 0 2px;
  letter-spacing: -.2px;
  color: var(--color-text);
}
.picker-card p {
  font-size: 13px;
  color: var(--color-text-muted);
  margin: 0;
  line-height: 1.45;
}
.picker-cta {
  margin-top: 8px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .5px;
  color: var(--color-primary);
  text-transform: uppercase;
}
@media (min-width: 720px) {
  .picker-cards { grid-template-columns: 1fr 1fr; gap: 18px; }
  .picker-card { padding: 26px 24px 22px; }
}

/* Chip que indica o tipo escolhido + link para voltar */
.type-chip-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 18px;
  padding: 10px 14px;
  border-radius: var(--radius-sm);
  background: var(--color-primary-soft);
}
.type-chip-bar .chip {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--color-primary);
}
.type-chip-bar .link-trocar {
  font-size: 12px;
  font-weight: 700;
  color: var(--color-text-muted);
  text-decoration: none;
}
.type-chip-bar .link-trocar:hover { color: var(--color-primary); }

@media (min-width: 720px) {
  .modal-dialog {
    width: 92%;
    max-width: 720px;
    height: auto;
    margin: 36px auto;
    border-radius: 20px;
    max-height: calc(100% - 72px);
  }
}

.modal-loading {
  text-align: center;
  padding: 40px 20px;
  color: var(--color-text-muted);
  font-size: 14px;
}

/* =========================================================
   VIEW PERFIL — modal de visualização
   ========================================================= */
.view-perfil { padding-bottom: 8px; }
.view-header {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 18px;
}
.view-foto-main {
  width: 100%;
  aspect-ratio: 3/4;
  max-height: 320px;
  background-size: cover;
  background-position: center;
  background-color: var(--color-primary-soft);
  border-radius: 16px;
}
.view-foto-main.no-photo {
  display: flex; align-items: center; justify-content: center;
}
.view-foto-main.no-photo span {
  font-size: 80px;
  font-weight: 800;
  color: var(--color-primary);
}
.view-head-info h2 {
  margin: 6px 0 2px;
  font-size: 22px;
  font-weight: 800;
}
.view-head-info .meta {
  color: var(--color-text-muted);
  margin: 0;
  font-size: 13px;
}
.view-section { margin: 18px 0; }
.view-section h3 {
  font-size: 12px;
  letter-spacing: 1.2px;
  font-weight: 800;
  color: var(--color-primary);
  text-transform: uppercase;
  margin: 0 0 10px;
}
.view-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px 10px;
  margin: 0;
}
.view-grid dt {
  font-size: 11px;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-top: 6px;
}
.view-grid dd {
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 600;
}
/* Cabeçalho só com informações (sem foto grande) */
.view-header--info { display: block; margin-bottom: 6px; }
/* Lista de fotos: 100% da largura, uma abaixo da outra */
.view-fotos-lista { display: flex; flex-direction: column; gap: 12px; }
.view-foto-full {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 14px;
  background: var(--color-primary-soft);
  cursor: zoom-in;
}
.view-galeria {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
  gap: 8px;
}
.view-thumb {
  aspect-ratio: 1;
  background-size: cover;
  background-position: center;
  background-color: var(--color-primary-soft);
  border-radius: 10px;
  position: relative;
}
.view-thumb.is-main { box-shadow: 0 0 0 3px var(--color-primary); }
.view-thumb .star {
  position: absolute; top: 4px; right: 4px;
  background: var(--color-primary);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  width: 20px; height: 20px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
}

.view-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
@media (min-width: 500px) {
  .view-actions { flex-direction: row; justify-content: flex-end; }
  .view-actions .btn { width: auto; }
}
.btn-block-mobile { width: 100%; }
@media (min-width: 500px) { .btn-block-mobile { width: auto; } }

@media (min-width: 720px) {
  .view-header { flex-direction: row; align-items: stretch; }
  .view-foto-main { width: 230px; flex-shrink: 0; }
  .view-grid { grid-template-columns: 140px 1fr; gap: 4px 12px; }
  .view-grid dt { margin-top: 2px; }
}

/* =========================================================
   PHOTO MANAGER — edição de fotos do modelo
   ========================================================= */
.fotos-manager {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 12px;
  padding: 12px;
  margin-bottom: 12px;
}
.fotos-manager-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px dashed #ececec;
}
.fotos-manager-toolbar .hint {
  font-size: 11px;
  color: var(--color-text-muted);
  flex: 1;
  min-width: 100%;
  order: 5;
}
@media (min-width: 600px) {
  .fotos-manager-toolbar .hint { min-width: 0; order: 0; text-align: right; }
}
.fotos-select-all {
  font-size: 12px;
  color: var(--color-text-muted);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

.fotos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 10px;
}
.foto-card {
  position: relative;
  aspect-ratio: 1;
  border-radius: 12px;
  overflow: hidden;
  background: #f5f3fa;
  cursor: grab;
  user-select: none;
  transition: transform .12s ease, box-shadow .12s ease;
}
.foto-card.dragging { opacity: .4; cursor: grabbing; }
.foto-card.is-main {
  box-shadow: 0 0 0 3px var(--color-primary);
}
.foto-thumb {
  width: 100%; height: 100%;
  background-size: cover;
  background-position: center;
}
.foto-card .foto-select {
  position: absolute;
  top: 6px; left: 6px;
  background: rgba(255,255,255,.92);
  border-radius: 50%;
  width: 22px; height: 22px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0,0,0,.18);
}
.foto-card .foto-select input { margin: 0; cursor: pointer; }
.foto-action {
  position: absolute;
  background: rgba(255,255,255,.92);
  border: none;
  border-radius: 50%;
  width: 26px; height: 26px;
  font-size: 14px;
  font-weight: 800;
  color: #2a2a2a;
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,.18);
  transition: background .15s ease, color .15s ease;
}
.foto-star { top: 6px; right: 6px; }
.foto-del  { bottom: 6px; right: 6px; }
.foto-star:hover { background: var(--color-primary); color: #fff; }
.foto-del:hover  { background: #e23b3b; color: #fff; }
.foto-card.is-main .foto-star { background: var(--color-primary); color: #fff; }
.foto-tag-main {
  position: absolute;
  bottom: 6px; left: 6px;
  background: var(--color-primary);
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .4px;
  padding: 3px 7px;
  border-radius: 999px;
  text-transform: uppercase;
}
.foto-thumb { cursor: zoom-in; }

/* =========================================================
   Form do elenco — overrides
   ========================================================= */
.elenco-form .form-section h3 {
  color: var(--color-primary);
}
.elenco-form .only-staff { display: none; }
.elenco-form .only-modelo { display: grid; }
.elenco-form[data-tipo="staff"] .only-staff { display: grid; }
.elenco-form[data-tipo="staff"] .only-modelo { display: none; }
.elenco-form[data-tipo="modelo"] .lbl-staff,
.elenco-form[data-tipo="staff"]  .lbl-modelo { display: none; }

/* Dropzone galeria */
.dropzone {
  border: 2px dashed #cdc9d6;
  border-radius: 12px;
  padding: 18px;
  text-align: left;
  background: #fff;
}
.dropzone-preview {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 10px;
  margin-top: 14px;
}
.dz-thumb {
  position: relative;
  aspect-ratio: 1;
  border-radius: 12px;
  overflow: hidden;
  background: #f5f3fa;
  cursor: grab;
  user-select: none;
  transition: transform .12s ease;
}
.dz-thumb.dragging { opacity: .4; cursor: grabbing; }
.dz-thumb.is-principal {
  box-shadow: 0 0 0 3px var(--color-primary);
}
.dz-thumb .dz-img {
  width: 100%; height: 100%;
  background-size: cover;
  background-position: center;
  cursor: zoom-in;
}
.dz-thumb .rm {
  position: absolute;
  top: 6px; right: 6px;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: rgba(0,0,0,.65);
  color: #fff;
  border: none;
  font-size: 16px;
  font-weight: 700;
  line-height: 0;
  cursor: pointer;
}
.dz-thumb .rm:hover { background: #e23b3b; }
.dz-tag-main {
  position: absolute;
  bottom: 6px; left: 6px;
  background: var(--color-primary);
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .5px;
  padding: 3px 7px;
  border-radius: 999px;
}

/* =========================================================
   LIGHTBOX
   ========================================================= */
.modal.lightbox .lightbox-dialog {
  position: relative;
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.lightbox-img {
  max-width: 94vw;
  max-height: 84vh;
  object-fit: contain;
  border-radius: 10px;
  box-shadow: 0 20px 60px rgba(0,0,0,.5);
  background: #000;
}
.lightbox-close {
  position: absolute;
  top: 18px; right: 18px;
  width: 44px; height: 44px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,.9);
  font-size: 24px;
  font-weight: 700;
  cursor: pointer;
  z-index: 2;
}
.lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,.85);
  color: #1c1c1e;
  font-size: 28px;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.lightbox-nav:hover { background: #fff; }
.lightbox-nav.prev { left: 14px; }
.lightbox-nav.next { right: 14px; }
.lightbox-counter {
  position: absolute;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  background: rgba(0,0,0,.5);
  padding: 6px 12px;
  border-radius: 999px;
  z-index: 2;
}
@media (min-width: 720px) {
  .lightbox-nav { width: 64px; height: 64px; font-size: 36px; }
}

/* =========================================================
   ELENCO — Lista e filtros
   ========================================================= */
.elenco-filtros {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 18px;
}
.tabs, .sub-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 4px;
  -webkit-overflow-scrolling: touch;
}
.tab, .sub-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 999px;
  background: #f5f3fa;
  color: var(--color-text-muted);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  flex-shrink: 0;
}
.tab .cnt, .sub-tab .cnt {
  font-size: 11px;
  background: rgba(0,0,0,.06);
  padding: 1px 7px;
  border-radius: 999px;
}
.tab.is-active {
  background: var(--color-primary);
  color: #fff;
}
.tab.is-active .cnt { background: rgba(255,255,255,.25); color: #fff; }
.sub-tab.is-active {
  background: var(--color-primary-soft);
  color: var(--color-primary);
}

/* Grid */
.elenco-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (min-width: 720px) { .elenco-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1000px){ .elenco-grid { grid-template-columns: repeat(4, 1fr); gap: 18px; } }
@media (min-width: 1400px){ .elenco-grid { grid-template-columns: repeat(5, 1fr); } }

.perfil-card {
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 18px rgba(20,0,60,.05);
  transition: transform .15s ease, box-shadow .15s ease;
  cursor: pointer;
}
.perfil-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(20,0,60,.1);
}
.perfil-foto {
  width: 100%;
  aspect-ratio: 3/4;
  background-size: cover;
  background-position: center;
  background-color: var(--color-primary-soft);
  position: relative;   /* para posicionar .perfil-actions */
}
.perfil-foto.no-photo {
  display: flex; align-items: center; justify-content: center;
}

/* Ícones de ação no card de perfil */
.perfil-actions {
  position: absolute;
  top: 8px;
  right: 8px;
  display: flex;
  gap: 6px;
  z-index: 2;
}
.perfil-action,
.perfil-action-form button {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(255,255,255,.92);
  color: #2a2a2a;
  border: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 4px 14px rgba(0,0,0,.18);
  transition: background .15s ease, color .15s ease, transform .12s ease;
  text-decoration: none;
}
.perfil-action:hover {
  background: var(--color-primary);
  color: #fff;
  transform: translateY(-1px);
}
.perfil-action.danger:hover {
  background: #e23b3b;
  color: #fff;
}
.perfil-action-form { margin: 0; padding: 0; line-height: 0; }
/* Card não deve "subir" inteiro quando hover for nos ícones */
.perfil-card:has(.perfil-actions:hover) { transform: none; }

.perfil-foto.no-photo span {
  font-size: 11px;
  font-weight: 800;
  color: var(--color-primary);
}
.perfil-info { padding: 12px 14px 16px; }
.perfil-info h3 {
  font-size: 15px;
  margin: 6px 0 4px;
  font-weight: 700;
}
.perfil-meta {
  font-size: 11px;
  color: var(--color-text-muted);
  margin: 2px 0;
}
.perfil-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .5px;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--color-primary-soft);
  color: var(--color-primary);
}
.perfil-tag.staff {
  background: #ffe1ee;
  color: #c93366;
}
/* Tag em overlay sobre a foto do card */
.perfil-tag.overlay {
  position: absolute;
  bottom: 8px;
  left: 8px;
  background: rgba(255,255,255,.92);
  color: var(--color-primary);
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
  z-index: 2;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.perfil-tag.overlay.staff {
  background: rgba(255,225,238,.95);
  color: #c93366;
}
.perfil-nome {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -.3px;
  color: var(--color-text);
  margin: 12px 14px 0;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.perfil-info { padding: 4px 14px 14px; }
.perfil-info .perfil-meta {
  font-size: 12px;
  color: var(--color-text-muted);
  font-weight: 600;
  margin: 0;
}

.empty-state {
  text-align: center;
  padding: 60px 20px;
  color: var(--color-text-muted);
}
.empty-state p { margin-bottom: 16px; }

/* =========================================================
   ============== DASHBOARD (Mobile First) =================
   ========================================================= */

.dash-body {
  background: #f4f4f4;
  min-height: 100vh;
}

/* Shell — mobile: 1 coluna, cabeçalho fixo, drawer */
.dash-shell {
  display: block;
  min-height: 100vh;
  padding: 0;
}

/* ----- Topo mobile ----- */
.dash-topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,.05);
}
.dash-burger {
  width: 42px; height: 42px;
  display: inline-flex;
  align-items: center; justify-content: center;
  border-radius: 12px;
  background: var(--color-primary);
  color: #fff;
  border: none;
}
.dash-burger svg { width: 22px; height: 22px; }

.dash-topbar .brand-mini {
  display: flex; align-items: center; gap: 8px;
  font-weight: 800; letter-spacing: 1.5px;
  color: var(--color-text);
}
.dash-topbar .brand-mini img { width: 28px; }

.dash-topbar .top-icon {
  width: 40px; height: 40px;
  border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: #f3eefe;
  color: var(--color-primary);
  border: none;
  position: relative;
}
.dash-topbar .top-icon .badge {
  position: absolute;
  top: 4px; right: 4px;
  width: 8px; height: 8px;
  background: #ff5b8a;
  border-radius: 50%;
}

/* ----- Sidebar (drawer no mobile) ----- */
.dash-sidebar {
  position: fixed;
  top: 0; left: 0;
  width: 260px;
  height: 100%;
  background: #fff;
  box-shadow: 0 0 40px rgba(0,0,0,.15);
  z-index: 50;
  transform: translateX(-100%);
  transition: transform .25s ease;
  padding: 22px 18px;
  overflow-y: auto;
}
.dash-sidebar.is-open { transform: translateX(0); }
.dash-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.4);
  z-index: 40;
  opacity: 0; pointer-events: none;
  transition: opacity .2s ease;
}
.dash-overlay.is-open { opacity: 1; pointer-events: auto; }

.dash-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 6px;
  text-decoration: none;
}
.dash-logo .logo-icon {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  background: transparent;
  border-radius: 0;
  width: auto; height: auto;
}
.dash-logo .logo-icon img {
  width: 100%;
  height: auto;
  display: block;
}
.dash-logo .name { display: none; }
.dash-subbrand {
  color: var(--color-primary);
  font-size: 12px;
  font-weight: 900;
  margin: 6px 0 0;
}
.dash-divider {
  border: 0;
  border-top: 1px dashed #ddd6fe;
  margin: 20px 0;
  width: 100%;
}

.dash-nav {
  display: flex; flex-direction: column;
  gap: 4px;
}
.dash-nav a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-radius: 10px;
  color: var(--color-text-muted);
  font-size: 14px;
  font-weight: 600;
  transition: background .15s ease, color .15s ease;
}
.dash-nav a:hover { background: #f3eefe; color: var(--color-primary); }
.dash-nav a.is-active {
  color: var(--color-primary);
  background: transparent;
}
.dash-nav a.is-active::before {
  content: '';
  width: 6px; height: 6px;
  background: var(--color-primary);
  border-radius: 50%;
  margin-right: 2px;
}
.dash-nav .icon {
  width: 18px; height: 18px;
  color: inherit;
}

.sidebar-promo {
  margin-top: 24px;
  background: #f5f1ff;
  border-radius: 16px;
  padding: 16px;
  text-align: center;
}
.sidebar-promo h4 {
  font-size: 14px;
  margin: 8px 0 4px;
}
.sidebar-promo p {
  font-size: 12px;
  color: var(--color-text-muted);
  margin: 0 0 12px;
}
.sidebar-promo .btn { padding: 10px 18px; font-size: 12px; }

/* ----- Main / Conteúdo ----- */
.dash-main {
  padding: 18px 16px 28px;
    max-width: 1200px;
}
.dash-pagebar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 14px;
  margin-bottom: 14px;
}
/* No mobile a busca já está na topbar — evita duplicar dentro da pagebar */
.dash-pagebar .dash-search { display: none; }
/* No mobile/tablet o sino já está na topbar — esconder o duplicado da pagebar */
@media (max-width: 999px) {
  .dash-pagebar .toolbar .top-icon.js-open-notif { display: none; }
}
.dash-pagebar-info { min-width: 0; }
/* Linha de status logo abaixo do título (view-casting-evento) */
.vce-status-row { display: flex; align-items: center; gap: 8px; margin-top: 2px; }
/* Status à direita do título (view-casting-evento) */
.vce-title-row { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 12px; }
.dash-title {
  font-size: 28px;
  font-weight: 800;
  margin: 4px 0 18px;
  letter-spacing: -.5px;
}

.dash-section { margin-bottom: 28px; }
.dash-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.dash-section-header h2 {
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--color-primary);
  margin: 0;
}
.dash-section-header a {
  font-size: 12px;
  color: var(--color-text-muted);
  font-weight: 600;
}
.dash-section-header a:hover { color: var(--color-primary); }

/* Grid de cards (mobile: 1 coluna) */
.dash-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

/* Card base */
.d-card {
  background: #fff;
  border-radius: 18px;
  padding: 20px;
  box-shadow: 0 4px 20px rgba(20,0,60,.04);
  position: relative;
  overflow: hidden;
}
.d-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.d-card-header h3 {
  font-size: 15px;
  font-weight: 700;
  margin: 0;
}
.d-card-header .kbd {
  color: var(--color-text-muted);
  font-size: 12px;
}
.d-card-icon {
  width: 38px; height: 38px;
  border-radius: 12px;
  background: #f3eefe;
  color: var(--color-primary);
  display: inline-flex; align-items: center; justify-content: center;
}
.d-card .big-number {
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -1px;
  margin: 4px 0;
}
.d-card .muted { color: var(--color-text-muted); font-size: 12px; }
.d-card .pill {
  display: inline-block;
  background: #ffe1ee;
  color: #e0407c;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 999px;
}
.d-card.dark {
  background: linear-gradient(140deg, var(--color-primary) 0%, #5114c0 100%);
  color: #fff;
}
.d-card.dark .muted { color: rgba(255,255,255,.78); }
.d-card.dark .d-card-icon { background: rgba(255,255,255,.18); color: #fff; }

/* Avisos / Atividade */
.activity-list {
  display: flex; flex-direction: column;
  gap: 12px;
  list-style: none;
  margin: 0; padding: 0;
}
.activity-item {
  display: flex; align-items: center; gap: 12px;
  background: #fff;
  border-radius: 14px;
  padding: 12px 14px;
}
.activity-icon {
  width: 36px; height: 36px;
  border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: #ffe7f0;
  color: #e64b8a;
  flex-shrink: 0;
}
.activity-icon.green { background: #e0f8ec; color: #1aaa61; }
.activity-icon.violet { background: #ede4ff; color: var(--color-primary); }
.activity-text { flex: 1; }
.activity-text strong { font-size: 14px; display: block; }
.activity-text span { font-size: 12px; color: var(--color-text-muted); }
.activity-amount {
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}
.activity-amount.neg { color: #e64b8a; }
.activity-amount.pos { color: #1aaa61; }

/* Right rail (profile + extras) */
.dash-right { margin-top: 6px; }
.profile-card {
  background: #fff;
  border-radius: 18px;
  padding: 18px;
  text-align: center;
  margin-bottom: 14px;
}
.profile-card .avatar {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: var(--color-primary-soft);
  color: var(--color-primary);
  margin: 0 auto 10px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 22px;
  font-weight: 800;
}
.profile-card h3 { margin: 4px 0 2px; font-size: 16px; }
.profile-card .role { color: var(--color-text-muted); font-size: 12px; }

/* Charts mini SVG */
.chart-mini { width: 100%; height: 80px; }
.chart-bar  { width: 100%; height: 110px; }
.chart-donut { width: 130px; height: 130px; margin: 6px auto; display: block; }

/* Calendário mini */
.cal-mini {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
  font-size: 11px;
}
.cal-mini .h, .cal-mini .d {
  height: 26px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 6px;
}
.cal-mini .h { color: var(--color-text-muted); font-weight: 700; }
.cal-mini .d { background: #f5f3fa; color: var(--color-text); }
.cal-mini .d.has-event { background: var(--color-primary-soft); color: var(--color-primary); font-weight: 700; }
.cal-mini .d.today { background: var(--color-primary); color: #fff; }
.cal-mini .d.empty { background: transparent; }

/* Search bar (desktop) */
.dash-search {
  display: none;
}

/* =========================================================
   Dashboard >= 720px  (tablet pequeno em diante)
   ========================================================= */
@media (min-width: 720px) {
  .dash-cards { grid-template-columns: 1fr 1fr; }
  .dash-main { padding: 24px 28px 40px; }
}

/* =========================================================
   Dashboard >= 1000px (tablet/laptop) — abre o layout
   ========================================================= */
@media (min-width: 1000px) {
  .dash-body { background: #f4f4f4 }
  .dash-shell {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 20px;
    padding: 20px;
  }
  .dash-topbar { display: none; }
  .dash-sidebar {
    position: static;
    transform: none;
    box-shadow: none;
    border-radius: 22px;
    height: auto;
    min-height: calc(100% - 40px);
    background: transparent;
    z-index: auto;
  }
  .dash-overlay { display: none; }
  .dash-main {
    background: #fff;
    border-radius: 22px;
    padding: 26px 28px;
    box-shadow: 0 4px 30px rgba(20,0,60,.06);
  }
  .dash-pagebar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 10px;
  }
  .dash-pagebar .dash-search { display: flex; }
  .dash-search {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    background: #f5f3fa;
    border-radius: 14px;
    padding: 8px 14px;
  }
  .dash-search input {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-size: 14px;
    font-family: inherit;
  }
  .dash-pagebar .toolbar { display: flex; gap: 8px; }
  .dash-pagebar .top-icon {
    width: 40px; height: 40px;
    border-radius: 50%;
    background: #f5f3fa;
    color: var(--color-text);
    border: none;
    display: inline-flex; align-items: center; justify-content: center;
    position: relative;
  }
  .dash-pagebar .top-icon .badge {
    position: absolute; top: 4px; right: 4px;
    width: 8px; height: 8px;
    background: #ff5b8a;
    border-radius: 50%;
  }
  .dash-title { font-size: 36px; }
}

/* =========================================================
   Dashboard >= 1280px (3 colunas com right rail)
   ========================================================= */
@media (min-width: 1280px) {
  .dash-shell {
  }
  .dash-cards { grid-template-columns: 1fr 1fr; }
  .dash-cards.cards-3 { grid-template-columns: 1.2fr 1fr 1fr; }
  .dash-right {
    background: transparent;
    margin-top: 0;
  }
  .dash-right .profile-card { background: #fff; border-radius: 22px; }
}

/* =========================================================
   Responsivo (forms / login — já existia)
   ========================================================= */
@media (max-width: 900px) {
  .form-wrapper { grid-template-columns: 1fr; }
  .form-aside { display: none; }
  .topbar-inner { padding: 22px 20px 60px; min-height: 180px; }
  .page-title { padding: 0 20px 24px; letter-spacing: 2px; }
}

@media (max-width: 720px) {
  .login-card { grid-template-columns: 1fr; }
  .login-form-side { padding: 36px 28px; }
  .login-side { padding: 36px 28px; order: 2; }
  .login-form-side h1 { font-size: 30px; }
}

@media (max-width: 600px) {
  .form-row {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 12px 10px;
  }
  .form-row label {
    text-align: left;
    padding: 0;
    color: var(--color-text-muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .5px;
  }
  .form-row .double { grid-template-columns: 80px 1fr; }
  .brand-name { font-size: 22px; }
  .brand-logo { width: 44px; }
  .topbar-inner { padding: 18px 16px 40px; }
  .page-title { padding: 0 16px 20px; font-size: 26px; }
  .form-card { padding: 24px 18px; }
  .container { padding: 0 16px; }
}

/* ============ Resumo financeiro da proposta (Etapa 3) ============ */
.cp-fin-card {
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 14px;
  padding: 6px 14px;
  margin-top: 10px;
}
.cp-fin-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px dashed #ece9f7;
}
.cp-fin-row:last-child { border-bottom: 0; }
.cp-fin-label { font-size: 13px; color: var(--color-text); font-weight: 600; }
.cp-fin-pct {
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
  color: var(--color-text-muted);
  background: #f5f3fa;
  border-radius: 6px;
  padding: 1px 6px;
  margin-left: 4px;
}
.cp-fin-val { font-size: 14px; font-weight: 700; color: var(--color-text); white-space: nowrap; }
.cp-fin-deduct .cp-fin-label,
.cp-fin-deduct .cp-fin-val { color: var(--color-text-muted); }
/* Linha do líquido — destaque on-brand: caixa branca, borda forte, valor verde */
.cp-fin-net {
  margin-top: 4px;
  padding: 14px;
  border: 2px solid #222;
  border-radius: 12px;
  background: #fff;
}
.cp-fin-net .cp-fin-label { font-weight: 800; color: #222; font-size: 13px; }
.cp-fin-net .cp-fin-val { font-size: 19px; font-weight: 800; color: var(--color-success); }

@media (min-width: 600px) {
  .cp-fin-card { padding: 8px 18px; }
  .cp-fin-label { font-size: 14px; }
  .cp-fin-net .cp-fin-val { font-size: 22px; }
}

/* ============ Checkout / Contratação (Etapa 2) ============ */
.ck-grid { display: flex; flex-direction: column; gap: 14px; }
.ck-h2 { margin: 0 0 14px; font-size: 16px; font-weight: 800; color: var(--color-text); }
.ck-line {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 9px 0; border-bottom: 1px dashed #ece9f7; font-size: 13px;
}
.ck-line span { color: var(--color-text-muted); }
.ck-line strong { color: var(--color-text); text-align: right; }
.ck-sel { padding: 12px 0; border-bottom: 1px dashed #ece9f7; }
.ck-sel-label { display: block; font-size: 12px; color: var(--color-text-muted); font-weight: 700; margin-bottom: 8px; text-transform: uppercase; letter-spacing: .4px; }
.ck-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ck-chip { background: #fff; border: 1px solid #ece9f7; color: #222; font-weight: 700; font-size: 12px; padding: 5px 12px; border-radius: 999px; }
.ck-total {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-top: 14px; padding: 16px; border: 2px solid #222; border-radius: 12px; background: #fff;
}
.ck-total span { font-weight: 800; color: #222; font-size: 14px; }
.ck-total strong { font-size: 22px; font-weight: 800; color: #222; }
.ck-escrow {
  display: flex; gap: 10px; align-items: flex-start;
  margin-top: 14px; padding: 13px 14px; border-radius: 12px;
  background: #fafbfc; border: 1px solid #ece9f7;
}
.ck-escrow svg { flex: 0 0 auto; color: var(--color-success); margin-top: 1px; }
.ck-escrow p { margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--color-text); font-weight: 600; }
.ck-gateway { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.ck-gateway-badge { background: #222; color: #fff; font-weight: 800; font-size: 12px; padding: 4px 10px; border-radius: 7px; letter-spacing: .5px; }
.ck-gateway-txt { font-size: 12px; color: var(--color-text-muted); }
.ck-metodos { border: 0; padding: 0; margin: 0 0 16px; display: flex; flex-direction: column; gap: 8px; }
.ck-metodos legend { font-size: 12px; font-weight: 700; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .4px; padding: 0; margin-bottom: 4px; }
.ck-metodo {
  display: flex; align-items: center; gap: 10px;
  border: 1.5px solid #ece9f7; border-radius: 12px; padding: 12px 14px; cursor: pointer;
  transition: border-color .15s, background .15s;
}
.ck-metodo:hover { border-color: var(--color-primary-light); }
.ck-metodo input { accent-color: var(--color-primary); width: 18px; height: 18px; }
.ck-metodo:has(input:checked) { border-color: var(--color-primary); background: var(--color-primary-soft); }
.ck-metodo-body { display: flex; flex-direction: column; }
.ck-metodo-body strong { font-size: 14px; color: var(--color-text); font-weight: 700; }
.ck-metodo-body em { font-style: normal; font-size: 12px; color: var(--color-text-muted); }
.ck-termos { margin: 4px 0 16px; }
.ck-actions { display: flex; flex-direction: column; gap: 8px; }

@media (min-width: 900px) {
  .ck-grid { display: grid; grid-template-columns: 1.2fr 1fr; align-items: start; }
}

/* Tag de proposta recusada / evento fechado */
.casting-prop-tag--recusada { background: #f5f3fa; border: 1px solid #ece9f7; color: var(--color-text-muted); }

/* ============ Central de notificações + toasts (Etapa 4) ============ */
/* Badge de contagem no sino (mobile topbar) */
.dash-topbar .top-icon .badge.js-notif-badge {
  top: -2px; right: -2px;
  width: auto; height: auto; min-width: 16px;
  padding: 1px 5px;
  font-size: 10px; font-weight: 800; line-height: 1.4;
  color: #fff; background: #ff5b8a;
  border-radius: 999px; text-align: center;
}
/* Badge no item "Avisos" da sidebar */
.dash-nav a { position: relative; }
.nav-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 5px; margin-left: auto;
  font-size: 11px; font-weight: 800; color: #fff; background: #ff5b8a;
  border-radius: 999px;
}

/* Lista de notificações no modal */
.notif-list { display: flex; flex-direction: column; gap: 2px; max-height: 60vh; overflow-y: auto; }
.notif-item {
  display: flex; gap: 11px; align-items: flex-start;
  padding: 12px 10px; border-radius: 10px; text-decoration: none;
  border-bottom: 1px solid #f0eef7;
}
.notif-item:hover { background: #faf9fe; }
.notif-item.is-unread { background: #f7f2ff; }
.notif-ico { font-size: 18px; line-height: 1.2; flex: 0 0 auto; }
.notif-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.notif-txt strong { font-size: 13.5px; color: var(--color-text); font-weight: 700; }
.notif-msg { font-size: 12.5px; color: var(--color-text-muted); line-height: 1.4; }
.notif-time { font-size: 11px; color: #b3adc6; margin-top: 2px; }

/* Pilha de toasts */
.toast-stack {
  position: fixed; z-index: 4000;
  top: 12px; left: 12px; right: 12px;
  display: flex; flex-direction: column; gap: 10px;
  pointer-events: none;
}
.toast {
  pointer-events: auto;
  display: flex; gap: 10px; align-items: flex-start;
  background: #fff; border-radius: 12px;
  border-left: 4px solid #222;
  box-shadow: 0 10px 30px rgba(31,18,54,.18);
  padding: 13px 14px;
  transform: translateY(-14px); opacity: 0;
  transition: transform .28s ease, opacity .28s ease;
}
.toast.is-in { transform: translateY(0); opacity: 1; }
.toast-ico { font-size: 18px; line-height: 1.2; flex: 0 0 auto; }
.toast-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.toast-body strong { font-size: 13.5px; font-weight: 800; color: var(--color-text); }
.toast-body span { font-size: 12.5px; color: var(--color-text-muted); line-height: 1.4; }
.toast-x { background: none; border: 0; font-size: 18px; line-height: 1; color: #b3adc6; cursor: pointer; padding: 0 2px; }
.toast-casting_contratado, .toast-status_pagamento { border-left-color: var(--color-success); }
.toast-proposta_recusada { border-left-color: #d9920a; }
.toast-mensagem, .toast-proposta_nova { border-left-color: #222; }
/* Botão "Contratar" incompleto: clicável (mostra o que falta), cursor de ação */
#btn-contratar-casting.btn-disabled { cursor: pointer !important; }

/* Alertbox central com fundo desfocado (estilo notificação) */
.ctr-alert-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(20,0,60,.30);
  -webkit-backdrop-filter: blur(7px);
  backdrop-filter: blur(7px);
  opacity: 0;
  transition: opacity .2s ease;
}
.ctr-alert-overlay.is-in { opacity: 1; }
.ctr-alert {
  display: flex;
  align-items: stretch;
  width: 100%;
  max-width: 460px;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 30px 80px rgba(20,0,60,.30);
  overflow: hidden;
  transform: scale(.95);
  transition: transform .2s ease;
}
.ctr-alert-overlay.is-in .ctr-alert { transform: scale(1); }
.ctr-alert-ico {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px 4px 18px 22px;
  color: #f59e0b;
}
.ctr-alert-body {
  flex: 1;
  min-width: 0;
  padding: 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ctr-alert-title { font-size: 17px; font-weight: 800; color: #222; line-height: 1.2; }
.ctr-alert-msg { font-size: 14px; color: var(--color-text-muted); line-height: 1.45; }
.ctr-alert-close {
  flex: 0 0 auto;
  border: none;
  border-left: 1px solid #ececf2;
  background: #fff;
  padding: 0 28px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  color: #222;
  cursor: pointer;
  transition: background .12s ease;
}
.ctr-alert-close:hover { background: #f5f3fa; }
@media (max-width: 480px) {
  .ctr-alert { flex-wrap: wrap; }
  .ctr-alert-close { flex: 1 1 100%; border-left: none; border-top: 1px solid #ececf2; padding: 14px; }
}

@media (min-width: 600px) {
  .toast-stack { left: auto; right: 20px; top: 20px; width: 360px; }
}

/* Orçamento + Resumo financeiro lado a lado (Etapa 3 / merge) */
.cp-orc-fin { display: flex; flex-direction: column; gap: 14px; }
.cp-orc-fin .cp-fin-card { margin-top: 0; }
@media (min-width: 900px) {
  .cp-orc-fin { display: grid; grid-template-columns: 1fr 1.15fr; align-items: start; gap: 20px; }
  .cp-orc-fin .cp-orc-input { padding-top: 4px; }
}

/* ============ Convite público (auto-cadastro) ============ */
.convite-body { background: #f4f1fb; min-height: 100vh; margin: 0; font-family: 'Montserrat', system-ui, sans-serif; color: var(--color-text); }
.convite-wrap { max-width: 560px; margin: 0 auto; padding: 22px 16px 60px; }
.convite-brand { display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 20px; color: var(--color-primary); margin: 6px 2px 16px; }
.convite-logo { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; background: var(--color-primary); }
.convite-logo img { width: 22px; height: 22px; }
/* Campos preenchidos corretamente — borda roxa */
.convite-form input.is-valid,
.convite-form select.is-valid,
.convite-form textarea.is-valid {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px var(--color-primary-soft);
}
.convite-card { background: #fff; border-radius: 18px; padding: 22px 18px; box-shadow: 0 14px 40px rgba(31,18,54,.08); }
.convite-card h1 { font-size: 22px; margin: 0 0 6px; }
.convite-sub { font-size: 13.5px; color: var(--color-text-muted); line-height: 1.5; margin: 0 0 18px; }
.convite-badge { display: inline-block; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px; color: var(--color-primary-dark); background: var(--color-primary-soft); border-radius: 999px; padding: 4px 12px; margin-bottom: 10px; }
.convite-section { border-top: 1px solid #efeaf9; margin-top: 18px; padding-top: 16px; }
.convite-section:first-of-type { border-top: 0; margin-top: 4px; padding-top: 0; }
.convite-section-title { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; color: var(--color-text-muted); margin: 0 0 12px; }
.convite-form label .req { color: var(--color-primary); font-style: normal; font-weight: 800; }
.cv-foto-erro { display: block; font-size: 12px; color: var(--color-error); margin-top: 8px; }
.convite-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.convite-form .form-row-stack { margin-bottom: 12px; }
.convite-foot { font-size: 11.5px; color: var(--color-text-muted); text-align: center; margin: 12px 0 0; }
.convite-card--ok { text-align: center; }
.convite-check { width: 64px; height: 64px; border-radius: 50%; background: #ecfdf3; color: var(--color-success); display: flex; align-items: center; justify-content: center; margin: 6px auto 14px; }
.convite-check--wait { background: var(--color-primary-soft); color: var(--color-primary-dark); }
@media (max-width: 480px) { .convite-2col { grid-template-columns: 1fr; gap: 0; } }

/* ============ Modal Convidar ============ */
.cvi-tipo { display: flex; gap: 10px; }
.cvi-tipo-opt { display: flex; align-items: center; gap: 7px; border: 1.5px solid #ece9f7; border-radius: 10px; padding: 9px 14px; cursor: pointer; font-weight: 700; font-size: 14px; flex: 1; }
.cvi-tipo-opt input { accent-color: var(--color-primary); }
.cvi-tipo-opt:has(input:checked) { border-color: var(--color-primary); background: var(--color-primary-soft); }
.cvi-link-row { display: flex; gap: 8px; }
.cvi-link-row input { flex: 1; font-size: 12.5px; }
.cvi-share { display: flex; flex-direction: column; gap: 8px; margin: 14px 0 4px; }

/* ============ Convidados (aprovação) ============ */
.cv-sec-title { font-size: 15px; font-weight: 800; margin: 8px 0 12px; display: flex; align-items: center; gap: 8px; }
.cv-count { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px; background: var(--color-primary); color: #fff; font-size: 12px; font-weight: 800; }
.cv-count--inline { min-width: 18px; height: 18px; font-size: 11px; background: var(--color-primary); }
.cv-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
.cv-card { background: #fff; border: 1px solid #ece9f7; border-radius: 16px; padding: 16px; box-shadow: 0 6px 18px rgba(31,18,54,.05); }
.cv-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; margin-bottom: 10px; }
.cv-card-head h3 { margin: 0 0 4px; font-size: 16px; }
.cv-tag { display: inline-block; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; background: #f5f3fa; border: 1px solid #ece9f7; color: #222; padding: 3px 9px; border-radius: 6px; }
.cv-data { display: grid; grid-template-columns: 96px 1fr; gap: 6px 12px; margin: 0 0 14px; font-size: 13px; }
.cv-data dt { color: var(--color-text-muted); font-weight: 700; }
.cv-data dd { margin: 0; color: var(--color-text); }
.cv-card-foot { display: flex; justify-content: flex-end; gap: 8px; border-top: 1px solid #f0eef7; padding-top: 12px; }
.cv-aval-list { display: flex; flex-direction: column; gap: 2px; }
.cv-aval-row { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-bottom: 1px solid #f0eef7; font-size: 13px; }
.cv-aval-nome { font-weight: 700; }
.cv-aval-tipo { color: var(--color-text-muted); }
.cv-aval-status { margin-left: auto; font-weight: 800; font-size: 12px; }
.cv-aval-status.is-ok { color: var(--color-success); }
.cv-aval-status.is-no { color: var(--color-text-muted); }
@media (min-width: 720px) { .cv-grid { grid-template-columns: 1fr 1fr; } }

/* ============ Mensagens (lista de conversas) ============ */
.msg-conv-list { display: flex; flex-direction: column; gap: 8px; }
.msg-conv { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid #ece9f7; border-radius: 14px; padding: 12px 14px; text-decoration: none; color: var(--color-text); transition: border-color .15s, box-shadow .15s; }
.msg-conv:hover { border-color: var(--color-primary-light); box-shadow: 0 6px 18px rgba(31,18,54,.06); }
.msg-conv.is-unread { background: #f7f2ff; border-color: var(--color-primary-light); }
.msg-conv-avatar { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%; background: var(--color-primary-soft); color: var(--color-primary-dark); font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: 17px; }
.msg-conv-main { flex: 1; min-width: 0; }
.msg-conv-top { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.msg-conv-top strong { font-size: 14px; }
.msg-conv-time { font-size: 11px; color: var(--color-text-muted); white-space: nowrap; }
.msg-conv-evento { font-size: 12px; color: var(--color-primary-dark); font-weight: 700; margin: 1px 0; }
.msg-conv-snippet { font-size: 12.5px; color: var(--color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.msg-conv-snippet em { font-style: normal; color: var(--color-text); font-weight: 600; }
.msg-conv-badge { flex: 0 0 auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--color-primary); color: #fff; font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center; }

/* ============ Faturamento ============ */
.fat-cards { display: grid; grid-template-columns: 1fr; gap: 12px; }
.fat-card { background: #fff; border: 1px solid #ece9f7; border-radius: 16px; padding: 16px; }
.fat-card--hl { border: 2px solid #222; }
.fat-label { display: block; font-size: 12px; color: var(--color-text-muted); font-weight: 700; }
.fat-val { display: block; font-size: 24px; font-weight: 800; color: #222; margin: 4px 0 2px; }
.fat-card--hl .fat-val { color: var(--color-success); }
.fat-sub { font-size: 11.5px; color: var(--color-text-muted); }
.fat-mini-grid { display: flex; flex-direction: column; gap: 0; }
.fat-mini { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px dashed #ece9f7; font-size: 13px; }
.fat-mini span { color: var(--color-text-muted); }
.fat-mini strong { color: var(--color-text); }
.fat-mini--net { border-bottom: 0; border-top: 2px solid #222; margin-top: 4px; }
.fat-mini--net strong { color: var(--color-success); font-size: 16px; }
.fat-table { display: flex; flex-direction: column; }
.fat-tr { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1fr; gap: 8px; padding: 11px 0; border-bottom: 1px solid #f0eef7; font-size: 13px; align-items: center; }
.fat-th { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--color-text-muted); font-weight: 800; }
.fat-badge { font-size: 11px; font-weight: 800; padding: 3px 8px; border-radius: 6px; }
.fat-badge--hold { background: #fff7e6; color: #b9770a; border: 1px solid #f3d9a6; }
.fat-badge--ok { background: #ecfdf3; color: #0f7a44; border: 1px solid #b6ebcb; }
@media (min-width: 600px) { .fat-cards { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .fat-cards { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 600px) {
  .fat-th { display: none; }
  .fat-tr { grid-template-columns: 1fr 1fr; gap: 4px 8px; padding: 12px 0; }
  .fat-tr span::before { content: attr(data-l) ": "; color: var(--color-text-muted); font-size: 11px; }
  .fat-tr span[data-l="Evento"] { grid-column: 1 / -1; font-weight: 700; }
  .fat-tr span[data-l="Evento"]::before { content: ""; }
}

/* ============ Agências (diretório) ============ */
.ag-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
.ag-card { background: #fff; border: 1px solid #ece9f7; border-radius: 16px; padding: 16px; box-shadow: 0 6px 18px rgba(31,18,54,.05); }
.ag-card-head { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; }
.ag-avatar { width: 48px; height: 48px; border-radius: 14px; background: var(--color-primary-soft); color: var(--color-primary-dark); font-weight: 800; font-size: 20px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.ag-card-head h3 { margin: 0; font-size: 16px; }
.ag-local { font-size: 12px; color: var(--color-text-muted); }
.ag-stats { display: flex; gap: 10px; margin-bottom: 12px; }
.ag-stat { flex: 1; background: #faf9fe; border-radius: 12px; padding: 10px; text-align: center; }
.ag-stat strong { display: block; font-size: 20px; font-weight: 800; color: var(--color-primary-dark); }
.ag-stat span { font-size: 11px; color: var(--color-text-muted); font-weight: 700; }
.ag-contacts { display: flex; flex-wrap: wrap; gap: 8px; }
.ag-contact { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #222; text-decoration: none; background: #f5f3fa; border: 1px solid #ece9f7; border-radius: 999px; padding: 5px 11px; font-weight: 600; }
.ag-contact:hover { border-color: var(--color-primary-light); }
@media (min-width: 720px) { .ag-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .ag-grid { grid-template-columns: 1fr 1fr 1fr; } }

/* ============ Dashboards — KPIs e blocos reais ============ */
.kpi-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 16px; }
.kpi { display: flex; flex-direction: column; gap: 2px; background: #fff; border: 1px solid #ece9f7; border-radius: 16px; padding: 15px 16px; text-decoration: none; color: var(--color-text); transition: border-color .15s, box-shadow .15s; }
.kpi:hover { border-color: var(--color-primary-light); box-shadow: 0 8px 22px rgba(31,18,54,.07); }
.kpi-num { font-size: 24px; font-weight: 800; color: #222; line-height: 1.1; }
.kpi-label { font-size: 13px; font-weight: 700; color: var(--color-text); }
.kpi-sub { font-size: 11.5px; color: var(--color-text-muted); }
.kpi--ok .kpi-num { color: var(--color-success); }
.kpi--alert { border-color: var(--color-primary); background: var(--color-primary-soft); }
.kpi--alert .kpi-num { color: var(--color-primary-dark); }
.dash-2col { display: grid; grid-template-columns: 1fr; gap: 16px; }
.dash-efic { display: flex; align-items: center; gap: 16px; margin-top: 14px; }
.dash-efic .chart-donut { width: 76px; height: 76px; flex: 0 0 auto; }
.dash-quick { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.dash-quick-item { display: flex; align-items: center; gap: 10px; background: #faf9fe; border: 1px solid #ece9f7; border-radius: 12px; padding: 12px; text-decoration: none; color: var(--color-text); cursor: pointer; text-align: left; font: inherit; }
.dash-quick-item:hover { border-color: var(--color-primary-light); }
.dash-quick-item .dq-ico { font-size: 20px; flex: 0 0 auto; }
.dash-quick-item strong { display: block; font-size: 13px; }
.dash-quick-item em { font-style: normal; font-size: 11px; color: var(--color-text-muted); }
@media (min-width: 600px) { .kpi-row { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1000px) { .dash-2col { grid-template-columns: 1fr 1fr; } }

/* ============ Checkout — dados de cobrança Asaas + confirmação ============ */
.ck-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ck-pagador .form-row-stack, .ck-cartao .form-row-stack { margin-bottom: 0px; }
.ck-pagador legend, .ck-cartao legend { margin-bottom: 8px; }
.ck-confirm-dl { display: grid; grid-template-columns: 96px 1fr; gap: 8px 12px; margin: 0 0 16px; font-size: 13px; }
.ck-confirm-dl dt { color: var(--color-text-muted); font-weight: 700; }
.ck-confirm-dl dd { margin: 0; color: var(--color-text); }
@media (max-width: 480px) { .ck-2col { grid-template-columns: 1fr; gap: 0; } }

/* ============================================================
   FIX SISTÊMICO: atributo [hidden] deve sempre ocultar
   (estava sendo sobrescrito por .form-row{display:...})
   ============================================================ */
[hidden] { display: none !important; }

/* ============ Castings — cards clicáveis e minimalistas ============ */
a.casting-card { text-decoration: none; color: inherit; cursor: pointer; }
.casting-card { transition: border-color .15s, box-shadow .15s, transform .15s; }
a.casting-card:hover { border-color: var(--color-primary-light); box-shadow: 0 10px 26px rgba(31,18,54,.09); transform: translateY(-2px); }
.casting-card-foot { display: flex; justify-content: flex-end; align-items: center; gap: 8px; }
.casting-go {
  width: 36px; height: 36px; border-radius: 11px;
  border: 1.5px solid #ece9f7; background: #fff; color: var(--color-primary);
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
}
a.casting-card:hover .casting-go { border-color: var(--color-primary); background: var(--color-primary-soft); }
.casting-go--primary { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.casting-go--primary svg { stroke: #fff; }

/* Convite — selor de tipo mais limpo */
.cvi-tipo { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cvi-tipo-opt { justify-content: center; gap: 9px; padding: 14px 12px; border-radius: 12px; }
.cvi-tipo-opt input { width: 16px; height: 16px; }

/* ============================================================
   ELENCO — apresentação em lista compacta (ref. pipeline cards)
   ============================================================ */
.elenco-list { display: flex; flex-direction: column; gap: 14px; }
.elenco-row {
  display: flex; align-items: center; gap: 18px;
  width: 100%; max-width: 1000px;
  background: #fff; border: 1px solid #ece9f7; border-radius: 18px; padding: 14px;
  transition: border-color .15s, box-shadow .15s;
}
.elenco-row:hover { border-color: var(--color-primary-light); box-shadow: 0 8px 22px rgba(31,18,54,.07); }
.elenco-av {
  width: 150px; height: 150px; border-radius: 16px; flex: 0 0 150px;   /* foto 1:1 150px */
  background: #f0eafd center/cover no-repeat;
  display: flex; align-items: center; justify-content: center; color: #b9a8e0;
}
.elenco-av svg { width: 46px; height: 46px; }
.elenco-row-main { flex: 1; min-width: 0; }
.elenco-row-main h3 { margin: 0; font-size: 19px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.elenco-row-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 8px; font-size: 13px; color: var(--color-text-muted); }
.elenco-row-tag { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; padding: 3px 10px; border-radius: 7px; background: #f5f3fa; border: 1px solid #ece9f7; color: #222; }
.elenco-row-tag.modelo { background: var(--color-primary-soft); border-color: transparent; color: var(--color-primary-dark); }
.elenco-row-attrs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.elr-attr { display: inline-flex; align-items: baseline; gap: 5px; font-size: 12.5px; color: #222; font-weight: 700; background: #fafbfc; border: 1px solid #ece9f7; border-radius: 7px; padding: 4px 9px; }
.elr-attr em { font-style: normal; font-weight: 600; font-size: 10.5px; text-transform: uppercase; letter-spacing: .3px; color: var(--color-text-muted); }
.elenco-row-acts { display: flex; gap: 6px; flex: 0 0 auto; }
.elenco-row-acts form { margin: 0; display: inline-flex; }
.elenco-row .perfil-action.elr-act {
  position: static; width: 38px; height: 38px; border-radius: 10px;
  border: 1px solid #ece9f7; background: #fff; color: #555;
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;
}
.elenco-row .perfil-action.elr-act:hover { border-color: var(--color-primary-light); color: var(--color-primary); background: #faf7ff; }
.elenco-row .perfil-action.elr-act.danger:hover { border-color: #f1c4c4; color: #e23b3b; background: #fdf2f2; }
.elenco-row .perfil-action.elr-act.ok { border-color: #bfe8cf; color: #1f9d57; }
.elenco-row .perfil-action.elr-act.ok:hover { background: #1f9d57; border-color: #1f9d57; color: #fff; }
/* contador de pendências na aba */
.tabs .cnt.cnt--alert { background: #e23b3b; color: #fff; border-color: transparent; }
/* filtro de status dos convidados (chips) */
/* Aviso clicável (abre o link relacionado) */
.activity-item--link { cursor: pointer; border-radius: 10px; transition: background .12s ease; }
.activity-item--link:hover { background: #faf7ff; }

/* Intervalo de datas do evento em destaque (listas e dashboard) */
.ev-daterange {
  display: inline-flex; align-items: center; gap: 7px;
  margin-top: 8px; padding: 6px 12px;
  background: #f5f3fa; border: 1px solid #ece9f7; border-radius: 10px;
  color: #222; font-size: 13.5px; font-weight: 800; line-height: 1;
}
.ev-daterange svg { color: var(--color-primary); flex: 0 0 auto; }
.ev-daterange .ev-dr-sep { color: var(--color-primary); font-weight: 800; }
.ev-daterange .ev-dr-dias { font-weight: 700; font-size: 11.5px; color: var(--color-text-muted); border-left: 1px solid #e6e2f0; padding-left: 7px; margin-left: 1px; }

.el-status-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.el-filter-lbl { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; color: var(--color-text-muted); margin-right: 2px; }
.el-stchip { font-size: 12.5px; font-weight: 700; color: #444; background: #fff; border: 1px solid #ece9f7; border-radius: 999px; padding: 6px 14px; cursor: pointer; }
.el-stchip:hover { border-color: var(--color-primary-light); color: var(--color-primary); }
.el-stchip.is-active { background: #222; border-color: #222; color: #fff; }
/* galeria somente leitura na aprovação do convidado */
.cv-approve-fotos { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.cv-approve-foto { position: relative; aspect-ratio: 1; border-radius: 10px; background: #f5f3fa center/cover no-repeat; border: 1px solid #ece9f7; }
.cv-approve-foto.is-main { box-shadow: 0 0 0 2px var(--color-primary); }
.cv-approve-tag { position: absolute; bottom: 5px; left: 5px; background: var(--color-primary); color: #fff; font-size: 8.5px; font-weight: 800; letter-spacing: .4px; padding: 2px 6px; border-radius: 999px; }
@media (max-width: 480px) {
  .elenco-row { gap: 12px; padding: 12px; }
  .elenco-av { width: 110px; height: 110px; flex-basis: 110px; }
  .elenco-row-main h3 { font-size: 16px; }
  .elenco-row-acts { flex-direction: column; }
}

/* ============================================================
   LISTA EM LINHAS com bloco de data (ref. project list)
   usada em Castings e Eventos
   ============================================================ */
.cklist { display: grid; grid-template-columns: 1fr; gap: 12px; }
.cklist-row {
  position: relative;
  display: flex; align-items: stretch; background: #fff;
  border: 1px solid #ece9f7; border-radius: 16px; overflow: hidden;
  text-decoration: none; color: inherit;
  transition: border-color .15s, box-shadow .15s, transform .15s;
}
/* Status / casting-prop-tag agora ficam ABAIXO do título (não mais absolute) */
.cklist-row .evento-status,
.cklist-row .casting-prop-tag { align-self: flex-start; }
a.cklist-row:hover,
.cklist-row[data-href]:hover { border-color: var(--color-primary-light); box-shadow: 0 10px 26px rgba(31,18,54,.09); transform: translateY(-2px); }
.cklist-row[data-href] { cursor: pointer; }
.cklist-date { flex: 0 0 78px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; border-right: 1px solid #f0eef7; position: relative; padding: 14px 6px; }
.cklist-date::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--accent, #c8a4ff); }
.cklist-date { background: color-mix(in srgb, var(--accent, #c8a4ff) 8%, #fff); }
.cklist-day { font-size: 24px; font-weight: 800; line-height: 1; color: var(--accent, var(--color-primary)); }
.cklist-mon { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; color: var(--color-text-muted); }

/* Propostas recebidas (listas de eventos do contratante) */
.prop-recebidas { display: inline-flex; align-items: baseline; gap: 5px; font-size: 12.5px; font-weight: 800; color: #222; background: #fff; border: 2px solid #222; border-radius: 9px; padding: 4px 10px; white-space: nowrap; text-decoration: none; }
.prop-recebidas b { font-size: 15px; }
.prop-novas { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 800; color: #fff; background: #e23b3b; border-radius: 999px; padding: 4px 10px; white-space: nowrap; text-decoration: none; }
.prop-novas::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: propPulse 1.2s ease-in-out infinite; }
@keyframes propPulse { 0%,100% { opacity: 1; } 50% { opacity: .3; } }
.prop-alert-banner { display: flex; align-items: center; gap: 10px; background: #fff4f4; border: 1px solid #f3c9c9; color: #b3261e; border-radius: 12px; padding: 12px 16px; margin: 14px 0 0; font-size: 14px; font-weight: 700; }
.prop-alert-banner svg { flex: 0 0 auto; }
.cklist-main { flex: 1; min-width: 0; padding: 13px 16px; }
.cklist-top { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.cklist-title { font-size: 15px; font-weight: 800; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.cklist-sub { font-size: 12px; font-weight: 600; color: #222; margin-top: 10px; display: flex; gap: 12px; flex-wrap: wrap; }
.cklist-reqs { display: flex; gap: 7px; margin-top: 9px; flex-wrap: wrap; }
.cklist-req { font-size: 11px; font-weight: 700; background: #f5f3fa; border: 1px solid #ece9f7; border-radius: 7px; padding: 3px 9px; color: #222; }
.cklist-req b { color: var(--color-primary-dark); }
.cklist-req .ok { color: var(--color-success); }
.cklist-aside { flex: 0 0 auto; display: flex; align-items: center; padding: 12px 14px; }
@media (min-width: 1100px) { .cklist { grid-template-columns: 1fr 1fr; } }

/* ============ Convites aguardando (lista de links) ============ */
.cvi-list { display: grid; grid-template-columns: 1fr; gap: 10px; }
.cvi-item { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px dashed #d9cdf3; border-radius: 14px; padding: 11px 14px; }
.cvi-item-ico { width: 42px; height: 42px; border-radius: 50%; background: #f0eafd; color: var(--color-primary); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.cvi-item-main { flex: 1; min-width: 0; }
.cvi-item-main strong { display: block; font-size: 14.5px; }
.cvi-item-meta { font-size: 12px; color: var(--color-text-muted); }
.cvi-item-acts { display: flex; gap: 5px; flex: 0 0 auto; }
.cvi-item-acts .elr-act { position: static; width: 32px; height: 32px; border-radius: 9px; border: 1px solid #ece9f7; background: #fff; color: #555; display: inline-flex; align-items: center; justify-content: center; }
.cvi-item-acts .elr-act:hover { border-color: var(--color-primary-light); color: var(--color-primary); }
.cvi-item-acts .elr-act.danger:hover { border-color: #f1c4c4; color: #e23b3b; }
@media (min-width: 900px) { .cvi-list { grid-template-columns: 1fr 1fr; } }

/* Fotos no card de convidado */
.cv-fotos { display: flex; gap: 6px; margin-bottom: 12px; flex-wrap: wrap; }
.cv-foto { width: 52px; height: 64px; border-radius: 9px; background: #f0eafd center/cover no-repeat; border: 1px solid #ece9f7; }

/* Modal editar convidado */
.cvi-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 480px) { .cvi-2col { grid-template-columns: 1fr; gap: 0; } }

/* Upload de fotos no convite público */
.cv-foto-drop {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  border: 1.5px dashed #d9cdf3; border-radius: 14px; padding: 22px 14px; cursor: pointer;
  color: var(--color-primary); background: #faf7ff; text-align: center;
}
.cv-foto-drop:hover { border-color: var(--color-primary); }
.cv-foto-drop span { font-weight: 700; font-size: 13.5px; color: var(--color-text); }
.cv-foto-drop em { font-style: normal; font-size: 11px; color: var(--color-text-muted); }
.cv-foto-preview { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.cv-foto-thumb { width: 64px; height: 80px; object-fit: cover; border-radius: 10px; border: 1px solid #ece9f7; }

/* Galeria do convite — mesma identidade do cadastro de modelos */
.cv-dropzone { border: 1.5px dashed #d9cdf3; border-radius: 14px; padding: 14px; background: #faf7ff; }
.cv-dropzone .cv-foto-drop { border: 0; background: transparent; padding: 8px 4px; }
.cv-dropzone .dropzone-preview { margin-top: 14px; }
.cv-dropzone .dz-img { cursor: default; }
.cv-foto-hint { font-size: 11.5px; color: var(--color-text-muted); margin: 12px 0 0; text-align: center; }
.dz-thumb .dz-star {
  position: absolute; top: 6px; left: 6px;
  width: 24px; height: 24px; border-radius: 50%;
  background: rgba(0,0,0,.55); color: #fff; border: none;
  font-size: 13px; line-height: 0; cursor: pointer;
}
.dz-thumb .dz-star:hover { background: var(--color-primary); }
.dz-thumb.is-principal .dz-star { background: var(--color-primary); }

/* ============ Alerta de mensagens (badge piscando) + msg nova ============ */
@keyframes msgPulse {
  0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255,91,138,.55); }
  50% { transform: scale(1.12); box-shadow: 0 0 0 5px rgba(255,91,138,0); }
}
.me-tab-count--alert {
  background: #ff5b8a !important; color: #fff !important;
  animation: msgPulse 1.2s ease-in-out infinite;
}
.vce-msg--novo {
  position: relative;
  background: #f7f2ff; border-radius: 10px;
  box-shadow: -3px 0 0 0 var(--color-primary) inset;
  padding-left: 10px;
}

/* ============ Castings: 1 por linha + status abaixo do título + filtros ============ */
.cklist { grid-template-columns: 1fr !important; max-width: 900px !important }   /* sempre uma proposta por linha */
.cklist-status { margin: 5px 0 3px; }
.cklist-status .casting-prop-tag { font-size: 10px; }
.casting-prop-tag--disponivel { background: var(--color-primary-soft); border: 1px solid transparent; color: var(--color-primary-dark); }
.casting-prop-tag--semminhaproposta {
  background: #fff;
  border: 1.5px dashed var(--color-primary);
  color: var(--color-primary-dark);
  font-weight: 800;
}
.casting-prop-tag--rascunho { background: #f1f1f3; border: 1px solid #e1e1e6; color: #6b6b73; }
.casting-prop-tag--contratada { background: #ecfdf3; border: 1px solid #b6ebcb; color: #0f7a44; }

.ck-filterbar { max-width: 900px; display: flex; flex-direction: column; gap: 10px; background: #fff; border: 1px solid #ece9f7; border-radius: 14px; padding: 12px 14px; margin-bottom: 16px; }
.ck-filter-line { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ck-filter-line--bottom { justify-content: space-between; }
.ck-search { display: flex; align-items: center; gap: 8px; flex: 1 1 200px; min-width: 160px; background: #f5f3fa; border-radius: 12px; padding: 8px 12px; color: var(--color-text-muted); }
.ck-search input { flex: 1; border: none; background: transparent; outline: none; font-size: 14px; font-family: inherit; color: var(--color-text); }
.ck-filterbar .me-filter-select { background: #fff; border: 1px solid #ece9f7; border-radius: 10px; padding: 8px 12px; font: inherit; font-size: 13px; font-weight: 600; color: var(--color-text); cursor: pointer; }
@media (max-width: 600px) {
  .ck-filter-line { gap: 8px; }
  .ck-filter-line .me-filter-select, .ck-search { flex: 1 1 100%; }
  .ck-filter-line--bottom { flex-direction: column; align-items: stretch; }
}

/* Status "Em análise" no casting */
.casting-prop-tag--analise { background: #fff7e6; border: 1px solid #f3d9a6; color: #b9770a; }

/* ============ Convidados: filtro + lista unificada + status ============ */
.cv-filterbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 14px; }
.cv-perfil-filter { margin: 0; }
.cv-perfil-filter .tab { cursor: pointer; }

.cv-uitem-list { display: flex; flex-direction: column; gap: 8px; }
.cv-uitem {
  display: flex; align-items: center; gap: 12px;
  background: #fff; border: 1px solid #ece9f7; border-radius: 14px; padding: 10px 14px;
}
.cv-uitem-ava {
  width: 44px; height: 44px; border-radius: 50%; flex: 0 0 auto;
  background: var(--color-primary-soft) center/cover no-repeat;
  color: var(--color-primary-dark); font-weight: 800; font-size: 16px;
  display: flex; align-items: center; justify-content: center;
}
.cv-uitem-main { flex: 1; min-width: 0; }
.cv-uitem-main strong { display: block; font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cv-uitem-meta { font-size: 12px; color: var(--color-text-muted); }
.cv-uitem-acts { display: flex; gap: 6px; flex: 0 0 auto; align-items: center; }
.cv-uitem-acts .elr-act { position: static; width: 32px; height: 32px; border-radius: 9px; border: 1px solid #ece9f7; background: #fff; color: #555; display: inline-flex; align-items: center; justify-content: center; }
.cv-uitem-acts .elr-act:hover { border-color: var(--color-primary-light); color: var(--color-primary); }
.cv-uitem-acts .elr-act.danger:hover { border-color: #f1c4c4; color: #e23b3b; }

/* Pílulas de status */
.cv-st { font-size: 11px; font-weight: 800; padding: 4px 10px; border-radius: 999px; white-space: nowrap; }
.cv-st--aguard  { background: #fff7e6; border: 1px solid #f3d9a6; color: #b9770a; }
.cv-st--pend    { background: var(--color-primary-soft); color: var(--color-primary-dark); }
.cv-st--standby { background: #f1eff7; border: 1px solid #e4e0f0; color: var(--color-text-muted); }
.cv-st--aprov   { background: #ecfdf3; border: 1px solid #b6ebcb; color: #0f7a44; }
.cv-st--recus   { background: #f5f3fa; border: 1px solid #ece9f7; color: var(--color-text-muted); }
@media (max-width: 520px) {
  .cv-uitem { flex-wrap: wrap; }
  .cv-uitem-acts { width: 100%; justify-content: flex-end; }
}

/* ============ Elenco — filtros avançados ============ */
.el-adv { background: #f4f4f4; border: 1px solid #ece9f7; border-radius: 16px; padding: 16px 18px; margin-bottom: 16px; }
/* Cabeçalho do filtro */
.el-adv-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 12px; margin-bottom: 14px; border-bottom: 1px solid #f0eef7; }
.el-adv-title { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px; color: #222; }
.el-adv-title svg { color: var(--color-primary); }
.el-adv-count { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: #222; color: #fff; font-size: 11px; font-weight: 800; }
.el-adv-clear { font-size: 12.5px; font-weight: 700; color: var(--color-text-muted); text-decoration: none; white-space: nowrap; }
.el-adv-clear:hover { color: #e23b3b; }
/* Chips de filtros ativos */
.el-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 16px; }
.el-chips-lbl { font-size: 12px; font-weight: 700; color: var(--color-text-muted); }
.el-chip { display: inline-flex; align-items: center; gap: 7px; background: #fff; border: 1.5px solid #222; border-radius: 999px; padding: 4px 5px 4px 12px; font-size: 12px; font-weight: 700; color: #222; }
.el-chip em { font-style: normal; color: var(--color-text-muted); }
.el-chip-x { width: 18px; height: 18px; border-radius: 50%; background: #f1eff7; color: #444; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; font-size: 13px; line-height: 1; }
.el-chip-x:hover { background: #e23b3b; color: #fff; }
/* Grade de campos */
.el-adv-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px 18px; }
.el-f { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.el-f > span { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; color: var(--color-text-muted); display: inline-flex; align-items: center; }
.el-f select, .el-f input { border: 1.5px solid #ece9f7; border-radius: 10px; padding: 9px 11px; font: inherit; font-size: 13px; color: var(--color-text); background: #fff; width: 100%; }
.el-f select:focus, .el-f input:focus { outline: none; border-color: var(--color-primary-light); }
.el-range { display: flex; align-items: center; gap: 8px; }
.el-range select, .el-range input { flex: 1; min-width: 0; }
.el-range > span { color: var(--color-text-muted); flex: 0 0 auto; }
.el-adv-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
/* Campo com filtro ativo (sem fundo roxo): borda escura + ponto verde no rótulo */
.el-f.is-on > span { color: #222; }
.el-f.is-on > span::after { content: ''; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--color-success); margin-left: 7px; }
.el-f.is-on select, .el-f.is-on input { border-color: #222; background: #fcfcff; }
@media (min-width: 720px)  { .el-adv-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1100px) { .el-adv-grid { grid-template-columns: repeat(4, 1fr); } }

/* ============================================================
   ADMIN — Dashboard administrativo
   ============================================================ */
.adm-fat-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 8px;
}
.adm-fat-cell {
  background: #fff;
  border: 1px solid #ece9f7;
  border-radius: 14px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.adm-fat-label { font-size: 12px; color: var(--color-text-muted); font-weight: 700; text-transform: uppercase; letter-spacing: .4px; }
.adm-fat-num   { font-size: 22px; font-weight: 800; color: #222; }
.adm-fat-sub   { font-size: 11px; color: var(--color-text-muted); font-weight: 600; }

.adm-table-wrap { overflow-x: auto; }
.adm-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.adm-table th {
  text-align: left;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: var(--color-text-muted);
  padding: 10px 12px;
  border-bottom: 1px solid #ece9f7;
  font-weight: 800;
  white-space: nowrap;
}
.adm-table td {
  padding: 12px;
  border-bottom: 1px solid #f5f3fa;
  vertical-align: middle;
}
.adm-table tr:hover td { background: #faf8ff; }

.adm-tag {
  display: inline-block;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .3px;
  text-transform: uppercase;
}
.adm-tag--agencia     { background: #ede4ff; color: #4e2dab; }
.adm-tag--contratante { background: #ffe1ee; color: #9b1c52; }
.adm-tag--ok          { background: #e7f7ee; color: #0f7a44; border: 1px solid #aee3c6; }
.adm-tag--pend        { background: #fff7e6; color: #b9770a; border: 1px solid #f3d9a6; }

.btn-success { background: var(--color-success); color: #fff; border: none; padding: 8px 14px; border-radius: 10px; font-weight: 800; font-size: 12px; cursor: pointer; letter-spacing: .3px; text-transform: uppercase; }
.btn-success:hover { background: #149b54; }
.btn-danger  { background: #e23b3b; color: #fff; border: none; padding: 8px 14px; border-radius: 10px; font-weight: 800; font-size: 12px; cursor: pointer; letter-spacing: .3px; text-transform: uppercase; margin-left: 6px; }
.btn-danger:hover { background: #b92d2d; }
.btn-sm { padding: 6px 12px; font-size: 11px; border-radius: 9px; }

@media (min-width: 720px) {
  .adm-fat-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ============================================================
   ADMIN — Listagens, chips, ações inline, mensagens
   ============================================================ */
.adm-tag--bloq { background: #ffe2e2; color: #a82424; border: 1px solid #f3b5b5; }
.evento-status--bloqueado { background: #fde2e2; color: #a82424; border: 1px solid #f3b5b5; padding: 4px 10px; border-radius: 999px; font-size: 10.5px; font-weight: 800; letter-spacing: .3px; text-transform: uppercase; }
.evento-status--rascunho   { background: #f1f1f3; color: #6b6b73; border: 1px solid #e1e1e6; padding: 4px 10px; border-radius: 999px; font-size: 10.5px; font-weight: 800; letter-spacing: .3px; text-transform: uppercase; }

.adm-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.adm-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; border-radius: 999px;
  font-size: 12px; font-weight: 700; color: #444;
  background: #fff; border: 1.5px solid #ece9f7; text-decoration: none;
  transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.adm-chip:hover { border-color: #c8c2dd; }
.adm-chip.is-active { background: #222; color: #fff; border-color: #222; }
.adm-chip-n { background: rgba(255,255,255,.16); color: inherit; padding: 1px 8px; border-radius: 999px; font-size: 11px; }
.adm-chip:not(.is-active) .adm-chip-n { background: #f3eefe; color: var(--color-primary-dark); }

.adm-actions { display: inline-flex; gap: 4px; align-items: center; }
.adm-iconbtn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 8px;
  background: #fff; color: #444; border: 1px solid #ece9f7;
  cursor: pointer; transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.adm-iconbtn:hover { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.adm-iconbtn--warn:hover   { background: #b9770a; border-color: #b9770a; }
.adm-iconbtn--danger:hover { background: #e23b3b; border-color: #e23b3b; }
.adm-iconbtn--acesso        { color: #16a34a; border-color: #cfeeda; }
.adm-iconbtn--acesso:hover  { background: #16a34a; border-color: #16a34a; color: #fff; }
.adm-iconbtn--conf          { color: #b9770a; border-color: #f3e3c4; }
.adm-iconbtn--conf:hover    { background: #b9770a; border-color: #b9770a; color: #fff; }

.adm-tag--naoconf {
  background: #fff8ec; color: #8a5a00; border: 1px solid #ffe0b0;
  font-size: 10px; margin-left: 4px;
}

/* Modal de confirmação de e-mail */
.adm-cf-status {
  border-radius: 10px; padding: 12px 14px; font-size: 13px; font-weight: 700; line-height: 1.5;
  background: #fff8ec; color: #8a5a00; border: 1px solid #ffe0b0;
}
.adm-cf-status.is-ok  { background: #dcfce7; color: #166534; border-color: #86efac; }
.adm-cf-status.is-err { background: #fee2e2; color: #991b1b; border-color: #fca5a5; }
.adm-cf-link {
  margin-top: 10px; padding: 11px 13px; border-radius: 10px;
  background: #faf8fd; border: 1px solid #ece9f7;
  font-size: 11.5px; font-family: monospace; color: #5A00B0; word-break: break-all;
}
.adm-iconbtn svg { width: 16px; height: 16px; }

/* Faixa de acesso direto (admin dentro da conta de um usuário) */
.imp-bar {
  position: sticky; top: 0; z-index: 120;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: #0a0a0a; color: #fff;
  padding: 9px 16px; font-size: 12.5px; font-weight: 700;
}
.imp-bar svg { width: 15px; height: 15px; flex: 0 0 15px; color: #16a34a; }
.imp-bar b { font-weight: 900; }
.imp-bar form { margin: 0 0 0 auto; }
.imp-bar button {
  background: #fff; color: #0a0a0a; border: 0; border-radius: 999px;
  padding: 6px 15px; font-family: inherit; font-size: 11.5px; font-weight: 900; cursor: pointer;
}
.imp-bar button:hover { background: #16a34a; color: #fff; }
@media (max-width: 600px) {
  .imp-bar { font-size: 11.5px; padding: 8px 12px; }
  .imp-bar form { margin-left: auto; }
}

/* Layout master-detail das mensagens */
.adm-msg-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
@media (min-width: 900px) {
  .adm-msg-grid { grid-template-columns: 340px 1fr; }
}
.adm-msg-aside { max-height: 70vh; overflow-y: auto; }
.adm-msg-aside .msg-conv-list { margin-top: 6px; }
.msg-conv {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 10px 12px; border-radius: 12px;
  text-decoration: none; color: inherit;
  transition: background .15s ease;
}
.msg-conv:hover { background: #faf8ff; }
.msg-conv.is-active { background: #f3eefe; }
.msg-conv-avatar {
  flex: 0 0 36px; width: 36px; height: 36px; border-radius: 50%;
  background: var(--color-primary-soft); color: var(--color-primary);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800;
}
.msg-conv-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.msg-conv-top  { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; }
.msg-conv-top strong { font-size: 13px; }
.msg-conv-time { font-size: 11px; color: var(--color-text-muted); }
.msg-conv-evento { font-size: 11.5px; color: var(--color-text-muted); }
.msg-conv-evento em { font-style: normal; color: #444; font-weight: 600; }
.msg-conv-snippet { font-size: 12px; color: #666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.msg-conv-badge { background: #f3eefe; color: var(--color-primary-dark); border-radius: 999px; font-size: 11px; font-weight: 800; padding: 3px 8px; }
.msg-conv.is-active .msg-conv-badge { background: var(--color-primary); color: #fff; }

/* Mensagens individuais (admin lendo conversa) */
.vce-msg-list { display: flex; flex-direction: column; gap: 8px; max-height: 60vh; overflow-y: auto; padding: 4px; }
.vce-msg {
  padding: 10px 14px; border-radius: 12px;
  background: #fff; border: 1px solid #ece9f7;
}
.vce-msg.is-agencia     { border-left: 3px solid var(--color-primary); }
.vce-msg.is-contratante { border-left: 3px solid #F472B6; }
.vce-msg-meta {
  display: flex; align-items: baseline; gap: 8px;
  font-size: 12px; color: var(--color-text-muted); margin-bottom: 4px;
}
.vce-msg-meta strong { color: #222; font-size: 13px; }
.vce-msg-role { background: #f3eefe; color: var(--color-primary-dark); padding: 1px 8px; border-radius: 999px; font-size: 10.5px; font-weight: 800; }
.vce-msg.is-contratante .vce-msg-role { background: #ffe1ee; color: #c93366; }
.vce-msg-text { font-size: 14px; line-height: 1.5; color: #222; }

/* Search field em filtros adm — visual igual ao dash-search */
.ck-filterbar .dash-search.ck-search input { width: 100%; }
.ck-filterbar { padding: 12px 14px; background: #fff; border: 1px solid #ece9f7; border-radius: 14px; display: flex; flex-direction: column; gap: 10px; }
.ck-filter-line { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ck-filter-line .dash-search { flex: 1 1 260px; }
.ck-filter-line--bottom { border-top: 1px solid #f5f3fa; padding-top: 10px; }

/* ============================================================
   ADMIN — Sortable tables, mensagens (excluir)
   ============================================================ */
.adm-table.js-sortable thead th[data-sort] {
  cursor: pointer;
  user-select: none;
  position: relative;
  padding-right: 22px;
}
.adm-table.js-sortable thead th[data-sort]::after {
  content: "↕";
  position: absolute;
  right: 8px;
  opacity: .3;
  font-size: 10px;
  top: 50%;
  transform: translateY(-50%);
}
.adm-table.js-sortable thead th[data-sort].sort-asc::after  { content: "▲"; opacity: 1; color: var(--color-primary); }
.adm-table.js-sortable thead th[data-sort].sort-desc::after { content: "▼"; opacity: 1; color: var(--color-primary); }
.adm-table.js-sortable thead th[data-sort]:hover { color: var(--color-primary-dark); }

/* Mensagem individual no admin com botão delete */
.vce-msg { position: relative; }
.vce-msg-actions { display: inline-flex; gap: 4px; margin-left: auto; }
.vce-msg-del {
  background: none; border: 1px solid #f3c2c2; color: #a82424;
  border-radius: 6px; padding: 2px 8px; font-size: 11px; cursor: pointer;
  font-weight: 700;
}
.vce-msg-del:hover { background: #e23b3b; color: #fff; border-color: #e23b3b; }
.vce-msg-meta { display: flex; align-items: baseline; gap: 8px; }

/* Marca destacada do item ativo nas conversas */
.msg-conv.is-active { background: var(--color-primary-soft); }

/* ============================================================
   CTR SELECT — coluna direita verde ao completar + flash
   ============================================================ */
.ctr-split-right.is-ok {
  background: color-mix(in srgb, var(--color-success) 12%, #fff);
  border-color: var(--color-success);
  box-shadow: 0 0 0 2px rgba(26,170,97,.18);
  transition: background .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.ctr-split-right.is-ok .ctr-col-head { color: var(--color-success); }
.ctr-split-right.is-ok .ctr-col-sub  { background: var(--color-success); color: #fff; border-color: var(--color-success); }

/* Pick vazio piscando ao tentar concluir incompleto */
.ctr-pick.is-empty.is-flash {
  animation: ctrPickFlash 1.4s ease-out;
  border-color: #e23b3b;
  box-shadow: 0 0 0 3px rgba(226,59,59,.25);
}
@keyframes ctrPickFlash {
  0%   { transform: scale(1);   box-shadow: 0 0 0 0    rgba(226,59,59,.0);  }
  20%  { transform: scale(1.04);box-shadow: 0 0 0 8px  rgba(226,59,59,.35); }
  60%  { transform: scale(1);   box-shadow: 0 0 0 14px rgba(226,59,59,.0);  }
  100% { transform: scale(1);   box-shadow: 0 0 0 0    rgba(226,59,59,.0);  }
}

/* Concluir desabilitado visualmente (mas continua clicável p/ mostrar aviso) */
.btn.btn-primary.js-ctr-concluir.btn-disabled {
  background: #ddd6ec; color: #8a82a3; cursor: not-allowed;
  box-shadow: none;
}
.btn.btn-primary.js-ctr-concluir.btn-disabled:hover { background: #ddd6ec; }

/* ============================================================
   casting-evento.php — master-detail (aside + main com tabs)
   ============================================================ */
.cep-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
@media (min-width: 1000px) {
  .cep-layout { grid-template-columns: 300px 1fr; align-items: start; }
  .cep-aside  { position: sticky; top: 14px; max-height: calc(100vh - 28px); display: flex; flex-direction: column; }
}
.cep-aside-head { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:8px; }
.cep-aside-head h3 { margin:0; font-size:14px; font-weight:800; text-transform:uppercase; letter-spacing:.4px; color:#222; }
.cep-aside .dash-search.cep-search { width:100%; margin-bottom:10px; }
.cep-aside .dash-search.cep-search input { width:100%; }
.cep-evlist { display:flex; flex-direction:column; gap:6px; overflow-y:auto; padding-right:2px; flex:1; min-height:0; }

.cep-evitem {
  display: flex; flex-direction: column; gap: 4px;
  padding: 10px 12px; border-radius: 12px;
  text-decoration: none; color: inherit;
  background: #fff; border: 1.5px solid #f0eef7;
  transition: background .15s ease, border-color .15s ease, transform .12s ease;
  position: relative;
}
.cep-evitem:hover { background:#faf8ff; border-color:#e7defc; }
.cep-evitem.is-active { background: var(--color-primary-soft); border-color: var(--color-primary); }
.cep-evitem-top { display:flex; align-items:baseline; justify-content:space-between; gap:6px; }
.cep-evitem-top strong { font-size:13.5px; color:#222; line-height:1.2; }
.cep-evitem-msg { background:#e23b3b; color:#fff; border-radius:999px; padding:1px 8px; font-size:10.5px; font-weight:800; }
.cep-evitem-meta { font-size:11.5px; color:var(--color-text-muted); }
.cep-evitem-st { align-self:flex-start; font-size:10px; margin-top:2px; }

.cep-main { min-width: 0; }
.cep-main .vce-tabs { margin-top: 10px; }

/* ============================================================
   STATUS CHIPS — filtros de status em eventos.php / meus-eventos.php
   Usam a MESMA paleta de evento-status / casting-prop-tag
   ============================================================ */
.status-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}
.status-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .3px;
  background: #fff;
  border: 1.5px solid #ece9f7;
  color: #444;
  text-decoration: none;
  transition: transform .12s ease, box-shadow .15s ease, border-color .15s ease;
}
.status-chip:hover { border-color: #c8c2dd; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(20,0,60,.08); }
.status-chip-n {
  background: #f3eefe;
  color: var(--color-primary-dark);
  border-radius: 999px;
  padding: 1px 9px;
  font-size: 11px;
  font-weight: 800;
}

/* Cores específicas — cada chip usa a paleta do status correspondente */
.status-chip--todos.is-active        { background: #222;        color: #fff;     border-color: #222; }
.status-chip--todos.is-active .status-chip-n { background: rgba(255,255,255,.18); color: #fff; }

/* Agência */
.status-chip--sem.is-active          { background: #fff;        color: var(--color-primary-dark); border-color: var(--color-primary); border-style: dashed; }
.status-chip--enviada.is-active      { background: #fff7e6;     color: #b9770a;  border-color: #f3d9a6; }
.status-chip--enviada.is-active .status-chip-n      { background: #b9770a; color: #fff; }
.status-chip--contratada.is-active   { background: #ecfdf3;     color: #0f7a44;  border-color: #b6ebcb; }
.status-chip--contratada.is-active .status-chip-n   { background: #0f7a44; color: #fff; }
.status-chip--recusada.is-active     { background: #f5f3fa;     color: #6b6b73;  border-color: #ddd6ec; }
.status-chip--recusada.is-active .status-chip-n     { background: #6b6b73; color: #fff; }
.status-chip--rascunho.is-active     { background: #f1f1f3;     color: #6b6b73;  border-color: #d6d6dc; }
.status-chip--rascunho.is-active .status-chip-n     { background: #6b6b73; color: #fff; }
.status-chip--finalizado.is-active   { background: #f5f3fa;     color: #6b6b73;  border-color: #ddd6ec; }

/* Contratante */
.status-chip--aguardando.is-active   { background: #fff7e6;     color: #b9770a;  border-color: #f3d9a6; }
.status-chip--aguardando.is-active .status-chip-n   { background: #b9770a; color: #fff; }
.status-chip--propostas.is-active    { background: #f3eefe;     color: var(--color-primary-dark); border-color: var(--color-primary-light); }
.status-chip--propostas.is-active .status-chip-n    { background: var(--color-primary); color: #fff; }
.status-chip--contratado.is-active   { background: #ecfdf3;     color: #0f7a44;  border-color: #b6ebcb; }
.status-chip--contratado.is-active .status-chip-n   { background: #0f7a44; color: #fff; }

/* Tag "Finalizado" + linha desativada (agência que não venceu) */
.casting-prop-tag--finalizado {
  background: #f5f3fa;
  border: 1px solid #ddd6ec;
  color: #6b6b73;
}
.cklist-row.is-finalizado {
  opacity: .55;
  cursor: not-allowed;
  filter: grayscale(.4);
}
.cklist-row.is-finalizado:hover {
  border-color: #ece9f7;
  box-shadow: none;
  transform: none;
}

/* ============================================================
   ctr-preview-head: botão "Selecionar X" no topo + contador
   ============================================================ */
.ctr-preview { display: block; padding: 12px 14px 14px; background: #fff; border-top: 1px solid #f0eef7; }
.ctr-preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.ctr-preview-btn {
  white-space: nowrap;
  background: #fff;
  color: #222;
  border: 2px solid #222;
  font-weight: 800;
  letter-spacing: .3px;
}
.ctr-preview-btn:hover {
  background: #222;
  color: #fff;
}
.ctr-preview-head .ctr-preview-count {
  font-size: 12px;
  font-weight: 800;
  color: var(--color-text-muted);
}
.ctr-preview-items {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

/* =========================================================================
   ============== EVENTO-FORM v2 — UX/UI senior overhaul =================
   Foco: responsividade mobile + contraste + hierarquia visual
   ========================================================================= */

/* ---------- STEPPER responsivo ---------- */
@media (max-width: 720px) {
  .evento-stepper {
    gap: 4px;
    margin-bottom: 14px;
    padding: 2px;
  }
  .evento-stepper .step-pill {
    flex: 1;
    padding: 8px 6px;
    font-size: 11px;         /* mostra label em todos os steps */
    justify-content: center;
    gap: 6px;
    min-height: 36px;
    line-height: 1.15;
    text-align: center;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .evento-stepper .step-pill span {
    font-size: 12px;
    width: 22px; height: 22px;
    min-width: 22px;
  }
  .evento-stepper .step-pill.is-current {
    flex: 1.4;
    font-size: 11.5px;
    padding: 8px 10px;
    gap: 6px;
    white-space: normal;
  }
}

/* ---------- FORM ROWS responsivos (label em cima do input no mobile) ---------- */
@media (max-width: 720px) {
  .evento-form .form-row,
  .evento-form .form-row.form-row-stack {
    grid-template-columns: 1fr !important;
    gap: 6px;
    margin-bottom: 14px;
  }
  .evento-form .form-row label {
    text-align: left;
    padding-right: 0;
    font-size: 12.5px;
    color: #0a0a0a;
    font-weight: 800;
    letter-spacing: .02em;
  }
  .evento-form .form-row .double {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .evento-form .form-section h3 {
    font-size: 15px;
    margin-bottom: 12px;
  }
  .evento-form .form-section {
    margin-bottom: 22px;
  }
}

/* ---------- HIERARQUIA VISUAL — "Quais profissionais você precisa?" ---------- */
.perfis-h {
  position: relative;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.01em;
  color: #0a0a0a;
  padding-left: 14px;
  margin: 6px 0 6px;
  line-height: 1.2;
}
.perfis-h::before {
  content: "";
  position: absolute;
  left: 0; top: 6px; bottom: 6px;
  width: 4px;
  border-radius: 4px;
  background: linear-gradient(180deg, #7C00F5 0%, #5600BC 100%);
}
.perfis-sub {
  font-size: 14px;
  color: #444;
  margin: 0 0 18px;
  line-height: 1.55;
  padding-left: 14px;
}
.perfis-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.perfis-actions .btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 11px 18px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .04em;
  border-radius: 10px;
}
.perfis-actions .btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(20,0,60,.10);
}
.perfis-cnt-wrap {
  display: inline-flex;
  gap: 6px;
  margin-left: auto;
  flex-wrap: wrap;
}
.perfis-cnt {
  background: #fff;
  border: 1.5px solid #ece9f7;
  color: #222;
  font-weight: 800;
  font-size: 12.5px;
  padding: 6px 12px;
  border-radius: 999px;
  letter-spacing: .02em;
}

@media (max-width: 600px) {
  .perfis-h { font-size: 17px; }
  .perfis-sub { font-size: 13.5px; margin-bottom: 14px; }
  .perfis-actions { gap: 8px; }
  .perfis-actions .btn { flex: 1; min-width: 120px; padding: 12px 14px; justify-content: center; }
  .perfis-cnt-wrap { margin-left: 0; width: 100%; justify-content: center; }
}

/* ---------- EMPTY STATE da tabela ---------- */
.ptbl-empty {
  background: linear-gradient(135deg, #fafbfc 0%, #f3f1f9 100%);
  border: 2px dashed #d9d4ec;
  border-radius: 14px;
  padding: 28px 20px;
  text-align: center;
  color: #444;
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 12px;
}
.ptbl-empty strong { color: #0a0a0a; font-weight: 800; }

/* ---------- TABELA responsiva: vira cards no mobile ---------- */
.ptbl-unificada th {
  font-size: 11.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #0a0a0a;
  font-weight: 800;
  padding: 12px 10px;
  background: #fafbfc;
}
.ptbl-unificada td {
  padding: 12px 10px;
  font-size: 13.5px;
  color: #222;
}
.ptbl-unificada select,
.ptbl-unificada input[type="text"] {
  font-size: 13.5px;
  padding: 8px 10px;
  border: 1.5px solid #d9d4ec;
  border-radius: 8px;
  background: #fff;
  color: #222;
  font-weight: 600;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.ptbl-unificada select:focus,
.ptbl-unificada input:focus {
  border-color: #7C00F5;
  box-shadow: 0 0 0 3px rgba(124,0,245,.12);
}
.ptbl-unificada select:disabled {
  background: #f5f3fa;
  color: #aaa;
  cursor: not-allowed;
  border-color: #ece9f7;
}

/* Coluna Idade com staff "———" sem limitação */
.ptbl-naopossui {
  display: inline-block;
  color: #c4c0d4;
  letter-spacing: 2px;
  font-weight: 700;
  font-size: 14px;
  padding: 6px 8px;
}

/* Mobile: transforma table em cards empilhados */
@media (max-width: 760px) {
  .ptbl-unificada thead { display: none; }
  .ptbl-unificada,
  .ptbl-unificada tbody,
  .ptbl-unificada tr,
  .ptbl-unificada td { display: block; width: 100%; }
  .ptbl-unificada tr {
    background: #fff;
    border: 1.5px solid #ece9f7;
    border-radius: 14px;
    margin-bottom: 10px;
    padding: 12px 14px 8px;
    position: relative;
  }
  .ptbl-unificada td {
    padding: 8px 0;
    border-bottom: 1px solid #f3f1f9;
    display: grid;
    grid-template-columns: 100px 1fr;
    align-items: center;
    gap: 10px;
  }
  .ptbl-unificada td:last-child { border-bottom: none; }
  .ptbl-unificada td::before {
    content: attr(data-label);
    font-size: 11px;
    font-weight: 800;
    color: #6b6b73;
    letter-spacing: .06em;
    text-transform: uppercase;
  }
  .ptbl-unificada td[data-label=""]::before { display: none; }
  .ptbl-unificada td[data-label=""] {
    position: absolute;
    top: 6px; right: 6px;
    border: 0;
    padding: 0;
    width: auto;
  }
  .ptbl-unificada select,
  .ptbl-unificada input[type="text"] {
    width: 100%;
    font-size: 14px;
    padding: 10px 12px;
  }
  .ptbl-unificada .cell-pair {
    grid-template-columns: 1fr auto 1fr;
    gap: 6px;
  }
}

/* ---------- ACTIONS BOTTOM responsivo ---------- */
@media (max-width: 600px) {
  .evento-form .actions-bottom {
    flex-wrap: wrap;
    gap: 8px;
  }
  .evento-form .actions-bottom .btn {
    flex: 1;
    min-width: 0;
  }
}

/* ---------- CALENDÁRIO responsivo ---------- */
@media (max-width: 600px) {
  .cal-range .cal-range-month {
    min-width: 0 !important;
  }
  .cal-range-viewport { overflow-x: auto; }
}

/* ---------- BADGE de auto-save ---------- */
.autosave-toast {
  position: fixed;
  bottom: 18px;
  right: 18px;
  background: #16a34a;
  color: #fff;
  padding: 10px 16px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 6px 20px rgba(22,163,74,.25);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .25s ease, transform .25s ease;
  pointer-events: none;
  z-index: 99999;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.autosave-toast.is-show {
  opacity: 1;
  transform: translateY(0);
}
.autosave-toast.is-saving { background: #5600BC; box-shadow: 0 6px 20px rgba(86,0,188,.25); }

/* ---------- ETAPA CONCLUÍDA — bandeira sutil ---------- */
.evento-form[data-step="2"] .evento-step-1 + .step-saved,
.evento-form[data-step="3"] .evento-step-2 + .step-saved {
  display: block;
}


/* =========================================================================
   Cascata visual: campo OBRIGATÓRIO atual em vermelho;
   demais campos vazios ficam apagados (disabled).
   ========================================================================= */
.ptbl-unificada .is-req-now,
.ptbl-unificada .is-req-now:focus {
  border-color: #e23b3b !important;
  box-shadow: 0 0 0 3px rgba(226,59,59,.15) !important;
  background: #fef2f2 !important;
  color: #991b1b !important;
  font-weight: 800 !important;
  animation: reqNowPulse 1.6s ease-in-out infinite;
}
@keyframes reqNowPulse {
  0%,100% { box-shadow: 0 0 0 3px rgba(226,59,59,.15); }
  50%     { box-shadow: 0 0 0 6px rgba(226,59,59,.22); }
}

/* Linhas com perfis incompletos ganham borda esquerda vermelha */
.ptbl-unificada tr.row-incomplete {
  background: #fff8f8 !important;
  border-left: 4px solid #e23b3b !important;
}

/* Resumo da etapa 2 vira alerta vermelho quando há erro */
.perfis-resumo {
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 10px;
  padding: 12px 14px;
  margin-top: 12px;
  font-size: 13.5px;
  color: #555;
  display: flex;
  align-items: center;
  gap: 8px;
}
.perfis-resumo.is-ok { background: #dcfce7; color: #166534; border-color: #bbf7d0; font-weight: 700; }
.perfis-resumo.is-erro {
  background: #fee2e2;
  border-color: #fecaca;
  color: #991b1b;
  font-weight: 700;
  animation: perfisShake .35s ease-in-out;
}
@keyframes perfisShake {
  0%,100% { transform: translateX(0); }
  20%     { transform: translateX(-6px); }
  60%     { transform: translateX(6px); }
  80%     { transform: translateX(-3px); }
}

/* =========================================================================
   Sobrescreve estilos antigos de "is-empty"/"is-locked" para usar o
   sistema novo (.is-filled / .is-req-now / disabled).
   ========================================================================= */
.ptbl-row.is-empty td:not(:first-child):not(:last-child) { opacity: 1 !important; }
.ptbl-row.is-locked td:not(:first-child)                 { opacity: 1 !important; }
/* Só remove o pulse/cor amarela antiga em campos NÃO desabilitados.
   Disabled mantém o visual "apagado" do select:disabled abaixo. */
.ptbl-row.is-empty .js-qtd:not(:disabled),
.ptbl-row.is-locked .js-qtd:not(:disabled),
.ptbl-row.is-locked .js-funcao:not(:disabled),
.ptbl-row.is-locked[data-kind="modelo"] .js-sexo:not(:disabled) {
  animation: none !important;
  background: #fff !important;
  border-color: #d9d4ec !important;
  color: #222 !important;
  font-weight: 600 !important;
}
/* E reforça: js-qtd e js-funcao DESABILITADOS seguem o "apagado" */
.ptbl-unificada .js-qtd:disabled,
.ptbl-unificada .js-funcao:disabled,
.ptbl-unificada .js-sexo:disabled {
  background: #fafbfc !important;
  border: 1.5px solid #ece9f7 !important;
  color: #c4c0d4 !important;
  font-weight: 600 !important;
  animation: none !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}

/* CAMPO PREENCHIDO — borda preta forte, totalmente opaco */
.ptbl-unificada .is-filled,
.ptbl-unificada .is-filled:focus {
  border: 2px solid #222 !important;
  background: #fff !important;
  color: #0a0a0a !important;
  font-weight: 800 !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

/* O dropdown de função do staff selecionado mantém o ambar como identidade */
.ptbl-unificada .js-funcao.is-filled,
.ptbl-unificada .ptbl-funcao-sel.has-value {
  background: #fff !important;
  border: 2px solid #d97706 !important;
  color: #92400e !important;
  font-weight: 800 !important;
}

/* CAMPO DESABILITADO (apagado, aguardando anterior) */
.ptbl-unificada select:disabled,
.ptbl-unificada input:disabled {
  background: #fafbfc !important;
  color: #c4c0d4 !important;
  border-color: #ece9f7 !important;
  font-weight: 600 !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
  animation: none !important;
}

/* CAMPO AGUARDANDO (vermelho pulsante) — reforça prioridade */
.ptbl-unificada .is-req-now,
.ptbl-unificada .is-req-now:focus {
  border: 2px solid #e23b3b !important;
  background: #fef2f2 !important;
  color: #991b1b !important;
  font-weight: 800 !important;
  opacity: 1 !important;
  box-shadow: 0 0 0 3px rgba(226,59,59,.15) !important;
}

/* =========================================================================
   .ptbl-obs-btn — só ganha borda preta quando estiver PREENCHIDO.
   - Vazio (enabled): borda tracejada, texto muted (estado "+ Adicionar")
   - Preenchido (.has-content): borda 2px solid #222, fundo branco, texto bold 800
   - Disabled: apagado (cinza claro)
   ========================================================================= */
.ptbl-unificada .ptbl-obs-btn {
  border: 1.5px dashed #c4c0d4 !important;
  background: #fff !important;
  color: #6b6b73 !important;
  font-weight: 700 !important;
  opacity: 1 !important;
  border-radius: 8px !important;
  height: 38px !important;
  font-size: 12.5px !important;
  letter-spacing: .02em !important;
}
.ptbl-unificada .ptbl-obs-btn:hover:not(:disabled):not(.has-content) {
  border-color: #7C00F5 !important;
  color: #5600BC !important;
}
.ptbl-unificada .ptbl-obs-btn:disabled {
  background: #fafbfc !important;
  border-color: #ece9f7 !important;
  border-style: dashed !important;
  color: #c4c0d4 !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}
.ptbl-unificada .ptbl-obs-btn.has-content {
  border: 2px solid #222 !important;
  background: #fff !important;
  color: #0a0a0a !important;
  font-weight: 800 !important;
  opacity: 1 !important;
}
.ptbl-unificada .ptbl-obs-btn.has-content:hover {
  background: #f7f0ff !important;
  border-color: #5600BC !important;
  color: #5600BC !important;
}

/* =========================================================================
   Tabela unificada — esquema cromático preto/branco.
   Apenas o vermelho do "próximo campo" tem cor.
   ========================================================================= */

/* Badge Modelo / Staff → mesma identidade neutra (preto sobre cinza claro) */
.ptbl-unificada .ptbl-kind,
.ptbl-unificada .ptbl-kind--modelo,
.ptbl-unificada .ptbl-kind--staff {
  background: none !important;
  color: #0a0a0a !important;
  border: none !important;
  font-weight: 800 !important;
}

/* Função do staff preenchida → preto (sem ambar) */
.ptbl-unificada .js-funcao.is-filled,
.ptbl-unificada .js-funcao.has-value,
.ptbl-unificada .ptbl-funcao-sel.has-value {
  background: #fff !important;
  border: 2px solid #222 !important;
  color: #0a0a0a !important;
  font-weight: 800 !important;
}

/* =========================================================================
   Hover na linha em tons de cinza apenas (sem cor roxa/amarela)
   ========================================================================= */
.ptbl tbody tr:hover td,
.ptbl tbody tr.ptbl-row.is-locked:hover td {
  background: #f7f7f9 !important;
}
.ptbl tbody tr:nth-child(even) td { background: #fafafc !important; }
/* Hover em coluna (col-hover via JS) — cinza */
.ptbl td.col-hover,
.ptbl th.col-hover {
  background: #f7f7f9 !important;
  border-left-color: #ece9f7 !important;
  border-right-color: #ece9f7 !important;
}

/* =========================================================================
   Zebra striping + hover azul claro (ptbl-unificada)
   ========================================================================= */
.ptbl-unificada tbody tr td { background: #f5f5f7 !important; }

.ptbl-unificada tbody tr:hover td,
.ptbl-unificada tbody tr.ptbl-row.is-locked:hover td {
  background: #eff6ff !important;
}

/* =========================================================================
   Linhas "view" (read-only) na ptbl-unificada
   ========================================================================= */
.ptbl-unificada .ptbl-view-row { cursor: pointer; transition: background .12s ease; border:1px solid #222 !important}
.ptbl-unificada .ptbl-view-row td {
  font-weight: 700;
  color: #0a0a0a;
  font-size: 13.5px;
}
.ptbl-unificada .ptbl-view-row td.vw-obs {
  font-weight: 500;
  color: #555;
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ptbl-unificada .ptbl-view-row .ptbl-rm {
  background: #fff;
  border: 1.5px solid #ece9f7;
  width: 28px; height: 28px;
  border-radius: 6px;
  cursor: pointer;
  color: #888;
  display: inline-flex; align-items: center; justify-content: center;
}
.ptbl-unificada .ptbl-view-row .ptbl-rm:hover {
  border-color: #e23b3b;
  color: #e23b3b;
  background: #fef2f2;
}

/* Modal #modal-perfil-form: red border no próximo campo obrigatório */
#modal-perfil-form .is-req-now,
#modal-perfil-form .is-req-now:focus {
  border-color: #e23b3b !important;
  background: #fef2f2 !important;
  color: #991b1b !important;
  box-shadow: 0 0 0 3px rgba(226,59,59,.15) !important;
  font-weight: 800 !important;
}
#modal-perfil-form .form-row {
  display: grid;
  grid-template-columns: 140px 1fr;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
#modal-perfil-form .form-row label {
  text-align: right;
  font-size: 13px;
  font-weight: 700;
  color: #222;
}
#modal-perfil-form select,
#modal-perfil-form textarea {
  padding: 10px 12px;
  border: 1.5px solid #d9d4ec;
  border-radius: 8px;
  font-family: inherit;
  font-size: 14px;
  outline: none;
}
@media (max-width:600px) {
  #modal-perfil-form .form-row { grid-template-columns: 1fr; }
  #modal-perfil-form .form-row label { text-align: left; }
}

/* Coluna de ações da linha-view: editar + remover lado a lado */
.ptbl-unificada .ptbl-col-actions {
  white-space: nowrap;
  text-align: right;
  width: 80px;
}
.ptbl-unificada .ptbl-col-actions .ptbl-rm + .ptbl-rm { margin-left: 4px; }
.ptbl-unificada .js-edit-perfil-btn:hover {
  border-color: #5600BC !important;
  color: #5600BC !important;
  background: #f7f0ff !important;
}

/* =========================================================================
   Modal "Cadastrar/Editar Perfil" — UI/UX refeito
   ========================================================================= */
/* Modal de perfil usa o max-width padrão (1000px), igual aos demais */
.pm-dialog { max-width: 1000px !important; }

.pm-header {
  padding: 22px 26px 16px !important;
  border-bottom: 1px solid #ece9f7;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.pm-header h2 { margin: 4px 0 0 !important; font-size: 20px; font-weight: 800; letter-spacing: -.01em; color: #0a0a0a; }
.pm-eyebrow {
  font-size: 11px; font-weight: 800; letter-spacing: .22em;
  text-transform: uppercase; color: #5600BC;
  display: inline-block;
}

.pm-body { padding: 22px 26px 22px !important; }

.pm-section {
  background: #fafbfc;
  border: 1px solid #ece9f7;
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 12px;
}
.pm-section-title {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #444;
  margin: 0 0 10px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.pm-opt {
  font-weight: 600;
  font-size: 10.5px;
  color: #888;
  background: #fff;
  padding: 2px 8px;
  border-radius: 99px;
  border: 1px solid #ece9f7;
  text-transform: lowercase;
  letter-spacing: 0;
}

/* Grid de campos da seção 1 */
.pm-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 120px;
  gap: 10px;
}
.pm-grid .pm-field { display: flex; flex-direction: column; gap: 5px; }
.pm-grid .pm-field--small { max-width: 120px; }
.pm-grid label {
  font-size: 11.5px;
  font-weight: 700;
  color: #444;
  letter-spacing: .03em;
}
.pm-grid select {
  width: 100%;
  height: 40px;
  padding: 0 12px;
  border: 1.5px solid #d9d4ec;
  border-radius: 8px;
  background: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  color: #222;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.pm-grid select:focus {
  border-color: #5600BC;
  box-shadow: 0 0 0 3px rgba(86,0,188,.12);
}
@media (max-width: 580px) {
  .pm-grid { grid-template-columns: 1fr; }
  .pm-grid .pm-field--small { max-width: none; }
}

/* Linha inline (Idade e Período) — compacta, não estica */
.pm-inline {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.pm-inline-lbl {
  font-size: 12.5px;
  font-weight: 700;
  color: #444;
}
.pm-inline-sep {
  font-size: 12px;
  color: #888;
  font-weight: 700;
}
.pm-input-pill {
  width: 88px;
  height: 40px;
  padding: 0 12px;
  border: 1.5px solid #d9d4ec;
  border-radius: 8px;
  background: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  color: #0a0a0a;
  outline: none;
  text-align: center;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.pm-input-pill:focus {
  border-color: #5600BC;
  box-shadow: 0 0 0 3px rgba(86,0,188,.12);
}
.pm-input-pill.is-erro {
  border-color: #e23b3b !important;
  background: #fef2f2 !important;
  color: #991b1b !important;
}

/* Textarea de observações */
.pm-textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1.5px solid #d9d4ec;
  border-radius: 8px;
  background: #fff;
  font-family: inherit;
  font-size: 13.5px;
  color: #222;
  outline: none;
  resize: vertical;
  min-height: 70px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.pm-textarea:focus {
  border-color: #5600BC;
  box-shadow: 0 0 0 3px rgba(86,0,188,.12);
}

.pm-helper { font-size: 11.5px; color: #888; margin-top: 6px; display: block; }
.pm-erro { font-size: 12px; color: #991b1b; font-weight: 700; margin-top: 8px; display: block; }

/* Ações do modal */
.pm-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid #ece9f7;
}
.pm-actions .btn { padding: 11px 22px; }

/* Próximo campo obrigatório em vermelho — sobrepõe estilo do modal */
#modal-perfil-form .is-req-now,
#modal-perfil-form .is-req-now:focus {
  border-color: #e23b3b !important;
  background: #fef2f2 !important;
  color: #991b1b !important;
  box-shadow: 0 0 0 3px rgba(226,59,59,.15) !important;
  font-weight: 800 !important;
}


/* Remove qualquer destaque visual de coluna no hover */
.ptbl td.col-hover,
.ptbl th.col-hover {
  background: inherit !important;
  border-left-color: inherit !important;
  border-right-color: inherit !important;
  box-shadow: none !important;
}

/* =========================================================================
   Modal Perfil v2 — layout limpo e organizado
   ========================================================================= */
/* Cards de seção mais compactos e consistentes */
#modal-perfil-form .pm-section {
  background: #fff;
  border: 1.5px solid #ece9f7;
  border-radius: 12px;
  padding: 16px 18px;
  margin-bottom: 12px;
}
#modal-perfil-form .pm-section-title {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #444;
  margin: 0 0 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}
#modal-perfil-form .pm-opt {
  font-weight: 700;
  font-size: 10px;
  color: #666;
  background: #f5f3fa;
  padding: 2px 7px;
  border-radius: 99px;
  border: 1px solid #ece9f7;
  text-transform: none;
  letter-spacing: 0;
  margin-left: 4px;
}

/* Field padrão (rótulo em cima, input em baixo, full width) */
#modal-perfil-form .pm-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
#modal-perfil-form .pm-field:last-child { margin-bottom: 0; }
#modal-perfil-form .pm-field label {
  font-size: 11.5px;
  font-weight: 700;
  color: #444;
  letter-spacing: .04em;
}
#modal-perfil-form .pm-field select,
#modal-perfil-form .pm-field input[type="text"] {
  width: 100%;
  height: 42px;
  padding: 0 14px;
  border: 1.5px solid #d9d4ec;
  border-radius: 8px;
  background: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  color: #0a0a0a;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
#modal-perfil-form .pm-field select:focus,
#modal-perfil-form .pm-field input:focus {
  border-color: #5600BC;
  box-shadow: 0 0 0 3px rgba(86,0,188,.12);
}

/* Linha 2 colunas: Sexo (flex 1) + Quantidade (largura fixa) */
#modal-perfil-form .pm-row-2col {
  display: grid;
  grid-template-columns: 1fr 130px;
  gap: 14px;
}
#modal-perfil-form .pm-row-2col .pm-field { margin-bottom: 0; }
@media (max-width: 480px) {
  #modal-perfil-form .pm-row-2col { grid-template-columns: 1fr; gap: 12px; }
  #modal-perfil-form .pm-row-2col .pm-field { margin-bottom: 12px; }
}

/* Faixa etária: De [—] até [—] anos — campos compactos com label próprio */
#modal-perfil-form .pm-age-row,
#modal-perfil-form .pm-time-row {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}
#modal-perfil-form .pm-age-cell,
#modal-perfil-form .pm-time-cell {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
#modal-perfil-form .pm-age-cell label,
#modal-perfil-form .pm-time-cell label {
  font-size: 11.5px;
  font-weight: 700;
  color: #444;
  letter-spacing: .04em;
}
#modal-perfil-form .pm-age,
#modal-perfil-form .pm-time-cell select {
  width: 100px;
  height: 42px;
  padding: 0 12px;
  border: 1.5px solid #d9d4ec;
  border-radius: 8px;
  background: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  color: #0a0a0a;
  text-align: center;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
#modal-perfil-form .pm-time-cell select { width: 120px; text-align: left; padding: 0 14px; }
#modal-perfil-form .pm-age:focus,
#modal-perfil-form .pm-time-cell select:focus {
  border-color: #5600BC;
  box-shadow: 0 0 0 3px rgba(86,0,188,.12);
}
#modal-perfil-form .pm-sep {
  align-self: flex-end;
  margin-bottom: 11px;
  font-size: 12.5px;
  font-weight: 700;
  color: #666;
}
#modal-perfil-form .pm-suffix {
  align-self: flex-end;
  margin-bottom: 11px;
  font-size: 13px;
  font-weight: 700;
  color: #444;
}

#modal-perfil-form .pm-helper {
  display: block;
  margin-top: 10px;
  font-size: 11.5px;
  color: #888;
}
#modal-perfil-form .pm-erro {
  display: block;
  margin-top: 10px;
  font-size: 12px;
  color: #991b1b;
  font-weight: 700;
}
#modal-perfil-form .pm-textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1.5px solid #d9d4ec;
  border-radius: 8px;
  background: #fff;
  font-family: inherit;
  font-size: 13.5px;
  color: #222;
  outline: none;
  resize: vertical;
  min-height: 72px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
#modal-perfil-form .pm-textarea:focus {
  border-color: #5600BC;
  box-shadow: 0 0 0 3px rgba(86,0,188,.12);
}

/* Ações finais */
#modal-perfil-form .pm-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid #ece9f7;
}
#modal-perfil-form .pm-actions .btn { padding: 12px 22px; font-size: 13px; }

/* Próximo campo obrigatório em vermelho — reforça para todos os tipos de input */
#modal-perfil-form .is-req-now,
#modal-perfil-form .is-req-now:focus {
  border-color: #e23b3b !important;
  background: #fef2f2 !important;
  color: #991b1b !important;
  box-shadow: 0 0 0 3px rgba(226,59,59,.15) !important;
  font-weight: 800 !important;
}



#modal-perfil-form .modal-dialog{
    max-width: 500px !important;
    width: 100% !important;
}


/* =========================================================================
   Sticky .pm-actions no modal de perfil
   ========================================================================= */
#modal-perfil-form .modal-body { max-height: 80vh; overflow-y: auto; padding-bottom: 0 !important; }
#modal-perfil-form .pm-actions {
  position: sticky;
  bottom: 0;
  background: #fff;
  margin: 18px -26px 0;
  padding: 14px 26px;
  border-top: 1px solid #ece9f7;
  z-index: 5;
  box-shadow: 0 -8px 20px rgba(0,0,0,.04);
}
@media (max-width:600px){
  #modal-perfil-form .pm-actions { margin: 14px -22px 0; padding: 12px 22px; }
}

/* =========================================================================
   Etapa 3/4 Confirmação — UI/UX repaginada
   ========================================================================= */
.cs-intro { margin-bottom: 18px; }
.cs-intro .cs-eyebrow {
  font-size: 11px; font-weight: 800; letter-spacing: .22em;
  text-transform: uppercase; color: #5600BC;
}
.cs-intro .cs-h {
  font-size: 24px; font-weight: 800; letter-spacing: -.015em;
  margin: 6px 0 6px; color: #0a0a0a; line-height: 1.15;
}
.cs-intro .cs-sub {
  font-size: 14px; color: #6b6b73; margin: 0; line-height: 1.55;
}

.confirm-summary { display: flex; flex-direction: column; gap: 14px; }

.cs-card {
  background: #fff;
  border: 1.5px solid #ece9f7;
  border-radius: 14px;
  padding: 20px 22px;
}
.cs-card-h {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid #f3f1f9;
}
.cs-card-h h4 {
  margin: 0; font-size: 14px; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase; color: #0a0a0a;
}
.cs-ico {
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  background: #f5f3fa; border-radius: 8px; font-size: 16px;
}
.cs-card-tot {
  margin-left: auto;
  background: #ede9fe; color: #5b21b6;
  padding: 4px 12px; border-radius: 99px;
  font-size: 11.5px; font-weight: 800;
  letter-spacing: .04em;
}

/* Grid de "cells" (chave : valor) */
.cs-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.cs-cell { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cs-cell--full { grid-column: 1 / -1; }
.cs-cell-l {
  font-size: 11px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: #888;
}
.cs-cell-v {
  font-size: 15px; font-weight: 700; color: #0a0a0a; line-height: 1.4;
  word-break: break-word;
}
@media (max-width: 600px) {
  .cs-grid { grid-template-columns: 1fr; gap: 10px; }
}

/* Descrição (HTML) */
.cs-sobre {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px dashed #ece9f7;
  display: flex; flex-direction: column; gap: 8px;
}
.cs-richtext {
  font-size: 14px; line-height: 1.6; color: #333;
  background: #fafbfc; padding: 12px 14px; border-radius: 8px;
}
.cs-richtext p { margin: 0 0 8px; } .cs-richtext p:last-child { margin: 0; }
.cs-richtext ul, .cs-richtext ol { margin: 0 0 8px 20px; }

/* Totais grandes (modelos / staff) */
.cs-tot-row {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  margin-bottom: 16px;
}
.cs-tot-box {
  background: #fafbfc; border: 1px solid #ece9f7; border-radius: 10px;
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 2px;
}
.cs-tot-n {
  font-size: 26px; font-weight: 900; color: #5600BC;
  letter-spacing: -.02em; line-height: 1;
}
.cs-tot-l {
  font-size: 11px; font-weight: 700; color: #666;
  text-transform: uppercase; letter-spacing: .08em; margin-top: 2px;
}

/* Lista de perfis */
.cs-perfis { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.cs-perfil {
  display: grid;
  grid-template-columns: 130px 50px 1fr;
  align-items: center; gap: 10px;
  padding: 10px 14px;
  background: #fafbfc;
  border-radius: 8px;
  border: 1px solid #f3f1f9;
}
.cs-perfil-tipo {
  font-size: 11px; font-weight: 800; letter-spacing: .04em;
  text-transform: uppercase;
  padding: 5px 10px; border-radius: 99px;
  background: #fff; border: 1px solid #ece9f7;
  color: #0a0a0a;
  text-align: center;
}
.cs-perfil-tipo--modelo { background: #ede9fe; color: #5b21b6; border-color: #ddd6fe; }
.cs-perfil-tipo--staff  { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.cs-perfil-qtd {
  font-size: 16px; font-weight: 900; color: #0a0a0a;
  text-align: center;
}
.cs-perfil-det {
  font-size: 13.5px; color: #444; font-weight: 600;
}
@media (max-width: 600px) {
  .cs-perfil { grid-template-columns: 1fr; gap: 6px; }
  .cs-perfil-tipo { justify-self: start; }
  .cs-perfil-qtd { text-align: left; }
}

.cs-empty { color: #888; font-size: 13.5px; padding: 14px 0; text-align: center; }

/* Termos & condições — checkbox */
.cs-termos {
  display: flex; align-items: flex-start; gap: 10px;
  background: #f5f3fa;
  border: 1.5px solid #ece9f7;
  border-radius: 10px;
  padding: 14px 16px;
  margin: 18px 0 14px;
  font-size: 13.5px; color: #333; line-height: 1.5;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.cs-termos:hover { border-color: #d9d4ec; }
.cs-termos input[type="checkbox"] {
  margin-top: 2px;
  width: 18px; height: 18px;
  accent-color: #5600BC;
  flex-shrink: 0;
  cursor: pointer;
}
.cs-termos a { color: #5600BC; font-weight: 800; text-decoration: underline; }
.cs-termos--erro {
  background: #fee2e2 !important; border-color: #fecaca !important; color: #991b1b;
  animation: csTermosShake .35s ease-in-out;
}
@keyframes csTermosShake {
  0%,100% { transform: translateX(0); }
  20%     { transform: translateX(-6px); }
  60%     { transform: translateX(6px); }
  80%     { transform: translateX(-3px); }
}

/* =========================================================
   CADEVENTO — overrides senior UX (cards + form rows)
   Carregado no stylesheet principal pra garantir cascata
   ========================================================= */
form#form-evento .form-section.fs-card {
  background: #fff !important;
  border: 1px solid #ece9f7 !important;
  border-radius: 16px !important;
  padding: 20px 22px !important;
  margin: 0 0 14px !important;
  box-shadow: 0 1px 2px rgba(20, 0, 60, .04) !important;
}
form#form-evento .fs-h {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 0 16px !important;
  padding: 0 0 12px !important;
  border-bottom: 1px dashed #ece9f7 !important;
}
form#form-evento .fs-h > div { flex: 1 1 auto; min-width: 0; }
form#form-evento .fs-h-ico {
  flex: 0 0 36px !important;
  width: 36px !important; height: 36px !important;
  border-radius: 10px !important;
  background: #ede9fe !important;
  color: #7C00F5 !important;
  display: inline-flex !important;
  align-items: center !important; justify-content: center !important;
}
form#form-evento .fs-h-ico svg { display: block; }
form#form-evento .fs-h-title {
  margin: 0 !important; padding: 0 !important;
  font-size: 15px !important; font-weight: 800 !important;
  letter-spacing: -.01em !important; color: #0a0a0a !important;
  line-height: 1.2 !important; text-transform: none !important;
}
form#form-evento .fs-h-sub {
  margin: 3px 0 0 !important; font-size: 12.5px !important;
  color: #6b6b73 !important; line-height: 1.4 !important;
}
form#form-evento .form-section.fs-card .form-row,
form#form-evento .form-section.fs-card .form-row.form-row-stack {
  display: block !important;
  padding: 0 !important;
  margin: 0 0 14px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  grid-template-columns: 1fr !important;
}
form#form-evento .form-section.fs-card .form-row:last-child { margin-bottom: 0 !important; }
form#form-evento .form-section.fs-card .form-row > label,
form#form-evento .form-section.fs-card .form-row.form-row-stack > label {
  display: block !important;
  font-size: 11px !important; font-weight: 800 !important;
  letter-spacing: .05em !important; text-transform: uppercase !important;
  color: #6b6b73 !important;
  padding: 0 !important; margin: 0 0 6px !important;
  text-align: left !important;
}
form#form-evento .form-section.fs-card input[type="text"],
form#form-evento .form-section.fs-card input[type="email"],
form#form-evento .form-section.fs-card input[type="url"],
form#form-evento .form-section.fs-card select,
form#form-evento .form-section.fs-card textarea {
  width: 100% !important;
  min-height: 46px !important;
  height: auto !important;
  padding: 12px 14px !important;
  line-height: 1.3 !important;
  border: 1.5px solid #e2dff0 !important;
  border-radius: 10px !important;
  font-family: inherit !important; font-size: 14.5px !important;
  color: #222 !important; background: #fff !important;
  outline: none !important;
  box-shadow: none !important;
  transition: border-color .15s ease, box-shadow .15s ease !important;
  box-sizing: border-box !important;
  vertical-align: middle !important;
}
form#form-evento .form-section.fs-card select {
  padding-right: 36px !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%236b6b73' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-color: #fff !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}
form#form-evento .form-section.fs-card textarea {
  min-height: 90px !important;
  resize: vertical !important;
}
form#form-evento .form-section.fs-card input:focus,
form#form-evento .form-section.fs-card select:focus,
form#form-evento .form-section.fs-card textarea:focus {
  border-color: #7C00F5 !important;
  box-shadow: 0 0 0 3px rgba(124, 0, 245, .1) !important;
}
@media (max-width: 600px) {
  form#form-evento .form-section.fs-card { padding: 16px 16px !important; }
  form#form-evento .form-section.fs-card .form-row { margin-bottom: 12px !important; }
}

/* ============================================================
   ELENCO — validação inline (campos com erro)
   ============================================================ */
.elenco-form .is-err,
.elenco-form input.is-err,
.elenco-form select.is-err,
.elenco-form textarea.is-err {
  border-color: #e23b3b !important;
  background: #fff5f5 !important;
  box-shadow: 0 0 0 3px rgba(226, 59, 59, .08) !important;
}
.elenco-form .elenco-err {
  display: block;
  color: #c81e1e;
  font-size: 12px;
  font-weight: 600;
  margin: 4px 0 0;
  line-height: 1.35;
}
.elenco-form .elenco-err-banner {
  background: #fee2e2;
  color: #991b1b;
  border: 1px solid #fca5a5;
  border-radius: 10px;
  padding: 11px 14px;
  font-size: 13px;
  font-weight: 700;
  margin: 0 0 14px;
}

/* ============================================================
   eventos_admin — meta items (criado por / contratado por)
   ============================================================ */
.cklist-meta-item{display:inline-flex;align-items:center;gap:5px;color:#6b6b73;font-size:12.5px;margin-right:14px}
.cklist-meta-item svg{flex-shrink:0;color:#7C00F5}
.cklist-meta-item em{font-style:normal;color:#888;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;margin-right:2px}
.cklist-meta-item strong{color:#222;font-weight:700}

.cklist-contratada-tag{
  display:inline-flex;align-items:center;gap:6px;
  background:#dcfce7;border:1px solid #86efac;color:#166534;
  padding:5px 10px;border-radius:99px;margin-top:6px;
  font-size:12px;font-weight:700;
}
.cklist-contratada-tag em{font-style:normal;color:#15803d;font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.cklist-contratada-tag strong{color:#14532d;font-weight:800}
.cklist-contratada-tag .cklist-contratada-val{margin-left:6px;padding-left:8px;border-left:1px solid #86efac;color:#14532d;font-weight:800}
.cklist-contratada-tag svg{flex-shrink:0;color:#16a34a}