/* HBMP custom date picker — shared by admin + public. Uses theme variables
   with safe fallbacks so it looks right in both contexts and in dark mode. */

.hbmp-dp-wrap { position: relative; display: block; }
.hbmp-dp-wrap, .hbmp-dp-pop, .hbmp-dp-pop * { box-sizing: border-box; }

/* Real date input kept for its value/min/max but hidden from view. */
.hbmp-dp-native {
	position: absolute !important; width: 1px !important; height: 1px !important;
	padding: 0 !important; margin: -1px !important; border: 0 !important;
	overflow: hidden !important; clip: rect(0 0 0 0) !important; opacity: 0 !important;
	pointer-events: none !important;
}
/* Visible field we control (consistent dd/mm/yyyy everywhere). */
.hbmp-dp-display {
	cursor: pointer; width: 100%;
	padding: 10px 38px 10px 12px !important;
	border: 1px solid var(--hbmp-border, #d8dee9);
	border-radius: 8px;
	font-size: 15px;
	background: var(--hbmp-card, #fff) !important;
	background-image: none !important;
	color: var(--hbmp-text, #0f172a);
}
.hbmp-dp-icon {
	position: absolute; top: 50%; right: 12px; transform: translateY(-50%);
	display: inline-flex; align-items: center; justify-content: center;
	color: var(--hbmp-primary, #026583); pointer-events: auto; cursor: pointer;
}

.hbmp-dp-pop {
	position: absolute; z-index: 9999; top: calc(100% + 6px); left: 0;
	width: 300px; max-width: 92vw;
	background: var(--hbmp-card, #fff);
	color: var(--hbmp-text, #0f172a);
	border: 1px solid var(--hbmp-border, #e2e8f0);
	border-radius: 14px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, .18);
	padding: 14px;
	-webkit-user-select: none; user-select: none;
}
.hbmp-dp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.hbmp-dp-title { font-weight: 700; font-size: 15px; }
/* Hard reset so the host theme's button rules can't break the grid layout. */
.hbmp-dp-pop .hbmp-dp-nav,
.hbmp-dp-pop .hbmp-dp-day {
	margin: 0 !important; min-width: 0 !important; max-width: none !important;
	box-shadow: none !important; text-transform: none !important; letter-spacing: normal !important;
	font: inherit !important; line-height: 1 !important; width: 100% !important;
	border: 0 !important; background: transparent; cursor: pointer; color: var(--hbmp-text, #0f172a);
}
.hbmp-dp-nav { width: 32px !important; height: 32px !important; border-radius: 8px; font-size: 22px !important; }
.hbmp-dp-nav:hover { background: var(--hbmp-surface-2, rgba(2, 101, 131, .08)); }
.hbmp-dp-dow { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; margin-bottom: 4px; }
.hbmp-dp-dow span { text-align: center; font-size: 11px; font-weight: 700; color: var(--hbmp-muted, #94a3b8); padding: 4px 0; }
.hbmp-dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.hbmp-dp-empty { height: 36px; }
.hbmp-dp-day {
	height: 36px !important; padding: 0 !important; border-radius: 9px !important; font-size: 13px !important;
	display: flex !important; align-items: center; justify-content: center;
}
.hbmp-dp-day:hover { background: var(--hbmp-surface-2, rgba(2, 101, 131, .10)); }
.hbmp-dp-day.is-today { box-shadow: inset 0 0 0 1px var(--hbmp-primary, #026583) !important; }
.hbmp-dp-day.is-selected { background: var(--hbmp-primary, #026583) !important; color: var(--hbmp-on-primary, #fff) !important; font-weight: 700; }
.hbmp-dp-day.is-disabled { color: var(--hbmp-muted, #cbd5e1) !important; opacity: .45; cursor: not-allowed; }
.hbmp-dp-day.is-disabled:hover { background: transparent; }
