/* layout.css */
@layer layout {

  /* Global container – EINMALIG (Footer darf das nicht nochmal definieren) */
  .container{
    max-width:1600px;
    margin:0 auto;
    padding:1rem;
    padding-bottom:70px; /* Platz für fixen Footer */
  }
  @media (min-width:1800px){
  .container{
    max-width:1800px;
  }
}

  /* Simple grid helpers */
  .grid{ display:grid; gap:1rem; }
  .grid-3{ grid-template-columns:repeat(3,1fr); }
  .grid-2{ grid-template-columns:repeat(2,1fr); }

  @media (max-width:1100px){
    .grid-3{ grid-template-columns:repeat(2,1fr); }
  }
  @media (max-width:800px){
    .grid-3,.grid-2{ grid-template-columns:1fr; }
  }

  /* Header layout (nur Struktur/Position) */
  .site-header{
    position:sticky;
    top:0;
    z-index:50;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;

    padding:0 1.25rem;
    height:58px;
  }

  .site-header .right-side{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:.75rem;
    flex-wrap:nowrap;
    flex:0 0 auto;
    min-width:0;
  }
  .site-header .right-side > *{ flex:0 0 auto; }

  /* Footer layout (nur Struktur/Position) */
  .site-footer{
    position:fixed;
    left:0; right:0; bottom:0;
    height:48px;
    padding:0 12px;
    z-index:900;

    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    column-gap:12px;
  }

  .footer-left{ grid-column:1; justify-self:start; white-space:nowrap; }
  .footer-center{ display:none; }
  .footer-right{
    grid-column:3;
    justify-self:end;
    display:flex;
    align-items:center;
    gap:12px;
  }

  /* Users layout */
  .users-wrap{ padding:1rem 0; }
  .users-grid{
    display:grid;
    grid-template-columns:3fr 2fr;
    gap:1rem;
  }
  @media (max-width:1000px){
    .users-grid{ grid-template-columns:1fr; }
  }
}