/* --gb-open, --gb-booked, --gb-tentative, --gb-closed and their -text colours come from Settings > Gigbook Website (set by the script) */
.gigbook-website { --gb-open: #2e7d32; --gb-open-text: #fff; --gb-booked: #b3261e; --gb-booked-text: #fff; --gb-tentative: #e8a33c; --gb-tentative-text: #111; --gb-closed: #4a4f57; --gb-closed-text: #fff;
    display: flex; flex-wrap: wrap; gap: 16px 32px; align-items: flex-start; }
.gigbook-website .gb-calendar-side { flex: 0 1 430px; min-width: 0; }
.gigbook-website .gb-form, .gigbook-website .gb-thanks { flex: 1 1 340px; min-width: 0; }
.gigbook-website [hidden] { display: none !important; }
.gigbook-website .gb-heading { flex: 1 1 100%; min-width: 0; text-align: center; }
.gigbook-website .gb-heading > :first-child { margin-top: 0; }
.gigbook-website .gb-heading > :last-child { margin-bottom: 0; }
.gigbook-website .gb-heading, .gigbook-website .gb-calendar-side, .gigbook-website .gb-form { transition: opacity .6s ease; }
.gigbook-website.gb-leaving .gb-heading, .gigbook-website.gb-leaving .gb-calendar-side, .gigbook-website.gb-leaving .gb-form { opacity: 0; }
.gigbook-website.gb-done { align-items: flex-start; justify-content: center; }
.gigbook-website.gb-done .gb-thanks { flex: 0 1 560px; text-align: center; animation: gb-appear .6s ease; }
.gigbook-website.gb-done .gb-thanks h3 { font-size: 2em; margin-bottom: 12px; }
@keyframes gb-appear { from { opacity: 0; } to { opacity: 1; } }

.gigbook-website .gb-card { background: #fff; color: #333; border-radius: 6px; padding: 10px; box-shadow: 0 2px 10px rgb(0 0 0 / .35); }
.gigbook-website .gb-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.gigbook-website .gb-month { font-size: 1.05em; color: #333; }
.gigbook-website .gb-head button { padding: 0 12px; border: 0; background: none; box-shadow: none; text-shadow: none; color: #333; font-size: 1.6em; line-height: 1.2; cursor: pointer; }
.gigbook-website .gb-head button:disabled { opacity: .2; cursor: default; }
.gigbook-website .gb-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; }
.gigbook-website .gb-dow { text-align: center; font-size: .75em; font-weight: bold; letter-spacing: .5px; text-transform: uppercase; padding: 5px 0; background: #d5d9df; color: #333; box-shadow: 3px 0 0 #d5d9df; }
.gigbook-website .gb-dow:last-of-type { box-shadow: none; }
.gigbook-website .gb-day { aspect-ratio: 1; min-width: 0; padding: 0; border: 1px solid #c9cdd4; border-radius: 2px; font: inherit; font-weight: bold; cursor: pointer; box-shadow: none; text-shadow: none; background-image: none; }
.gigbook-website .gb-open { background: var(--gb-open); color: var(--gb-open-text); }
.gigbook-website .gb-booked { background: var(--gb-booked); color: var(--gb-booked-text); }
.gigbook-website .gb-tentative { background: var(--gb-tentative); color: var(--gb-tentative-text); }
.gigbook-website .gb-closed, .gigbook-website .gb-unknown { background: var(--gb-closed); color: var(--gb-closed-text); }
.gigbook-website .gb-past { background: #f4f5f7; color: #b8bbc1; font-weight: normal; cursor: default; }
.gigbook-website .gb-blank { border: 1px solid #eceef1; border-radius: 2px; background: #fafbfc; }
.gigbook-website .gb-picked { box-shadow: inset 0 0 0 3px currentColor; }
.gigbook-website .gb-day:focus-visible { outline: 2px solid #2f80ed; outline-offset: 1px; }

.gigbook-website .gb-legend { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 16px; font-size: .9em; }
.gigbook-website .gb-legend li { margin: 0; }
.gigbook-website .gb-swatch { display: inline-block; width: 14px; height: 14px; vertical-align: -2px; border-radius: 2px; border: 1px solid #c9cdd4; }

.gigbook-website .gb-form h3, .gigbook-website .gb-thanks h3, .gigbook-website .gb-spacer { margin: 0 0 8px; }
.gigbook-website .gb-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; }
.gigbook-website .gb-wide { grid-column: 1 / -1; }
.gigbook-website .gb-form label { display: block; margin: 0; font-weight: bold; }
.gigbook-website .gb-form input, .gigbook-website .gb-form select, .gigbook-website .gb-form textarea { display: block; width: 100%; height: 38px; box-sizing: border-box; margin: 2px 0 0; padding: 6px 8px; font: inherit; font-weight: normal; }
.gigbook-website .gb-form textarea { height: auto; }
.gigbook-website .gb-form input[readonly] { cursor: default; }
.gigbook-website .gb-req { color: #e55; }
.gigbook-website .gb-warning { margin: 0; color: #f0a830; font-weight: bold; }
.gigbook-website .gb-problems { margin: 8px 0 0 18px; color: #e55; }

.gigbook-website .gb-time { position: relative; min-width: 0; }
.gigbook-website .gb-time-list { position: absolute; z-index: 20; left: 0; right: 0; max-height: 220px; overflow-y: auto; margin: 0; padding: 0; list-style: none; background: #fff; color: #222; border: 1px solid #888; box-shadow: 0 4px 12px rgb(0 0 0 / .4); }
.gigbook-website .gb-time-list li { margin: 0; padding: 5px 8px; cursor: pointer; }
.gigbook-website .gb-time-list li:hover, .gigbook-website .gb-time-list li.gb-at { background: #2f80ed; color: #fff; }

.gigbook-website .gb-send { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin-top: 10px; }
.gigbook-website .gb-submit { padding: 10px 28px; font: inherit; cursor: pointer; }
.gigbook-website .gb-submit:disabled { opacity: .5; }
.gigbook-website .gb-note { margin: 8px 0 0; font-size: .9em; }
.gigbook-website .gb-trap { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* an empty label the size of the form's, so the calendar lines up with its first boxes; not when they stack */
.gigbook-website .gb-spacer-label { margin: 0 0 2px; font-weight: bold; }
@media (max-width: 800px) {
    .gigbook-website .gb-spacer { display: none; }
}
@media (max-width: 480px) {
    .gigbook-website .gb-fields { grid-template-columns: minmax(0, 1fr); }
}

/* hints in the boxes are dim and slanted, so they can't pass for something filled in (owner, 2026-11-09: the "e.g. 6:30 PM" time hint
   looked like a real time) */
.gigbook-website .gb-form input::placeholder, .gigbook-website .gb-form textarea::placeholder { color: #9aa0a8; font-style: italic; opacity: 1; }