/*
 * Agendamento nativo (partials/live-booking.blade.php).
 * Cada template define só as variáveis --lb-* no seu CSS (ou no wrapper); o resto é neutro.
 */
:where(.lb){
    /* :where() = especificidade zero: as variáveis do template sempre vencem estes padrões */
    --lb-bg:#f6f3ee;--lb-ink:#1a1715;--lb-muted:#6f6962;--lb-line:#d9d2c8;--lb-field:#fff;
    --lb-accent:#8a1f14;--lb-accent-ink:#fff;
    --lb-radius:20px;--lb-field-radius:12px;--lb-font-head:inherit;
}
.lb{
    --lb-soft:color-mix(in srgb,var(--lb-accent) 10%,transparent);
    background:var(--lb-bg);color:var(--lb-ink);border-radius:var(--lb-radius);padding:30px;min-width:0;max-width:100%;text-align:left
}
.lb *{box-sizing:border-box}
.lb-head{display:flex;gap:14px;align-items:center;padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid var(--lb-line)}
.lb-head-num{font-family:var(--lb-font-head);font-size:38px;line-height:1;color:var(--lb-accent)}
.lb-head strong{display:block;font-size:16px}
.lb-head small{display:block;margin-top:3px;font-size:13px;color:var(--lb-muted)}
.lb-field{margin:0 0 16px;display:block;border:0;padding:0}
.lb-field>label,.lb-field label{display:grid;gap:7px;margin:0}
.lb-field label>span,.lb-label{display:block;margin:0 0 7px;font-size:10.5px;line-height:1.2;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lb-ink)}
.lb-field label>span{margin:0}
.lb input[type=text],.lb input[type=tel],.lb input[type=date],.lb select,.lb textarea{
    width:100%;min-height:46px;padding:12px 14px;border:1px solid var(--lb-line);border-radius:var(--lb-field-radius);
    background:var(--lb-field);color:var(--lb-ink);font:inherit;font-size:15px;box-shadow:none;appearance:auto
}
.lb textarea{resize:vertical;min-height:70px}
.lb input:focus,.lb select:focus,.lb textarea:focus{outline:2px solid var(--lb-accent);outline-offset:1px;border-color:var(--lb-accent)}
.lb-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lb-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.lb-hint{margin:0;padding:14px;border:1px dashed var(--lb-line);border-radius:var(--lb-field-radius);font-size:13.5px;color:var(--lb-muted);text-align:center}

.lb-pros{display:flex;flex-wrap:wrap;gap:8px}
.lb-pro{display:inline-flex;align-items:center;gap:9px;min-height:46px;padding:5px 16px 5px 6px;border:1px solid var(--lb-line);border-radius:999px;background:var(--lb-field);color:var(--lb-ink);font:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:border-color .15s,background .15s}
.lb-pro img{width:34px;height:34px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.lb-pro-initial{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;background:var(--lb-soft);color:var(--lb-accent);font-style:normal;font-weight:700}
.lb-pro:hover{border-color:color-mix(in srgb,var(--lb-ink) 35%,var(--lb-line))}
.lb-pro.is-on{border-color:var(--lb-accent);background:var(--lb-soft);box-shadow:inset 0 0 0 1px var(--lb-accent)}

.lb-days{max-width:100%;display:flex;gap:8px;overflow-x:auto;padding:2px 2px 8px;margin:0 -2px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.lb-day{flex:0 0 auto;width:64px;padding:8px 4px;border:1px solid var(--lb-line);border-radius:var(--lb-field-radius);background:var(--lb-field);color:var(--lb-ink);font:inherit;text-align:center;cursor:pointer;display:grid;gap:1px;transition:border-color .15s,background .15s}
.lb-day small{font-size:10px;text-transform:uppercase;letter-spacing:.02em;color:var(--lb-muted);white-space:nowrap}
.lb-day b{font-size:19px;line-height:1.15}
.lb-day:hover{border-color:color-mix(in srgb,var(--lb-ink) 35%,var(--lb-line))}
.lb-day.is-on{background:var(--lb-accent);border-color:var(--lb-accent);color:var(--lb-accent-ink)}
.lb-day.is-on small{color:inherit;opacity:.85}

.lb-slots{margin-top:6px}
.lb-slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:8px}
.lb-slot{min-height:42px;border:1px solid var(--lb-line);border-radius:var(--lb-field-radius);background:var(--lb-field);color:var(--lb-ink);font:inherit;font-size:14.5px;font-weight:600;cursor:pointer;transition:border-color .15s,background .15s}
.lb-slot:hover{border-color:color-mix(in srgb,var(--lb-ink) 35%,var(--lb-line))}
.lb-slot.is-on{background:var(--lb-accent);border-color:var(--lb-accent);color:var(--lb-accent-ink)}

.lb-error{margin:0 0 12px;padding:11px 13px;border-radius:var(--lb-field-radius);background:#fde8e6;color:#8d1a10;font-size:13.5px;font-weight:600}
.lb-submit{width:100%;min-height:54px;padding:0 22px;border:0;border-radius:var(--lb-field-radius);background:var(--lb-accent);color:var(--lb-accent-ink);font:inherit;font-size:14px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:14px;cursor:pointer;transition:opacity .15s,transform .15s}
.lb-submit:hover:not(:disabled){transform:translateY(-1px)}
.lb-submit:disabled{opacity:.45;cursor:not-allowed}
.lb-foot{margin:12px 0 0;text-align:center;font-size:11.5px;color:var(--lb-muted)}

.lb-done{text-align:center;padding:26px 8px;display:grid;gap:10px;justify-items:center}
.lb-done[hidden],.lb-body[hidden],.lb-error[hidden]{display:none}
.lb-done-mark{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--lb-accent);color:var(--lb-accent-ink);font-size:28px}
.lb-done strong{font-family:var(--lb-font-head);font-size:24px}
.lb-done p{margin:0;color:var(--lb-muted);line-height:1.5}
.lb-again{margin-top:6px;padding:11px 18px;border:1px solid var(--lb-line);border-radius:var(--lb-field-radius);background:transparent;color:var(--lb-ink);font:inherit;font-size:13.5px;font-weight:600;cursor:pointer}

@media (max-width:700px){
    .lb{padding:22px 16px}
    .lb-row{grid-template-columns:1fr}
    .lb-slot-grid{grid-template-columns:repeat(4,1fr)}
    .lb input,.lb select,.lb textarea{font-size:16px}
}
.lb-retry{margin-top:8px;padding:8px 14px;border:1px solid var(--lb-line);border-radius:var(--lb-field-radius);background:var(--lb-field);color:var(--lb-ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer}

/* Iframe do widget (link configurado) — mesmo contêiner para todos os modelos */
.lb-embed{--lb-bg:transparent;min-width:0;max-width:100%;border-radius:var(--lb-radius,var(--radius,20px));overflow:hidden}
.lb-embed-head{padding:6px 8px 14px}
.lb-embed-head strong{display:block;font-family:var(--lb-font-head,inherit);font-size:18px}
.lb-embed-head small{display:block;margin-top:4px;opacity:.7;font-size:12.5px}
.lb-embed iframe{display:block;width:100%;height:min(820px,88vh);min-height:560px;border:0;border-radius:inherit;background:#fff}
@media(max-width:700px){.lb-embed iframe{height:86vh;min-height:520px}}
/* Tema automático: o formulário herda cor/fundo do contêiner (template claro ou escuro) */
.lb--themed{
    --lb-bg:transparent;--lb-ink:currentColor;
    --lb-muted:color-mix(in srgb,currentColor 62%,transparent);
    --lb-line:color-mix(in srgb,currentColor 24%,transparent);
    --lb-field:color-mix(in srgb,currentColor 7%,transparent);
    --lb-accent-ink:#fff;
    padding:0;color:inherit
}
.lb--themed .lb-head{border-bottom-color:var(--lb-line)}
.lb select option,.lb select optgroup{color:#161616;background:#fff}
/* Família "booking-card" (cartão claro dentro de página escura): mantém o próprio cartão */
.lb--themed.lb--card{--lb-bg:#f4f1ea;--lb-ink:#1a1715;--lb-muted:#6f6962;--lb-line:#d6cfc4;--lb-field:#fff;padding:30px;color:#1a1715}
@media(max-width:700px){.lb--themed.lb--card{padding:22px 16px}}
/* Wrappers feitos para o iframe (fundo branco, borda, altura fixa) não devem pintar o formulário nativo:
   ele herda a cor do contêiner, então o fundo do wrapper precisa ser o do próprio template. */
:is(div,section):has(> .lb--themed:not(.lb--card)){background:transparent;color:inherit;border-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;min-height:0;height:auto;aspect-ratio:auto}
.lb-day:disabled,.lb-day.is-off{opacity:.32;cursor:not-allowed;text-decoration:line-through;background:transparent}
.lb-day:disabled:hover{border-color:var(--lb-line)}
.lb--themed.lb--pad{padding:28px}
@media(max-width:700px){.lb--themed.lb--pad{padding:20px 16px}}
.lb-field{min-width:0}
.lb-days{width:100%;min-width:0}
