/* =========================================================================
   product-booking.css — skin "Data do mergulho" do prototipo aprovado
   (checkout-batismo.html, secao 2) sobre o formulario do WooCommerce
   Bookings na pagina do produto Batismo. A UI nativa (calendario-mes +
   inputs numericos) e escondida; as pilulas/steppers injetados (.atl-bk)
   dirigem o Bookings por proxy. Escopo: .atl-bk.
   ========================================================================= */
.atl-bk {
  --blue: #0066ff;
  --blue-dark: #002b5c;
  --blue-deep: #001932;
  --blue-soft: #eaf6ff;
  --green-dark: #159a51;
  --text: #0b1f33;
  --muted: #5d7085;
  --line: #dcecf8;
  --radius-sm: 10px;
  --font-sans: 'Inter', -apple-system, Arial, sans-serif;
  font-family: var(--font-sans);
  color: var(--text);
  margin: 6px 0 18px;
}

/* esconder a UI nativa do Bookings (calendario + inputs de pessoas) */
.atl-bk-native-hidden { display: none !important; }

/* urgencia */
.atl-bk .atl-urgency {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 14px;
  font-size: 13px;
  font-weight: 500;
  color: var(--blue-dark);
  background: #fff4ed;
  border: 1px solid #ffd9c4;
  border-radius: var(--radius-sm);
  padding: 9px 13px;
}
.atl-bk .atl-urgency b { font-weight: 700; color: #d9531e; }
.atl-bk .atl-pulse {
  width: 9px; height: 9px; border-radius: 50%; background: #ff7a45; flex: none;
  box-shadow: 0 0 0 0 rgba(255,122,69,.6); animation: atlPulse 1.9s infinite;
}
@keyframes atlPulse {
  0% { box-shadow: 0 0 0 0 rgba(255,122,69,.55); }
  70% { box-shadow: 0 0 0 7px rgba(255,122,69,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,122,69,0); }
}

/* pilulas de data */
.atl-bk .atl-dates { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.atl-bk .atl-pill {
  position: relative;
  border: 1.5px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 11px 8px 12px;
  text-align: center;
  cursor: pointer;
  background: #fff;
  transition: border-color .15s, background .15s;
  user-select: none;
}
.atl-bk .atl-pill .dow { font-size: 11px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .4px; }
.atl-bk .atl-pill .dnum { font-size: 20px; font-weight: 800; color: var(--blue-deep); line-height: 1.1; margin-top: 1px; }
.atl-bk .atl-pill .mon { font-size: 11px; font-weight: 600; color: var(--muted); }
.atl-bk .atl-pill:hover { border-color: var(--blue); }
.atl-bk .atl-pill.sel { border-color: var(--blue); background: var(--blue-soft); box-shadow: 0 0 0 3px rgba(0,102,255,.10); }
.atl-bk .atl-pill .tag {
  position: absolute; top: -9px; left: 50%; transform: translateX(-50%);
  white-space: nowrap; color: #fff; font-size: 9.5px; font-weight: 700;
  padding: 2px 7px; border-radius: 999px; letter-spacing: .2px;
}
.atl-bk .atl-pill.few .tag { background: #ff7a45; }
.atl-bk .atl-pill.last .tag { background: #e0413a; }
.atl-bk .atl-pill.soldout { opacity: .45; cursor: not-allowed; background: #f4f7fa; }
.atl-bk .atl-pill.soldout .tag { background: #90a2b4; }

/* nota do horario */
.atl-bk .atl-slot-note {
  display: flex; align-items: center; gap: 8px; margin-top: 13px;
  font-size: 13px; color: var(--blue-dark); background: var(--blue-soft);
  border-radius: var(--radius-sm); padding: 10px 13px; font-weight: 500;
}
.atl-bk .atl-slot-note svg { width: 16px; height: 16px; flex: none; color: var(--blue); }
.atl-bk .atl-slot-note b { font-weight: 700; }

/* steppers de pessoas */
.atl-bk .atl-qty {
  display: flex; align-items: center; gap: 14px; margin-top: 14px;
  border-top: 1px solid var(--line); padding-top: 15px;
}
.atl-bk .atl-qty .lbl { font-size: 14px; font-weight: 600; color: var(--blue-dark); }
.atl-bk .atl-qty .lbl span { display: block; font-size: 12px; font-weight: 400; color: var(--muted); }
.atl-bk .atl-stepper {
  margin-left: auto; display: flex; align-items: center;
  border: 1.5px solid var(--line); border-radius: 999px; overflow: hidden;
}
.atl-bk .atl-stepper button {
  width: 40px; height: 40px; border: 0; background: #fff;
  font-size: 20px; font-weight: 700; color: var(--blue); cursor: pointer; line-height: 1;
}
.atl-bk .atl-stepper button:disabled { color: #c2cfdb; cursor: not-allowed; }
.atl-bk .atl-stepper .val { min-width: 36px; text-align: center; font-size: 16px; font-weight: 800; color: var(--blue-deep); }

/* nota do acompanhante */
.atl-bk .atl-addon-note {
  display: flex; gap: 9px; align-items: flex-start; margin-top: 14px;
  font-size: 12.5px; color: var(--muted); line-height: 1.45;
  background: #f5fbff; border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 11px 13px;
}
.atl-bk .atl-addon-note svg { width: 17px; height: 17px; flex: none; color: var(--blue); margin-top: 1px; }
.atl-bk .atl-addon-note b { color: var(--text); font-weight: 700; }