/* Plugin-side overrides + small components not covered by the child theme.
   The child theme is the source of truth for tokens / brand colours.
   This file only adds pieces that ship with the plugin. */

.bp-pager { display: flex; gap: 6px; flex-wrap: wrap; }
.bp-pager .bp-pager-btn.is-active { background: var(--bp-brand-600, #C95F0E); color: #fff; border-color: transparent; }

/* WC items in cart: surface our line meta a touch better. */
.woocommerce-cart-form .product-name dl.variation dd { margin-bottom: 4px; }
.woocommerce-checkout .product-name dl.variation dd { margin-bottom: 4px; }

/* Booking picker on the tutor profile.
   Tap targets >= 44x44 per WCAG 2.5.5 so a thumb can hit a single
   30-minute slot without misfiring onto a neighbour. */
.bp-booking-picker .bp-picker-times { display: flex; flex-wrap: wrap; gap: 8px; }
.bp-booking-picker .bp-picker-time { display: inline-flex; align-items: center; justify-content: center; gap: 4px; padding: 10px 14px; min-height: 44px; min-width: 64px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px; cursor: pointer; background: #fff; font-size: 0.95rem; font-weight: 500; }
.bp-booking-picker .bp-picker-time input { margin: 0; }
.bp-booking-picker .bp-picker-time:has(input:checked) { background: var(--bp-brand-600, #C95F0E); color: #fff; border-color: transparent; }
.bp-booking-picker .bp-picker-summary { font-style: italic; }

/* Inline action collapsibles inside the booking table. */
.bp-inline-action { display: inline-block; margin: 0 4px 6px 0; vertical-align: top; }
.bp-inline-action > summary { list-style: none; cursor: pointer; }
.bp-inline-action > summary::-webkit-details-marker { display: none; }
.bp-inline-action[open] > summary { margin-bottom: 6px; }
.bp-inline-action form { padding: 8px; border: 1px solid rgba(0,0,0,0.08); border-radius: 8px; background: #fff; min-width: 240px; }

/* Editable availability grid in the tutor dashboard.
   Tap targets >= 44x44 so a tutor can edit availability from a phone
   without misfiring. The grid wrapper scrolls horizontally on mobile
   because 8 columns at >= 44px requires more than 375px viewport. */
.bp-avail-grid-edit-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
.bp-avail-grid-edit { min-width: 640px; }
.bp-avail-grid-edit .bp-avail-cell { all: unset; display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border-radius: 6px; cursor: pointer; user-select: none; font-weight: 600; transition: background 80ms ease; }
.bp-avail-grid-edit .bp-avail-cell.is-off { background: rgba(0,0,0,0.06); color: rgba(0,0,0,0.4); }
.bp-avail-grid-edit .bp-avail-cell.is-on  { background: var(--bp-forest-600, #0F766E); color: #fff; }
.bp-avail-grid-edit .bp-avail-cell:focus-visible { outline: 2px solid var(--bp-brand-600, #C95F0E); outline-offset: 1px; }

/* Bulk-set shortcuts above the grid so a tutor doesn't have to tap
   168 cells one by one. Wired up by tutor-dashboard.js. */
.bp-avail-bulk { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.bp-avail-bulk .bp-avail-bulk-btn {
	appearance: none;
	display: inline-flex; align-items: center; justify-content: center;
	padding: 8px 12px; min-height: 40px;
	border: 1px solid var(--bp-line, rgba(0,0,0,0.1));
	border-radius: 8px; background: #fff;
	color: var(--bp-ink, #1A1410);
	font-size: 13px; font-weight: 500; cursor: pointer;
}
.bp-avail-bulk .bp-avail-bulk-btn:hover { background: var(--bp-brand-100, #FFEFD2); border-color: transparent; color: var(--bp-brand-700, #9F4710); }
.bp-avail-bulk .bp-avail-bulk-btn.is-danger:hover { background: rgba(220,38,38,0.08); color: rgb(185,28,28); }

/* Loading state for AJAX panels — single source of truth. */
.bp-loading { opacity: 0.5; pointer-events: none; }
.bp-skeleton { background: linear-gradient(90deg, rgba(0,0,0,0.05), rgba(0,0,0,0.1), rgba(0,0,0,0.05)); background-size: 200% 100%; animation: bpSkel 1.2s ease-in-out infinite; border-radius: 8px; min-height: 80px; }
@keyframes bpSkel { 0%{background-position:200% 0;} 100%{background-position:-200% 0;} }

/* Hero chip pulse — moved out of inline <style> in landing-hero.php (U-10). */
@keyframes bpPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0.5); } 50% { box-shadow: 0 0 0 6px rgba(34,197,94,0); } }

/* Explicit per-lesson price block on tutor cards — replaces the
   confusing "$X / hour" line. */
.bp-tutor-prices {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin: 10px 0;
	padding: 10px 12px;
	background: rgba(0,0,0,0.025);
	border-radius: 10px;
	border: 1px solid rgba(0,0,0,0.06);
	font-size: 13px;
}
.bp-tutor-price-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
}
.bp-tutor-price-label {
	color: var(--bp-ink-soft, #525252);
}
.bp-tutor-price-amount {
	font-family: var(--bp-font-head, inherit);
	color: var(--bp-ink, #0a0a0a);
	font-weight: 700;
	white-space: nowrap;
}

/* HIGH-1 (1.2.0): broadcast banner on user dashboards. */
.bp-broadcast-banner {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 14px 18px;
	margin: 0 0 18px;
	border-radius: 10px;
	border-left: 4px solid #3b82f6;
	background: #eff6ff;
	color: #1e3a8a;
	font-size: 14px;
	line-height: 1.5;
}
.bp-broadcast-banner-success { border-left-color: #16a34a; background: #f0fdf4; color: #14532d; }
.bp-broadcast-banner-warning { border-left-color: #d97706; background: #fffbeb; color: #78350f; }
.bp-broadcast-banner-critical { border-left-color: #dc2626; background: #fef2f2; color: #7f1d1d; }
.bp-broadcast-banner-body { flex: 1; }
.bp-broadcast-banner-body strong { display: block; margin-bottom: 4px; font-size: 15px; }
.bp-broadcast-banner-dismiss {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 999px;
	background: rgba(0,0,0,0.06);
	color: inherit;
	text-decoration: none;
	font-size: 18px;
	line-height: 1;
}
.bp-broadcast-banner-dismiss:hover { background: rgba(0,0,0,0.12); }