/* The original input remains in its layout slot; only its calendar is replaced. */
body input[data-date-input] {
  padding-right: 30px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23324e68' stroke-width='1.8'%3E%3Crect x='4' y='5' width='16' height='16' rx='2'/%3E%3Cpath d='M8 3v4m8-4v4M4 11h16'/%3E%3C/svg%3E");
  background-position: right 9px center;
  background-repeat: no-repeat;
  background-size: 14px;
}

.vgo-date-picker {
  position: fixed;
  z-index: 3000;
  box-sizing: border-box;
  width: 304px;
  max-width: calc(100vw - 8px);
  padding: 10px;
  border: 1px solid var(--border-strong, #9db9d0);
  border-radius: 8px;
  background: #fff;
  color: #173750;
  box-shadow: 0 6px 24px #102c4933;
  font: 14px/1.4 system-ui, sans-serif;
}

.vgo-date-picker[hidden] { display: none; }
.vgo-date-picker .vgo-date-header { display: flex; align-items: center; gap: 4px; }
.vgo-date-picker :is(button, select, input) {
  box-sizing: border-box;
  min-height: 36px;
  margin: 0;
  border: 1px solid transparent;
  border-radius: 4px;
  padding: 4px;
  background: #fff;
  color: inherit;
  font: inherit;
  letter-spacing: normal;
  box-shadow: none;
}
.vgo-date-picker button { cursor: pointer; }
.vgo-date-picker .vgo-date-header button { width: 28px; flex: 0 0 28px; font-size: 22px; }
.vgo-date-picker select { flex: 1; width: 0; min-width: 0; }
.vgo-date-picker input { width: 74px; min-width: 0; }
.vgo-date-picker :is(select, input) { border-color: #cfdeec; }
.vgo-date-picker table { width: 100%; min-width: 0; border-collapse: collapse; table-layout: fixed; }
.vgo-date-picker caption { padding: 8px 0 4px; font-weight: 600; }
.vgo-date-picker :is(th, td) { height: 36px; padding: 0; border: 0; background: transparent; text-align: center; font: inherit; }
.vgo-date-picker th { color: #516d85; font-size: 12px; }
.vgo-date-picker td button { width: 100%; }
.vgo-date-picker button[aria-current="date"] { border-color: #236daa; }
.vgo-date-picker button[aria-pressed="true"] { background: #0b5ebd; color: #fff; }
.vgo-date-picker button:disabled { opacity: .35; cursor: default; }
.vgo-date-picker button:hover:not(:disabled):not([aria-pressed="true"]) { background: #e7f0f9; }
.vgo-date-picker :is(button, input, select):focus-visible { outline: 2px solid #126cc1; outline-offset: 1px; }
.vgo-date-picker .vgo-date-footer { display: flex; justify-content: space-between; gap: 4px; margin-top: 6px; border-top: 1px solid #dfebf4; padding-top: 6px; }
.vgo-date-picker .vgo-date-footer button { padding-inline: 8px; color: #0b5ebd; }