@charset "UTF-8";
/* LatePoint Recipe Extras - plan picker on the services step (v2.2.0, E06).
   The picker shows while no plan is open; LatePoint adds
   .selecting-item-category once one is, and its own Atras removes it. */

.latepoint-step-content.lpplan-on:not(.selecting-item-category) .os-item-category-w.lpplan-cat { display: none !important; }
.latepoint-step-content.selecting-item-category .lpplan-panel { display: none; }

.lpplan-panel { display: flex; flex-direction: column; gap: 14px; margin: 4px 0 8px; }

.lpplan-top { display: flex; justify-content: flex-end; }
.lpplan-more { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 2px; border: 0; background: none; color: #0f8c77; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.lpplan-more svg { width: 17px; height: 17px; flex: 0 0 auto; }
.lpplan-more:hover { color: #0b6e5d; }

.lpplan-tabs { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 4px; padding: 4px; background: #f2f4f6; border-radius: 12px; }
.lpplan-panel .lpplan-tab { min-height: 44px; padding: 0 8px; border: 0; border-radius: 9px; background: none; color: #5b6470; font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; transition: background-color .12s ease, color .12s ease; }
.lpplan-tab:hover { color: #1b1f24; }
.lpplan-tab.is-on { background: #ffffff; color: #1b1f24; box-shadow: 0 1px 3px rgba(0,0,0,.10); }

.lpplan-card { border: 1px solid #e5e7ee; border-radius: 15px; padding: 18px; display: flex; flex-direction: column; gap: 12px; background: #ffffff; }
.lpplan-card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.lpplan-card-name { font-size: 20px; font-weight: 700; color: #1b1f24; }
.lpplan-card-price { font-size: 20px; font-weight: 700; color: #0f8c77; white-space: nowrap; }
.lpplan-rows { display: flex; flex-direction: column; }
.lpplan-row { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid #f0f2f4; font-size: 14.5px; }
.lpplan-row:last-child { border-bottom: 0; }
.lpplan-row-l { color: #3a434d; }
.lpplan-row-v { font-weight: 600; color: #1b1f24; text-align: right; }
.lpplan-row:last-child .lpplan-row-v { font-weight: 500; color: #5b6470; }
.lpplan-row.is-included .lpplan-row-v { font-weight: 600; color: #0f8c77; }
.lpplan-panel .lpplan-choose { min-height: 48px; padding: 0 16px; border: 0; border-radius: 12px; background: #0f8c77; color: #ffffff; font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; }
.lpplan-choose:hover { background: #0b6e5d; }

.lpplan-tab:focus-visible, .lpplan-choose:focus-visible, .lpplan-more:focus-visible,
.lpplan-sheet-x:focus-visible, .lpplan-sheet-ok:focus-visible { outline: 2px solid #0f8c77; outline-offset: 2px; }

/* Buttons: the theme styles <button>; state everything that matters. */
.lpplan-panel button, .lpplan-intro .lpplan-more, .lpplan-sheet button { box-sizing: border-box; margin: 0; text-transform: none; letter-spacing: normal; line-height: 1.2; box-shadow: none; text-shadow: none; }
.lpplan-panel .lpplan-tab.is-on { box-shadow: 0 1px 3px rgba(0,0,0,.10); }

/* "Elegi tu plan." and the link on one line (LatePoint's own text block). */
.lpplan-intro { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.lpplan-intro > p { margin: 0; }
.latepoint-step-content.selecting-item-category .lpplan-intro .lpplan-more { display: none; }

/* The sheet: inside the booking modal, rising from its bottom edge. */
.lpplan-sheet-w[hidden] { display: none; }
.lpplan-sheet-w { position: absolute; inset: 0; z-index: 50; display: flex; align-items: flex-end; }
.lpplan-sheet-backdrop { position: absolute; inset: 0; background: rgba(20,26,32,.45); }
.lpplan-sheet { position: relative; width: 100%; max-height: 92%; overflow-y: auto; box-sizing: border-box; background: #ffffff; border-radius: 20px 20px 0 0; padding: 10px 24px 24px; display: flex; flex-direction: column; gap: 16px; box-shadow: 0 -8px 30px rgba(0,0,0,.15); color: #1b1f24; outline: none;
	font-family: latepoint, -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
.lpplan-sheet button { font-family: inherit; }
.lpplan-sheet-grip { align-self: center; width: 40px; height: 4px; border-radius: 999px; background: #d6dade; }
.lpplan-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.lpplan-sheet-title { font-size: 18px; font-weight: 700; line-height: 1.3; }
.lpplan-sheet .lpplan-sheet-x { width: 36px; height: 36px; flex: 0 0 auto; padding: 0; border: 0; border-radius: 50%; background: #f2f4f6; color: #1b1f24; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.lpplan-sheet-x svg { width: 16px; height: 16px; display: block; }
.lpplan-def { display: flex; gap: 14px; align-items: center; }
.lpplan-def-ico { flex: 0 0 36px; height: 36px; border-radius: 10px; background: #e9f6f2; color: #0f8c77; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 800; line-height: 1; }
.lpplan-def-ico svg { width: 20px; height: 20px; display: block; }
.lpplan-def-txt { font-size: 14px; line-height: 1.45; color: #3a434d; }
.lpplan-def-txt strong { font-weight: 700; color: #1b1f24; }
.lpplan-sheet-note { margin: 0; padding: 10px 12px; border-radius: 10px; background: #f6f7f8; font-size: 13px; line-height: 1.45; color: #4a535d; }
.lpplan-sheet .lpplan-sheet-ok { min-height: 48px; padding: 0 16px; border: 0; border-radius: 12px; background: #1b1f24; color: #ffffff; font-size: 15px; font-weight: 600; cursor: pointer; display: flex; align-items: center; justify-content: center; }

/* Slides up from the modal's bottom edge, and back down on close. */
.lpplan-sheet-w .lpplan-sheet { transform: translateY(100%); transition: transform .26s cubic-bezier(.2,.8,.2,1); }
.lpplan-sheet-w .lpplan-sheet-backdrop { opacity: 0; transition: opacity .22s ease; }
.lpplan-sheet-w.is-open .lpplan-sheet { transform: none; }
.lpplan-sheet-w.is-open .lpplan-sheet-backdrop { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .lpplan-sheet-w .lpplan-sheet, .lpplan-sheet-w .lpplan-sheet-backdrop { transition: none !important; } }

/* No focus ring from the theme on a click or a tap; keyboard users keep
   a green one (the theme draws an orange outline on every focused element). */
.lpplan-panel :focus:not(:focus-visible), .lpplan-intro :focus:not(:focus-visible),
.lpplan-sheet:focus, .lpplan-sheet :focus:not(:focus-visible) { outline: none !important; box-shadow: none !important; }
.lpplan-panel .lpplan-tab.is-on:focus:not(:focus-visible) { box-shadow: 0 1px 3px rgba(0,0,0,.10) !important; }
.lpplan-panel :focus-visible, .lpplan-intro :focus-visible, .lpplan-sheet :focus-visible { outline: 2px solid #0f8c77 !important; outline-offset: 2px; box-shadow: none !important; }

/* Inside an open plan (v2.3.0, Don's pick G06 boxed, no icons): chip with
   the plan, a title, then LatePoint's own boxes without picture or price. */
.latepoint-step-content.lpplan-on.selecting-item-category .lpplan-intro { display: none; }
.lpplan-cat:not(.selected) > .lpplan-head { display: none; }
.lpplan-head { display: flex; flex-direction: column; gap: 14px; margin: 0 0 12px; }
.lpplan-chip { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border-radius: 12px; background: #e9f6f2; }
.lpplan-chip-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.lpplan-chip-name { font-size: 15px; font-weight: 700; color: #0b6e5d; line-height: 1.3; }
.lpplan-chip-sub { font-size: 12.5px; color: #2c4a43; line-height: 1.35; }
.lpplan-head .lpplan-chip-change { flex: 0 0 auto; min-height: 36px; padding: 0 2px; margin: 0; border: 0; background: none; color: #0f8c77; font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; box-shadow: none; text-transform: none; letter-spacing: normal; }
.lpplan-chip-change:hover { color: #0b6e5d; }
.lpplan-menus-title { margin: 4px 0 0; font-size: 15px; font-weight: 600; color: #1b1f24; line-height: 1.3; }

/* The menus: lp-service-cards.css lays each box out as a grid with named
   areas (name, price, desc, more, list) under an eight-class selector.
   Inside an open plan there is no picture and no price; same prefix plus
   the plan class, so
   these win on specificity, not on file order. */
.latepoint-w .latepoint-booking-form-element .os-item-category-w.lpplan-dressed > .os-services.os-items.os-as-rows .os-item .os-item-i,
.latepoint-w .latepoint-booking-form-element .os-item-category-w.lpplan-dressed > .os-services.os-items.os-as-rows .os-item .os-item-i:has(.os-item-img-w) {
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas: "name" "desc" "more" "list";
	padding: 16px 18px;
}
.latepoint-w .latepoint-booking-form-element .os-item-category-w.lpplan-dressed > .os-services.os-items.os-as-rows .os-item .os-item-i .os-item-img-w,
.latepoint-w .latepoint-booking-form-element .os-item-category-w.lpplan-dressed > .os-services.os-items.os-as-rows .os-item .os-item-i .os-item-price-w { display: none !important; }
.latepoint-w .latepoint-booking-form-element .os-item-category-w.lpplan-dressed > .os-services.os-items.os-as-rows .os-item .os-item-i .os-item-name-w .os-item-name { font-size: 17px; font-weight: 700; line-height: 1.3; }
.latepoint-w .latepoint-booking-form-element .os-item-category-w.lpplan-dressed > .os-services.os-items.os-as-rows .os-item .os-item-i .os-item-name-w .os-item-desc { margin: 6px 0 0; font-size: 14px; line-height: 1.5; color: #4a535d; }

/* No theme focus ring on a click or tap here either. */
.lpplan-head :focus:not(:focus-visible),
.latepoint-w .latepoint-booking-form-element .lpplan-dressed > .os-services > .os-item:focus:not(:focus-visible) { outline: none !important; box-shadow: none !important; }
.lpplan-head :focus-visible { outline: 2px solid #0f8c77 !important; outline-offset: 2px; }
