/* EHS Kostenverwaltung v5 — responsive.css */
@media(max-width:1100px){
  .main{padding:20px 16px}
  .header-inner{padding:12px 16px}
  .grid-4{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:900px){
  .grid-2,.grid-4{grid-template-columns:1fr}
  .header-right{display:none}
  .main{padding:16px 12px}
  .page-strip{padding:16px 18px;flex-direction:column;align-items:flex-start;gap:10px}
  .page-strip h1{font-size:18px}
  .strip-badge{min-width:unset;padding:8px 14px}
  .card-body{padding:16px}
  .filter-bar{padding:12px 16px;gap:10px}
  .filter-bar .fg{min-width:140px}
  .nav-btn{padding:11px 16px;font-size:13px}
  .nav-icon{display:none}
  table{font-size:12px}
  table th,table td{padding:8px 10px}
}

@media(max-width:600px){
  /* Header */
  .header-inner{padding:10px 12px;gap:8px}
  .logo-icon{width:180px;height:72px}
  .header-right{display:none}
  .ehs-title{font-size:14px}
  .ehs-sub{display:none}

  /* Navigation – horizontal scrollbar statt umbrechen */
  .nav-inner{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .nav-inner::-webkit-scrollbar{display:none}
  .nav-btn{padding:10px 14px;font-size:12px;white-space:nowrap;flex-shrink:0}
  .nav-icon{display:none}

  /* Main */
  .main{padding:12px 10px}
  .page-strip{padding:12px 14px;border-radius:10px;margin-bottom:16px}
  .page-strip h1{font-size:16px}
  .page-strip p{font-size:12px}
  .strip-badge{display:none}

  /* Karten */
  .card{border-radius:10px}
  .card-header{padding:12px 14px}
  .card-header h2{font-size:14px}
  .card-body{padding:12px}
  .ch-icon{width:26px;height:26px;font-size:13px}

  /* Formular */
  .form-group{margin-bottom:12px}
  input,select{padding:9px 11px;font-size:14px}
  .btn{padding:10px 16px;font-size:13px}
  .btn-primary,.btn-success{padding:12px}

  /* Filter */
  .filter-bar{padding:10px 12px;gap:8px}
  .filter-bar .fg{min-width:100%;flex:unset}
  .filter-total{width:100%;text-align:center}

  /* Stat-Karten */
  .grid-4{grid-template-columns:repeat(2,1fr);gap:10px}
  .stat-card{padding:12px 14px}

  /* Tabelle – horizontal scrollbar */
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:8px}
  table{font-size:11px;min-width:520px}
  table th,table td{padding:7px 8px}

  /* Eintrags-Liste (Erfassen-Tab) */
  .entry-item{flex-direction:column;align-items:flex-start;gap:6px;padding:10px 12px}
  .entry-item .ei-actions{align-self:flex-end}

  /* Login */
  .login-card{padding:28px 20px;border-radius:14px}

  /* Modal */
  .modal{padding:22px 18px;max-width:95%}
  .modal-actions{flex-direction:column}
  .modal-actions .btn{width:100%}

  /* Lädle-Popup */
  .laedle-modal{max-width:98vw;max-height:90vh;border-radius:14px}
  .laedle-header{padding:14px 16px}
  .laedle-items{padding:10px}
  .laedle-footer{padding:12px 14px}

  /* Charts */
  .chart-box canvas{max-height:200px}
}

@media(max-width:380px){
  .grid-4{grid-template-columns:1fr 1fr}
  .nav-btn{padding:9px 10px;font-size:11px}
  .main{padding:10px 8px}
}
