/* Fan Zona Tabs – minimal modern style */
.fzt-container { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; border: 1px solid #e5e7eb; border-radius: 1rem; }
.fzt-tabs { display: flex; flex-wrap: wrap; gap: .5rem; }
.fzt-tab, .fzt-archive-link { display: inline-block; padding: .6rem .9rem; border-radius: .75rem; text-decoration: none; border: 1px solid #e5e7eb; }
.fzt-tab:hover, .fzt-archive-link:hover { background: #f5f7fb; }
.fzt-tab.is-active { border-color: #2563eb; box-shadow: inset 0 0 0 1px #2563eb; }
.fzt-cta .fzt-archive-link { font-weight: 600; }
.fzt-empty { padding: 1rem; color: #6b7280; }

/* Archive grid */
.fzt-archive .fzt-header { margin: 2rem 0 1rem; }
.fzt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1rem; margin-top: 1rem; }
.fzt-card { border: 1px solid #e5e7eb; border-radius: 1rem; overflow: hidden; background: #fff; transition: transform .15s ease, box-shadow .15s ease; }
.fzt-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,0.07); }
.fzt-card-link { display: grid; gap: .5rem; padding: .75rem; text-decoration: none; color: inherit; }
.fzt-thumb img { display: block; width: 100%; height: auto; }
.fzt-card-title { margin: .25rem 0; font-size: 1.1rem; }
.fzt-card-cta { display: inline-block; margin-top: .5rem; opacity: .7; }

/* Single */
.fzt-single .fzt-tabs.sticky { position: sticky; top: 0; background: rgba(255,255,255,.9); padding: .5rem; border-bottom: 1px solid #e5e7eb; backdrop-filter: blur(6px); z-index: 10; }
.fzt-title { margin: 1rem 0; }
.fzt-body { display: grid; gap: 1rem; }

/* === Mobile hotfix for squeezed/vertical text in betting tables (Tipovanje) === */
@media screen and (max-width: 768px) {
  /* Prevent letter-by-letter wrapping */
  .fzt-container table td,
  .fzt-container table th,
  .fzt-container .team-name,
  .fzt-container .match-row,
  .fzt-container .match-cell {
    white-space: nowrap !important;
    word-break: keep-all !important;
  }

  /* Allow horizontal scroll if content doesn't fit */
  .fzt-container table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Safety: ensure flex/grid parents don't force super narrow columns */
  .fzt-container .fzt-body,
  .fzt-container .fzt-grid,
  .fzt-container .fzt-tabs {
    min-width: 0;
  }
}

/* === Mobile force-fix: prevent letter-by-letter wrapping anywhere inside plugin === */
@media screen and (max-width: 768px) {
  .fzt-container, .fzt-container * {
    word-break: normal !important;
    overflow-wrap: normal !important;
    white-space: nowrap !important;
    hyphens: manual !important;
    writing-mode: horizontal-tb !important;
  }

  /* Allow horizontal scrolling when content doesn't fit */
  .fzt-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}
