/* Booklium Booking — Public CSS */
:root {
  --blbk-primary:    #1a7f7f;
  --blbk-primary-dk: #145f5f;
  --blbk-primary-lt: #e8f6f6;
  --blbk-dark:       #1c2b3a;
  --blbk-gray:       #6b7280;
  --blbk-border:     #e2e8f0;
  --blbk-white:      #ffffff;
  --blbk-success:    #16a34a;
  --blbk-danger:     #dc2626;
  --blbk-warning:    #d97706;
  --blbk-radius:     8px;
  --blbk-shadow:     0 4px 20px rgba(0,0,0,.10);
}

/* ── Booking Form ── */
.blbk-booking-form { background: var(--blbk-white); border: 1px solid var(--blbk-border); border-radius: 12px; box-shadow: var(--blbk-shadow); overflow: hidden; }
.blbk-booking-form__header { background: var(--blbk-primary); color: #fff; padding: 24px 28px; }
.blbk-booking-form__header h3 { color: #fff; margin: 0 0 4px; font-size: 1.15rem; }
.blbk-booking-form__price { display: flex; align-items: baseline; gap: 6px; }
.blbk-booking-form__price .amount { font-size: 2rem; font-weight: 700; }
.blbk-booking-form__price .per { font-size: .85rem; opacity: .75; }
.blbk-booking-form__body { padding: 24px 28px; }

/* Availability checker */
.blbk-avail-check { background: var(--blbk-primary-lt); border-radius: var(--blbk-radius); padding: 20px; margin-bottom: 20px; }
.blbk-avail-check h4 { font-size: .95rem; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.blbk-avail-check h4::before { content: ''; display: block; width: 3px; height: 18px; background: var(--blbk-primary); border-radius: 2px; }
.blbk-date-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.blbk-field { display: flex; flex-direction: column; gap: 5px; }
.blbk-field label { font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--blbk-gray); }
.blbk-field input, .blbk-field select { padding: 10px 14px; border: 1.5px solid var(--blbk-border); border-radius: var(--blbk-radius); font-size: .9rem; color: var(--blbk-dark); background: #fff; outline: none; width: 100%; }
.blbk-field input:focus, .blbk-field select:focus { border-color: var(--blbk-primary); box-shadow: 0 0 0 3px rgba(26,127,127,.1); }

/* Availability status */
.blbk-avail-status { padding: 12px 16px; border-radius: var(--blbk-radius); font-size: .88rem; font-weight: 600; margin: 12px 0; display: none; }
.blbk-avail-status.available { background: #dcfce7; color: var(--blbk-success); display: block; }
.blbk-avail-status.unavailable { background: #fee2e2; color: var(--blbk-danger); display: block; }
.blbk-avail-status.checking { background: #fef3c7; color: var(--blbk-warning); display: block; }

/* Price breakdown */
.blbk-price-breakdown { background: #f8fafc; border: 1px solid var(--blbk-border); border-radius: var(--blbk-radius); padding: 16px; margin: 16px 0; font-size: .88rem; display: none; }
.blbk-price-breakdown.visible { display: block; }
.blbk-price-row { display: flex; justify-content: space-between; padding: 5px 0; }
.blbk-price-row--total { font-weight: 700; font-size: 1rem; border-top: 1px solid var(--blbk-border); padding-top: 10px; margin-top: 6px; color: var(--blbk-primary); }

/* Guest form */
.blbk-guest-form { display: none; }
.blbk-guest-form.visible { display: block; }
.blbk-guest-form h4 { font-size: .95rem; margin: 20px 0 14px; }
.blbk-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.blbk-full { grid-column: 1/-1; }
textarea.blbk-field { resize: vertical; min-height: 80px; }
textarea.blbk-field input { min-height: 80px; resize: vertical; }
.blbk-field textarea { padding: 10px 14px; border: 1.5px solid var(--blbk-border); border-radius: var(--blbk-radius); font-size: .9rem; font-family: inherit; width: 100%; outline: none; resize: vertical; min-height: 80px; }
.blbk-field textarea:focus { border-color: var(--blbk-primary); box-shadow: 0 0 0 3px rgba(26,127,127,.1); }

/* Buttons */
.blbk-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 14px; border-radius: var(--blbk-radius); font-weight: 700; font-size: .95rem; cursor: pointer; border: 2px solid transparent; transition: all .25s; font-family: inherit; }
.blbk-btn--primary { background: var(--blbk-primary); color: #fff; border-color: var(--blbk-primary); }
.blbk-btn--primary:hover:not(:disabled) { background: var(--blbk-primary-dk); }
.blbk-btn--primary:disabled { opacity: .6; cursor: not-allowed; }
.blbk-btn--outline { background: transparent; color: var(--blbk-primary); border-color: var(--blbk-primary); }
.blbk-btn--outline:hover { background: var(--blbk-primary-lt); }

/* Agreement */
.blbk-agreement { font-size: .8rem; color: var(--blbk-gray); text-align: center; margin-top: 12px; line-height: 1.5; }
.blbk-agreement a { color: var(--blbk-primary); }

/* Success state */
.blbk-success-msg { background: #dcfce7; border: 1px solid #bbf7d0; border-radius: var(--blbk-radius); padding: 20px; text-align: center; display: none; }
.blbk-success-msg.visible { display: block; }
.blbk-success-msg h4 { color: var(--blbk-success); margin-bottom: 8px; }
.blbk-success-msg p { color: #166534; font-size: .9rem; margin: 0; }

/* ── Rooms List (shortcode) ── */
.blbk-rooms-grid { display: grid; gap: 28px; }
.blbk-rooms-grid--2 { grid-template-columns: repeat(2, 1fr); }
.blbk-rooms-grid--3 { grid-template-columns: repeat(3, 1fr); }
.blbk-rooms-grid--4 { grid-template-columns: repeat(4, 1fr); }

/* ── Search Form ── */
.blbk-search-form { background: #fff; border: 1px solid var(--blbk-border); border-radius: var(--blbk-radius); padding: 24px; box-shadow: var(--blbk-shadow); }
.blbk-search-grid { display: grid; grid-template-columns: 1fr 1fr 1fr auto; gap: 14px; align-items: end; }

/* ── Availability Calendar ── */
.blbk-cal-wrapper { background: #fff; border: 1px solid var(--blbk-border); border-radius: var(--blbk-radius); overflow: hidden; }
.blbk-cal-header { background: var(--blbk-primary); color: #fff; text-align: center; padding: 14px; font-weight: 700; }
.blbk-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); }
.blbk-cal-day-name { text-align: center; font-size: .72rem; font-weight: 700; padding: 8px 4px; color: var(--blbk-gray); }
.blbk-cal-day { text-align: center; padding: 8px 4px; font-size: .85rem; border-radius: 4px; margin: 2px; cursor: default; }
.blbk-cal-day.available { color: var(--blbk-dark); cursor: pointer; }
.blbk-cal-day.available:hover { background: var(--blbk-primary-lt); color: var(--blbk-primary); }
.blbk-cal-day.unavailable { background: #fee2e2; color: var(--blbk-danger); text-decoration: line-through; }
.blbk-cal-day.today { border: 2px solid var(--blbk-primary); font-weight: 700; }
.blbk-cal-day.empty { opacity: 0; }
.blbk-cal-legend { display: flex; gap: 16px; padding: 12px 16px; font-size: .78rem; flex-wrap: wrap; }
.blbk-cal-legend span { display: flex; align-items: center; gap: 6px; }
.blbk-cal-swatch { display: inline-block; width: 14px; height: 14px; border-radius: 2px; }

/* ── My Bookings ── */
.blbk-my-booking { background: #fff; border: 1px solid var(--blbk-border); border-radius: var(--blbk-radius); padding: 20px; margin-bottom: 16px; display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: start; }
.blbk-my-booking__num { font-family: monospace; color: var(--blbk-primary); font-weight: 700; font-size: .9rem; }
.blbk-my-booking__room { font-weight: 700; font-size: 1.05rem; margin: 4px 0; }
.blbk-my-booking__dates { font-size: .85rem; color: var(--blbk-gray); }
.blbk-badge { display: inline-block; padding: 4px 12px; border-radius: 50px; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.blbk-badge--pending   { background: #ede9fe; color: #7c3aed; }
.blbk-badge--confirmed { background: #dcfce7; color: var(--blbk-success); }
.blbk-badge--cancelled { background: #fee2e2; color: var(--blbk-danger); }
.blbk-badge--completed { background: var(--blbk-primary-lt); color: var(--blbk-primary); }

/* Confirm Page */
.blbk-confirm-box { background: #fff; border: 1px solid var(--blbk-border); border-radius: 12px; padding: 40px; text-align: center; max-width: 600px; margin: 0 auto; box-shadow: var(--blbk-shadow); }
.blbk-confirm-box__icon { font-size: 3.5rem; margin-bottom: 20px; display: block; }
.blbk-confirm-table { width: 100%; border-collapse: collapse; margin: 24px 0; text-align: left; }
.blbk-confirm-table th { padding: 10px 14px; background: #f8fafc; font-size: .85rem; width: 40%; }
.blbk-confirm-table td { padding: 10px 14px; font-size: .9rem; border-bottom: 1px solid var(--blbk-border); }

/* Responsive */
@media (max-width: 768px) {
  .blbk-date-row, .blbk-two-col { grid-template-columns: 1fr; }
  .blbk-search-grid { grid-template-columns: 1fr; }
  .blbk-rooms-grid--2, .blbk-rooms-grid--3, .blbk-rooms-grid--4 { grid-template-columns: 1fr; }
  .blbk-my-booking { grid-template-columns: 1fr; }
}