/* General booking layout */

.spb-wrapper {
    max-width: 520px;
    margin: 0 auto;
    padding: 1rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    text-align: center;
}

.spb-heading-centre {
    margin-bottom: 0.25rem;
}

.spb-intro-centre {
    font-size: 0.95rem;
    color: #444;
    margin-bottom: 1.25rem;
}

/* Vertical stack */

.spb-stack {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
}

.spb-field {
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
}

.spb-field label {
    display: block;
    font-weight: 500;
}

/* Inputs / selects */

.spb-field input[type="date"],
.spb-field input[type="text"],
#spb-party-size {
    width: 100%;
    max-width: 260px;
    padding: 0.4rem 0.5rem;
    box-sizing: border-box;
    margin-top: 0.25rem;
}

.spb-small-print {
    font-size: 0.85rem;
    color: #555;
    margin-top: 0.5rem;
}

/* Slots */

#spb-slots {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.spb-slot {
    display: block;
    width: 100%;
    text-align: left;
    margin-bottom: 0.4rem;
    padding: 0.5rem 0.75rem;
    border-radius: 999px;
    border: 1px solid #ccc;
    background: #f7f7f7;
    cursor: pointer;
    font-size: 0.95rem;
}

.spb-slot:hover {
    background: #e9f4ff;
}

.spb-slot.selected {
    border-color: #0077b6;
    background: #d0ebff;
}

.spb-slot-owners {
    border-style: dashed;
}

/* Messages */

.spb-success {
    color: #2e7d32;
}

.spb-error {
    color: #c62828;
}

/* Buttons */

#spb-submit {
    margin-top: 0.6rem;
    padding: 0.5rem 1.2rem;
    border-radius: 999px;
    border: none;
    background: #0077b6;
    color: #fff;
    cursor: pointer;
    font-weight: 600;
}

#spb-submit:hover {
    background: #005b8c;
}

/* Result screen */

#spb-result-screen {
    border-top: 1px solid #ddd;
    padding-top: 1rem;
}

#spb-result-back {
    margin-top: 1rem;
    padding: 0.5rem 1.2rem;
    border-radius: 999px;
    border: none;
    background: #0077b6;
    color: #fff;
    cursor: pointer;
    font-weight: 600;
}

#spb-result-back:hover {
    background: #005b8c;
}

#spb-result-message ul {
    margin-left: 1.2rem;
    text-align: left;
}

/* Public summary */

.spb-summary-wrapper {
    max-width: 960px;
    margin: 0 auto;
    padding: 1rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.spb-summary-filter {
    margin-bottom: 1rem;
}

.spb-summary-filter input[type="date"] {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
}

.spb-summary-help {
    font-size: 0.9rem;
    color: #555;
    margin-bottom: 0.5rem;
}

.spb-summary-table,
.spb-summary-bookings-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    font-size: 0.95rem;
}

.spb-summary-table th,
.spb-summary-table td,
.spb-summary-bookings-table th,
.spb-summary-bookings-table td {
    border: 1px solid #ddd;
    padding: 0.4rem 0.5rem;
}

.spb-summary-table th {
    background: #f2f2f2;
}

.spb-summary-row {
    cursor: pointer;
}

.spb-summary-row:hover {
    background: #f7fbff;
}

.spb-summary-bookings-table th {
    background: #f9f9f9;
}

.spb-summary-inline-form {
    display: inline-block;
    margin-right: 0.5rem;
}

.spb-summary-inline-form input[type="number"] {
    width: 60px;
}

.spb-summary-delete {
    background: transparent;
    border: none;
    color: #c62828;
    cursor: pointer;
}

.spb-summary-delete:hover {
    text-decoration: underline;
}

/* Public summary notices */

.spb-summary-notice {
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.75rem;
    border-radius: 4px;
    font-size: 0.9rem;
}

.spb-summary-notice-success {
    background: #e6f4ea;
    border: 1px solid #c8e6c9;
    color: #2e7d32;
}

.spb-summary-notice-error {
    background: #ffebee;
    border: 1px solid #ffcdd2;
    color: #c62828;
}

/* Badges */

.spb-badge {
    display: inline-block;
    padding: 0.1rem 0.4rem;
    border-radius: 999px;
    font-size: 0.75rem;
    background: #e0e0e0;
    color: #333;
}

.spb-badge-confirmed {
    background: #e8f5e9;
    color: #2e7d32;
}

.spb-badge-cancelled {
    background: #eeeeee;
    color: #777;
}

.spb-badge-blocked {
    background: #ffebee;
    color: #c62828;
}
/* Grey out submit button while processing */
#spb-submit[disabled] {
    opacity: 0.6;
    cursor: not-allowed;
}