/* ============================================================
   BAZA — Layout fix
   Reši: dvojni robovi, preozki vsebniki, mobilni prikaz
   Dodaj na vsako stran PRED obstoječimi CSS-ji:
   <link rel="stylesheet" href="baza-layout-fix.css?v=20260325">
   ============================================================ */

/* ── 1. CONTAINER — brez lastnega ozadja, samo širina in sredinjenje ── */
html body .container,
html body .page-container > .container,
html body > .container {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  width: min(1600px, calc(100% - 24px)) !important;
  max-width: 1600px !important;
  margin: 12px auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Container znotraj containerja — brez dodatnih robov */
html body .container .container {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ── 2. CARD — en sam čist rob, brez dvojnega ── */
.card,
.stat-card,
.panel,
.section-card,
.filter-bar,
.chart-card,
.table-wrap,
.dashboard-half {
  border-radius: 12px !important;
  margin-bottom: 16px !important;
}

/* table-container je del card-a - brez lastnega roba */
.table-container {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow-x: auto !important;
}

/* Svetli način — bel card, subtilen sence */
body:not(.dark-mode) .card,
body:not(.dark-mode) .stat-card,
body:not(.dark-mode) .panel,
body:not(.dark-mode) .section-card,
body:not(.dark-mode) .filter-bar,
body:not(.dark-mode) .chart-card,
body:not(.dark-mode) .table-wrap,
body:not(.dark-mode) .table-container {
  background: #ffffff !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
}

/* Temni način — en sam temen card, en subtilen rob */
body.dark-mode .card,
body.dark-mode .stat-card,
body.dark-mode .panel,
body.dark-mode .section-card,
body.dark-mode .filter-bar,
body.dark-mode .chart-card,
body.dark-mode .table-wrap,
body.dark-mode .dashboard-half {
  background: rgba(30, 36, 50, 0.92) !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3) !important;
  backdrop-filter: blur(8px) !important;
}

/* ── 3. FILTER BAR — manj padding, bolj kompakten ── */
.filter-bar,
.filters-row,
.filter-row {
  padding: 12px 16px !important;
  gap: 10px !important;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

/* ── 4. CARD PADDING — konsistenten notranji prostor ── */
.card,
.section-card,
.chart-card {
  padding: 20px !important;
}

.stat-card {
  padding: 16px !important;
}

.table-wrap,
.table-container {
  padding: 0 !important;
  overflow-x: auto !important;
}

/* ── 5. MOBILNI PRIKAZ ── */
@media (max-width: 767px) {
  html body .container,
  html body .page-container > .container,
  html body > .container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 8px 12px !important;
  }

  .card,
  .section-card,
  .chart-card {
    padding: 14px !important;
    border-radius: 10px !important;
    margin-bottom: 10px !important;
  }

  .stat-card {
    padding: 12px !important;
    border-radius: 10px !important;
  }

  .filter-bar,
  .filter-row {
    padding: 10px 12px !important;
    gap: 8px !important;
  }
}

@media (max-width: 480px) {
  html body .container,
  html body .page-container > .container,
  html body > .container {
    padding: 0 4px 10px !important;
  }

  .card,
  .section-card,
  .chart-card {
    padding: 12px !important;
    border-radius: 8px !important;
  }
}

/* ── 6. NASLOVI DIREKTNO NA CGP-BG OZADJU ── */
/* h1/h2 ki so neposredno v .content (zunaj .card) na modrem cgp-bg gradientu
   morajo biti beli - sicer temna barva sploh ni vidna.
   Counter-override: znotraj .card ostanejo primary barve. */

body.cgp-bg:not(.dark-mode) .content > h1,
body.cgp-bg:not(.dark-mode) .content > h2,
body.cgp-bg:not(.dark-mode) .content > .page-title,
body.cgp-bg:not(.dark-mode) .main-content > div > h1,
body.cgp-bg:not(.dark-mode) .main-content > div > p {
  color: #ffffff !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.25);
}

/* Subtitle/muted direktno na ozadju */
body.cgp-bg:not(.dark-mode) .content > p,
body.cgp-bg:not(.dark-mode) .content > .muted,
body.cgp-bg:not(.dark-mode) .content > small {
  color: rgba(255,255,255,0.85) !important;
}

/* Ohrani original barve ZNOTRAJ kartic */
body.cgp-bg:not(.dark-mode) .card h1,
body.cgp-bg:not(.dark-mode) .card h2,
body.cgp-bg:not(.dark-mode) .card h3,
body.cgp-bg:not(.dark-mode) .card h4,
body.cgp-bg:not(.dark-mode) .stat-card h1,
body.cgp-bg:not(.dark-mode) .stat-card h2 {
  color: inherit !important;
  text-shadow: none !important;
}
