/* ============================================================
   3DPrint.ua — Mobile UX & Accessibility fixes
   Source: MOBILE_OPTIMIZATION.md spec (4 audits, 390-430px) +
   independent audit 2026-06-11. Selectors verified against the
   live DOM (Blocksy + custom shop template), not the spec hints.
   v1.0.0
   ============================================================ */

/* ── Contrast (P1-8): WCAG AA ─────────────────────────────────
   Palette color 1 (#2872fa) is Blocksy's link/accent blue —
   measured 3.95–4.31:1 on white. #1a56d6 ≈ 5.6:1. One variable
   fixes links, accent buttons and the grey-on-blue spans. */
:root {
  --theme-palette-color-1: #1a56d6;
  --dp3-muted: #595959; /* replaces #8a8a8a / #999 metas (3.45:1 → 7:1) */
}

/* Checkout: «Виберіть опцію…» placeholder + muted selects (was #999, 2.75:1) */
.woocommerce-checkout select,
.woocommerce-checkout .select2-selection__placeholder { color: #595959; }
.woocommerce-checkout ::placeholder { color: #595959; opacity: 1; }
.woocommerce-checkout .product-name a { color: var(--theme-palette-color-1); }

/* Muted meta text site-wide (blog dates, captions) */
.post-date, .entry-meta, .ct-meta-element, figcaption { color: var(--dp3-muted); }

/* ============================================================
   MOBILE / TOUCH (≤999.98px — theme's tablet breakpoint)
   ============================================================ */
@media (max-width: 999.98px) {

  /* ── P0-1: primary action buttons ≥48px ──
     form.cart prefix beats Blocksy's button-height rule on product pages */
  .single_add_to_cart_button,
  form.cart .single_add_to_cart_button,
  .wc-proceed-to-checkout .checkout-button,
  #place_order,
  form input[type="submit"],
  .wpcf7-submit,
  .btn-submit {
    min-height: 48px !important;
    height: auto;
    padding-block: 12px;
    font-size: 16px;
  }
  .woocommerce-checkout .input-text,
  .woocommerce-checkout select,
  .woocommerce-cart .input-text,
  .wpcf7 input[type="text"],
  .wpcf7 input[type="email"],
  .wpcf7 input[type="tel"],
  form.cart input.qty {
    min-height: 48px;
  }
  /* iOS focus-zoom guard: no form control below 16px (P1-11) */
  input, textarea, select { font-size: 16px; }

  /* ── P0-3: header tap targets (measured 15–22px) ── */
  .ct-header-trigger,                /* «Меню» burger, was 18×18 */
  .ct-header-search.ct-toggle,       /* search toggle */
  a.dp3-hp,                          /* header phone icon, was 22×22 */
  .ct-header-cart .ct-cart-item {    /* cart link, was 70×20 */
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .ct-header > div { column-gap: 8px; } /* breathing room between targets */

  /* off-canvas menu: submenu toggles were 15×15, links 43px */
  .ct-toggle-dropdown-mobile {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  #offcanvas .mobile-menu a { min-height: 44px; display: flex; align-items: center; }

  /* hero slider dots: 10×10 visual, invisible 44×44 hit area */
  .hero-dots .dot { position: relative; }
  .hero-dots .dot::after {
    content: "";
    position: absolute;
    left: 50%; top: 50%;
    width: 44px; height: 44px;
    transform: translate(-50%, -50%);
  }
  .hero-dots { gap: 14px; } /* keep expanded hit areas from overlapping */

  /* cart page remove (22×25) + mini-cart drawer remove (27×27) */
  .product-mobile-actions a.remove,
  .woocommerce-cart-form a.remove,
  .ct-cart-content a.remove,
  #woo-cart-panel a.remove {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    line-height: 1;
  }

  /* breadcrumbs + review link (20px tall) */
  .ct-breadcrumbs a,
  .shop-breadcrumbs a,
  .woocommerce-review-link {
    display: inline-block;
    padding-block: 15px; /* ~14px line + 30px = 44px hit area */
  }
  .ct-breadcrumbs, .shop-breadcrumbs { line-height: 1.2; }

  /* footer link rows */
  .ct-footer .menu a, .ct-footer [class*="menu"] li a {
    display: inline-block;
    padding-block: 10px;
  }

  /* ── P0-3: catalog (FDM page had 99 sub-44px targets) ── */
  .pa-btn       { width: 44px; height: 44px; }   /* wishlist, was 32 */
  .pcard-cart   { width: 44px; height: 44px; }   /* add-to-cart icon, was 36 */
  .shop-pager a,
  .shop-pager span { min-width: 44px; height: 44px; } /* pagination, was 36 */
  .pcard-name   { padding-block: 6px; min-height: 44px; } /* product title link */
  .sf-opt       { min-height: 44px; padding-block: 4px; } /* filter rows */
  .shop-popular a { display: inline-block; padding: 10px 8px; }
  .st-left select { min-height: 44px; }          /* sort dropdown */

  /* ── P3-17: typography floor (12px ×101, 11px ×14, 10px ×2) ── */
  .entry-content p, .entry-content li { font-size: 15px; line-height: 1.5; }
  .pcard-name   { font-size: 14px; }
  .pcard-brand, .sf-opt, .sh-note { font-size: 13px; }
  .sf-opt .sf-cnt, .sp-card p, .hp-cat-sub { font-size: 12px; }
  .hp-blog-date, small, .ct-meta-element { font-size: 13px; }
}

/* ── P0-2: sticky buy bar (product pages, phones only) ── */
.m-sticky-buy {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 60;
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
  background: #fff;
  box-shadow: 0 -2px 12px rgba(0, 0, 0, .12);
}
.m-sticky-buy[hidden] { display: none; }
.m-sticky-buy__price {
  font-weight: 700;
  font-size: 17px;
  color: #111;
  white-space: nowrap;
}
.m-sticky-buy__btn {
  min-height: 48px;
  flex: 1;
  border: 0;
  border-radius: 8px;
  background: #D32300; /* brand red, 4.9:1 with white text */
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}
@media (min-width: 768px) { .m-sticky-buy { display: none; } }

/* ── P2-16: thumb-zone bottom bar (marketing pages, phones) ── */
@media (max-width: 689.98px) {
  .mobile-bottom-bar {
    position: fixed;
    inset: auto 0 0 0;
    display: flex;
    padding-bottom: env(safe-area-inset-bottom);
    background: #fff;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, .12);
    z-index: 59; /* below the product sticky-buy bar */
  }
  .mobile-bottom-bar a {
    flex: 1;
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    color: #111418;
  }
  .mobile-bottom-bar a + a { border-left: 1px solid #ececec; }
  .mobile-bottom-bar .mbb-primary { color: #D32300; }
  body.has-mobile-bottom-bar { padding-bottom: 56px; }
}
@media (min-width: 690px) { .mobile-bottom-bar { display: none; } }

/* ── P2-14: harden against latent horizontal overflow ──
   overflow-x:clip (not hidden) keeps position:sticky working */
html, body { overflow-x: clip; }
.ct-cart-content, .woocommerce-mini-cart { max-width: 100vw; }

/* ── P2-15: safe-area insets (viewport-fit=cover is set) ── */
[data-sticky] .ct-header,
.ct-header[data-sticky] {
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

/* ── Batch 2 (11.06.2026): approved items 6,7,8,12 ── */
@media (max-width: 999.98px) {
  /* 6: CF7 select + blog comment form to 48px */
  .wpcf7 select { min-height: 48px; }
  .comment-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
  .comment-form textarea { min-height: 48px; }
  .comment-form .submit { min-height: 48px; padding-block: 12px; font-size: 16px; }

  /* 7: footer link rows (dp3-footer-legal + columns), were 20-23px tall */
  .dp3-footer-legal-inner a,
  .dp3-foot-links-inner a,
  .ct-footer-copyright a { display: inline-block; padding-block: 11px; }

  /* 8: Gutenberg buttons (were 40px) */
  .wp-block-button__link {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* 14: product meta category/tag links (were 17px tall) */
  .posted_in a, .tagged_as a { display: inline-block; padding-block: 13px; }

  /* 12: 12px floor for catalog/services micro-labels */
  .ps, .sh-badge, .sh-tag, .pcard-avail, .sp-card p, .sf-opt .sf-cnt,
  .dp3-scanner-banner-badge, .srv-hero-kicker, .svc-hero-tag, .srv-stat-l { font-size: 12px; }
}

/* AI-chat bubble (#dp3ai-btn, mu-plugin dp3-ai-assistant):
   respect the home-indicator + don't cover the bottom bars */
body #dp3ai-btn { bottom: calc(20px + env(safe-area-inset-bottom)); }
@media (max-width: 689.98px) {
  body.has-mobile-bottom-bar #dp3ai-btn  { bottom: calc(72px + env(safe-area-inset-bottom)); }
  body.has-mobile-bottom-bar #dp3ai-panel { bottom: calc(142px + env(safe-area-inset-bottom)); }
}
@media (max-width: 767.98px) {
  body.single-product #dp3ai-btn  { bottom: calc(88px + env(safe-area-inset-bottom)); }
  body.single-product #dp3ai-panel { bottom: calc(158px + env(safe-area-inset-bottom)); }
}
