/* DOBRÁ KAPSA — menú inferior ÚNICO: Obchod · Objednávky · Košík (centro) · Pro firmy · Účet (con tienda: … · QR kód · Odměny · …).
   Lo comparten la tienda (/) y la tarjeta (/ucet/): igual en el móvil, en el navegador y en la app instalada.
   Lo crea /assets/appmenu.js (solo si Firebase está configurado). */

/* Barra redondeada, con un poco de cristal; el botón central (amarillo, redondo y levantado) es el de la acción principal:
   Košík (sin tienda) o QR kód (con tienda). Debajo de cada icono, su nombre; el de la página en la que estás va con un fondo amarillo suave. */
.dk-menu { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 85; background: rgba(255,255,255,0.97); -webkit-backdrop-filter: saturate(1.3) blur(10px); backdrop-filter: saturate(1.3) blur(10px); border-radius: 22px 22px 0 0; box-shadow: 0 -8px 28px rgba(74,50,15,0.14), 0 -1px 0 rgba(0,0,0,0.04); padding-bottom: env(safe-area-inset-bottom, 0px); font-family: 'Montserrat', sans-serif; }
.dk-menu-in { max-width: 560px; margin: 0 auto; padding: 0 6px; display: grid; grid-template-columns: repeat(5, 1fr); align-items: end; }
.dkb { appearance: none; border: 0; background: none; margin: 0; color: #8a8478; text-decoration: none; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 9px 2px 8px; min-height: 64px; font-family: inherit; font-size: 0.68rem; font-weight: 700; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: color .15s; }
.dkb svg { display: block; }
.dkb .lbl { line-height: 1.1; white-space: nowrap; }
.dkb-ic { position: relative; display: flex; align-items: center; justify-content: center; width: 54px; height: 30px; border-radius: 999px; transition: background .2s; }
.dkb.on { color: #6A4A25; font-weight: 800; }
.dkb.on .dkb-ic { background: #FFE9A6; }
.dkb.on svg { stroke-width: 2.3; }
.dkb:active .dkb-ic { background: #FFF3CE; }
.dkb:focus-visible { outline: 2px solid #6A4A25; outline-offset: -2px; border-radius: 10px; }
.dkb-tag { display: none; position: absolute; top: -3px; right: 6px; width: 16px; height: 16px; border-radius: 50%; background: #1f7a3d; color: #fff; font: 800 10px/16px 'Montserrat', sans-serif; font-style: normal; text-align: center; border: 2px solid #fff; box-sizing: content-box; margin: -2px -2px 0 0; justify-content: center; align-items: center; }
.dkb.b2b .dkb-tag { display: flex; }
.dkb-qr { color: #6A4A25; padding-top: 0; font-weight: 800; }
.dkb-fab { position: relative; display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin-top: -30px; border-radius: 50%; background: linear-gradient(160deg, #FFCB3D, #FFBC0D 55%, #F0A800); color: #111111; border: 5px solid #FFFFFF; box-shadow: 0 8px 20px rgba(214,150,0,0.45), 0 2px 6px rgba(106,74,37,0.25); transition: transform 0.15s; }
.dkb-qr:active .dkb-fab { transform: scale(0.94); }
.dkb-badge { position: absolute; top: -7px; right: -9px; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 12px; background: #6A4A25; color: #fff; border: 2px solid #fff; box-sizing: border-box; font: 800 0.72rem/20px 'Montserrat', sans-serif; font-style: normal; text-align: center; }
.dkb-badge[hidden] { display: none; }

/* Cuándo se ve: SIEMPRE en la tarjeta (/ucet/); en la tienda, en pantallas de móvil/tablet y en la app instalada (en un PC ancho no hace falta). */
body.dk-menu-always .dk-menu { display: block; }
@media (max-width: 900px) { body.has-dk-menu .dk-menu { display: block; } }
@media (display-mode: standalone), (display-mode: fullscreen) { body.has-dk-menu .dk-menu { display: block; } }
body.is-standalone.has-dk-menu .dk-menu { display: block; }

/* Espacio para que el menú no tape el final de la página */
body.dk-menu-always { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
@media (max-width: 900px) { body.has-dk-menu { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); } }
@media (display-mode: standalone), (display-mode: fullscreen) { body.has-dk-menu { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); } }
body.is-standalone.has-dk-menu { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }

/* El botón flotante del carrito va SIEMPRE arriba a la derecha (también en móvil: abajo está el menú). Los avisos suben sobre el menú. */
@media (max-width: 600px) { body.has-dk-menu .floating-cart-btn { top: max(14px, env(safe-area-inset-top, 14px)); bottom: auto; right: 14px; } }
body.dk-menu-always .toast { bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }

/* Ventana del QR (la misma en la tienda y en la tarjeta). margin:auto la CENTRA: el reset global de la web (* { margin: 0 }) se lo quitaba y quedaba pegada a la izquierda. */
.dk-qr-dlg { border: 0; border-radius: 22px; padding: 0; margin: auto; width: min(400px, calc(100vw - 20px)); max-height: calc(100vh - 20px); overflow: auto; background: #FFFFFF; box-shadow: 0 24px 70px rgba(0,0,0,0.45); }
.dk-qr-dlg::backdrop { background: rgba(30,20,8,0.6); }
.dk-qr-card { background: linear-gradient(160deg, #FFBC0D, #ffd666); padding: 18px; text-align: center; font-family: 'Nunito', sans-serif; color: #111111; }
.dk-qr-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 12px; font-family: 'Montserrat', sans-serif; }
.dk-qr-top b { font-size: 1.1rem; text-align: left; overflow-wrap: anywhere; }
.dk-qr-pill { background: #6A4A25; color: #FFFFFF; border-radius: 999px; padding: 4px 12px; font-weight: 800; font-size: 0.85rem; white-space: nowrap; }
.dk-qr-card h3 { font-family: 'Montserrat', sans-serif; font-size: 1.1rem; margin: 0 0 10px; }
.dk-qr-card canvas { display: block; margin: 0 auto; width: min(280px, 72vw); height: min(280px, 72vw); background: #FFFFFF; border-radius: 16px; padding: 4px; box-sizing: content-box; }
.dk-qr-code { font-family: ui-monospace, Menlo, Consolas, monospace; font-weight: 800; letter-spacing: 0.12em; margin-top: 10px; font-size: 1.05rem; }
.dk-qr-card p { font-size: 0.85rem; margin: 8px 0 0; color: #4a3714; line-height: 1.45; }
.dk-qr-actions { display: flex; gap: 10px; padding: 12px 16px 16px; background: #FFFFFF; }
.dk-qr-actions a, .dk-qr-actions button { flex: 1; min-height: 46px; border-radius: 12px; border: 0; display: inline-flex; align-items: center; justify-content: center; text-align: center; text-decoration: none; font-family: 'Montserrat', sans-serif; font-weight: 800; font-size: 0.88rem; cursor: pointer; }
.dk-qr-actions .main { background: #FFBC0D; color: #111111; }
.dk-qr-actions .alt { background: #f1ede4; color: #111111; }

@media print { .dk-menu, .dk-qr-dlg { display: none !important; } }