/*!
 * ALVI zákaznícky portál – vizuálna úprava /objednavky/ (v2).
 * Iba prekrytie existujúcich tried modulu Objednávky pod body.alvi-ord-body.
 * JS ani logika objednávania sa nemenia.
 */

/* zjednotená paleta s portálom */
body.alvi-ord-body {
	--ord-bg: var(--ap-bg); --ord-fg: var(--ap-fg); --ord-acc: var(--ap-acc);
	--ord-card: color-mix(in srgb, var(--ap-fg) 4%, var(--ap-bg));
	--ord-line: color-mix(in srgb, var(--ap-fg) 9%, transparent);
	--ord-muted: color-mix(in srgb, var(--ap-fg) 62%, transparent);
	background: var(--ap-bg);
	font-family: "Inter", "SF Pro Text", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* navigácia portálu – na objednávkach hore, na mobile ako segmentový prepínač */
body.alvi-ord-body .ap-shell--orders .ap-nav { position: static; border-top: 0; background: transparent; padding-bottom: 0; }
body.alvi-ord-body .ap-shell--orders.alvi-portal { padding-bottom: 0; }
body.alvi-ord-body .ap-shell--orders .ap-nav__list { max-width: 760px; padding: 0 16px; }
@media (max-width: 760px) {
	body.alvi-ord-body .ap-shell--orders .ap-nav { border-bottom: 0; padding: 12px 16px 0; backdrop-filter: none; -webkit-backdrop-filter: none; }
	body.alvi-ord-body .ap-shell--orders .ap-nav__list { background: color-mix(in srgb, var(--ap-fg) 6%, transparent); border-radius: 999px; padding: 3px; }
	body.alvi-ord-body .ap-shell--orders .ap-nav__link { height: 36px; flex-direction: row; font-size: 13px; gap: 6px; border-radius: 999px; }
	body.alvi-ord-body .ap-shell--orders .ap-nav__link.is-current { background: var(--ap-acc); color: #17130b; }
	body.alvi-ord-body .ap-shell--orders .ap-nav__link.is-current::after { display: none; }
	body.alvi-ord-body .ap-shell--orders .ap-nav__ico { display: none; }
}

/* titulok */
body.alvi-ord-body .alvi-ord { max-width: 760px; padding-top: 28px; }
body.alvi-ord-body .alvi-ord h1 {
	font-family: inherit; text-transform: none; letter-spacing: -.02em; font-weight: 650; color: var(--ap-fg);
	font-size: clamp(26px, 4.2vw, 34px); margin: 0 0 6px; text-align: left;
}
body.alvi-ord-body .alvi-ord .ord-intro { text-align: left; font-size: 15px; margin: 0 0 24px; color: var(--ord-muted); }

/* prepínač dní */
body.alvi-ord-body .alvi-ord .ord-day-switcher {
	grid-template-columns: 44px minmax(0, 1fr) 44px; background: color-mix(in srgb, var(--ap-fg) 4%, var(--ap-bg));
	border: 1px solid var(--ord-line); border-radius: 16px; padding: 12px; margin-bottom: 12px;
}
body.alvi-ord-body .alvi-ord .ord-day-arrow { width: 44px; height: 44px; font-size: 24px; border: 1px solid var(--ord-line); color: var(--ap-fg); background: transparent; }
body.alvi-ord-body .alvi-ord .ord-day-arrow:not(:disabled):hover { border-color: var(--ap-acc); color: var(--ap-acc); }
body.alvi-ord-body .alvi-ord .ord-day-name { font-family: inherit; font-size: 22px; font-weight: 650; color: var(--ap-fg); letter-spacing: -.01em; }
body.alvi-ord-body .alvi-ord .ord-day-date { margin-top: 4px; padding: 0; border: 0; text-transform: none; letter-spacing: 0; font-size: 13.5px; font-weight: 500; color: var(--ord-muted); }
body.alvi-ord-body .alvi-ord .ord-cutoff {
	justify-content: flex-start; margin: 0 0 20px; padding: 10px 14px; border: 0; border-radius: 12px;
	background: color-mix(in srgb, #ff8a80 12%, transparent); color: #ff8a80; font-size: 13.5px; font-weight: 500;
}
body.alvi-ord-body .alvi-ord .ord-cutoff strong { color: #ffd9d5; font-weight: 650; }

/* menu dňa – zoznam, nie boxy */
body.alvi-ord-body .alvi-ord #ordDayContent { background: transparent; border: 0; padding: 0; }
body.alvi-ord-body .alvi-ord .ord-sec-title {
	font-family: inherit; text-transform: none; letter-spacing: 0; font-size: 15px; font-weight: 600; color: var(--ord-muted);
	margin: 26px 0 4px; padding: 0; border: 0;
}
body.alvi-ord-body .alvi-ord .ord-sec-title:first-child { margin-top: 4px; }
body.alvi-ord-body .alvi-ord .ord-item {
	background: transparent; border: 0; border-bottom: 1px solid var(--ord-line); border-radius: 0;
	padding: 16px 0; margin: 0; gap: 14px;
}
body.alvi-ord-body .alvi-ord .ord-item:last-child { border-bottom: 0; }
body.alvi-ord-body .alvi-ord .ord-item .i-label {
	min-width: 30px; height: 26px; display: grid; place-items: center; padding: 0 6px; border: 0; border-radius: 8px;
	background: color-mix(in srgb, var(--ap-fg) 7%, transparent); color: var(--ord-muted); font-size: 12px; font-weight: 600; letter-spacing: 0;
}
body.alvi-ord-body .alvi-ord .ord-item .i-name { font-size: 16px; line-height: 1.4; font-weight: 500; }
body.alvi-ord-body .alvi-ord .ord-item .i-price { font-size: 14px; margin-top: 3px; color: var(--ap-acc); font-weight: 600; }
body.alvi-ord-body .alvi-ord .ord-item select {
	min-height: 38px; border-radius: 10px; font-size: 14px; background: color-mix(in srgb, var(--ap-fg) 5%, var(--ap-bg)); border-color: var(--ord-line); margin-top: 8px;
}
body.alvi-ord-body .alvi-ord .i-add { gap: 0; border: 1px solid var(--ord-line); border-radius: 999px; padding: 3px; }
body.alvi-ord-body .alvi-ord .i-add button { width: 36px; height: 36px; border-radius: 50%; border: 0; font-size: 19px; color: var(--ap-fg); }
body.alvi-ord-body .alvi-ord .i-add button:hover { background: color-mix(in srgb, var(--ap-fg) 7%, transparent); color: var(--ap-fg); }
body.alvi-ord-body .alvi-ord .i-add button[data-act="plus"] { background: var(--ap-acc); color: #17130b; }
body.alvi-ord-body .alvi-ord .i-add button[data-act="plus"]:hover { filter: brightness(1.07); color: #17130b; }
body.alvi-ord-body .alvi-ord .i-add .q { min-width: 30px; font-variant-numeric: tabular-nums; font-weight: 600; }

/* CTA košíka */
body.alvi-ord-body .alvi-ord .ord-order-cta {
	animation: none; border-radius: 999px; background: var(--ap-acc); border: 0; color: #17130b; font-weight: 650;
	box-shadow: 0 12px 30px rgba(0, 0, 0, .5); width: min(100%, 340px);
}
body.alvi-ord-body .alvi-ord .ord-order-cta:hover { filter: brightness(1.07); }

/* spodný toolbar objednávok */
body.alvi-ord-body .ord-tb { background: color-mix(in srgb, var(--ap-bg) 88%, transparent) !important; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
body.alvi-ord-body .ord-tb button, body.alvi-ord-body .ord-tb a { text-transform: none; letter-spacing: 0; font-size: 11.5px; font-weight: 550; color: color-mix(in srgb, var(--ap-fg) 66%, transparent); }
body.alvi-ord-body .ord-tb .is-on { color: var(--ap-fg); }
body.alvi-ord-body .ord-tb .is-on .tb-ic { color: var(--ap-acc); }

/* moje objednávky na tejto stránke, modály */
body.alvi-ord-body .alvi-ord .mo-order { background: var(--ord-card); border-radius: 14px; }
body.alvi-ord-body .ord-cart-sheet, body.alvi-ord-body .ord-payment-sheet, body.alvi-ord-body .ord-consent-sheet, body.alvi-ord-body .ord-login-box { border-color: var(--ord-line); border-radius: 18px; }
body.alvi-ord-body .ord-modal-head h2, body.alvi-ord-body .ord-login-title { text-transform: none; letter-spacing: -.01em; color: var(--ap-fg); font-family: inherit; }

/* focus */
body.alvi-ord-body .alvi-ord button:focus-visible, body.alvi-ord-body .alvi-ord select:focus-visible,
body.alvi-ord-body .alvi-ord input:focus-visible, body.alvi-ord-body .alvi-ord textarea:focus-visible { outline: 2px solid var(--ap-acc); outline-offset: 2px; }

/* pätička portálu nad toolbarom objednávok */
@media (max-width: 760px) {
	body.alvi-ord-body .ap-shell--orders .ap-footer { padding-bottom: 8px; }
	body.alvi-ord-body .alvi-ord { padding: 18px 16px 110px; }
	body.alvi-ord-body .alvi-ord .ord-item { flex-wrap: nowrap; align-items: flex-start; gap: 10px; padding: 14px 0; }
	body.alvi-ord-body .alvi-ord .ord-item .i-main { flex: 1 1 auto; flex-basis: auto; }
	body.alvi-ord-body .alvi-ord .ord-item .i-name { font-size: 15px; }
	body.alvi-ord-body .alvi-ord .ord-item .i-label { min-width: 26px; height: 22px; font-size: 11px; margin-top: 1px; }
	body.alvi-ord-body .alvi-ord .i-add { margin-left: 0; }
	body.alvi-ord-body .alvi-ord .i-add button { width: 32px; height: 32px; font-size: 17px; }
	body.alvi-ord-body .alvi-ord .i-add .q { min-width: 24px; }
	body.alvi-ord-body .alvi-ord .ord-day-switcher { padding: 8px; grid-template-columns: 40px minmax(0, 1fr) 40px; }
	body.alvi-ord-body .alvi-ord .ord-day-arrow { width: 40px; height: 40px; }
	body.alvi-ord-body .ord-to-top { bottom: 150px; right: 12px; width: 42px; height: 42px; }
}
