.dt, .dt * { box-sizing: border-box; }
.dt { --dt-ink: #142b24; --dt-green: #225a46; max-width: 760px; margin: 36px auto; padding: clamp(20px, 4vw, 40px); border: 1px solid #dce3dd; border-radius: 18px; background: #fff; color: var(--dt-ink); font: 17px/1.6 system-ui, sans-serif; }
.dt h1, .dt h2 { color: var(--dt-ink); line-height: 1.15; font-weight: 650; letter-spacing: -.035em; }
.dt h1 { font-size: clamp(32px, 6vw, 48px); }
.dt h2 { font-size: clamp(27px, 5vw, 37px); margin-top: 24px; }
.dt p { margin: 16px 0; }
.dt a { color: var(--dt-green); text-decoration: underline; text-underline-offset: 3px; }
.dt .dt-eyebrow { font-size: 12px; font-weight: 700; letter-spacing: .15em; }
.dt-form { display: grid; gap: 18px; }
.dt-form label { display: grid; gap: 6px; font-weight: 600; }
.dt-form input, .dt-form select { width: 100%; padding: 13px 14px; border: 1px solid #899c92; border-radius: 7px; background: #fff; color: #142b24; font: inherit; min-height: 48px; }
.dt button { appearance: none; padding: 13px 21px; min-height: 48px; background: var(--dt-green); color: white; border: 1px solid var(--dt-green); border-radius: 8px; font: 600 16px/1.4 system-ui, sans-serif; cursor: pointer; }
.dt button:disabled { opacity: .55; cursor: wait; }
.dt input:focus-visible, .dt select:focus-visible, .dt button:focus-visible, .dt a:focus-visible { outline: 3px solid #dba65a; outline-offset: 3px; }
.dt-notice { padding: 15px 18px; background: #f0f3ef; border-left: 4px solid #879a8b; border-radius: 5px; font-size: 15px; }
.dt-success { background: #e4f5e9; border-color: #2c7a40; }
.dt-warning { background: #fff3d4; border-color: #936008; }
.dt-error { background: #fff0ed; border-color: #bb3c2d; }
.dt-date { font-size: 25px; font-weight: 650; }
.dt-qr { display: block; max-width: 100%; width: 300px; height: auto; margin: 20px auto; image-rendering: pixelated; }
.dt-ticket-page { margin: 0; padding: 12px; background: #f3f3ed; }
.dt-occupancy { font-size: 23px; }
.dt-modes { display: flex; flex-wrap: wrap; gap: 18px; padding: 12px 16px; border: 1px solid #b8c6bd; border-radius: 8px; margin-bottom: 20px; }
.dt-modes label { display: flex; align-items: center; gap: 9px; padding: 8px; cursor: pointer; }
.dt-modes input { width: 21px; height: 21px; accent-color: #225a46; }
.dt video { width: 100%; max-height: 400px; margin-top: 18px; border-radius: 8px; }
.dt [hidden] { display: none !important; }
.dt-honey { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.dt-actions { display: flex; gap: 10px; }
.dt-admin-form { max-width: 480px; margin: 20px 0; }
@media print { .dt-ticket-page { background: white; } .dt { border: 0; margin: 0; } .dt button { display: none; } }

.dt-choice { margin: 20px 0; border: 1px solid #b8c6bd; border-radius: 10px; padding: 18px; }
.dt-choice summary { font-size: 22px; font-weight: 650; cursor: pointer; }
.dt-check { display: flex !important; align-items: center; }
.dt-check input { width: 22px; min-height: 22px; }
.dt-admin details { margin: 14px 0; padding: 12px; background: #fff; border: 1px solid #ccd0d4; border-radius: 5px; }
.dt-admin summary { cursor: pointer; font-weight: 600; }
.dt-admin-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap: 16px; }
.dt-filters { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; margin: 20px 0; }
.dt-filters label { display: grid; gap: 5px; }
.dt-pass-detail { background: #fff; padding: 20px; margin: 20px 0; border: 2px solid #225a46; }
.dt-table-scroll { overflow-x: auto; }
.dt-admin pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.dt-admin textarea { width: 100%; }
.dt-cards { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
.dt-card { padding: 12px; text-align: center; border: 1px dashed #777; break-inside: avoid; }
.dt-card h2 { font-size: 21px; }
.dt-card p { font-size: 13px; }
.dt-card img { width: 200px; max-width: 100%; image-rendering: pixelated; }
@media print { .dt-cards { gap: 8mm; } .dt-card { break-inside: avoid; } .dt-ticket-page .dt { max-width: none; padding: 0; } }
@media (max-width: 500px) { .dt-cards { grid-template-columns: 1fr; } }
.dt-admin-form input[type="checkbox"] { width: 20px; min-height: 20px; }
/* Compact, day-focused administration. */
.dt-metrics { display: grid; grid-template-columns: repeat(auto-fit,minmax(145px,1fr)); gap: 12px; margin: 18px 0; max-width: 1200px; }
.dt-metric { display: flex; flex-direction: column; gap: 12px; padding: 18px; border: 1px solid #d9e1dc; border-radius: 8px; background: #fff; }
.dt-metric span { color: #4b5c52; font-size: 13px; }
.dt-metric strong { color: #173f30; font-size: 29px; line-height: 1.2; }
.dt-schedule-nav { padding: 16px 20px; background: #e9efeb; border-radius: 8px; margin: 20px 0; }
.dt-schedule-nav .dt-filters { margin: 0 0 12px; }
.dt-day-links, .dt-day-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.dt-day-actions .dt-admin-form { margin: 10px 0; }
.dt-day-title { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; font-size: 22px !important; }
.dt-day-title small { font-size: 14px; font-weight: 400; color: #58655d; }
.dt-slots { max-width: 1200px; }
.dt-slots th, .dt-slots td { padding: 13px 16px; vertical-align: middle; }
.dt-slots tbody th strong { font-size: 18px; }
.dt-slots progress { display: block; width: 120px; max-width: 100%; height: 6px; margin: 5px 0; accent-color: #276247; }
.dt-slots small { color: #58655d; }
.dt-slots .dt-current-slot { background: #e0f2e6 !important; }
.dt-badge { display: inline-block; font-size: 11px; font-weight: 500; color: #225a46; }
.dt-delete-link { color: #a52a23 !important; }
.dt-edit-panel { background: #fff; border-left: 4px solid #225a46; padding: 20px; margin: 20px 0; scroll-margin-top: 50px; }
.dt-delete-panel { border-color: #b32d2e; }
.dt-admin .dt-danger { color: #fff; background: #b32d2e; border-color: #b32d2e; }
.dt-admin .dt-admin-check { display: flex; align-items: center; gap: 8px; }
.dt-time-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.dt-slot-actions { white-space: nowrap; }
@media (max-width: 600px) { .dt-time-fields { grid-template-columns: 1fr; } .dt-slots th, .dt-slots td { padding: 10px; } }

/* Station feedback stays readable without relying on sound or colour alone. */
.dt-connection{background:#fff0df;border-color:#b55f0a;color:#733b07}
.dt-station #dt-result{font-size:clamp(1.4rem,4vw,2.4rem);font-weight:700;min-height:160px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:14px;padding:24px}
.dt-station #dt-video{max-height:32vh;width:100%;object-fit:cover}
.dt-overdue{background:#fff0d5!important;color:#704000}
.dt-station .dt-form{margin-top:20px}

.dt-station .dt-result-due{font-size:1.35rem;line-height:1.35}

/* Public forms only, enabled by design="website" on their shortcode.
   Variables may be set on the surrounding Elementor container or theme. */
.dt.dt-website {
    --dt-ink: var(--dt-text-color, var(--e-global-color-text, inherit));
    --dt-green: var(--dt-accent, var(--e-global-color-accent, #222));
    width: 100%; max-width: none; min-width: 0; margin: 0; padding: 0;
    border: 0; border-radius: 0; background: transparent;
    font: inherit; font-family: var(--dt-font-family, inherit); color: var(--dt-ink);
}
.dt.dt-website h2 {
    color: inherit;
    font-family: var(--dt-heading-font-family, var(--e-global-typography-primary-font-family, inherit));
    font-size: var(--dt-heading-size, 1.75em);
    font-weight: var(--e-global-typography-primary-font-weight, 700);
    line-height: 1.2; letter-spacing: normal;
}
.dt.dt-website .dt-eyebrow { font-family: inherit; }
.dt.dt-website .dt-form input, .dt.dt-website .dt-form select {
    min-width: 0; max-width: 100%; font: inherit;
    color: var(--dt-field-color, #222); background: var(--dt-field-background, #fff);
    border-color: var(--dt-field-border, #767676); border-radius: var(--dt-radius, 4px);
}
.dt.dt-website button {
    font: inherit; font-weight: 600; white-space: normal;
    color: var(--dt-button-text, #fff); background: var(--dt-green);
    border-color: var(--dt-green); border-radius: var(--dt-radius, 4px);
}
.dt.dt-website .dt-choice { border-color: var(--dt-field-border, #767676); border-radius: var(--dt-radius, 4px); }
.dt.dt-website .dt-choice summary { font: inherit; font-weight: 700; }
.dt.dt-website .dt-notice { color: #142b24; font: inherit; overflow-wrap: anywhere; }
.dt.dt-website .dt-check { align-items: flex-start; }
.dt.dt-website .dt-check input { flex: 0 0 22px; accent-color: var(--dt-green); }