galali-shoptet 1.0.13 → 1.0.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "galali-shoptet",
-  "version": "1.0.13",
+  "version": "1.0.15",
   "description": "Custom CSS for Galali Shoptet theme (designshop.galali.cz)",
   "main": "style.css",
   "style": "style.css",

package/style.css

@@ -685,6 +685,10 @@ header#header nav#navigation ul.menu-level-3 > li > a:focus {
     background: var(--gl-surface-alt);
 }
 
+body.in-registrace main#content.content.narrow {
+    max-width: 790px !important;
+}
+
 /* Row + wide-carousel: vynulovat Shoptet container, sjednotit šířku */
 .content-wrapper.homepage-box.before-carousel .row.banners-row,
 .content-wrapper.homepage-box.before-carousel .wide-carousel {
@@ -1337,10 +1341,14 @@ main.content > .products.products-block > .product .price-final strong {
     main.content > .products.products-block > .product .price-final { font-size: 18px; line-height: 22px; }
 }
 @media (max-width: 767px) {
+    :root {
+        --gl-gutter: 20px;
+    }
     /* #2: base má padding 0 var(--gl-gutter)(=60px) !important → na mobilu úzké uprostřed.
        Roztáhnout na (skoro) plnou šířku. */
     main.content,
     main.content:not(.wide) { padding: 0 12px !important; }
+    body:not(.in-index) main#content.content { padding: 0 20px !important; }
     /* #4: oddělit produkty (Akční/Novinky) od sekce "Nakupte podle kategorií" nad i patičky pod */
     main.content { margin: 48px 0 72px !important; }
     main.content > .products.products-block > .product a.name { min-height: 38px; }
@@ -2673,7 +2681,7 @@ body.type-detail .p-short-description p:last-child { margin-bottom: 0; }
 
 /* "Detailní informace" link */
 body.type-detail [data-testid="productCardDescr"] a,
-body.type-detail .chevron-after.chevron-down-after {
+body.type-detail .content-wrapper .chevron-after.chevron-down-after {
     display: inline-flex;
     align-items: center;
     gap: 8px;
@@ -2685,9 +2693,9 @@ body.type-detail .chevron-after.chevron-down-after {
     text-underline-offset: 4px;
     transition: opacity .15s;
 }
-body.type-detail [data-testid="productCardDescr"] a:hover,
-body.type-detail .chevron-after.chevron-down-after:hover { opacity: .65; }
-body.type-detail .chevron-after.chevron-down-after::after {
+body.type-detail .content-wrapper [data-testid="productCardDescr"] a:hover,
+body.type-detail .content-wrapper .chevron-after.chevron-down-after:hover { opacity: .65; }
+body.type-detail .content-wrapper .chevron-after.chevron-down-after::after {
     content: "";
     display: inline-block;
     width: 10px;
@@ -2696,17 +2704,17 @@ body.type-detail .chevron-after.chevron-down-after::after {
 }
 
 /* Variants / amount / add-to-cart form */
-body.type-detail .p-info-wrapper .amount,
-body.type-detail .amount-wrapper {
+body.type-detail .content-wrapper .p-info-wrapper .amount,
+body.type-detail .content-wrapper .amount-wrapper {
     display: flex;
     align-items: center;
     gap: 14px;
     margin: 0;
     padding: 0;
 }
-body.type-detail .amount-input-wrapper,
-body.type-detail .amount input[type="number"],
-body.type-detail input.amount {
+body.type-detail .content-wrapper .amount-input-wrapper,
+body.type-detail .content-wrapper .amount input[type="number"],
+body.type-detail .content-wrapper input.amount {
     display: inline-flex;
     align-items: center;
     width: 110px;
@@ -2719,11 +2727,11 @@ body.type-detail input.amount {
     font-size: 18px;
     text-align: center;
 }
-body.type-detail .amount input[type="number"]:focus { outline: none; border-color: var(--gl-fg-1); }
+body.type-detail .content-wrapper .amount input[type="number"]:focus { outline: none; border-color: var(--gl-fg-1); }
 
 /* Add to cart button (jen button, ne wrapper) */
-body.type-detail button.add-to-cart-button,
-body.type-detail #addToCart {
+body.type-detail .content-wrapper button.add-to-cart-button,
+body.type-detail .content-wrapper #addToCart {
     display: inline-flex;
     align-items: center;
     justify-content: center;
@@ -2743,16 +2751,16 @@ body.type-detail #addToCart {
     cursor: pointer;
     transition: background .15s, color .15s, transform .12s;
 }
-body.type-detail button.add-to-cart-button:hover,
-body.type-detail #addToCart:hover { background: #1a1a1a; }
-body.type-detail button.add-to-cart-button:focus-visible,
-body.type-detail #addToCart:focus-visible {
+body.type-detail .content-wrapper button.add-to-cart-button:hover,
+body.type-detail .content-wrapper #addToCart:hover { background: #1a1a1a; }
+body.type-detail .content-wrapper button.add-to-cart-button:focus-visible,
+body.type-detail .content-wrapper #addToCart:focus-visible {
     outline: 2px solid var(--gl-fg-1);
     outline-offset: 3px;
 }
 
 /* Social/share/print row */
-body.type-detail .social-buttons-wrapper {
+body.type-detail .content-wrapper .social-buttons-wrapper {
     display: flex;
     align-items: center;
     gap: 16px;
@@ -2760,13 +2768,13 @@ body.type-detail .social-buttons-wrapper {
     padding: 12px 0 0;
     border-top: 1px solid var(--gl-divider);
 }
-body.type-detail .social-buttons-wrapper .link-icons {
+body.type-detail .content-wrapper .social-buttons-wrapper .link-icons {
     display: flex;
     align-items: center;
     gap: 22px;
     flex-wrap: wrap;
 }
-body.type-detail .link-icon {
+body.type-detail .content-wrapper .link-icon {
     display: inline-flex;
     align-items: center;
     gap: 8px;
@@ -2779,33 +2787,33 @@ body.type-detail .link-icon {
     background: transparent !important;
     transition: color .15s;
 }
-body.type-detail .link-icon::before {
+body.type-detail .content-wrapper .link-icon::before {
     content: "";
     display: inline-block;
     width: 16px;
     height: 16px;
     background: center/contain no-repeat;
 }
-body.type-detail .link-icon.print::before {
+body.type-detail .content-wrapper .link-icon.print::before {
     background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23828282' stroke-width='1.4'><path d='M4 4V1h8v3M4 11h8v4H4zM2 4h12v7H2z'/></svg>");
 }
-body.type-detail .link-icon.chat::before {
+body.type-detail .content-wrapper .link-icon.chat::before {
     background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23828282' stroke-width='1.4'><path d='M2 3h12v8H7l-3 3v-3H2z'/></svg>");
 }
-body.type-detail .link-icon.share::before {
+body.type-detail .content-wrapper .link-icon.share::before {
     background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23828282' stroke-width='1.4'><circle cx='4' cy='8' r='2'/><circle cx='12' cy='3' r='2'/><circle cx='12' cy='13' r='2'/><path d='m6 7 4-3M6 9l4 3'/></svg>");
 }
-body.type-detail .link-icon:hover { color: var(--gl-fg-1); }
-body.type-detail .link-icon:hover::before { filter: brightness(0); }
-body.type-detail .link-icon:focus-visible {
+body.type-detail .content-wrapper .link-icon:hover { color: var(--gl-fg-1); }
+body.type-detail .content-wrapper .link-icon:hover::before { filter: brightness(0); }
+body.type-detail .content-wrapper .link-icon:focus-visible {
     outline: 2px solid var(--gl-fg-1);
     outline-offset: 4px;
 }
 
 /* Detail tabs (Popis / Diskuze) */
-body.type-detail .product-tabs,
-body.type-detail .tabs,
-body.type-detail ul.nav-tabs {
+body.type-detail .content-wrapper .product-tabs,
+body.type-detail .content-wrapper .tabs,
+body.type-detail .content-wrapper ul.nav-tabs {
     display: flex !important;
     gap: 0;
     margin: 56px 0 0 !important;
@@ -2814,18 +2822,18 @@ body.type-detail ul.nav-tabs {
     border: 0 !important;
     border-bottom: 1px solid var(--gl-divider) !important;
 }
-body.type-detail .product-tabs > li,
-body.type-detail .tabs > li,
-body.type-detail ul.nav-tabs > li {
+body.type-detail .content-wrapper .product-tabs > li,
+body.type-detail .content-wrapper .tabs > li,
+body.type-detail .content-wrapper ul.nav-tabs > li {
     margin: 0 !important;
     padding: 0 !important;
     background: transparent !important;
     border: 0 !important;
     list-style: none;
 }
-body.type-detail .product-tabs > li > a,
-body.type-detail .tabs > li > a,
-body.type-detail ul.nav-tabs > li > a {
+body.type-detail .content-wrapper .product-tabs > li > a,
+body.type-detail .content-wrapper .tabs > li > a,
+body.type-detail .content-wrapper ul.nav-tabs > li > a {
     display: inline-flex;
     align-items: center;
     padding: 16px 24px !important;
@@ -2841,26 +2849,26 @@ body.type-detail ul.nav-tabs > li > a {
     border-radius: 0 !important;
     transition: color .15s, border-color .15s;
 }
-body.type-detail .product-tabs > li.active > a,
-body.type-detail .product-tabs > li > a.active,
-body.type-detail .tabs > li.active > a,
-body.type-detail ul.nav-tabs > li.active > a {
+body.type-detail .content-wrapper .product-tabs > li.active > a,
+body.type-detail .content-wrapper .product-tabs > li > a.active,
+body.type-detail .content-wrapper .tabs > li.active > a,
+body.type-detail .content-wrapper ul.nav-tabs > li.active > a {
     color: var(--gl-fg-1) !important;
     border-bottom-color: var(--gl-fg-1) !important;
 }
-body.type-detail .product-tabs > li > a:hover,
-body.type-detail .tabs > li > a:hover {
+body.type-detail .content-wrapper .product-tabs > li > a:hover,
+body.type-detail .content-wrapper .tabs > li > a:hover {
     color: var(--gl-fg-1) !important;
 }
-body.type-detail .product-tabs > li > a:focus-visible,
-body.type-detail .tabs > li > a:focus-visible {
+body.type-detail .content-wrapper .product-tabs > li > a:focus-visible,
+body.type-detail .content-wrapper .tabs > li > a:focus-visible {
     outline: 2px solid var(--gl-fg-1);
     outline-offset: -2px;
 }
 
 /* Tab panels */
-body.type-detail .tab-content,
-body.type-detail .tab-pane {
+body.type-detail .content-wrapper .tab-content,
+body.type-detail .content-wrapper .tab-pane {
     margin: 0;
     padding: 32px 0;
     background: transparent;
@@ -2870,8 +2878,8 @@ body.type-detail .tab-pane {
     line-height: 1.7;
     color: var(--gl-fg-1);
 }
-body.type-detail .tab-content h2,
-body.type-detail .tab-content h3 {
+body.type-detail .content-wrapper .tab-content h2,
+body.type-detail .content-wrapper .tab-content h3 {
     font-family: var(--gl-font-ui);
     font-size: 28px;
     line-height: 1.2;
@@ -2879,23 +2887,23 @@ body.type-detail .tab-content h3 {
     margin: 0 0 20px;
     color: var(--gl-fg-1);
 }
-body.type-detail .tab-content p { margin: 0 0 16px; }
-body.type-detail .tab-content a {
+body.type-detail .content-wrapper .tab-content p { margin: 0 0 16px; }
+body.type-detail .content-wrapper .tab-content a {
     color: var(--gl-fg-1);
     text-decoration: underline;
     text-underline-offset: 3px;
 }
 
 /* Related / similar products under detail */
-body.type-detail .related-products,
-body.type-detail .similar-products,
-body.type-detail .also-bought-products {
+body.type-detail .content-wrapper .related-products,
+body.type-detail .content-wrapper .similar-products,
+body.type-detail .content-wrapper .also-bought-products {
     margin: 80px 0 0;
     padding: 0;
 }
-body.type-detail .related-products h2,
-body.type-detail .related-products .h2,
-body.type-detail .similar-products h2 {
+body.type-detail .content-wrapper .related-products h2,
+body.type-detail .content-wrapper .related-products .h2,
+body.type-detail .content-wrapper .similar-products h2 {
     margin: 0 0 32px;
     padding: 0;
     font-family: var(--gl-font-ui);
@@ -2904,8 +2912,8 @@ body.type-detail .similar-products h2 {
     font-weight: var(--gl-w-bold);
     color: var(--gl-fg-1);
 }
-body.type-detail .related-products .products,
-body.type-detail .similar-products .products {
+body.type-detail .content-wrapper .related-products .products,
+body.type-detail .content-wrapper .similar-products .products {
     display: grid !important;
     grid-template-columns: repeat(4, 1fr);
     column-gap: 40px;
@@ -2917,39 +2925,39 @@ body.type-detail .similar-products .products {
 
 /* Responsive detail */
 @media (max-width: 1023px) {
-    body.type-detail main#content { padding: 0 32px 96px !important; }
-    body.type-detail .row.product-top {
+    body.type-detail .content-wrapper main#content { padding: 0 32px 96px !important; }
+    body.type-detail .content-wrapper .row.product-top {
         grid-template-columns: 1fr;
         gap: 32px;
     }
-    body.type-detail .p-detail-inner-header h1 { font-size: 36px; line-height: 40px; }
-    body.type-detail .p-final-price-wrapper strong.price-final,
-    body.type-detail strong.price-final { font-size: 32px; line-height: 36px; }
-    body.type-detail .related-products .products,
-    body.type-detail .similar-products .products { grid-template-columns: repeat(3, 1fr); column-gap: 24px; row-gap: 36px; }
+    body.type-detail .content-wrapper .p-detail-inner-header h1 { font-size: 36px; line-height: 40px; }
+    body.type-detail .content-wrapper .p-final-price-wrapper strong.price-final,
+    body.type-detail .content-wrapper strong.price-final { font-size: 32px; line-height: 36px; }
+    body.type-detail .content-wrapper .related-products .products,
+    body.type-detail .content-wrapper .similar-products .products { grid-template-columns: repeat(3, 1fr); column-gap: 24px; row-gap: 36px; }
 }
 @media (max-width: 767px) {
-    body.type-detail main#content { padding: 0 20px 64px !important; }
-    body.type-detail .p-detail-inner-header { margin-bottom: 20px; }
-    body.type-detail .p-detail-inner-header h1 { font-size: 28px; line-height: 32px; }
-    body.type-detail .p-final-price-wrapper strong.price-final,
-    body.type-detail strong.price-final { font-size: 26px; line-height: 30px; }
-    body.type-detail .add-to-cart,
-    body.type-detail #addToCart { width: 100%; min-width: 0; height: 48px; font-size: 15px; }
-    body.type-detail .amount-input-wrapper,
-    body.type-detail .amount input[type="number"],
-    body.type-detail input.amount { width: 90px; height: 48px; }
-    body.type-detail .product-tabs > li > a,
-    body.type-detail .tabs > li > a,
-    body.type-detail ul.nav-tabs > li > a { padding: 12px 16px !important; font-size: 14px; }
-    body.type-detail .tab-content { padding: 24px 0; font-size: 15px; }
-    body.type-detail .social-buttons-wrapper .link-icons { gap: 14px; }
-    body.type-detail .related-products,
-    body.type-detail .similar-products { margin-top: 48px; }
-    body.type-detail .related-products h2,
-    body.type-detail .similar-products h2 { font-size: 22px; line-height: 26px; }
-    body.type-detail .related-products .products,
-    body.type-detail .similar-products .products { grid-template-columns: repeat(2, 1fr); column-gap: 12px; row-gap: 24px; }
+    body.type-detail .content-wrapper main#content { padding: 0 20px 64px !important; }
+    body.type-detail .content-wrapper .p-detail-inner-header { margin-bottom: 20px; }
+    body.type-detail .content-wrapper .p-detail-inner-header h1 { font-size: 28px; line-height: 32px; }
+    body.type-detail .content-wrapper .p-final-price-wrapper strong.price-final,
+    body.type-detail .content-wrapper strong.price-final { font-size: 26px; line-height: 30px; }
+    body.type-detail .content-wrapper .add-to-cart,
+    body.type-detail .content-wrapper #addToCart { width: 100%; min-width: 0; height: 48px; font-size: 15px; }
+    body.type-detail .content-wrapper .amount-input-wrapper,
+    body.type-detail .content-wrapper .amount input[type="number"],
+    body.type-detail .content-wrapper input.amount { width: 90px; height: 48px; }
+    body.type-detail .content-wrapper .product-tabs > li > a,
+    body.type-detail .content-wrapper .tabs > li > a,
+    body.type-detail .content-wrapper ul.nav-tabs > li > a { padding: 12px 16px !important; font-size: 14px; }
+    body.type-detail .content-wrapper .tab-content { padding: 24px 0; font-size: 15px; }
+    body.type-detail .content-wrapper .social-buttons-wrapper .link-icons { gap: 14px; }
+    body.type-detail .content-wrapper .related-products,
+    body.type-detail .content-wrapper .similar-products { margin-top: 48px; }
+    body.type-detail .content-wrapper .related-products h2,
+    body.type-detail .content-wrapper .similar-products h2 { font-size: 22px; line-height: 26px; }
+    body.type-detail .content-wrapper .related-products .products,
+    body.type-detail .content-wrapper .similar-products .products { grid-template-columns: repeat(2, 1fr); column-gap: 12px; row-gap: 24px; }
 }
 
 /* ============================================ */
@@ -3852,7 +3860,7 @@ body.ordering-process .order-confirm a:hover { opacity: .65; }
 /* Form-group + smart-label-wrapper (label nad/u inputu) */
 .box .form-group,
 .box .form-group-wrapped {
-    margin: 0 0 16px;
+    margin: 0 0 16px 20px;
     padding: 0;
     position: relative;
 }
@@ -4867,30 +4875,35 @@ body.ordering-process input[type="checkbox"] {
     outline-offset: 4px;
 }
 
-/* Mobile */
-@media (max-width: 767px) {
+/* Mobile — POZOR: base .siteCookies__button má min-width:140px !important,
+   takže mobilní shrink MUSÍ mít taky !important, jinak buttony nezmenší → banner
+   přeteče 390px → roztáhne layout viewport (ikony headeru ujedou z obrazovky). */
+@media (max-width: 1023px) {
     .siteCookies,
     .siteCookies.siteCookies--bottom,
     .siteCookies.siteCookies--light,
     .siteCookies.siteCookies--scrolled {
-        left: 16px;
-        right: 16px;
-        bottom: 16px;
+        left: 12px !important;
+        right: 12px !important;
+        bottom: 12px !important;
+        max-width: calc(100vw - 24px) !important;
+        box-sizing: border-box !important;
     }
     .siteCookies .siteCookies__form {
-        flex-direction: column;
-        align-items: stretch;
-        gap: 16px;
-        padding: 16px;
+        flex-direction: column !important;
+        align-items: stretch !important;
+        gap: 14px !important;
+        padding: 16px !important;
     }
     .siteCookies .siteCookies__buttonWrap {
-        flex-direction: column;
-        gap: 8px;
+        flex-direction: column !important;
+        gap: 8px !important;
+        width: 100% !important;
     }
     .siteCookies button.siteCookies__button,
     .siteCookies .siteCookies__button {
-        width: 100%;
-        min-width: 0;
+        width: 100% !important;
+        min-width: 0 !important;
     }
 }
 
@@ -5200,7 +5213,7 @@ h4.order-icon.order-summary,
 .box-headline.order-icon,
 .shipping-billing-table h4.order-icon {
     background-image: none !important;
-    padding-left: 0 !important;
+    padding-left: 20px !important;
 }
 h4.order-icon::before,
 h4.order-icon::after {
@@ -6035,7 +6048,7 @@ body.type-detail .p-detail-info {
 }
 
 /* --- Quantity stepper: rámeček + +/- buttony --- */
-body.type-detail span.quantity {
+body.type-detail .content span.quantity {
     display: inline-flex !important;
     align-items: stretch !important;
     height: 52px;
@@ -6046,14 +6059,14 @@ body.type-detail span.quantity {
     isolation: isolate;
     padding: 0 !important;
 }
-body.type-detail span.quantity > label {
+body.type-detail .content span.quantity > label {
     display: flex !important;
     align-items: center;
     order: 2;
     margin: 0 !important;
     padding: 0 !important;
 }
-body.type-detail span.quantity input.amount {
+body.type-detail .content span.quantity input.amount {
     width: 56px !important;
     height: 50px !important;
     border: 0 !important;
@@ -6063,39 +6076,39 @@ body.type-detail span.quantity input.amount {
     font-size: 16px !important;
     font-weight: var(--gl-w-medium) !important;
     line-height: 50px !important;
-    -moz-appearance: textfield !important;
     -webkit-appearance: none !important;
     appearance: none !important;
+    -moz-appearance: textfield !important;
     padding: 0 !important;
     margin: 0 !important;
     box-sizing: border-box !important;
     color: var(--gl-fg-1) !important;
     overflow: hidden !important;
 }
-body.type-detail span.quantity label {
+body.type-detail .content span.quantity label {
     overflow: hidden !important;
     position: relative !important;
     background: var(--gl-white);
 }
-body.type-detail span.quantity input.amount::-webkit-outer-spin-button,
-body.type-detail span.quantity input.amount::-webkit-inner-spin-button,
-body.type-detail input[type="number"]::-webkit-outer-spin-button,
-body.type-detail input[type="number"]::-webkit-inner-spin-button {
+body.type-detail .content span.quantity input.amount::-webkit-outer-spin-button,
+body.type-detail .content span.quantity input.amount::-webkit-inner-spin-button,
+body.type-detail .content input[type="number"]::-webkit-outer-spin-button,
+body.type-detail .content input[type="number"]::-webkit-inner-spin-button {
     -webkit-appearance: none !important;
     appearance: none !important;
     margin: 0 !important;
     display: none !important;
 }
-body.type-detail input[type="number"] {
+body.type-detail .content input[type="number"] {
     -moz-appearance: textfield !important;
     appearance: textfield !important;
 }
-body.type-detail span.quantity input.amount:focus {
+body.type-detail .content span.quantity input.amount:focus {
     outline: none;
     box-shadow: inset 0 0 0 2px var(--gl-fg-1);
 }
-body.type-detail span.quantity button.increase,
-body.type-detail span.quantity button.decrease {
+body.type-detail .content span.quantity button.increase,
+body.type-detail .content span.quantity button.decrease {
     display: inline-flex !important;
     align-items: center;
     justify-content: center;
@@ -6119,37 +6132,37 @@ body.type-detail span.quantity button.decrease {
     transition: background-color .15s, color .15s;
     flex: 0 0 auto !important;
 }
-body.type-detail span.quantity button.increase:before,
-body.type-detail span.quantity button.decrease:before {
+body.type-detail .content span.quantity button.increase:before,
+body.type-detail .content span.quantity button.decrease:before {
     content: none !important;
     display: none !important;
 }
-body.type-detail span.quantity button.decrease { order: 1; border-right: 1px solid var(--gl-stroke-1) !important; }
-body.type-detail span.quantity button.increase { order: 3; border-left: 1px solid var(--gl-stroke-1) !important; }
-body.type-detail span.quantity button.increase:hover,
-body.type-detail span.quantity button.decrease:hover {
+body.type-detail .content span.quantity button.decrease { order: 1; border-right: 1px solid var(--gl-stroke-1) !important; }
+body.type-detail .content span.quantity button.increase { order: 3; border-left: 1px solid var(--gl-stroke-1) !important; }
+body.type-detail .content span.quantity button.increase:hover,
+body.type-detail .content span.quantity button.decrease:hover {
     background: var(--gl-fg-1) !important;
     color: var(--gl-white) !important;
 }
-body.type-detail span.quantity button.increase:focus-visible,
-body.type-detail span.quantity button.decrease:focus-visible {
+body.type-detail .content span.quantity button.increase:focus-visible,
+body.type-detail .content span.quantity button.decrease:focus-visible {
     outline: 2px solid var(--gl-fg-1);
     outline-offset: 2px;
     z-index: 1;
 }
-body.type-detail span.quantity button.increase:disabled,
-body.type-detail span.quantity button.decrease:disabled,
-body.type-detail span.quantity button.increase[disabled],
-body.type-detail span.quantity button.decrease[disabled] {
+body.type-detail .content span.quantity button.increase:disabled,
+body.type-detail .content span.quantity button.decrease:disabled,
+body.type-detail .content span.quantity button.increase[disabled],
+body.type-detail .content span.quantity button.decrease[disabled] {
     background: var(--gl-white) !important;
     color: var(--gl-fg-2) !important;
     opacity: 0.4;
     cursor: not-allowed;
 }
-body.type-detail span.quantity button.increase span,
-body.type-detail span.quantity button.decrease span,
-body.type-detail span.quantity .increase__sign,
-body.type-detail span.quantity .decrease__sign {
+body.type-detail .content span.quantity button.increase span,
+body.type-detail .content span.quantity button.decrease span,
+body.type-detail .content span.quantity .increase__sign,
+body.type-detail .content span.quantity .decrease__sign {
     position: static !important;
     top: auto !important;
     left: auto !important;
@@ -6166,13 +6179,13 @@ body.type-detail span.quantity .decrease__sign {
     display: inline-block !important;
 }
 /* Hide vendor tooltips inside quantity (anywhere, vč. ::before/::after) */
-body.type-detail span.quantity > .increase-tooltip,
-body.type-detail span.quantity > .decrease-tooltip,
-body.type-detail span.quantity .js-increase-tooltip,
-body.type-detail span.quantity .js-decrease-tooltip,
-body.type-detail span.quantity [role="tooltip"],
-body.type-detail span.quantity [data-trigger="manual"],
-body.type-detail span.quantity [data-testid="tooltip"] {
+body.type-detail .content span.quantity > .increase-tooltip,
+body.type-detail .content span.quantity > .decrease-tooltip,
+body.type-detail .content span.quantity .js-increase-tooltip,
+body.type-detail .content span.quantity .js-decrease-tooltip,
+body.type-detail .content span.quantity [role="tooltip"],
+body.type-detail .content span.quantity [data-trigger="manual"],
+body.type-detail .content span.quantity [data-testid="tooltip"] {
     display: none !important;
     visibility: hidden !important;
     width: 0 !important;
@@ -6182,19 +6195,19 @@ body.type-detail span.quantity [data-testid="tooltip"] {
     left: -99999px !important;
     overflow: hidden !important;
 }
-body.type-detail span.quantity > .increase-tooltip::before,
-body.type-detail span.quantity > .increase-tooltip::after,
-body.type-detail span.quantity > .decrease-tooltip::before,
-body.type-detail span.quantity > .decrease-tooltip::after { content: none !important; display: none !important; }
+body.type-detail .content span.quantity > .increase-tooltip::before,
+body.type-detail .content span.quantity > .increase-tooltip::after,
+body.type-detail .content span.quantity > .decrease-tooltip::before,
+body.type-detail .content span.quantity > .decrease-tooltip::after { content: none !important; display: none !important; }
 
 /* --- Add-to-cart: full-row layout (qty + button na jedné lince) --- */
-body.type-detail div.add-to-cart {
+body.type-detail .content div.add-to-cart {
     margin: 4px 0 0 !important;
     align-items: stretch !important;
     justify-content: flex-start !important;
     flex-wrap: nowrap !important;
 }
-body.type-detail div.add-to-cart button.add-to-cart-button {
+body.type-detail .content div.add-to-cart button.add-to-cart-button {
     flex: 1 1 auto !important;
     min-width: 0 !important;
     width: auto !important;
@@ -6202,7 +6215,7 @@ body.type-detail div.add-to-cart button.add-to-cart-button {
     position: relative;
     padding: 0 56px 0 24px !important;
 }
-body.type-detail div.add-to-cart button.add-to-cart-button::after {
+body.type-detail .content div.add-to-cart button.add-to-cart-button::after {
     content: "";
     position: absolute;
     right: 24px;
@@ -6213,15 +6226,15 @@ body.type-detail div.add-to-cart button.add-to-cart-button::after {
     background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='12' viewBox='0 0 18 12' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='square'><path d='M0 6h16'/><path d='M11 1l5 5-5 5'/></svg>") center/contain no-repeat;
     transition: transform .15s, background-image .15s;
 }
-body.type-detail div.add-to-cart button.add-to-cart-button:hover::after {
+body.type-detail .content div.add-to-cart button.add-to-cart-button:hover::after {
     transform: translate(3px, -50%);
     background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='12' viewBox='0 0 18 12' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='square'><path d='M0 6h16'/><path d='M11 1l5 5-5 5'/></svg>");
 }
 
 /* --- Detail short description: schovat (design nemá pod cenou) --- */
-body.type-detail .p-info-wrapper .chevron-after.chevron-down-after,
-body.type-detail .p-info-wrapper [data-testid="productCardDescr"],
-body.type-detail .p-info-wrapper .p-short-description,
+body.type-detail .content .p-info-wrapper .chevron-after.chevron-down-after,
+body.type-detail .content .p-info-wrapper [data-testid="productCardDescr"],
+body.type-detail .content .p-info-wrapper .p-short-description,
 body.type-detail .p-info-wrapper [itemprop="description"] {
     display: none !important;
 }
@@ -7387,3 +7400,210 @@ body.type-search .products.products-block .product .add-to-cart {
     body.type-search .products.products-block .product .price.price-final { font-size: 14px; }
 }
 
+/* ============================================================
+   === Mobil audit fixes (2026-07-03) — konzistence napříč eshopem ===
+   Zdroj: full mobile audit (home/detail/kategorie/search/košík/checkout/registrace/login/heslo).
+   ============================================================ */
+
+@media (max-width: 1023px) {
+    /* --- A1) Skryj topnav menu (Jak nakupovat / OP) na mobilu ---
+       Globální "desktop polish" rule `.top-navigation-menu{display:flex}` (bez media query,
+       pozdější v pořadí) přebíjela mobilní `display:none` → menu se zobrazovalo a jeho bílé
+       pozadí PŘEKRÝVALO logo. Late-source !important vrací hidden. */
+    .top-navigation-bar .top-navigation-menu,
+    .top-navigation-bar .top-navigation-menu-trigger,
+    .top-navigation-bar ul.top-navigation-bar-menu {
+        display: none !important;
+    }
+
+    /* --- A2) Topnav VŽDY fixed overlay (konzistentně) ---
+       Vendor dává topnav `fixed` na homepage, ale `static` na kategorii/detailu/košíku/checkoutu
+       → tam header spadl na 2. řádek (logo pod ikonami) a checkout step-bar (ol.cart-header)
+       se schoval za header (vykukoval jen černý kroužek kroku = "blob").
+       Fixed = header sedí na y=0 (logo vlevo), ikony transparentně přes něj vpravo,
+       obsah teče pod headerem → 1 řádek na VŠECH stránkách + step-bar viditelný. */
+    .top-navigation-bar {
+        position: fixed !important;
+        top: 0 !important;
+        left: 0 !important;
+        right: 0 !important;
+        width: 100% !important;
+        z-index: 60 !important;
+        background: transparent !important;
+        border: 0 !important;
+        box-shadow: none !important;
+    }
+    header#header {
+        position: sticky !important;
+        top: 0 !important;
+    }
+
+    /* --- A3) Reset ordering-process login boxu na HEADER ikoně ---
+       Rule `body.ordering-process .toggle-window[data-target=login]` (mířená na checkout
+       login trigger) trefovala i header ikonu → bílý bordered box místo ikony. Vrátit ikonu. */
+    body.ordering-process .top-navigation-bar .responsive-tools a.toggle-window[data-target="login"] {
+        padding: 0 !important;
+        background-color: transparent !important;
+        border: 0 !important;
+        border-radius: 0 !important;
+        letter-spacing: 0 !important;
+        background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28' fill='none' stroke='black' stroke-width='1.8'><circle cx='14' cy='10' r='4'/><path d='M6 24c0-4 4-7 8-7s8 3 8 7'/></svg>") !important;
+        background-position: center !important;
+        background-repeat: no-repeat !important;
+        background-size: 22px 22px !important;
+    }
+
+    /* --- A4) Větší tap-target ikon (min 44px hit area), vizuální ikona 22px --- */
+    .top-navigation-bar .top-navigation-tools .responsive-tools a.toggle-window {
+        width: 44px !important;
+        min-width: 44px !important;
+        height: 44px !important;
+        background-size: 22px 22px !important;
+    }
+    .top-navigation-bar .top-navigation-tools .responsive-tools { gap: 2px !important; }
+    .top-navigation-bar .container { height: 56px !important; padding: 0 8px 0 16px !important; }
+}
+
+/* --- B) Account/form primární tlačítka: modrá/purpurová → černá ---
+   REGISTROVAT (input.btn-login), PŘIHLÁSIT SE (button.btn-login), ODESLAT (input.btn-primary),
+   404 "Zpět do obchodu" (a.btn-default). Vendor je nechává modré/purpurové. */
+input.btn.btn-primary, input[type="submit"].btn-primary, input[type="submit"].btn-login,
+input.btn.btn-login, button.btn.btn-login,
+a.btn.btn-default:not(.unveil-button):not(.toggle-contacts):not(.next-step-forward) {
+    background: var(--gl-black) !important;
+    background-color: var(--gl-black) !important;
+    background-image: none !important;
+    color: var(--gl-white) !important;
+    border: 1px solid var(--gl-black) !important;
+    border-radius: 0 !important;
+    box-shadow: none !important;
+    text-transform: uppercase !important;
+    letter-spacing: 0.06em !important;
+    font-family: var(--gl-font-ui) !important;
+    font-weight: var(--gl-w-medium) !important;
+    padding: 12px 24px !important;
+    min-height: 44px !important;
+    cursor: pointer;
+    transition: background .15s;
+}
+input.btn.btn-primary:hover, input.btn.btn-login:hover,
+button.btn.btn-login:hover, a.btn.btn-default:not(.unveil-button):hover {
+    background: #1a1a1a !important;
+    background-color: #1a1a1a !important;
+}
+
+/* --- C) Load-more + "Nahoru": modrá → černá outline --- */
+button.loadMore__button, a.loadMore__button, .loadMore__button,
+a.goToTop__button, .goToTop__button.btn {
+    color: var(--gl-fg-1) !important;
+    background: var(--gl-white) !important;
+    background-color: var(--gl-white) !important;
+    background-image: none !important;
+    border: 1px solid var(--gl-fg-1) !important;
+    border-radius: 0 !important;
+    box-shadow: none !important;
+    text-transform: uppercase !important;
+    letter-spacing: 0.06em !important;
+    font-family: var(--gl-font-ui) !important;
+    font-weight: var(--gl-w-medium) !important;
+}
+button.loadMore__button:hover, a.goToTop__button:hover, .loadMore__button:hover {
+    background: var(--gl-fg-1) !important;
+    background-color: var(--gl-fg-1) !important;
+    color: var(--gl-white) !important;
+}
+
+/* --- D) Modré textové odkazy (account formuláře, search kategorie) → černá podtržená --- */
+body.in-login #formLogin a,
+body.in-login #formLoginIncluded a,
+body.in-registrace #register-form a,
+body.in-zapomenute-heslo main a:not(.btn),
+#customerLogin #formLoginIncluded a,
+body.type-search #search-group-categories a,
+body.type-search .search-results-group a {
+    color: var(--gl-fg-1) !important;
+    text-decoration: underline !important;
+    text-underline-offset: 3px;
+}
+body.in-login #formLogin a:hover,
+body.in-registrace #register-form a:hover,
+body.type-search .search-results-group a:hover {
+    opacity: .7;
+}
+/* Search kategorie: zruš disc odrážky (vendor UL) → čistý seznam */
+body.type-search #search-group-categories ul,
+body.type-search .search-results-group-list {
+    list-style: none !important;
+    padding-left: 0 !important;
+    margin-left: 0 !important;
+}
+body.type-search #search-group-categories li,
+body.type-search .search-results-group-list li {
+    list-style: none !important;
+}
+
+/* --- E) Checkout: vybraná doprava/platba (b.shipping-billing-name) je modrá → černá --- */
+b.shipping-billing-name,
+.shipping-billing-name,
+body.ordering-process .shipping-billing-name,
+body.ordering-process .cart-recap .price,
+body.ordering-process td.shipping-billing-name {
+    color: var(--gl-fg-1) !important;
+}
+
+/* --- F) Košík quantity stepper: vendor dává +/− buttonům position:absolute →
+   vypadnou z gridu (cart CSS je narozdíl od detailu neresetuje) → rozhozený box.
+   Přepnout na flex [− 1 +] jako na detailu. --- */
+table.cart-table span.quantity {
+    display: inline-flex !important;
+    flex-direction: row !important;
+    align-items: stretch !important;
+    width: 120px !important;
+    height: 40px !important;
+    padding: 0 !important;
+    position: relative;
+    overflow: hidden;
+}
+table.cart-table span.quantity button.decrease,
+table.cart-table span.quantity button.increase {
+    position: static !important;
+    inset: auto !important;
+    top: auto !important; right: auto !important; bottom: auto !important; left: auto !important;
+    width: 36px !important;
+    min-width: 36px !important;
+    height: auto !important;
+    align-self: stretch !important;
+    display: inline-flex !important;
+    align-items: center !important;
+    justify-content: center !important;
+    font-size: 0 !important;
+    background: transparent !important;
+}
+table.cart-table span.quantity button.decrease { order: 1 !important; border-right: 1px solid var(--gl-divider) !important; }
+table.cart-table span.quantity label { order: 2 !important; flex: 1 1 auto !important; margin: 0 !important; }
+table.cart-table span.quantity input.amount { width: 100% !important; }
+table.cart-table span.quantity button.increase { order: 3 !important; border-left: 1px solid var(--gl-divider) !important; }
+table.cart-table span.quantity button.decrease::before,
+table.cart-table span.quantity button.increase::before {
+    position: static !important;
+    inset: auto !important;
+    top: auto !important; left: auto !important; right: auto !important; bottom: auto !important;
+    display: block !important;
+    width: auto !important;
+    height: auto !important;
+    margin: 0 !important;
+    transform: none !important;
+    font-size: 18px !important;
+    line-height: 1 !important;
+    color: var(--gl-fg-1) !important;
+    background: none !important;
+}
+table.cart-table span.quantity button.decrease::before { content: "−" !important; }
+table.cart-table span.quantity button.increase::before { content: "+" !important; }
+table.cart-table span.quantity .increase__sign,
+table.cart-table span.quantity .decrease__sign,
+table.cart-table span.quantity .increase-tooltip,
+table.cart-table span.quantity .decrease-tooltip,
+table.cart-table span.quantity .js-increase-tooltip,
+table.cart-table span.quantity .js-decrease-tooltip { display: none !important; }
+