.ccc-siteops-booking {
    --ccc-ink: #172033;
    --ccc-muted: #5b6578;
    --ccc-line: #dce2ea;
    --ccc-surface: #ffffff;
    --ccc-soft: #f5f7fa;
    --ccc-accent: #b42318;
    --ccc-accent-dark: #8f1c13;
    --ccc-success: #067647;
    --ccc-warning: #b54708;
    max-width: 980px;
    margin: 2rem auto;
    color: var(--ccc-ink);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.ccc-siteops-booking *,
.ccc-siteops-booking *::before,
.ccc-siteops-booking *::after { box-sizing: border-box; }

.ccc-siteops-booking__intro,
.ccc-siteops-booking__fieldset,
.ccc-siteops-booking__availability,
.ccc-siteops-booking__confirmation {
    background: var(--ccc-surface);
    border: 1px solid var(--ccc-line);
    border-radius: 18px;
    box-shadow: 0 12px 34px rgba(23, 32, 51, .08);
    padding: clamp(1.1rem, 3vw, 2rem);
    margin: 0 0 1.25rem;
}

.ccc-siteops-booking__intro {
    background: linear-gradient(135deg, #172033 0%, #273650 100%);
    color: #fff;
}

.ccc-siteops-booking__intro h2 { color: #fff; margin: .25rem 0 .75rem; font-size: clamp(1.8rem, 4vw, 3rem); }
.ccc-siteops-booking__intro p { color: rgba(255,255,255,.9); }
.ccc-siteops-booking__eyebrow { text-transform: uppercase; letter-spacing: .09em; font-weight: 700; font-size: .78rem; }
.ccc-siteops-booking__phone a { color: #fff; font-weight: 800; text-decoration-thickness: 2px; }

.ccc-siteops-booking__fieldset { min-width: 0; }
.ccc-siteops-booking__fieldset legend { font-size: 1.25rem; font-weight: 800; padding: 0 .4rem; }
.ccc-siteops-booking__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.ccc-siteops-booking__field { display: flex; flex-direction: column; gap: .4rem; font-weight: 700; }
.ccc-siteops-booking__field--wide { grid-column: 1 / -1; }
.ccc-siteops-booking__field span { font-size: .92rem; }
.ccc-siteops-booking input,
.ccc-siteops-booking select,
.ccc-siteops-booking textarea {
    width: 100%;
    border: 1px solid #aeb8c6;
    border-radius: 10px;
    padding: .82rem .9rem;
    color: var(--ccc-ink);
    background: #fff;
    font: inherit;
}
.ccc-siteops-booking input:focus,
.ccc-siteops-booking select:focus,
.ccc-siteops-booking textarea:focus {
    outline: 3px solid rgba(180, 35, 24, .18);
    border-color: var(--ccc-accent);
}

.ccc-siteops-booking__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    border: 0;
    border-radius: 999px;
    padding: .85rem 1.35rem;
    margin-top: 1rem;
    background: var(--ccc-accent);
    color: #fff;
    font-weight: 800;
    cursor: pointer;
}
.ccc-siteops-booking__button:hover { background: var(--ccc-accent-dark); }
.ccc-siteops-booking__button:disabled { opacity: .55; cursor: wait; }
.ccc-siteops-booking__button--secondary { background: var(--ccc-ink); }

.ccc-siteops-booking__area { margin: 0 0 1rem; padding: .8rem 1rem; background: var(--ccc-soft); border-radius: 10px; }
.ccc-siteops-booking__slots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.ccc-siteops-booking__slot {
    position: relative;
    display: flex;
    gap: .75rem;
    border: 2px solid var(--ccc-line);
    border-radius: 14px;
    padding: 1rem;
    background: #fff;
    cursor: pointer;
}
.ccc-siteops-booking__slot:hover,
.ccc-siteops-booking__slot.is-selected { border-color: var(--ccc-accent); box-shadow: 0 0 0 3px rgba(180, 35, 24, .1); }
.ccc-siteops-booking__slot input { width: auto; margin-top: .25rem; }
.ccc-siteops-booking__slot-main { display: flex; flex-direction: column; gap: .25rem; }
.ccc-siteops-booking__slot-main small { color: var(--ccc-muted); line-height: 1.35; }
.ccc-siteops-booking__slot-fee { color: var(--ccc-warning); font-weight: 800; }

.ccc-siteops-booking__consent { display: flex; align-items: flex-start; gap: .65rem; margin: 1rem 0; font-weight: 600; }
.ccc-siteops-booking__consent input { width: auto; margin-top: .25rem; }
.ccc-siteops-booking__disclaimer { color: var(--ccc-muted); font-size: .9rem; }
.ccc-siteops-booking__status { min-height: 1.5rem; padding: .2rem 0; font-weight: 700; }
.ccc-siteops-booking__status.is-error { color: var(--ccc-accent); }
.ccc-siteops-booking__status.is-success { color: var(--ccc-success); }
.ccc-siteops-booking__status.is-loading { color: var(--ccc-muted); }
.ccc-siteops-booking__confirmation { border-color: #75c9a5; background: #ecfdf3; }
.ccc-siteops-booking__confirmation h3 { margin-top: 0; }
.ccc-siteops-booking__confirmation dl { margin: 1rem 0; }
.ccc-siteops-booking__confirmation dl div { display: grid; grid-template-columns: 150px 1fr; gap: .75rem; padding: .45rem 0; border-bottom: 1px solid rgba(6,118,71,.16); }
.ccc-siteops-booking__confirmation dt { font-weight: 800; }
.ccc-siteops-booking__confirmation dd { margin: 0; }
.ccc-siteops-booking__honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.ccc-siteops-booking__empty { padding: 1rem; border-left: 4px solid var(--ccc-warning); background: #fff7ed; }

@media (max-width: 700px) {
    .ccc-siteops-booking__grid,
    .ccc-siteops-booking__slots { grid-template-columns: 1fr; }
    .ccc-siteops-booking__field--wide { grid-column: auto; }
    .ccc-siteops-booking__confirmation dl div { grid-template-columns: 1fr; gap: .15rem; }
}
