/* UTC Booking v3.2 — Mobile-first, readable, scoped #utc-booking-app */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

#utc-booking-app { font-family:'Poppins',sans-serif!important; color:#eee!important; box-sizing:border-box; }
#utc-booking-app *, #utc-booking-app *::before, #utc-booking-app *::after { box-sizing:border-box; }

/* ── Fix parent background stretch — desktop only, mobile untouched ── */
@media(min-width:768px) {
    .ast-container:has(#utc-booking-app),
    .ast-separate-container:has(#utc-booking-app),
    .entry-content:has(#utc-booking-app),
    .site-content:has(#utc-booking-app),
    .page-content:has(#utc-booking-app),
    .wp-block-group:has(#utc-booking-app),
    .wp-block-cover:has(#utc-booking-app),
    #content:has(#utc-booking-app),
    #primary:has(#utc-booking-app),
    main:has(#utc-booking-app),
    section:has(#utc-booking-app),
    div:has(> #utc-booking-app) {
        background-attachment:fixed!important;
    }
}

/* ── Tabs ── */
#utc-booking-app .utc-tabs-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; margin-bottom:10px; }
#utc-booking-app .utc-tabs-wrap::-webkit-scrollbar { display:none; }
#utc-booking-app .utc-tabs { display:flex!important; gap:8px!important; white-space:nowrap; }
#utc-booking-app .utc-tab {
    appearance:none!important; display:inline-block!important; flex-shrink:0;
    padding:10px 20px!important; border-radius:8px!important;
    border:1px solid #444!important; background:#1e1e1e!important; color:#ccc!important;
    font:600 13px/1.4 'Poppins',sans-serif!important; cursor:pointer!important;
    text-decoration:none!important; box-shadow:none!important;
    white-space:nowrap!important; transition:all .15s!important;
}
#utc-booking-app .utc-tab:hover { border-color:#c8f041!important; color:#c8f041!important; }
#utc-booking-app .utc-tab.active { background:#c8f041!important; color:#111!important; border-color:#c8f041!important; font-weight:700!important; }

/* ── Filter Row ── */
#utc-booking-app .utc-filters-row { display:flex!important; gap:8px!important; margin-bottom:10px!important; flex-wrap:wrap; }
#utc-booking-app .utc-dropdown { position:relative; }
#utc-booking-app .utc-dropdown-btn {
    appearance:none!important; display:flex!important; align-items:center!important; gap:6px;
    padding:8px 16px!important; border-radius:8px!important;
    border:1px solid #444!important; background:#1e1e1e!important; color:#ccc!important;
    font:500 12px/1.4 'Poppins',sans-serif!important; cursor:pointer!important;
    white-space:nowrap!important; transition:all .15s!important;
}
#utc-booking-app .utc-dropdown-btn:hover { border-color:#c8f041!important; color:#c8f041!important; }
#utc-booking-app .utc-dropdown.open .utc-dropdown-btn { border-color:#c8f041!important; color:#c8f041!important; }
#utc-booking-app .utc-arrow { font-size:9px; transition:transform .15s; }
#utc-booking-app .utc-dropdown.open .utc-arrow { transform:rotate(180deg); }

#utc-booking-app .utc-dropdown-menu {
    display:none; position:absolute; top:calc(100% + 4px); left:0; z-index:100;
    min-width:200px; max-height:280px; overflow-y:auto;
    background:#1e1e1e!important; border:1px solid #444!important; border-radius:8px!important;
    padding:4px!important; box-shadow:0 8px 24px rgba(0,0,0,.6)!important;
}
#utc-booking-app .utc-dropdown.open .utc-dropdown-menu { display:block; }
#utc-booking-app .utc-dd-item {
    appearance:none!important; display:block!important; width:100%!important; text-align:left!important;
    padding:10px 14px!important; border:none!important; background:transparent!important;
    color:#ccc!important; font:500 12px/1.4 'Poppins',sans-serif!important;
    cursor:pointer!important; border-radius:6px!important; transition:all .1s!important;
}
#utc-booking-app .utc-dd-item:hover { background:#2a2a2a!important; color:#fff!important; }
#utc-booking-app .utc-dd-item.active { background:rgba(200,240,65,.12)!important; color:#c8f041!important; font-weight:700!important; }

/* ── Active Filter Tags ── */
#utc-booking-app .utc-active-filters { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
#utc-booking-app .utc-filter-tag {
    display:inline-flex!important; align-items:center!important; gap:4px;
    padding:4px 12px!important; border-radius:20px!important;
    background:rgba(200,240,65,.12)!important; color:#c8f041!important;
    font:600 11px/1.4 'Poppins',sans-serif!important;
}
#utc-booking-app .utc-tag-x {
    appearance:none!important; border:none!important; background:transparent!important;
    color:#c8f041!important; font-size:14px!important; cursor:pointer!important;
    padding:0 0 0 2px!important; line-height:1;
}
#utc-booking-app .utc-tag-x:hover { color:#fff!important; }

/* ── Grid ── */
#utc-booking-app .utc-schedule-grid { display:grid!important; grid-template-columns:1fr; gap:12px!important; }
@media(min-width:520px) { #utc-booking-app .utc-schedule-grid { grid-template-columns:repeat(2,1fr)!important; } }
@media(min-width:900px) { #utc-booking-app .utc-schedule-grid { grid-template-columns:repeat(3,1fr)!important; } }

/* ── Card ── */
#utc-booking-app .utc-card {
    background:#1e1e1e!important; border:1px solid #333!important; border-radius:12px!important;
    overflow:hidden; transition:transform .15s,border-color .15s!important;
}
#utc-booking-app .utc-card:hover { transform:translateY(-2px)!important; border-color:#c8f041!important; }
#utc-booking-app .utc-card-full { opacity:.45!important; }
#utc-booking-app .utc-card-full:hover { transform:none!important; border-color:#333!important; }
#utc-booking-app .utc-card-accent { height:4px; width:100%; }
#utc-booking-app .utc-card-body { padding:14px 16px 16px!important; position:relative; }

/* Badge row */
#utc-booking-app .utc-card-row { display:flex!important; justify-content:space-between!important; align-items:center!important; margin-bottom:8px!important; gap:6px; }
#utc-booking-app .utc-badge {
    padding:3px 10px!important; border-radius:4px!important; font-size:10px!important; font-weight:700!important;
    text-transform:uppercase!important; letter-spacing:.4px!important;
    white-space:nowrap; /* bg + color set inline per level */
}
#utc-booking-app .utc-special-inline {
    font-size:9px!important; font-weight:600!important; opacity:.8; text-transform:none!important; letter-spacing:0!important;
}
#utc-booking-app .utc-slots { font-size:11px!important; font-weight:600!important; color:#52b788!important; white-space:nowrap; }
#utc-booking-app .utc-slots.low  { color:#ff9f43!important; }
#utc-booking-app .utc-slots.full { color:#ff6b6b!important; }

/* ★ DAY + DATE — biggest, highlighted, bold ★ */
#utc-booking-app .utc-day-date {
    font-size:20px!important; font-weight:800!important; color:#fff!important;
    line-height:1.2!important; margin-bottom:2px!important;
}

/* ★ TIME — below day, slightly smaller, still bold ★ */
#utc-booking-app .utc-time {
    font-size:16px!important; font-weight:700!important; color:#e0e0e0!important;
    line-height:1.3!important; margin-bottom:8px!important;
}

/* COACH — clear */
#utc-booking-app .utc-coach {
    font-size:13px!important; color:#e0e0e0!important; margin-bottom:6px!important; font-weight:600!important;
}

/* LOCATION — blue link style */
#utc-booking-app .utc-loc {
    display:inline-flex!important; align-items:center!important; gap:3px;
    font-size:13px!important; color:#4dabf7!important; margin-bottom:12px!important;
    text-decoration:none!important; cursor:pointer!important; transition:color .15s!important;
    font-weight:500!important;
}
#utc-booking-app .utc-loc:hover { color:#74c0fc!important; text-decoration:underline!important; }

/* Card bottom */
#utc-booking-app .utc-card-bottom {
    display:flex!important; justify-content:space-between!important; align-items:center!important;
    border-top:1px solid #333!important; padding-top:12px!important;
}
#utc-booking-app .utc-price { font-size:16px!important; font-weight:700!important; color:#c8f041!important; }
#utc-booking-app .utc-price small { font-size:11px!important; font-weight:400!important; color:#999!important; margin-left:2px; }

#utc-booking-app .utc-btn-book {
    appearance:none!important; background:#c8f041!important; color:#111!important; border:none!important;
    padding:10px 20px!important; border-radius:8px!important; font:700 12px/1 'Poppins',sans-serif!important;
    cursor:pointer!important; white-space:nowrap!important; transition:opacity .15s!important;
}
#utc-booking-app .utc-btn-book:hover { opacity:.85!important; }
#utc-booking-app .utc-btn-book:disabled,
#utc-booking-app .utc-btn-book[disabled] { background:#333!important; color:#666!important; cursor:not-allowed!important; }

/* ── Loading & empty ── */
#utc-booking-app .utc-loading { text-align:center; padding:40px 16px; color:#999; grid-column:1/-1; }
#utc-booking-app .utc-spinner { width:28px;height:28px;border:3px solid #333;border-top-color:#c8f041;border-radius:50%;animation:utcspin .6s linear infinite;margin:0 auto 10px; }
@keyframes utcspin{to{transform:rotate(360deg)}}

#utc-booking-app .utc-empty { text-align:center; padding:40px 16px; color:#999; grid-column:1/-1; }
#utc-booking-app .utc-empty-icon { font-size:36px; margin-bottom:8px; }
#utc-booking-app .utc-empty h3 { font-size:15px!important; color:#ddd!important; margin:0 0 6px!important; font-weight:600!important; }
#utc-booking-app .utc-empty p  { font-size:13px!important; color:#999!important; margin:0!important; }
#utc-booking-app .utc-btn-seeall {
    appearance:none!important; margin-top:12px!important; padding:10px 24px!important;
    background:#c8f041!important; color:#111!important; border:none!important;
    border-radius:8px!important; font:700 12px/1 'Poppins',sans-serif!important; cursor:pointer!important;
}

/* ── Modal ── */
#utc-booking-app .utc-modal { display:none!important; position:fixed; inset:0; z-index:99999; align-items:center; justify-content:center; padding:16px; }
#utc-booking-app .utc-modal.open { display:flex!important; }
#utc-booking-app .utc-modal-overlay { position:absolute; inset:0; background:rgba(0,0,0,.8); }
#utc-booking-app .utc-modal-content {
    position:relative; z-index:1; background:#1e1e1e!important; border:1px solid #444!important;
    border-radius:14px!important; padding:22px!important; width:100%; max-width:420px; max-height:90vh; overflow-y:auto;
}
#utc-booking-app .utc-modal-close {
    position:absolute; top:12px; right:12px; background:#333!important; border:none!important;
    width:30px;height:30px;border-radius:50%;font-size:18px;cursor:pointer;color:#999;
    display:flex;align-items:center;justify-content:center; line-height:1;
}
#utc-booking-app .utc-modal-close:hover { color:#fff!important; }

#utc-booking-app .utc-session-summary { background:rgba(200,240,65,.06)!important; border:1px solid rgba(200,240,65,.2)!important; border-radius:10px!important; padding:12px 14px!important; margin-bottom:18px!important; }
#utc-booking-app .utc-session-summary h4 { margin:0 0 6px!important; font-size:15px!important; font-weight:700!important; color:#c8f041!important; }
#utc-booking-app .utc-session-summary p  { margin:3px 0!important; font-size:13px!important; color:#ccc!important; }

/* ── Form ── */
#utc-booking-app .utc-modal-content h3 { font-size:10px!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.8px!important;color:#999!important;margin:16px 0 10px!important; }
#utc-booking-app .utc-form-group { margin-bottom:10px!important; }
#utc-booking-app .utc-form-group label { display:block!important;font-size:13px!important;font-weight:600!important;margin-bottom:4px!important;color:#ddd!important; }
#utc-booking-app .utc-form-group input {
    width:100%!important;padding:10px 14px!important;background:#141414!important;border:1px solid #444!important;
    border-radius:8px!important;font-size:14px!important;color:#eee!important;font-family:'Poppins',sans-serif!important;outline:none!important;
}
#utc-booking-app .utc-form-group input:focus { border-color:#c8f041!important; }
#utc-booking-app .utc-form-group input::placeholder { color:#555!important; }
#utc-booking-app .required { color:#ff6b6b!important; }
#utc-booking-app .optional { color:#777!important;font-size:10px!important; }

/* ── Booking Buttons ── */
#utc-booking-app .utc-booking-buttons { display:flex!important;flex-direction:column!important;gap:10px!important; }
#utc-booking-app .utc-book-link {
    display:flex!important;align-items:center!important;gap:12px!important;
    padding:14px 16px!important;border-radius:10px!important;border:2px solid transparent!important;
    text-decoration:none!important;cursor:pointer!important;transition:all .15s!important;
}
#utc-booking-app .utc-book-link:hover { opacity:.9!important;transform:translateY(-1px)!important; }
#utc-booking-app .utc-book-icon { font-size:22px!important;flex-shrink:0; }
#utc-booking-app .utc-book-link strong { font-size:14px!important;display:block!important; }
#utc-booking-app .utc-book-link small  { font-size:11px!important;opacity:.8; }

/* Kuyy — blue */
#utc-booking-app .utc-book-kuyy { background:#0066ff!important;border-color:#0066ff!important; }
#utc-booking-app .utc-book-kuyy strong,
#utc-booking-app .utc-book-kuyy small { color:#fff!important; }

/* Reclub — green */
#utc-booking-app .utc-book-reclub { background:#1a8f3c!important;border-color:#1a8f3c!important; }
#utc-booking-app .utc-book-reclub strong,
#utc-booking-app .utc-book-reclub small { color:#fff!important; }

/* WhatsApp — WA green */
#utc-booking-app .utc-book-wa { background:#25d366!important;border-color:#25d366!important; }
#utc-booking-app .utc-book-wa strong { color:#fff!important; }
#utc-booking-app .utc-book-wa small  { color:rgba(255,255,255,.85)!important; }

#utc-booking-app .utc-form-total { text-align:right!important;font-size:12px!important;color:#999!important;margin-bottom:14px!important;padding-top:10px!important;border-top:1px solid #333!important; }
#utc-booking-app .utc-form-total strong { display:block!important;font-size:20px!important;font-weight:700!important;color:#c8f041!important; }

#utc-booking-app .utc-error { margin-top:8px;padding:10px 14px;background:rgba(255,80,80,.1);border:1px solid rgba(255,80,80,.25);border-radius:8px;color:#ff8a8a;font-size:12px; }
#utc-booking-app .utc-banner { background:rgba(200,240,65,.1);border:1px solid rgba(200,240,65,.25);border-radius:10px;padding:12px 16px;color:#c8f041;font-weight:600;margin-bottom:16px;font-size:13px; }

/* ── Mobile ── */
@media(max-width:520px) {
    #utc-booking-app .utc-tabs { flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
    #utc-booking-app .utc-tabs::-webkit-scrollbar { display:none; }
    #utc-booking-app .utc-day-date { font-size:17px!important; }
    #utc-booking-app .utc-time { font-size:14px!important; }
    #utc-booking-app .utc-coach { font-size:12px!important; }
    #utc-booking-app .utc-loc { font-size:12px!important; }
    #utc-booking-app .utc-price { font-size:15px!important; }
    #utc-booking-app .utc-btn-book { padding:9px 16px!important;font-size:11px!important; }
    #utc-booking-app .utc-modal-content { padding:18px!important; }
    #utc-booking-app .utc-tab { padding:9px 14px!important;font-size:11px!important; }
    #utc-booking-app .utc-dropdown-btn { padding:8px 12px!important;font-size:11px!important; }
}
