/* StockAZ 0.9.8.4 — approved responsive/card polish */

/* Analysis Stock Card: remove footer and keep a compact 16px bottom breathing room. */
.analysis-foot,
.analysis-card-foot{
  display:none !important;
}
.analysis-card .analysis-top,
.analysis-card .analysis-card-top{
  padding-bottom:16px !important;
}
.analysis-history-card-sync .analysis-card{
  height:auto !important;
}
.analysis-history-card-sync .analysis-card-top{
  flex:0 0 auto !important;
}

/* Unified Stock Card spacing: 32px horizontally and vertically. */
.stock-grid,
.stockgrid,
.popular-grid,
.portfolio-grid{
  column-gap:32px !important;
  row-gap:32px !important;
}

/* Homepage Analysis Stock Cards: 32px vertical rhythm on every viewport. */
.recent-stack{
  gap:32px !important;
}

@media(max-width:1000px){
  .stock-grid,
  .stockgrid,
  .popular-grid,
  .portfolio-grid{
    column-gap:32px !important;
    row-gap:32px !important;
  }

  .recent-stack{
    gap:32px !important;
  }
}

@media(max-width:650px){
  .stock-grid,
  .stockgrid,
  .popular-grid,
  .portfolio-grid{
    gap:32px !important;
  }

  .recent-stack{
    gap:32px !important;
  }
}

/* Desktop/fine-pointer interaction: Stock-related cards lift by 10px. */
@media(hover:hover) and (pointer:fine){
  .stock-card[data-card-href],
  .analysis-card[data-card-href],
  .stock-watch-card[data-card-href]{
    transition:
      transform .22s ease,
      box-shadow .22s ease,
      border-color .22s ease !important;
    will-change:transform;
  }

  .stock-card[data-card-href]:hover,
  .analysis-card[data-card-href]:hover,
  .stock-watch-card[data-card-href]:hover{
    transform:translateY(-10px) !important;
    box-shadow:0 16px 34px rgba(17,20,19,.09) !important;
  }

  /* Reserve vertical room so carousel cards are not clipped while lifting. */
  .analysis-history-card-sync .carousel-track{
    padding-top:12px !important;
    margin-top:-12px !important;
  }
}

/* Mobile header + fullscreen navigation. */
@media(max-width:1000px){
  body.stockaz-mobile-menu-open{
    overflow:hidden !important;
    touch-action:none;
  }

  .top{
    z-index:9999 !important;
  }

  .topin{
    position:relative !important;
    justify-content:center !important;
  }

  /* True visual center of the mobile menu bar. */
  .topin > .brand{
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    transform:translate(-50%,-50%) !important;
    margin:0 !important;
    z-index:10003 !important;
  }

  .mobile-nav{
    display:block !important;
    position:static !important;
    margin-left:auto !important;
    z-index:10004 !important;
  }

  .mobile-nav > summary,
  .mobile-nav > summary.mobile-toggle,
  .mobile-nav > summary.mobile-menu-toggle{
    position:relative !important;
    z-index:10005 !important;
  }

  /* White overlay covers the viewport; menu block is centered both ways. */
  .mobile-nav .mobile-menu{
    position:fixed !important;
    inset:0 !important;
    width:100% !important;
    max-width:none !important;
    height:100vh !important;
    height:100dvh !important;
    margin:0 !important;
    padding:76px 24px 28px !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:#fff !important;
    display:none !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    z-index:10001 !important;
    overflow:auto !important;
  }

  .mobile-nav[open] .mobile-menu{
    display:flex !important;
  }

  .mobile-nav .mobile-menu a{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:min(320px,82vw) !important;
    min-height:54px !important;
    padding:0 20px !important;
    margin:0 !important;
    border-radius:10px !important;
    background:transparent !important;
    color:var(--ink,#111413) !important;
    font-size:18px !important;
    line-height:1.25 !important;
    font-weight:700 !important;
    text-align:center !important;
  }

  .mobile-nav .mobile-menu a.active{
    background:var(--surface,#f5f7f5) !important;
    font-weight:900 !important;
  }

  /* Hamburger -> X while open, regardless of page-specific Master CSS. */
  .mobile-nav[open] > summary span:nth-child(1){
    transform:translateY(5.5px) rotate(45deg) !important;
  }
  .mobile-nav[open] > summary span:nth-child(2){
    opacity:0 !important;
  }
  .mobile-nav[open] > summary span:nth-child(3){
    transform:translateY(-5.5px) rotate(-45deg) !important;
  }
}


/* v0.9.8.6 · Locked Stock Card ending
   No status/price/CTA below the compact Price + Volume chart.
   Chart-to-card bottom breathing room = 16px on every viewport. */
#stocks .stock-card{
  padding-bottom:16px !important;
}
#stocks .stock-foot{
  display:none !important;
}

/* Footer branding is logo-only; no repeated site tagline at page end. */
.footbrandgroup .foottagline{
  display:none !important;
}


/* v0.9.8.7 · Unified card system */
:root{
  --carousel-card-gap:32px;
}

/* Theo dõi Stock cards use the same card rhythm. */
#stockGrid{
  gap:32px !important;
}

/* All content/card titles use Regular 400.
   Ticker symbols, metadata, section headings and buttons keep their own weights. */
.analysis-title,
.analysis-card-title,
.feature-heading h3,
.latestGrid .latestTitle,
.historyRow .historyMain strong,
.knowledgeCard h3,
.stock-watch-card .company h3,
.stock-watch-card .analysis-item a,
.analysis-item a,
.feature-copy h3,
.card h3,
.learn-title,
.archive-title,
.article-title,
.related-card h3,
.stockaz-blog-card__title{
  font-weight:400 !important;
}

/* Featured analysis titles:
   - desktop line-height = 1.3
   - responsive line-height = 1.5
   The date remains anchored at the same bottom position of the title rail. */
.feature-heading{
  gap:0 !important;
  min-height:112px !important;
  justify-content:space-between !important;
}
.feature-heading h3{
  line-height:1.3 !important;
  font-weight:400 !important;
}
.feature-heading time{
  margin-top:auto !important;
}

@media(max-width:650px){
  .feature-heading{
    min-height:88px !important;
  }
  .feature-heading h3{
    line-height:1.5 !important;
  }
}


/* v0.9.8.8 · Exact Homepage Analysis Card gap
   home.css previously used justify-content:space-between on desktop,
   which distributed leftover column height in addition to the declared gap.
   This locks the visible/card layout gap to the actual 32px value. */
@media(min-width:1001px){
  .recent-stack{
    justify-content:flex-start !important;
    height:auto !important;
    gap:32px !important;
  }
}