/*
 * Tam Tam Street — Mobile Adaptive Layer
 * Caricato per ultimo per uniformare tema, Gutenberg, WooCommerce e Dokan.
 */

:root {
  --tt-mobile-gutter: clamp(16px, 4.5vw, 24px);
  --tt-section-space: clamp(44px, 9vw, 76px);
  --tt-control-height: 48px;
}

html {
  max-width: 100%;
  overflow-x: clip;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
}

img,
picture,
video,
canvas,
svg,
iframe,
embed,
object {
  max-width: 100%;
}

img,
picture,
video,
canvas,
svg {
  height: auto;
}

iframe,
embed,
object {
  width: 100%;
}

figure,
.wp-caption,
.wp-block-image,
.wp-block-video,
.wp-block-embed,
.wp-block-gallery {
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

pre,
code,
kbd,
samp,
a,
p,
li,
td,
th {
  overflow-wrap: anywhere;
  word-break: normal;
}

input,
select,
textarea,
button {
  max-width: 100%;
  font: inherit;
}

/* Contenitori: impedisce che padding e larghezze desktop escano dalla viewport. */
.wrapper,
.container,
.tt-section,
.site-main,
.entry-content,
.wp-site-blocks,
.woocommerce,
.dokan-dashboard-wrap,
.dokan-single-store,
.dokan-store-wrap,
.dokan-store-page-wrap {
  min-width: 0;
}

/* Gutenberg */
.entry-content > *,
.wp-site-blocks > * {
  max-width: 100%;
}

.wp-block-columns,
.wp-block-media-text,
.wp-block-group,
.wp-block-cover,
.wp-block-buttons {
  min-width: 0;
}

.wp-block-table,
.woocommerce table,
.dokan-table-wrap,
.dokan-product-listing-area .dokan-product-listing-top,
.dokan-product-listing-area .dokan-product-listing-table {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Touch target minimo, senza alterare icone puramente decorative. */
a.button,
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.dokan-btn {
  min-height: 44px;
}

@media (max-width: 900px) {
  .wrapper,
  .container,
  .tt-section {
    width: 100%;
    padding-left: var(--tt-mobile-gutter);
    padding-right: var(--tt-mobile-gutter);
  }

  .site-header,
  header,
  .navbar {
    padding-left: var(--tt-mobile-gutter);
    padding-right: var(--tt-mobile-gutter);
  }

  .header-inner {
    min-width: 0;
    gap: 12px;
  }

  .site-logo {
    flex: 0 1 auto;
    min-width: 0;
  }

  .site-logo img {
    width: auto;
    max-width: min(42vw, 180px);
    height: clamp(58px, 15vw, 82px);
    object-fit: contain;
  }

  .header-right {
    flex: 0 0 auto;
  }

  .mobile-menu {
    position: fixed;
    inset: auto 0 0 0;
    top: var(--tt-header-height, 82px);
    width: 100%;
    max-height: calc(100dvh - var(--tt-header-height, 82px));
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 9999;
  }

  .wp-block-columns,
  .wp-block-media-text {
    gap: clamp(20px, 5vw, 32px);
  }

  .wp-block-columns:not(.is-not-stacked-on-mobile) {
    flex-wrap: wrap !important;
  }

  .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
    flex-basis: 100% !important;
    min-width: 0;
  }

  .wp-block-media-text:not(.has-media-on-the-right),
  .wp-block-media-text.has-media-on-the-right {
    grid-template-columns: 1fr !important;
  }

  .wp-block-media-text .wp-block-media-text__media,
  .wp-block-media-text .wp-block-media-text__content {
    grid-column: 1 !important;
  }

  .wp-block-media-text .wp-block-media-text__content {
    padding: clamp(20px, 5vw, 32px) 0;
  }

  /* Griglie custom: due colonne su tablet. */
  .tt-cards-grid,
  .grid-associazioni,
  .woocommerce ul.products,
  body.dokan-store ul.products,
  body.dokan-store .seller-items ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* WooCommerce */
  .woocommerce div.product,
  .woocommerce-page div.product {
    min-width: 0;
  }

  .woocommerce div.product div.images,
  .woocommerce div.product div.summary,
  .woocommerce-page div.product div.images,
  .woocommerce-page div.product div.summary {
    width: 100% !important;
    float: none !important;
  }

  .woocommerce .cart-collaterals .cart_totals,
  .woocommerce-page .cart-collaterals .cart_totals,
  .woocommerce-checkout #customer_details,
  .woocommerce-checkout #order_review,
  .woocommerce-checkout #order_review_heading {
    width: 100% !important;
    float: none !important;
  }

  /* Dokan: sidebar sopra al contenuto; tabelle scorrono senza allargare il body. */
  body.dokan-dashboard .dokan-dashboard-wrap {
    display: block !important;
  }

  body.dokan-dashboard .dokan-dash-sidebar,
  body.dokan-dashboard .dokan-dashboard-content {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    float: none !important;
  }

  body.dokan-dashboard .dokan-product-listing-area {
    max-width: 100%;
    overflow: hidden;
  }

  body.dokan-dashboard .dokan-table,
  body.dokan-dashboard table.dokan-table {
    min-width: 760px !important;
  }

  body.dokan-dashboard .dokan-form-inline {
    align-items: stretch !important;
  }

  body.dokan-dashboard .dokan-form-inline input,
  body.dokan-dashboard .dokan-form-inline select,
  body.dokan-dashboard .dokan-form-inline button {
    flex: 1 1 220px;
    width: 100% !important;
    max-width: none !important;
  }
}

@media (max-width: 640px) {
  :root {
    --tt-mobile-gutter: 16px;
    --tt-control-height: 48px;
  }

  .wrapper,
  .container,
  .tt-section {
    padding-top: var(--tt-section-space);
    padding-bottom: var(--tt-section-space);
  }

  h1,
  .entry-title,
  .page-title,
  .woocommerce .page-title {
    font-size: clamp(2rem, 10vw, 2.75rem) !important;
    line-height: 1.05;
    letter-spacing: -0.035em;
  }

  h2 {
    font-size: clamp(1.65rem, 8vw, 2.25rem) !important;
  }

  h3 {
    font-size: clamp(1.25rem, 6vw, 1.65rem) !important;
  }

  body,
  input,
  select,
  textarea,
  button {
    font-size: 16px;
  }

  .mobile-menu {
    padding: 20px var(--tt-mobile-gutter) 28px;
  }

  .mobile-menu-items,
  .mobile-menu-items ul {
    width: 100%;
    padding: 0;
    margin: 0;
  }

  .mobile-menu-items li {
    width: 100%;
    margin: 0;
  }

  .mobile-menu-items a {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 48px;
    padding: 10px 0;
  }

  .tt-cards-grid,
  .grid-associazioni,
  .woocommerce ul.products,
  body.dokan-store ul.products,
  body.dokan-store .seller-items ul.products {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 20px !important;
  }

  .card,
  .glass-card,
  .woocommerce ul.products li.product,
  body.dokan-store ul.products li.product {
    min-width: 0;
  }

  .wp-block-buttons,
  .wp-block-button,
  .wp-block-button__link {
    width: 100%;
  }

  .wp-block-button__link,
  .button,
  .btn,
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce input.button,
  .dokan-btn {
    width: 100%;
    white-space: normal;
    text-align: center;
  }

  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea {
    width: 100% !important;
    min-height: var(--tt-control-height);
  }

  textarea {
    min-height: 130px;
  }

  /* Tabelle WooCommerce: contenitore scorrevole, celle leggibili. */
  .woocommerce-cart-form,
  .woocommerce-orders-table,
  .woocommerce-account .woocommerce-MyAccount-content,
  body.dokan-dashboard .dokan-product-listing-area {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .woocommerce table.shop_table {
    min-width: 620px;
  }

  .woocommerce table.shop_table_responsive,
  .woocommerce-page table.shop_table_responsive {
    min-width: 0;
  }

  /* Dokan filtri e azioni in colonna. */
  body.dokan-dashboard .dokan-product-listing-top,
  body.dokan-dashboard .dokan-product-listing-top .dokan-w12,
  body.dokan-dashboard .dokan-product-listing-top .dokan-w8,
  body.dokan-dashboard .dokan-product-listing-top .dokan-w4,
  body.dokan-store .dokan-store-products-filter-area {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 10px !important;
  }

  body.dokan-store .dokan-store-tabs ul,
  body.dokan-store ul.dokan-list-inline {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  body.dokan-store .dokan-store-tabs li a,
  body.dokan-store ul.dokan-list-inline li a {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(0,0,0,.08);
  }

  /* Gallerie: evita miniature eccessivamente strette. */
  .wp-block-gallery.has-nested-images.columns-3 figure.wp-block-image,
  .wp-block-gallery.has-nested-images.columns-4 figure.wp-block-image,
  .wp-block-gallery.has-nested-images.columns-5 figure.wp-block-image,
  .wp-block-gallery.has-nested-images.columns-6 figure.wp-block-image,
  .wp-block-gallery.has-nested-images.columns-7 figure.wp-block-image,
  .wp-block-gallery.has-nested-images.columns-8 figure.wp-block-image {
    width: calc(50% - var(--wp--style--unstable-gallery-gap, 8px) / 2) !important;
  }

  footer,
  .site-footer {
    padding-left: var(--tt-mobile-gutter);
    padding-right: var(--tt-mobile-gutter);
  }
}

@media (max-width: 420px) {
  .site-logo img {
    max-width: 150px;
    height: 60px;
  }

  .header-right {
    gap: 9px;
  }

  .header-icon svg,
  .header-icon img {
    width: 21px;
    height: 21px;
  }

  .wp-block-gallery.has-nested-images figure.wp-block-image {
    width: 100% !important;
  }

  body.dokan-dashboard .dokan-product-listing-area {
    padding: 14px !important;
  }
}

@media (hover: none) and (pointer: coarse) {
  .card:hover,
  .glass-card:hover,
  .woocommerce ul.products li.product:hover,
  body.dokan-store ul.products li.product:hover {
    transform: none !important;
  }

  a,
  button,
  input,
  select,
  textarea {
    -webkit-tap-highlight-color: transparent;
  }
}

/* =========================================================
   VISION / QUERY LOOP — GRIGLIA MOBILE A 2 CARD PER RIGA
   Gestisce sia il Query Loop Gutenberg sia griglie/card custom.
   ========================================================= */
@media (max-width: 640px) {
  /* Testata della pagina Vision: meno vuoto e migliore gerarchia. */
  body .entry-content {
    padding-left: var(--tt-mobile-gutter);
    padding-right: var(--tt-mobile-gutter);
  }

  body .entry-content > h1:first-child,
  body .entry-content .wp-block-post-title:first-child {
    margin-bottom: 18px !important;
    text-align: center !important;
    font-size: clamp(2.65rem, 14vw, 4rem) !important;
    line-height: .9 !important;
  }

  body .entry-content > h1:first-child + p,
  body .entry-content .vision-intro,
  body .entry-content .visions-intro {
    max-width: 36ch !important;
    margin: 0 auto 24px !important;
    text-align: center !important;
    font-size: clamp(.96rem, 4.2vw, 1.08rem) !important;
    line-height: 1.48 !important;
  }

  /* Riduce il grande vuoto tra introduzione e catalogo. */
  body .entry-content > .wp-block-spacer {
    height: clamp(24px, 10vw, 44px) !important;
  }

  /* Gutenberg Query Loop / Post Template. */
  body .entry-content .wp-block-query,
  body .entry-content .wp-block-post-template,
  body .entry-content ul.wp-block-post-template {
    width: 100% !important;
    max-width: 100% !important;
  }

  body .entry-content .wp-block-post-template,
  body .entry-content ul.wp-block-post-template,
  body .entry-content .vision-grid,
  body .entry-content .visions-grid,
  body .entry-content .tt-vision-grid,
  body .entry-content .cards-vision,
  body .entry-content .vision-cards {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 14px !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Singola card. */
  body .entry-content .wp-block-post-template > li,
  body .entry-content .wp-block-post,
  body .entry-content .vision-card,
  body .entry-content .visions-card,
  body .entry-content .tt-vision-card {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-radius: 18px !important;
  }

  /* Immagine card: più bassa e uniforme. */
  body .entry-content .wp-block-post-featured-image,
  body .entry-content .vision-card figure,
  body .entry-content .visions-card figure,
  body .entry-content .tt-vision-card figure {
    width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-radius: 16px 16px 0 0 !important;
  }

  body .entry-content .wp-block-post-featured-image a {
    display: block !important;
    width: 100% !important;
  }

  body .entry-content .wp-block-post-featured-image img,
  body .entry-content .vision-card img,
  body .entry-content .visions-card img,
  body .entry-content .tt-vision-card img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
    border-radius: 0 !important;
  }

  /* Corpo testuale della card. */
  body .entry-content .wp-block-post-template > li > :not(figure):not(.wp-block-post-featured-image),
  body .entry-content .vision-card__content,
  body .entry-content .visions-card__content,
  body .entry-content .tt-vision-card__content {
    min-width: 0 !important;
  }

  /* Titolo: massimo 3 righe, dimensione adatta a due colonne. */
  body .entry-content .wp-block-post-title,
  body .entry-content .vision-card h2,
  body .entry-content .vision-card h3,
  body .entry-content .visions-card h2,
  body .entry-content .visions-card h3,
  body .entry-content .tt-vision-card h2,
  body .entry-content .tt-vision-card h3 {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
    overflow: hidden !important;
    margin: 14px 10px 7px !important;
    text-align: center !important;
    font-size: clamp(.98rem, 4.35vw, 1.18rem) !important;
    line-height: 1.16 !important;
    letter-spacing: -.015em !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: auto !important;
  }

  body .entry-content .wp-block-post-title a {
    text-decoration: none !important;
  }

  /* Codice, categoria o metadati. */
  body .entry-content .wp-block-post-terms,
  body .entry-content .wp-block-post-date,
  body .entry-content .wp-block-post-excerpt,
  body .entry-content .vision-code,
  body .entry-content .vision-card__code,
  body .entry-content .visions-card__code {
    margin: 0 10px 13px !important;
    text-align: center !important;
    font-size: clamp(.7rem, 3.15vw, .82rem) !important;
    line-height: 1.25 !important;
    letter-spacing: .015em !important;
  }

  /* Pulsante compatto ma facilmente cliccabile. */
  body .entry-content .wp-block-post-template .wp-block-buttons,
  body .entry-content .vision-card .wp-block-buttons,
  body .entry-content .visions-card .wp-block-buttons,
  body .entry-content .tt-vision-card .wp-block-buttons {
    width: auto !important;
    margin: auto 9px 10px !important;
  }

  body .entry-content .wp-block-post-template .wp-block-button,
  body .entry-content .vision-card .wp-block-button,
  body .entry-content .visions-card .wp-block-button,
  body .entry-content .tt-vision-card .wp-block-button {
    width: 100% !important;
  }

  body .entry-content .wp-block-post-template .wp-block-button__link,
  body .entry-content .vision-card .wp-block-button__link,
  body .entry-content .visions-card .wp-block-button__link,
  body .entry-content .tt-vision-card .wp-block-button__link,
  body .entry-content .vision-card .button,
  body .entry-content .visions-card .button,
  body .entry-content .tt-vision-card .button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 44px !important;
    padding: 9px 8px !important;
    border-radius: 14px !important;
    white-space: normal !important;
    text-align: center !important;
    font-size: clamp(.76rem, 3.4vw, .9rem) !important;
    line-height: 1.15 !important;
  }

  /* Neutralizza margini Gutenberg che possono rompere la griglia. */
  body .entry-content .wp-block-post-template > li > * {
    max-width: 100% !important;
  }
}

/* Schermi molto stretti: mantiene due colonne, ma riduce gap e raggi. */
@media (max-width: 380px) {
  body .entry-content .wp-block-post-template,
  body .entry-content ul.wp-block-post-template,
  body .entry-content .vision-grid,
  body .entry-content .visions-grid,
  body .entry-content .tt-vision-grid,
  body .entry-content .cards-vision,
  body .entry-content .vision-cards {
    gap: 10px !important;
  }

  body .entry-content .wp-block-post-template > li,
  body .entry-content .vision-card,
  body .entry-content .visions-card,
  body .entry-content .tt-vision-card {
    border-radius: 14px !important;
  }

  body .entry-content .wp-block-post-title,
  body .entry-content .vision-card h2,
  body .entry-content .vision-card h3,
  body .entry-content .visions-card h2,
  body .entry-content .visions-card h3,
  body .entry-content .tt-vision-card h2,
  body .entry-content .tt-vision-card h3 {
    margin-left: 8px !important;
    margin-right: 8px !important;
    font-size: .92rem !important;
  }
}