/* === dwh-date-control component styles === */
.dwh-dc-trigger {
    min-width: 70px; max-width: 150px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    font-weight: bold; color: darkred; border-color: #0d6efd;
}
.dwh-dc-trigger:hover { border-color: #0d6efd; }
.dwh-dc-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 4px;
    padding: 4px 0;
}
/* single-button tile (year / month / day levels) */
.dwh-dc-tile {
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 6px 2px;
    text-align: center;
    cursor: pointer;
    font-size: 0.78rem;
    line-height: 1.2;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    transition: background-color 0.12s;
    width: 100%;
}
.dwh-dc-tile:hover:not(:disabled)  { background-color: #e7f1ff; }
.dwh-dc-tile.dc-active  { background-color: #0d6efd; color: #fff; border-color: #0a58ca; }
.dwh-dc-tile.dc-in-range { background-color: #cfe2ff; border-color: #9ec5fe; }
.dwh-dc-tile.dc-current { border-color: #0d6efd; font-weight: 600; }
.dwh-dc-tile:disabled   { opacity: 0.35; cursor: not-allowed; }

/* two-zone tile (millennium / century / decade levels) */
.dwh-dc-tile-group {
    display: flex;
    align-items: stretch;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    min-height: 44px;
    overflow: hidden;
    transition: border-color 0.12s;
}
.dwh-dc-tile-group.dc-active  { border-color: #0a58ca; background-color: #0d6efd; color: #fff; }
.dwh-dc-tile-group.dc-in-range { background-color: #cfe2ff; border-color: #9ec5fe; }
.dwh-dc-tile-group.dc-disabled { opacity: 0.35; pointer-events: none; }
.dwh-dc-tile-main {
    flex: 1 1 0;
    min-width: 0;
    border: none;
    background: none;
    padding: 4px 2px;
    font-size: 0.75rem;
    line-height: 1.2;
    cursor: pointer;
    color: inherit;
    text-align: center;
}
.dwh-dc-tile-main:hover { background-color: #e7f1ff; }
.dwh-dc-tile-group.dc-active .dwh-dc-tile-main:hover { background-color: #0a58ca; }
.dwh-dc-tile-confirm {
    flex: 0 0 24px;
    border: none;
    border-left: 1px solid #dee2e6;
    background: none;
    cursor: pointer;
    font-size: 0.7rem;
    color: #198754;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.dwh-dc-tile-confirm:hover { background-color: #d1e7dd; color: #0a3622; }
.dwh-dc-tile-group.dc-active .dwh-dc-tile-confirm { border-left-color: #0a58ca; color: #d1e7dd; }
.dwh-dc-tile-group.dc-active .dwh-dc-tile-confirm:hover { background-color: #0a58ca; }
@media (max-width: 767px) {
    .dwh-dc-tile-confirm { flex: 0 0 30px; font-size: 0.8rem; }
}
.dwh-dc-era-btn {
    min-height: 56px;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.03em;
}
.dwh-dc-breadcrumb {
    font-size: 0.78rem;
    overflow-x: auto;
    white-space: nowrap;
    padding-bottom: 2px;
    flex: 1;
}
.dwh-dc-breadcrumb-btn {
    background: none;
    border: none;
    padding: 0 2px;
    color: #0d6efd;
    cursor: pointer;
    font-size: 0.78rem;
    text-decoration: underline;
}
.dwh-dc-breadcrumb-btn.dc-current {
    color: #212529;
    font-weight: 600;
    text-decoration: none;
    cursor: default;
}
.dwh-dc-range-indicator {
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 0.8rem;
    margin-bottom: 6px;
}
.dwh-dc-presets { margin-top: 6px; }
.dwh-dc-presets button { font-size: 0.78rem; }
/* text input wrapper */
.dwh-dc-input-wrap { position: relative; }
.dwh-dc-text-input { padding-right: 2rem; }
.dwh-dc-input-clear {
    position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
    color: #6c757d; line-height: 1; padding: 0 4px;
}
/* suggestion chips */
.dwh-dc-suggestion { font-size: 0.8rem; }
/* selected-date badge */
.dwh-dc-selected-badge {
    display: inline-block;
    background: #e9ecef; color: #212529;
    border-radius: 4px; padding: 2px 8px;
    font-weight: 600; font-size: 0.88rem;
}
.dwh-dc-panel {
    position: fixed; z-index: 1055;
    background: #fff;
    display: flex; flex-direction: column; overflow: hidden;
}
.dwh-dc-panel-header {
    flex-shrink: 0; padding: 6px 12px;
    display: flex; align-items: center;
    border-bottom: 1px solid #dee2e6;
}
.dwh-dc-panel-body {
    flex: 1; display: flex; flex-direction: column;
    overflow: hidden; min-height: 0; padding: 6px 12px 8px;
}
.dwh-dc-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.35); z-index: 1054; }
.dwh-dc-fixed-zone { flex-shrink: 0; }
.dwh-dc-grid-zone  { flex: 1; overflow-y: auto; min-height: 0; padding-top: 4px; }
/* Desktop: dropdown below trigger */
@media (min-width: 768px) {
    .dwh-dc-panel {
        width: 460px; max-width: calc(100vw - 16px); max-height: 65dvh;
        border-radius: 8px; border: 1px solid rgba(0,0,0,.18);
        box-shadow: 0 8px 24px rgba(0,0,0,.15);
    }
    .dwh-dc-backdrop { display: none; }
    .dwh-dc-grid { grid-template-columns: repeat(10, 1fr); }
    .dwh-dc-panel-enter-active, .dwh-dc-panel-leave-active { transition: opacity .15s, transform .15s; }
    .dwh-dc-panel-enter, .dwh-dc-panel-leave-to { opacity: 0; transform: translateY(-6px); }
}
/* Mobile: bottom sheet */
@media (max-width: 767px) {
    .dwh-dc-panel {
        /* --dc-kb-inset = on-screen-keyboard height (set inline from visualViewport):
           lift the sheet above the keyboard and shrink it so input + suggestions
           stay visible instead of being covered. */
        bottom: var(--dc-kb-inset, 0px) !important; left: 0 !important; right: 0 !important; top: auto !important;
        max-height: min(88dvh, calc(100dvh - var(--dc-kb-inset, 0px) - 8px));
        border-top-left-radius: 12px; border-top-right-radius: 12px;
        box-shadow: 0 -4px 20px rgba(0,0,0,.2);
        transition: bottom .2s ease, max-height .2s ease;
    }
    .dwh-dc-tile { min-height: 44px; font-size: 0.8rem; }
    .dwh-dc-panel-enter-active, .dwh-dc-panel-leave-active { transition: transform .25s ease; }
    .dwh-dc-panel-enter, .dwh-dc-panel-leave-to { transform: translateY(100%); }
}

/* Form context: trigger styled as a visible form-like button */
.dc-form-wrap .dwh-dc-trigger {
    border-color: #dee2e6;
    background-color: #fff;
    color: #212529;
    font-weight: normal;
    max-width: 200px;
}
.dc-form-wrap .dwh-dc-trigger:hover {
    border-color: #86b7fe;
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
}