/* HiddenHelp live-safe button + tile polish
   Purpose: bring the softer v14-style buttons/cards into the current live build
   without touching HTML structure, filters, scripts, saved-data logic or navigation. */

:root{
  --hh-safe-ink:#2f2138;
  --hh-safe-muted:#6f5f78;
  --hh-safe-line:rgba(126,87,139,.18);
  --hh-safe-line-strong:rgba(126,87,139,.26);
  --hh-safe-purple:#ead0ff;
  --hh-safe-blue:#e5f8ff;
  --hh-safe-mint:#e9fff5;
  --hh-safe-cream:#fff8df;
  --hh-safe-card:#ffffff;
  --hh-safe-shadow:0 14px 34px rgba(55,32,68,.10);
  --hh-safe-shadow-soft:0 8px 22px rgba(55,32,68,.075);
}

html,body{overflow-x:hidden!important;}
body *{box-sizing:border-box;}
main,.wrap,.container,.page-wrap,section,article,div{min-width:0;}
img,svg,video,canvas,iframe{max-width:100%;height:auto;}

/* Remove the glossy/white stripe effect that came from some rebrand attempts. */
.btn::before,.button::before,.small-btn::before,.action-tile::before,
.links a::before,.links button::before,.actions a::before,.actions button::before,
.hero-actions a::before,.hero-actions button::before,.result-actions a::before,.result-actions button::before,
.card-actions a::before,.card-actions button::before,.guide-actions a::before,.guide-actions button::before,
button.card::before,.tile button::before,.result-tile button::before,.route-controls button::before,
.hh-live-nav button::before,.hh-route-nav button::before,.filter-chip::before,.chip::before{
  content:none!important;display:none!important;
}

/* Buttons: v14-inspired soft rounded look, applied only to actual action controls. */
.btn,a.btn,button.btn,
.button,a.button,button.button,
.small-btn,
.links a,.links button,
.actions a,.actions button,
.hero-actions a,.hero-actions button,
.result-actions a,.result-actions button,
.card-actions a,.card-actions button,
.guide-actions a,.guide-actions button,
.panel-actions a,.panel-actions button,
.tool-actions a,.tool-actions button,
.support-actions a,.support-actions button,
.route-controls button,
.hh-live-nav button,.hh-route-nav button,
[data-hh-save-plan],.copy-btn,.contact-chip,
.support-plan-link-card a{
  appearance:none!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-height:46px!important;
  min-width:0!important;
  max-width:100%!important;
  padding:11px 16px!important;
  border-radius:999px!important;
  border:1px solid var(--hh-safe-line-strong)!important;
  background:linear-gradient(135deg,var(--hh-safe-purple),var(--hh-safe-blue))!important;
  color:var(--hh-safe-ink)!important;
  box-shadow:var(--hh-safe-shadow-soft)!important;
  text-decoration:none!important;
  text-align:center!important;
  font-weight:850!important;
  line-height:1.15!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}

/* Keep secondary-looking actions calm rather than all feeling primary. */
.btn.secondary,.button.secondary,
.links a:nth-child(n+2),.links button:nth-child(n+2),
.actions a:nth-child(n+2),.actions button:nth-child(n+2),
.hero-actions a:nth-child(n+2),.hero-actions button:nth-child(n+2),
.result-actions a:nth-child(n+2),.result-actions button:nth-child(n+2),
.card-actions a:nth-child(n+2),.card-actions button:nth-child(n+2),
.guide-actions a:nth-child(n+2),.guide-actions button:nth-child(n+2),
.route-controls button:nth-child(n+2){
  background:linear-gradient(135deg,#fff,#eefbff)!important;
  color:#5a4164!important;
}

.btn.mint,.btn.print,[data-print-plan],
.actions a[href*="print"],.actions button[id*="print" i],.links button[id*="print" i]{
  background:linear-gradient(135deg,var(--hh-safe-cream),var(--hh-safe-mint))!important;
  color:#2b654f!important;
  border-color:rgba(95,166,132,.24)!important;
}

button:disabled,.btn:disabled,.hh-live-nav button:disabled,.hh-route-nav button:disabled{
  opacity:.58!important;cursor:not-allowed!important;box-shadow:none!important;
}

/* Preserve filter behaviour and make filters wrap instead of touching edges. */
.filters,.filter-row,.filterbar,.filter-bar,.guide-filters,.hh-filter-row,
.badge-row,.chip-row,.chips,.quick-filters{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  row-gap:10px!important;
  align-items:center!important;
  max-width:100%!important;
}
.filter-chip,.chip,.tag,.badge,.label,.status,.pill,.category-chip,
.guide-filter,.hh-filter-chip{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  max-width:100%!important;
  min-height:34px!important;
  padding:7px 12px!important;
  border-radius:999px!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}

/* Card/tile sizing: laptop friendly, but avoids making mobile cramped. */
.card,.tile,.result-tile,.route-card,.guide-card,.saving-card,.provider-card,
.contact-card,.dashboard-card,.support-card,.tool-card,.glass,.section,
.local-card,.activity-card,.hh-info-card,.quick-route,.support-plan-link-card,
.snapshot,.empty-state,.empty-plan,.article-card{
  max-width:100%!important;
  min-width:0!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}
.card,.tile,.result-tile,.route-card,.guide-card,.saving-card,.provider-card,
.contact-card,.dashboard-card,.support-card,.tool-card,.local-card,.activity-card,
.hh-info-card,.article-card{
  border-radius:24px!important;
  box-shadow:var(--hh-safe-shadow)!important;
}
.tile,.result-tile,.route-card,.provider-card,.guide-card,.saving-card,.local-card,.activity-card{
  display:flex!important;
  flex-direction:column!important;
  gap:12px!important;
  padding:18px!important;
}
.tile .links,.tile .actions,.result-tile .links,.result-tile .actions,.result-actions,
.route-card .links,.route-card .actions,.guide-card .links,.guide-card .actions,
.card .links,.card .actions{
  margin-top:auto!important;
}

/* Better grids on laptops/desktops without forcing tiny columns. */
.tiles,.trust,.start-grid,.seo-grid,.input-grid,.choice-grid,.result-grid,.localgrid,
.guide-grid,.cards,.routes,.dashboard-grid,.support-grid,.savings-grid,.activity-grid,
.provider-grid,.deep-grid{
  gap:16px!important;
  align-items:stretch!important;
}
@media (min-width:760px){
  .tiles,.choice-grid,.result-grid,.input-grid,.localgrid,.guide-grid,.cards,.routes,
  .dashboard-grid,.support-grid,.savings-grid,.activity-grid,.provider-grid,.deep-grid{
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important;
  }
  .seo-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))!important;}
  .trust{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;}
  .actions,.links,.hero-actions,.result-actions,.card-actions,.guide-actions,
  .panel-actions,.tool-actions,.support-actions{
    display:flex!important;flex-wrap:wrap!important;gap:12px!important;align-items:stretch!important;
  }
  .actions>*,.links>*,.hero-actions>*,.result-actions>*,.card-actions>*,.guide-actions>*{
    flex:1 1 180px!important;
  }
}
@media (min-width:1100px){
  .tiles,.choice-grid,.result-grid,.localgrid,.guide-grid,.cards,.routes,
  .dashboard-grid,.support-grid,.savings-grid,.activity-grid,.provider-grid,.deep-grid{
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr))!important;
  }
}

/* Mobile: one clean column, full-width buttons, no overflow. */
@media (max-width:700px){
  main,.wrap,.container,.page-wrap{width:min(100% - 22px, var(--page, 1120px))!important;margin-left:auto!important;margin-right:auto!important;}
  .tiles,.trust,.start-grid,.seo-grid,.input-grid,.choice-grid,.result-grid,.localgrid,
  .guide-grid,.cards,.routes,.dashboard-grid,.support-grid,.savings-grid,.activity-grid,
  .provider-grid,.deep-grid{grid-template-columns:1fr!important;gap:12px!important;}
  .tile,.result-tile,.route-card,.provider-card,.guide-card,.saving-card,.local-card,.activity-card,
  .card,.support-card,.tool-card{padding:15px!important;border-radius:22px!important;min-height:0!important;}
  .actions,.links,.hero-actions,.result-actions,.card-actions,.guide-actions,
  .panel-actions,.tool-actions,.support-actions,.route-controls{
    display:grid!important;grid-template-columns:1fr!important;gap:10px!important;width:100%!important;
  }
  .actions>*,.links>*,.hero-actions>*,.result-actions>*,.card-actions>*,.guide-actions>*,
  .panel-actions>*,.tool-actions>*,.support-actions>*,.route-controls>*{
    width:100%!important;min-width:0!important;flex:1 1 auto!important;margin:0!important;
  }
  .btn,a.btn,button.btn,.button,a.button,button.button,.small-btn,
  .links a,.links button,.actions a,.actions button,.hero-actions a,.hero-actions button,
  .result-actions a,.result-actions button,.card-actions a,.card-actions button,
  .guide-actions a,.guide-actions button,.route-controls button,.support-plan-link-card a{
    width:100%!important;min-height:48px!important;padding:12px 14px!important;
  }
  h1{font-size:clamp(2rem,10vw,2.65rem)!important;line-height:1.02!important;}
  h2{font-size:clamp(1.45rem,7vw,2rem)!important;line-height:1.08!important;}
  h3,.card strong,.tile strong{font-size:clamp(1.08rem,5.5vw,1.35rem)!important;line-height:1.12!important;}
}

/* Laptop-specific: cards should not become huge vertical slabs on common Chromebook/laptop widths. */
@media (min-width:900px) and (max-width:1280px){
  .tile,.result-tile,.route-card,.provider-card,.guide-card,.saving-card,.local-card,.activity-card{padding:17px!important;}
  .card p,.tile p,.result-tile p,.route-card p,.guide-card p{font-size:.98rem!important;line-height:1.45!important;}
}

/* Accessibility floating panel must remain on screen. */
.hh-accessibility-bar,.hh-v14-access,.accessibility-float,.floating-accessibility,.hh-access-float{
  max-width:calc(100vw - 18px)!important;
  right:max(8px,env(safe-area-inset-right))!important;
  bottom:max(8px,env(safe-area-inset-bottom))!important;
}