/* ============ RESPONSIVE ============ */

/* Tablet — 2-col grid, heroes span full row */
@media (max-width: 1279px) {
  .v-voksen .tool-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Small tablet */
@media (max-width: 991px) {
  .v-voksen .tool-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ── Touch target fixes (all screens) ── */
.recent-doc-item {
  min-height: 36px;
}

.recent-docs-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 12px;
  margin: -8px -12px;
  border-radius: var(--radius-md);
}

.voksen-email-link {
  min-height: 44px;
}

.voksen-email-item {
  min-height: 36px;
}

/* ── Touch devices: disable sticky hover ── */
@media (hover: none) {
  .v-voksen .tool-card:hover {
    transform: none;
    border-color: rgba(0, 0, 0, 0.10);
    box-shadow:
      0 1px 3px 0 rgba(0, 0, 0, 0.07),
      0 1px 2px -1px rgba(0, 0, 0, 0.07);
  }
  .v-voksen .tool-card:active {
    transform: scale(0.98);
  }
  [data-theme="dark"].v-voksen .tool-card:hover {
    background: rgba(255, 255, 255, 0.05);
    box-shadow: none;
  }
  .recent-doc-item:not(.recent-doc-empty):hover {
    background: transparent;
  }
  .recent-doc-item:not(.recent-doc-empty):active {
    background: rgba(var(--color-primary-rgb), 0.06);
  }
  .voksen-email-item:hover {
    background: transparent;
  }
  .voksen-email-item:active {
    background: rgba(var(--color-primary-rgb), 0.06);
  }
  .cal-glance-item:hover {
    background: transparent;
  }
  .cal-glance-item:active {
    background: rgba(var(--color-primary-rgb), 0.06);
  }
}

/* ── Eliminate tap-zoom delay ── */
.tool-card,
.recent-doc-item,
.voksen-email-item,
.voksen-email-link,
.recent-docs-link,
.voksen-email-connect-btn,
.voksen-email-refresh,
.cal-glance-item,
.cal-glance-link,
.mobile-nav-item {
  touch-action: manipulation;
}

/* ── iPad landscape (1024–1279px) ── */
@media (min-width: 992px) and (max-width: 1279px) {
  .dash-row-bottom {
    grid-template-columns: repeat(4, 1fr);
  }
  /* Email widget spans full row when it wraps alone */
  .voksen-email-glance.widget-size-medium {
    grid-column: 1 / -1;
    grid-row: span 1;
    max-height: 200px;
  }
}

/* ── iPad portrait (768–991px) ── */
@media (min-width: 768px) and (max-width: 991px) {
  .v-voksen .tool-cards {
    gap: 12px;
  }
  .dash-row-bottom {
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
  }
  .voksen-email-glance.widget-size-medium {
    grid-column: 1 / -1;
    grid-row: span 1;
    max-height: 200px;
  }
}

/* ── Mobile ── */
@media (max-width: 767px) {
  /* Welcome */
  .voksen-welcome {
    padding: var(--space-4) 0 var(--space-3);
  }
  .voksen-welcome h1 {
    font-size: var(--font-size-xl);
    line-height: 1.3;
  }

  /* Mobile reorder: data widgets before tool cards */
  .main-content {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
  }
  .voksen-welcome { order: 1; }
  .dash-row-bottom { order: 2; }
  .tool-cards { order: 3; }

  /* Within dash-row-bottom, reorder: calendar first, email second, docs third, ghost last */
  .cal-glance-card { order: 1; }
  .voksen-email-glance { order: 2; }
  .recent-docs-card { order: 3; }
  .dash-empty-state { order: 0; }
  .dash-widget-ghost { order: 10; margin-top: 0; }

  /* Tool cards grid — mobile: stack heroes */
  .v-voksen .tool-cards {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: var(--space-4);
  }
  .v-voksen .tool-cards--hero-only {
    grid-template-columns: 1fr;
  }
  .v-voksen .tool-card--hero,
  .v-voksen .tool-cards--hero-only .tool-card--hero {
    grid-column: span 1;
    padding: 20px;
    min-height: auto;
  }
  .v-voksen .tool-card--hero .tool-card-icon {
    width: 40px;
    height: 40px;
    margin-bottom: 12px;
  }
  .v-voksen .tool-card--hero .tool-card-title {
    font-size: 1rem;
  }
  .v-voksen .tool-card--secondary {
    padding: 16px;
  }
  .v-voksen .tool-card--secondary .tool-card-icon {
    width: 36px;
    height: 36px;
    margin-bottom: 10px;
  }
  .v-voksen .tool-card--secondary .tool-card-title {
    font-size: 0.8125rem;
  }
  .v-voksen .tool-card--secondary .tool-card-description {
    display: none;
  }
  .v-voksen .tool-card-meta {
    display: none;
  }

  /* Bottom row — single column on mobile, auto height */
  .dash-row-bottom {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    gap: 12px;
  }
  .widget-size-medium {
    grid-column: span 1;
    grid-row: span 1;
  }

  /* Recent docs card */
  .recent-docs-card {
    padding: var(--space-4);
  }
  .recent-docs-header {
    margin-bottom: var(--space-3);
  }
  .recent-doc-item {
    padding: 10px var(--space-2);
    gap: var(--space-2);
  }
  .recent-doc-title {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: var(--font-size-sm);
    line-height: 1.4;
  }

  /* Email glance card */
  .voksen-email-glance {
    padding: var(--space-4);
  }
  .voksen-email-header {
    margin-bottom: var(--space-3);
  }
  .voksen-email-item {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .voksen-email-subject {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.4;
  }

  /* Calendar glance card — mobile */
  .cal-glance-card {
    padding: var(--space-4);
  }
  .cal-glance-header {
    margin-bottom: var(--space-3);
  }

  /* Card shadows — lighter on mobile */
  .v-voksen .tool-card {
    box-shadow:
      0 1px 2px rgba(0, 0, 0, 0.05),
      0 4px 12px rgba(0, 0, 0, 0.04);
  }
  .recent-docs-card,
  .voksen-email-glance,
  .cal-glance-card {
    box-shadow: none;
    border: 1px solid rgba(0, 0, 0, 0.08);
  }

  /* Mobile bottom nav + safe area */
  .main-content {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .mobile-nav {
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .mobile-nav-item {
    min-height: 48px;
    min-width: 48px;
  }
}