:root {
    --ink: #17131f;
    --muted: #777381;
    --red: #e5484d;
    --line: #e9e8f0;
    --background: #f5f5fd;
    --oo-font-family: 'Plus Jakarta Sans', Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; color: var(--ink); background: var(--background); font-family: var(--oo-font-family)!important; -webkit-font-smoothing: antialiased; }
.oo-booking-page *,
.oo-booking-page input,
.oo-booking-page select,
.oo-booking-page textarea,
.oo-booking-page button,
.oo-booking-page option { font-family: var(--oo-font-family)!important; }
.oo-booking-page.oo-booking-embed { min-height: 0; background: transparent; }
.oo-booking-embed .oo-booking-shell { width: 100%; min-height: 720px; margin: 0; border-radius: 0; box-shadow: none; }
.oo-booking-shell { width: min(1120px, calc(100% - 32px)); min-height: 680px; margin: 48px auto; border-radius: 28px; overflow: hidden; background: #fff; box-shadow: 0 30px 80px rgba(28, 20, 55, .10); display: grid; grid-template-columns: .85fr 1.15fr; }
.oo-booking-intro { position: relative; padding: 48px; color: #fff; background:var(--oo-hero-background,#241a2c); display: flex; flex-direction: column; justify-content: space-between; }
.oo-booking-intro::after { content: '♫'; position: absolute; right: -25px; bottom: 40px; color: rgba(255,255,255,.06); font-size: 260px; line-height: 1; transform: rotate(-12deg); }
.oo-public-brand { position: relative; z-index: 1; color: #fff; text-decoration: none; display: flex; align-items: center; gap: 12px; font-size: 20px; }
.oo-public-brand > span { width: 42px; height: 42px; border-radius: 12px; background: var(--red); display: grid; place-items: center; }
.oo-public-brand > span img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.oo-public-brand b { color: #ff777b; }
.oo-booking-intro > div { position: relative; z-index: 1; }
.oo-public-pill { display: inline-block; padding: 7px 11px; border-radius: 99px; background: rgba(255,255,255,.12); font-size: 10px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.oo-booking-intro h1 { max-width: 410px; margin: 20px 0 16px; font-size: clamp(38px, 5vw, 58px); line-height: 1.03; letter-spacing: -.05em; }
.oo-booking-intro p { max-width: 430px; margin: 0; color: rgba(255,255,255,.67); font-size: 14px; line-height: 1.75; }
.oo-booking-intro footer { position: relative; z-index: 1; color: rgba(255,255,255,.48); font-size: 11px; }.oo-booking-intro footer a { color: #ff777b; font-weight: 700; text-decoration: none; }
.oo-booking-intro.oo-text-dark { color:#17131f }.oo-booking-intro.oo-text-dark .oo-public-brand { color:#17131f }.oo-booking-intro.oo-text-dark .oo-public-pill { color:#17131f; background:rgba(23,19,31,.09) }.oo-booking-intro.oo-text-dark p { color:rgba(23,19,31,.68) }.oo-booking-intro.oo-text-dark footer { color:rgba(23,19,31,.52) }.oo-booking-intro.oo-text-dark::after { color:rgba(23,19,31,.055) }.oo-booking-intro.oo-text-dark footer a { color:#c9363b }
.oo-booking-form-card { padding: 52px clamp(30px, 6vw, 72px); display: grid; align-content: center; }
.oo-form-heading { margin-bottom: 28px; display: flex; align-items: center; gap: 15px; }.oo-form-heading > span { width: 38px; height: 38px; border-radius: 12px; color: var(--red); background: #ffe8e9; display: grid; place-items: center; font-size: 11px; font-weight: 800; }.oo-form-heading h2 { margin: 0; font-size: 25px; letter-spacing: -.035em; }.oo-form-heading p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.oo-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }.oo-field { margin-bottom: 17px; display: block; }.oo-field > span { margin-bottom: 7px; display: flex; justify-content: space-between; color: #54505c; font-size: 11px; font-weight: 700; }.oo-field small { color: #aaa6b0; font-size: 9px; font-weight: 500; }.oo-field input,.oo-field select,.oo-field textarea { width: 100%; border: 1px solid var(--line); border-radius: 12px; outline: 0; color: var(--ink); background: #fafafd; font: inherit; font-size: 12px; transition: .2s; }.oo-field input,.oo-field select { height: 45px; padding: 0 13px; }.oo-field textarea { padding: 13px; resize: vertical; }.oo-field input:focus,.oo-field select:focus,.oo-field textarea:focus { border-color: #d79093; background: #fff; box-shadow: 0 0 0 3px rgba(229,72,77,.08); }
.oo-submit-booking { width: 100%; height: 49px; border: 0; border-radius: 13px; color: #fff; background: var(--ink); display: flex; align-items: center; justify-content: center; gap: 12px; font: 700 12px 'Plus Jakarta Sans',sans-serif; cursor: pointer; box-shadow: 0 12px 28px rgba(23,19,31,.16); }.oo-submit-booking span { font-size: 18px; }.oo-privacy-note { margin: 12px 0 0; color: #aaa6b0; font-size: 9px; text-align: center; }.oo-form-error { padding: 10px 13px; border-radius: 10px; color: #a62e32; background: #ffe8e9; font-size: 11px; }
.oo-booking-success { text-align: center; }.oo-booking-success > span { width: 64px; height: 64px; margin: 0 auto 20px; border-radius: 20px; color: #fff; background: #51ae8a; display: grid; place-items: center; font-size: 28px; }.oo-booking-success h2 { margin: 0 0 10px; font-size: 28px; }.oo-booking-success p { max-width: 440px; margin: 0 auto 24px; color: var(--muted); font-size: 13px; line-height: 1.7; }.oo-booking-success a { color: var(--red); font-size: 12px; font-weight: 700; }
.oo-availability-message { min-height: 16px; margin: -10px 0 10px; color: #b13439; font-size: 10px; font-weight: 600; }
.oo-field select:disabled { color: #aaa6b0; cursor: not-allowed; opacity: .7; }
.oo-uppercase-input { text-transform: uppercase; }
@media (max-width: 760px) { .oo-booking-shell { margin: 16px auto; grid-template-columns: 1fr; }.oo-booking-intro { min-height: 370px; padding: 32px; }.oo-booking-form-card { padding: 36px 24px; }.oo-form-grid { grid-template-columns: 1fr; gap: 0; } }
.oo-form-grid--three { grid-template-columns:1.15fr 1fr .8fr }
@media (max-width:900px) { .oo-form-grid--three { grid-template-columns:1fr } }

/* Public schedule picker */
.oo-booking-picker-field input[type="hidden"] { display:none!important; }
.oo-booking-picker-trigger { width:100%; height:45px; padding:0 13px; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:#fafafd; display:flex; align-items:center; justify-content:space-between; gap:12px; text-align:left; font-size:12px; cursor:pointer; transition:.2s; }
.oo-booking-picker-trigger:hover:not(:disabled),.oo-booking-picker-trigger:focus-visible { border-color:#d79093; background:#fff; box-shadow:0 0 0 3px rgba(229,72,77,.08); outline:0; }
.oo-booking-picker-trigger:disabled { color:#aaa6b0; cursor:not-allowed; opacity:.7; }
.oo-booking-picker-trigger svg { width:17px; height:17px; flex:0 0 17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
html.oo-booking-modal-open,html.oo-booking-modal-open body { overflow:hidden; }
.oo-booking-schedule-modal[hidden] { display:none!important; }
.oo-booking-schedule-modal { position:fixed; inset:0; z-index:999999; display:grid; place-items:center; padding:24px; }
.oo-booking-schedule-backdrop { position:absolute; inset:0; background:rgba(8,7,11,.72); -webkit-backdrop-filter:blur(13px); backdrop-filter:blur(13px); }
.oo-booking-schedule-dialog { position:relative; width:min(640px,100%); max-height:min(760px,calc(100vh - 48px)); overflow:auto; border:1px solid rgba(255,255,255,.12); border-radius:26px; color:#fff; background:linear-gradient(180deg,#1c1a20 0%,#121116 100%); box-shadow:0 35px 100px rgba(0,0,0,.45); animation:ooBookingScheduleIn .2s ease-out; }
@keyframes ooBookingScheduleIn { from { opacity:0; transform:translateY(12px) scale(.985) } to { opacity:1; transform:none } }
.oo-booking-schedule-header { padding:28px 30px 20px; display:flex; justify-content:space-between; gap:20px; }
.oo-booking-schedule-kicker { color:#ff656b; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.oo-booking-schedule-header h2 { margin:7px 0 5px; font-size:25px; line-height:1.12; letter-spacing:-.035em; }
.oo-booking-schedule-header p { margin:0; color:#918d99; font-size:11px; line-height:1.55; }
.oo-booking-schedule-close { width:38px; height:38px; flex:0 0 38px; border:1px solid rgba(255,255,255,.08); border-radius:12px; color:#a9a5af; background:#26242b; font-size:24px; line-height:1; cursor:pointer; }
.oo-booking-schedule-view { padding:0 30px 30px; }
.oo-booking-calendar-nav { height:58px; margin-bottom:13px; border:1px solid rgba(255,255,255,.09); border-radius:15px; display:grid; grid-template-columns:48px 1fr 48px; align-items:center; }
.oo-booking-calendar-nav strong { text-align:center; font-size:13px; text-transform:capitalize; }
.oo-booking-calendar-nav button { width:36px; height:36px; margin:auto; border:0; border-radius:10px; color:#fff; background:transparent; font-size:24px; cursor:pointer; }
.oo-booking-calendar-nav button:hover:not(:disabled) { background:rgba(255,255,255,.08); }
.oo-booking-calendar-nav button:disabled { opacity:.2; cursor:not-allowed; }
.oo-booking-calendar-weekdays,.oo-booking-calendar-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:7px; }
.oo-booking-calendar-weekdays { padding:0 4px 8px; }
.oo-booking-calendar-weekdays span { color:#8e8a94; font-size:9px; font-weight:700; text-align:center; text-transform:uppercase; }
.oo-booking-calendar-day { position:relative; aspect-ratio:1/1; min-height:54px; border:1px solid transparent; border-radius:13px; color:#f4f2f6; background:transparent; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; cursor:pointer; transition:.18s ease; }
.oo-booking-calendar-day span { font-size:12px; font-weight:700; }
.oo-booking-calendar-day i { width:5px; height:5px; border-radius:50%; background:#6bc58c; box-shadow:0 0 0 4px rgba(107,197,140,.08); }
.oo-booking-calendar-day.is-partial i { background:#e1b852; box-shadow:0 0 0 4px rgba(225,184,82,.08); }
.oo-booking-calendar-day.is-unavailable i,.oo-booking-calendar-day.is-past i { background:#e8666b; box-shadow:none; }
.oo-booking-calendar-day:hover:not(:disabled) { border-color:rgba(255,255,255,.14); background:#25232a; transform:translateY(-1px); }
.oo-booking-calendar-day.is-selected { border-color:#6b7cff; background:#5368ea; box-shadow:0 9px 24px rgba(83,104,234,.25); }
.oo-booking-calendar-day.is-selected i { background:#fff; box-shadow:none; }
.oo-booking-calendar-day.is-today:not(.is-selected) { border-color:rgba(255,255,255,.13); }
.oo-booking-calendar-day:disabled { opacity:.28; cursor:not-allowed; }
.oo-booking-calendar-day.is-outside { visibility:hidden; }
.oo-booking-calendar-legend { margin-top:20px; padding-top:18px; border-top:1px solid rgba(255,255,255,.07); display:flex; flex-wrap:wrap; gap:18px; color:#918d99; font-size:9px; }
.oo-booking-calendar-legend span { display:flex; align-items:center; gap:7px; }
.oo-booking-calendar-legend i { width:7px; height:7px; border-radius:50%; }
.oo-booking-calendar-legend i.is-available { background:#6bc58c; }.oo-booking-calendar-legend i.is-partial { background:#e1b852; }.oo-booking-calendar-legend i.is-unavailable { background:#e8666b; }
.oo-booking-selected-date { margin-bottom:18px; padding:14px 16px; border:1px solid rgba(255,255,255,.08); border-radius:15px; background:#19181d; display:flex; align-items:center; gap:13px; }
.oo-booking-selected-date button { width:34px; height:34px; border:0; border-radius:10px; color:#fff; background:#25232a; cursor:pointer; }
.oo-booking-selected-date div { display:grid; gap:2px; }.oo-booking-selected-date small { color:#7f7b85; font-size:9px; }.oo-booking-selected-date strong { font-size:12px; text-transform:capitalize; }
.oo-booking-time-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.oo-booking-time-option { min-height:64px; padding:10px; border:1px solid rgba(255,255,255,.11); border-radius:13px; color:#fff; background:#1b1a1f; display:grid; place-items:center; gap:2px; cursor:pointer; transition:.18s; }
.oo-booking-time-option strong { font-size:12px; }.oo-booking-time-option span { color:#87c69e; font-size:9px; }
.oo-booking-time-option:hover:not(:disabled) { border-color:#6b7cff; background:#22232c; transform:translateY(-1px); }
.oo-booking-time-option.is-selected { border-color:#6b7cff; box-shadow:0 0 0 2px rgba(107,124,255,.22); }
.oo-booking-time-option.is-occupied { border-color:rgba(232,102,107,.12); color:#e66a6f; background:rgba(110,40,45,.09); cursor:not-allowed; }
.oo-booking-time-option.is-occupied span { color:#c85d62; }
.oo-booking-time-note { margin:18px 0 0; color:#77737d; font-size:9px; text-align:center; }
.oo-booking-time-empty { grid-column:1/-1; padding:28px 15px; border:1px dashed rgba(255,255,255,.12); border-radius:14px; color:#9c98a2; font-size:11px; text-align:center; }
@media (max-width:640px) {
    .oo-booking-schedule-modal { padding:0; }
    .oo-booking-schedule-dialog { width:100%; max-height:88vh; border-radius:24px 24px 0 0; border-bottom:0; }
    .oo-booking-schedule-header { padding:22px 20px 16px; }
    .oo-booking-schedule-view { padding:0 20px 24px; }
    .oo-booking-calendar-day { min-height:43px; border-radius:11px; }
    .oo-booking-calendar-weekdays,.oo-booking-calendar-grid { gap:4px; }
    .oo-booking-time-grid { grid-template-columns:repeat(2,1fr); }
    .oo-booking-calendar-legend { gap:10px; }
}

/* =========================================================
   MOBILE — HERO / BRAND BOOKING
   ========================================================= */
@media (max-width: 760px) {

    .oo-booking-shell {
        margin: 0 auto;
        width: 100%;
        border-radius: 0;
    }

    .oo-booking-intro {
        min-height: auto !important;
        padding: 26px 24px 32px !important;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        gap: 0;
    }

    /* Logo + nombre */
    .oo-public-brand {
        display: flex;
        align-items: center;
        gap: 12px;
        margin: 0 0 28px;
    }

    .oo-public-brand > span {
        width: 46px;
        height: 46px;
        min-width: 46px;
        border-radius: 12px;
    }

    .oo-public-brand > span img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: inherit;
    }

    .oo-public-brand {
        font-size: 20px;
        line-height: 1.1;
    }

    /*
     * Contenedor que incluye:
     * RESERVA ONLINE + título + descripción
     */
    .oo-booking-intro > div {
        position: relative;
        display: block;
        margin: 0;
    }

    /* Badge */
    .oo-public-pill {
        position: static !important;
        display: inline-flex;
        align-items: center;
        width: fit-content;
        margin: 0 0 16px !important;
        padding: 7px 11px;
        transform: none !important;
    }

    /* Título */
    .oo-booking-intro h1 {
        margin: 0 0 14px;
        max-width: 320px;
        font-size: 38px;
        line-height: 1.02;
    }

    /* Descripción */
    .oo-booking-intro p {
        margin: 0;
        max-width: 340px;
        font-size: 13px;
        line-height: 1.65;
    }

    /* Footer */
    .oo-booking-intro footer {
        margin-top: 32px;
    }

    /* Nota musical decorativa */
    .oo-booking-intro::after {
        right: -30px;
        bottom: -25px;
        font-size: 190px;
    }
}
/* 0.8.0 — artist names use normal capitalization */
.oo-uppercase-input{text-transform:none!important;}