.barber-form { max-width:800px; margin: 1rem auto; padding: 1rem; border: 1px solid #eee; border-radius: 12px; }
.barber-grid { display: grid; grid-template-columns:  1fr; gap: 12px; }
.barber-grid label { display:flex; flex-direction:column; gap:6px; font-weight:600; }
.barber-grid label span { font-weight:600; }
.barber-grid label.full { grid-column: 1 / -1; }
.barber-grid input, .barber-grid select, .barber-grid textarea { padding:.65rem .75rem; border:1px solid #ddd; border-radius:10px; font-weight:400; }
.barber-actions { display:flex; align-items:center; gap:12px; margin-top:12px; }

.barber-msg { font-size:.95rem; }
@media (max-width:640px){ .barber-grid{ grid-template-columns: 1fr; } }

.bb-slots{margin-top:8px}
.bb-slots-list{display:flex;flex-wrap:wrap;gap:8px}
.bb-slot-btn{padding:.45rem .65rem;border:1px solid #ddd;border-radius:8px;background:#fff;cursor:pointer}
.bb-slot-btn.active{outline:2px solid #111}
.bb-slots-empty{font-size:.95rem;color:#666}


/* Serviços como cards (multi-seleção) */
.bb-services-grid{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.25rem }
.bb-service-card{ border:1px solid #ddd; background:#fff; border-radius:.6rem; padding:.6rem .8rem; cursor:pointer; position:relative; }
.bb-service-card .bb-service-check{ display:none; position:absolute; top:.3rem; right:.4rem; font-weight:700; }
.bb-service-card.active{ border-color:#111; box-shadow:0 0 0 2px rgba(0,0,0,.05) inset; }
.bb-service-card.active .bb-service-check{ display:inline; }
.bb-help{ color:#666; font-size:.85rem; }


/* --- Added: show duration and price under service name --- */
.bb-service-meta {
  display: block;
  font-weight: 400;
  font-size: .85rem;
  color: #555;
  margin-top: .15rem;
}
.bb-service-duration::after {
  content: " \2022 ";
  margin: 0 .25rem;
}
.bb-service-price {
  white-space: nowrap;
}


/* --- Added: services as lines with thumbnail --- */
.bb-service-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  text-align: left;
  padding: .5rem .75rem;
  margin-bottom: .5rem;
}
.bb-service-thumb {
  flex: 0 0 auto;
  margin-right: .75rem;
}
.bb-service-thumb img {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 6px;
}
.bb-service-info {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}


/* --- Added: list layout with thumbnails --- */
.bb-services-list {
  display: block;
}
.bb-service-row {
  display: flex;
  align-items: center;
  width: 100%;
  text-align: left;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 8px; /* one per line */
  background: #fff;
  cursor: pointer;
  transition: box-shadow .15s ease, border-color .15s ease;
}
.bb-service-row.is-selected,
.bb-service-row[aria-pressed="true"] {
  border-color: #111;
  box-shadow: 0 0 0 3px rgba(17,17,17,.05);
}
.bb-service-thumb {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  object-fit: cover;
  flex: 0 0 auto;
  margin-right: 12px;
  background: #f2f2f2;
}
.bb-service-thumb--placeholder {
  display: inline-block;
  width: 48px;
  height: 48px;
  border-radius: 8px;
  background: #f6f6f6;
}
.bb-service-texts {
  flex: 1 1 auto;
  min-width: 0;
}
.bb-service-name {
  display: block;
  font-weight: 600;
}
.bb-service-meta {
  display: block;
  font-weight: 400;
  font-size: .85rem;
  color: #555;
  margin-top: .15rem;
}
.bb-service-duration::after {
  content: " \2022 ";
  margin: 0 .25rem;
}
.bb-service-price { white-space: nowrap; }
.bb-service-check {
  margin-left: 12px;
}


/* Active state for service rows */
.bb-service-row.active{
  border-color:#111;
  box-shadow:0 0 0 2px rgba(0,0,0,.05) inset;
}
.bb-service-row.active .bb-service-check{ display:inline; }


/* --- Fix: ensure checkmark only shows when selected --- */
.barber-form .bb-service-row .bb-service-check,
.barber-form .bb-service-card .bb-service-check{
  display: none !important;
}
.barber-form .bb-service-row.active .bb-service-check,
.barber-form .bb-service-card.active .bb-service-check{
  display: inline-block !important;
}


/* ===== Select2 barber avatar ===== */
.select2-container .bb-barber-option-row {
  display: flex; align-items: center; gap: 8px;
}
.bb-barber-option-avatar {
  width: 24px; height: 24px; border-radius: 50%; object-fit: cover; background:#f1f1f1;
}
.bb-barber-option-avatar--placeholder { display:inline-block; }
.select2-selection__rendered .bb-barber-option-row {
  display:flex; align-items:center; gap:8px;
}
/* Ensure height comfy */
.select2-container--default .select2-selection--single {
  height: 42px; padding: 6px 8px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 28px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 42px;
}


/* ==== Select2 barber: fix overlapping & alignment ==== */
.select2-container { width: 100% !important; }
.select2-container--default .select2-selection--single {
  height: 44px; min-height: 44px; padding: 0 8px;
  display: flex; align-items: center;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  display: flex; align-items: center; gap: 8px;
  padding-left: 0; padding-right: 24px; /* leave room for arrow */
  line-height: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100%; right: 6px;
}
/* item rows in dropdown */
.select2-results__option .bb-barber-option-row { display:flex; align-items:center; gap:8px; }
.select2-results__option .bb-barber-option-avatar { width:24px; height:24px; border-radius:50%; object-fit:cover; background:#f1f1f1; }
.select2-results__option .bb-barber-option-avatar--placeholder { display:inline-block; width:24px; height:24px; border-radius:50%; background:#f4f4f4; }
.select2-results__option .bb-barber-option-name { flex: 1 1 auto; min-width: 0; }


/* Ensure Select2 is fully clickable and above other layers */
.select2-container .select2-selection { pointer-events: auto !important; }
.select2-container--open { z-index: 99999 !important; }
.select2-dropdown { z-index: 99999 !important; }


/* ===== Barber radio list with avatar ===== */
.bb-barbers-list{ display:flex; flex-wrap:wrap; gap:8px; }
.bb-barber-option{
  display:flex; align-items:center; gap:10px;
  border:1px solid #e5e5e5; border-radius:12px;
  background:#fff; padding:8px 12px; cursor:pointer;
  transition: box-shadow .15s ease, border-color .15s ease;
}
.bb-barber-option.active{ border-color:#111; box-shadow:0 0 0 2px rgba(0,0,0,.05) inset; }
.bb-barber-avatar{ width:28px; height:28px; border-radius:50%; object-fit:cover; background:#f2f2f2; }
.bb-barber-avatar--placeholder{ display:inline-block; width:28px; height:28px; border-radius:50%; background:#f2f2f2; }
.bb-barber-name{ font-weight:600; }
.bb-barber-check{ margin-left:6px; }
.bb-barber-option.active .bb-barber-check{ }

/* Click reliability for barber list */
.bb-barbers-list, .bb-barber-option { pointer-events: auto !important; position: relative; z-index: 1; }


/* ===== Barber native radio list ===== */
.bb-barbers-radio{ list-style:none; margin:0; padding:0; display:block; }
.bb-barbers-radio li{ margin: 0 0 8px 0; }
.bb-barber-radio{
  display:flex; align-items:center; gap:10px;
  border:1px solid #e5e5e5; border-radius:12px;
  background:#fff; padding:8px 12px; cursor:pointer;
  transition: box-shadow .15s ease, border-color .15s ease;
}
.bb-barber-radio input[type="radio"]{
  /* Visually hidden but accessible */
  position:absolute; opacity:0; width:1px; height:1px; margin:-1px; clip:rect(0 0 0 0); clip-path: inset(50%);
}
.bb-barber-radio .bb-barber-check{ margin-left:6px; }
.bb-barber-radio .bb-barber-avatar{ width:28px; height:28px; border-radius:50%; object-fit:cover; background:#f2f2f2; }
.bb-barber-avatar--placeholder{ display:inline-block; width:28px; height:28px; border-radius:50%; background:#f2f2f2; }

/* Selected state via :checked */
.bb-barber-radio input[type="radio"]:checked ~ .bb-barber-name,
.bb-barber-radio input[type="radio"]:checked ~ .bb-barber-avatar{ filter:none; }
.bb-barber-radio input[type="radio"]:checked ~ .bb-barber-check{ opacity:1; }

/* Outline for selected container */
.bb-barber-radio input[type="radio"]:checked ~ .bb-barber-name:before{ content:''; }
.bb-barber-radio input[type="radio"]:checked + .bb-barber-avatar,
.bb-barber-radio input[type="radio"]:checked ~ .bb-barber-name,
.bb-barber-radio input[type="radio"]:checked ~ .bb-barber-check{ }
.bb-barbers-radio li:has(input[type="radio"]:checked) .bb-barber-radio{
  border-color:#111; box-shadow:0 0 0 2px rgba(0,0,0,.05) inset;
}

/* Fallback if :has() not supported: use focus-visible + active feel */
.bb-barber-radio:focus-within{ outline: 2px solid rgba(0,0,0,.08); outline-offset: 2px; }


/* ===== Barber combobox (compact like select) ===== */
.bb-barber-combobox{ position: relative; }
.bb-barber-combo-toggle{
  width: 100%; display:flex; align-items:center; gap:8px;
  border:1px solid #e5e5e5; border-radius:12px; background:#fff;
  padding:8px 12px; height:44px; line-height:28px; text-align:left; cursor:pointer;
}
.bb-barber-combo-avatar{ width:24px; height:24px; border-radius:50%; object-fit:cover; background:#f1f1f1; }
.bb-barber-combo-avatar--placeholder{ display:inline-block; width:24px; height:24px; border-radius:50%; background:#f4f4f4; }
.bb-barber-combo-text{ flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.bb-barber-combo-arrow{ margin-left:auto; }
.bb-barber-combo-list{
  position:absolute; left:0; right:0; top:calc(100% + 6px);
  border:1px solid #e5e5e5; border-radius:12px; background:#fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.06); max-height:260px; overflow:auto; padding:6px; display:none;
  z-index: 9999;
}
.bb-barber-combobox.is-open .bb-barber-combo-list{ display:block; }
.bb-barber-combo-item{
  width:100%; display:flex; align-items:center; gap:10px;
  padding:8px 10px; border-radius:10px; cursor:pointer; background:transparent; border:0;
}
.bb-barber-combo-item:hover, .bb-barber-combo-item:focus{ background:#f7f7f7; }
.bb-barber-combo-name{ font-weight:500; }


/* ===== Barber radio grid (side-by-side cards) ===== */
.bb-barbers-radio{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:12px; }
.bb-barbers-radio li{ margin:0; }
.bb-barber-radio{
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px;
  border:1px solid #e5e5e5; border-radius:12px; background:#fff; padding:12px;
  cursor:pointer; transition: box-shadow .15s ease, border-color .15s ease; min-height: 96px;
}
.bb-barber-radio.active{ border-color:#111; box-shadow:0 0 0 2px rgba(0,0,0,.05) inset; }
.bb-barber-radio input[type="radio"]{ position:absolute; opacity:0; width:1px; height:1px; margin:-1px; clip:rect(0 0 0 0); clip-path: inset(50%); }
.bb-barber-avatar{ width:40px; height:40px; border-radius:50%; object-fit:cover; background:#f2f2f2; }
.bb-barber-avatar--placeholder{ display:inline-block; width:40px; height:40px; border-radius:50%; background:#f2f2f2; }
.bb-barber-name{ font-weight:600; }
.bb-barber-check{ display:none; }
.bb-barber-radio.active .bb-barber-check{ display:inline-block; }

/* === Cabeçalho do agendamento === */
.bb-shop-header{display:flex;align-items:center;gap:16px;margin:0 0 16px;padding:12px;border:1px solid #e5e7eb;border-radius:12px;background:#fafafa}
.bb-shop-logo{width:72px;height:72px;object-fit:contain;border-radius:8px}
.bb-shop-meta{display:flex;flex-direction:column}
.bb-shop-name{margin:0;font-size:1.25rem;line-height:1.4}
.bb-shop-address{margin:4px 0 0;color:#555}

/* Ajustar largura do cabeçalho da barbearia para alinhar com o formulário */
.bb-shop-header {
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

/* ==== Barber cards: equal height grid ==== */
.bb-barbers-radio {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
}
.bb-barbers-radio li { margin: 0; }
.bb-barber-radio {
  min-height: 120px;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 16px 12px;
}
.bb-barber-radio .bb-barber-name { display:block; text-wrap: balance; }

.bb-help-text{display:block;margin:-4px 0 8px;color:#666;font-size:.925rem;}

/* === Fix barber card checkmark positioning === */
.bb-barber-radio { position: relative; }
.bb-barber-radio input[type="radio"]:checked + .bb-barber-name::after {
  content: "✔";
  position: absolute;
  top: 8px;
  right: 10px;
  font-size: 16px;
  color: #000;
}
/* Hide inline check mark if plugin injects into text */
.bb-barber-radio input[type="radio"]:checked + .bb-barber-name {
  display: inline-block;
}

/* === Ensure checkmark doesn't change card height === */
.bb-barber-radio { position: relative; }
.bb-barber-radio .bb-barber-check {
  position: absolute;
  top: 8px;
  right: 10px;
  font-size: 16px;
  line-height: 1;
  opacity: 0;
  transition: opacity .15s ease;
}
.bb-barber-radio input[type="radio"]:checked ~ .bb-barber-check { opacity: 1; }

/* Toggle switch for barber active/inactive */
.switch { position: relative; display:inline-block; width:36px; height:20px; margin-left:8px; }
.switch input { opacity:0; width:0; height:0; }
.slider { position:absolute; cursor:pointer; top:0; left:0; right:0; bottom:0; background:#ccc; transition:.4s; border-radius:20px; }
.slider:before { position:absolute; content:''; height:14px; width:14px; left:3px; bottom:3px; background:white; transition:.4s; border-radius:50%; }
input:checked + .slider { background:#4CAF50; }
input:checked + .slider:before { transform: translateX(16px); }


/* === Overrides: Public Shortcode Header ([barber_agendamento]) === */
.bb-shop-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 12px;
  padding: 20px;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  background: #fafafa;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
.bb-shop-header .bb-shop-logo {
  width: 120px;
  height: 120px;
  border-radius: 9999px; /* fully round */
  object-fit: cover;     /* fill circle nicely */
  display: block;
}
.bb-shop-header .bb-shop-name {
  margin: 0;
  font-size: 1.5rem;     /* larger than address */
  line-height: 1.3;
  font-weight: 700;
}
.bb-shop-header .bb-shop-address {
  margin: 4px 0 0;
  font-size: 1rem;
  color: #555;
}

/* Small screens: keep the same; Larger screens can bump sizes slightly */
@media (min-width: 768px) {
  .bb-shop-header .bb-shop-logo { width: 140px; height: 140px; }
  .bb-shop-header .bb-shop-name { font-size: 1.75rem; }
}


/* === Overrides Update: Remove background and border from Header === */
.bb-shop-header {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}




/* Resumo do agendamento - estilo clean */
.bb-summary {
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 12px 14px;
  background: #fafafa;
  margin: 12px 0 16px;
  font-size: 0.9rem;
  color: #333;
}

.bb-summary-title {
  margin: 0 0 8px;
  font-size: 0.95rem;
  font-weight: 500;
  color: #444;
}

.bb-summary-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 12px;
}

.bb-summary-list li {
  display: flex;
  gap: 4px;
  align-items: baseline;
  min-height: 20px;
  line-height: 1.3;
}

.bb-summary-list li strong {
  font-weight: 500;
  color: #555;
}

@media (max-width:640px){
  .bb-summary-list { grid-template-columns: 1fr; }
}


/* Botão Agendar - destaque */
.barber-actions { display:flex; align-items:center; justify-content:flex-start; gap:12px; margin-top:12px; }
.barber-submit {
  background:#4f46e5; /* indigo */
  color:#fff;
  padding:.85rem 1.25rem;
  border:none;
  border-radius:10px;
  cursor:pointer;
  font-weight:600;
  transition:transform .05s ease, box-shadow .2s ease, background-color .2s ease;
  box-shadow: 0 6px 16px rgba(79,70,229,.25);
}
.barber-submit:hover { background:#4338ca; box-shadow:0 8px 20px rgba(79,70,229,.35); transform:translateY(-1px); }
.barber-submit:active { transform:translateY(0); box-shadow:0 4px 12px rgba(79,70,229,.25); }
.barber-submit:focus { outline: 2px solid #a5b4fc; outline-offset:2px; }

@media (max-width:640px){
  .barber-submit { width:100%; text-align:center; }
}

/* Caso algum tema injete um segundo checkbox logo após a label, escondemos para evitar duplicidade */


/* Corrige possíveis quebras de linha antes do consent */
.barber-form 


/* aumentado */
  margin: 0;
  accent-color: #4f46e5;
  flex:0 0 auto;

  appearance: auto !important;
  -webkit-appearance: checkbox !important;
  -moz-appearance: checkbox !important;

  border: 1px solid #cfd4dc;
  border-radius: 4px;
  background: #fff;
}



/* Garantir visibilidade do checkbox de consentimento */



/* Força exibição do checkbox LGPD mesmo se o tema sobrescrever */




/* LGPD consent alinhado: checkbox antes do texto, centralizado verticalmente */
label.consent{
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:10px;
  font-size:0.9rem;
  color:#444;
  margin:10px 0 8px;
  line-height:1.4;
  cursor:pointer;
}
label.consent input[type="checkbox"]{
  flex:0 0 auto;
  width:20px; height:20px;
  margin:0;
  accent-color:#4f46e5;
  appearance:auto !important;
  -webkit-appearance:checkbox !important;
  -moz-appearance:checkbox !important;
}
label.consent span{
  flex:1;
  display:inline-block;
  line-height:1.4;
}


/* LGPD: checkbox + texto na mesma linha, alinhado à esquerda */
label.consent{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  text-align:left !important;
  flex-wrap:nowrap !important;
  width:100%;
  margin: 10px 0 8px;
}
label.consent input[type="checkbox"]{
  flex:0 0 auto;
}
label.consent span{
  display:inline-block;
  white-space:normal;   /* pode quebrar em 2 linhas, mas ao lado do checkbox */
  line-height:1.4;
}


@media (max-width:640px){
  /* removed .barber-actions-row { */ flex-direction:column; align-items:stretch; }
  .barber-actions-row .barber-submit{ width:100%; }
}


/* LGPD consent linha compacta */
label.consent.compact{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:0.88rem;
  color:#555;
  margin:10px 0 6px;
  line-height:1.3;
}
label.consent.compact input[type="checkbox"]{
  width:18px; height:18px;
  margin:0;
  accent-color:#4f46e5;
  flex:0 0 auto;
}
@media (max-width:640px){
  label.consent.compact{ flex-wrap:wrap; }
}

/* Consent compact line */
label.consent{
  display:flex; align-items:center; gap:8px;
  font-size:.9rem; color:#555;
  margin:6px 2px 6px;
  line-height:1.3;
}
label.consent input[type="checkbox"]{
  width:18px; height:18px; margin:0; flex:0 0 auto;
  accent-color:#4f46e5;
  appearance:auto; -webkit-appearance:checkbox; -moz-appearance:checkbox;
}
label.consent span{ white-space:normal; }
@media (max-width:640px){
  label.consent{ align-items:flex-start; }
}


/* Botão Agendar maior e alinhado à direita */
.barber-actions {
  display: flex;
  justify-content: flex-end; /* joga o botão pro canto direito */
  margin-top: 12px;
}

.barber-submit {
  font-size: 1rem;
  padding: 1rem 1.75rem;
  border-radius: 12px;
}

/* Remove borda cinza do formulário */
.barber-form {
  border: none !important;
  box-shadow: none !important;
}

/* Force form width */
.barber-form {
  max-width: 1000px !important;
}


/* Padronização de fontes do formulário */
/* Nome do serviço em destaque */
.bb-service-name {
  font-size: 1.05rem;
  font-weight: 600;
  color: #222;
}

/* Duração e preço do serviço */
.bb-service-duration,
.bb-service-price {
  font-size: 0.9rem;
  color: #555;
}

/* Labels do formulário */
.barber-form label {
  font-size: 0.95rem;
  font-weight: 500;
  color: #333;
}


/* Padronização geral de fontes */
/* Texto base maior */
.barber-form {
  font-size: 1rem;
  color: #222;
}

/* Labels */
.barber-form label {
  font-size: 1rem;
  font-weight: 500;
}

/* Inputs e textarea */
.barber-form input,
.barber-form textarea,
.barber-form select {
  font-size: 1rem;
}

/* Nome do serviço */
.bb-service-name {
  font-size: 1.15rem;
  font-weight: 600;
}

/* Duração e preço */
.bb-service-duration,
.bb-service-price {
  font-size: 1rem;
  color: #555;
}

/* Resumo do agendamento */
.barber-summary {
  font-size: 1rem;
}
.barber-summary strong {
  font-weight: 600;
}


/* Ajuste de padronização de fontes */
/* Nome do serviço mantém destaque */
.bb-service-name {
  font-size: 1.15rem;
  font-weight: 600;
  color: #222;
}

/* Duração e preço mais suaves */
.bb-service-duration,
.bb-service-price {
  font-size: 1rem;
  font-weight: 400;
  color: #555;
}

/* Labels, inputs e resumo iguais ao nome do serviço (sem bold forte) */
.barber-form label,
.barber-form input,
.barber-form textarea,
.barber-form select,
.barber-summary {
  font-size: 1.15rem;
  font-weight: 400;
  color: #222;
}

/* Botão Agendar acompanha */
.barber-submit {
  font-size: 1.15rem;
  font-weight: 500;
}


/* Ajuste peso do nome do serviço para mais leve */
.bb-service-name {
  font-size: 1.15rem;
  font-weight: 500; /* menos grosso que 600 */
  color: #222;
}


/* Nome do serviço mais leve (peso normal) */
.bb-service-name {
  font-size: 1.15rem;
  font-weight: 400; /* peso normal */
  color: #222;
}