/* ===== Designed inline date + time picker ===== */
.dp { background: #fff; border: 1px solid rgba(0,0,0,.08); border-radius: 16px; padding: 14px; box-shadow: 0 4px 20px rgba(0,0,0,.05); max-width: 320px; }
.dp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.dp-title { font-weight: 800; font-size: 15px; color: var(--text-1, #1a1a1a); }
.dp-nav { width: 32px; height: 32px; border-radius: 9px; border: 1px solid rgba(0,0,0,.1); background: #fff; cursor: pointer; color: var(--text-2, #4a4a4a); display: grid; place-items: center; transition: all .15s ease; }
.dp-nav:hover { background: var(--text-1, #1a1a1a); color: #fff; border-color: var(--text-1, #1a1a1a); }
.dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.dp-wd { text-align: center; font-size: 10.5px; font-weight: 800; text-transform: uppercase; color: #9a9a9a; padding-bottom: 6px; letter-spacing: .04em; }
.dp-day { aspect-ratio: 1; border: none; background: transparent; border-radius: 10px; cursor: pointer; font-size: 13px; font-weight: 600; color: var(--text-1, #1a1a1a); display: grid; place-items: center; transition: all .12s ease; }
.dp-day:hover:not(:disabled) { background: var(--panel, #E8F0F4); }
.dp-day:disabled { color: #cfcfcf; cursor: not-allowed; }
.dp-day.dp-empty { pointer-events: none; }
.dp-day.dp-today { box-shadow: inset 0 0 0 1.5px rgba(24,24,27,.18); }
.dp-day.dp-sel { background: #D4FF33; color: #18181B; font-weight: 800; box-shadow: none; }
.dp-timerow { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(0,0,0,.06); }
.dp-timerow i { color: #9a9a9a; }
.dp-timelbl { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #767676; }
.dp-time { flex: 1; padding: 9px 12px; border: 1px solid rgba(0,0,0,.14); border-radius: 10px; font-size: 14px; font-family: inherit; font-weight: 600; color: var(--text-1, #1a1a1a); background: #fff; }
.dp-time:focus { outline: none; border-color: var(--text-1, #1a1a1a); box-shadow: 0 0 0 3px rgba(212,255,51,.35); }
