/* /assets/css/views/welcome.css */
/* welcome.css — Alexium UI (Welcome)
   - View-only layout rules for the welcome view
   - Reuses ax-core components; no core overwrites; no hard colors.
*/

/* ------------------------------------------------------------
   Main card height: viewport minus topbar minus outer paddings
   (prevents vertical overflow)
   ------------------------------------------------------------ */

/*
  Annahmen aus ax-core:
  - --ax-topbar-h  : Höhe der Topbar
  - --ax-p-3 / --ax-p-4 : vertikale Shell/Card-Abstände
*/

.ax-view--welcome{
  /* volle Höhe ohne Overflow durch Außenabstände */
  min-height: calc(
    100vh
    - var(--ax-topbar-h)
    - 4px
  );

  display: flex;
  flex-direction: column;
}

/* ------------------------------------------------------------
   Body grid
   ------------------------------------------------------------ */

.ax-view--welcome .ax-welcome__body{
  flex: 1;
  display: grid;
  align-items: center;
  /* verhindert Überlauf bei hohen Inhalten */
  min-height: 0;
}

.ax-view--welcome .ax-welcome__layout{
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  gap: var(--ax-p-3);
  width: 100%;
}

/* ------------------------------------------------------------
   Media / poster
   ------------------------------------------------------------ */

.ax-view--welcome .ax-welcome__poster{
  display: block;
  width: 100%;
  height: auto;
  max-height: 100%;
  object-fit: contain;
  border-radius: var(--ax-r-md);
  border: 1px solid var(--ax-border);
}

/* ------------------------------------------------------------
   Tiles / quicklinks
   ------------------------------------------------------------ */

.ax-view--welcome .ax-welcome__tiles{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ax-p-2);
}

.ax-view--welcome .ax-welcome__tiles > .stat{
  height: 100%;
}

/* spacing helpers (view-only) */
.ax-view--welcome .ax-welcome__hint{ margin-bottom: 10px; }
.ax-view--welcome .ax-welcome__tilehint{ margin-top: 6px; }

/* ------------------------------------------------------------
   Responsive
   ------------------------------------------------------------ */

@media (max-width: 900px){
  .ax-view--welcome .ax-welcome__layout{
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px){
  .ax-view--welcome .ax-welcome__body{
    align-items: stretch;
  }

  .ax-view--welcome .ax-welcome__tiles{
    grid-template-columns: 1fr;
  }
}