/* Zákaznícky portál - sidebar layout */
.zp-portal {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  margin: 50px 0; /* medzera hore a dole */
}

.zp-sidebar {
  width: 240px;
  position: sticky;
  top: 80px;
}

.zp-sidebar .zp-item {
  display: block;
  width: 100%;
  padding: 10px 14px;
  margin: 6px 0;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
  color: #111;
  cursor: pointer;
  text-align: left;
  font-weight: 600;
}

.zp-sidebar .zp-item[aria-current="true"] {
  outline: 2px solid #3b82f6;
}

.zp-content {
  flex: 1;
  min-width: 0;
}

.zp-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 18px;
  margin-bottom: 30px; /* aj medzi boxmi bude rozostup */
}

.zp-section[hidden] {
  display: none !important;
}

@media (max-width: 900px) {
  .zp-portal {
    flex-direction: column;
  }
  .zp-sidebar {
    width: 100%;
    position: static;
  }
  .zp-sidebar .zp-row {
    display: flex;
    gap: 8px;
  }
  .zp-sidebar .zp-item {
    flex: 1;
  }
}

/* Špeciálne pre elFinder box */
#elfinder-frontend-container {
  height: 460px;          /* pevná výška kontajnera, elFinder dostane rovnakú */
  max-height: 70vh;       /* nikdy viac ako 70% výšky okna */
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;       /* elFinder si rieši vlastné scrollovanie vo vnútri */
}

.zp-h{font-size:1.125rem;line-height:1.5rem;margin:0 0 10px 0;font-weight:700}

.zp-greeting-text{margin:20px 0 10px 0;font-weight:600}

/* Menšie nadpisy v zákazníckom portáli */
.zp-portal h1,
.zp-portal h2,
.zp-portal h3,
.zp-portal .zp-h {
  font-size: 25px;      /* pevná veľkosť */
  line-height: 24px;
  margin: 0 0 12px 0;
  font-weight: 600;
}

/* ŠIRŠIE INPUTY na frontende (pridanie + úprava profilu) */
.zp-content input[type="text"],
.zp-content input[type="email"],
.zp-content input[type="password"],
.zp-content select,
.zp-content textarea {
  width: 100%;
  max-width: 640px;
  box-sizing: border-box;
}
.zp-content .zp-card p label {
  display: block;
}
.zp-content .zp-card p label input,
.zp-content .zp-card p label select,
.zp-content .zp-card p label textarea {
  margin-top: 4px;
}

/* Zaoblená tabuľka zákazníkov */
.zp-content table.widefat,
.zp-content table {
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 12px;
  overflow: hidden;
}
.zp-content table thead tr {
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.zp-content table th, .zp-content table td {
  padding: 10px 12px;
}



/* Zaoblené tabuľky v portálovej administrácii */
table.rounded {
  border-radius: 16px;
  overflow: hidden;
  border-collapse: separate;
  border-spacing: 0;
  box-shadow: 0 4px 14px rgba(0,0,0,.06);
}
table.rounded thead th:first-child { border-top-left-radius: 16px; }
table.rounded thead th:last-child  { border-top-right-radius: 16px; }
table.rounded tbody tr:last-child td:first-child { border-bottom-left-radius: 16px; }
table.rounded tbody tr:last-child td:last-child  { border-bottom-right-radius: 16px; }


/* === Mobile: stack sidebar items vertically === */
@media (max-width: 900px) {
  .zp-sidebar .zp-row { 
    display: block; 
  }
  .zp-sidebar .zp-item { 
    display: block; 
    width: 100%; 
  }
}


/* === Mobile: make all cards (boxes) equal full width and prevent overflow === */
@media (max-width: 900px) {
  .zp-portal { overflow-x: hidden; }
  .zp-content { width: 100%; max-width: 100%; box-sizing: border-box; }
  .zp-card { width: 100%; max-width: 100%; box-sizing: border-box; }
  .zp-card > * { max-width: 100%; }

  /* Keep long words/URLs from stretching the layout */
  .zp-content, .zp-card {
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  /* Media elements scale to box */
  .zp-card img, .zp-card video, .zp-card iframe {
    max-width: 100%;
    height: auto;
  }

  /* Tables and pre/code blocks should scroll inside, not stretch the page */
  .zp-card table, .zp-card pre, .zp-card code {
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }

  /* elFinder containers: full width, no outer overflow */
  #elfinder-frontend-container,
  #elfinder-admin-impersonate,
  #elfinder-container {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow: hidden;
  }
  .elfinder { max-width: 100%; }
}


/* === Mobile: nicer sidebar outline and padding === */
@media (max-width: 900px) {
  /* give inner padding so borders/shadows aren't clipped by viewport */
  .zp-portal { padding-left: 12px; padding-right: 12px; }

  /* sidebar full width and styled as a card */
  .zp-sidebar { width: 100%; max-width: 100%; box-sizing: border-box; }
  .zp-sidebar .zp-row {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 10px;
    box-shadow: 0 4px 14px rgba(0,0,0,.06);
  }
  .zp-sidebar .zp-item {
    display: block;
    width: 100%;
    margin: 6px 0;
  }
}


/* === Mobile: keep content truly full width; sidebar still carded === */
@media (max-width: 900px) {
  /* remove global padding so content can span edge-to-edge */
  .zp-portal { padding-left: 0; padding-right: 0; }
  /* give the sidebar "card" its own margins so it doesn't touch edges */
  .zp-sidebar .zp-row { margin-left: 12px; margin-right: 12px; }
  /* ensure content and cards occupy full width */
  .zp-content { width: 100%; max-width: 100%; }
  .zp-content .zp-card { width: 100%; max-width: 100%; }
}


/* Center tables in portal lists (frontend only) */
.zp-table-center thead th,
.zp-table-center tbody td { text-align: center; }
.zp-table-center thead th.zp-left,
.zp-table-center tbody td.zp-left { text-align: left; }

/* Make delete control look like plain text link */
.zp-as-link {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  color: #2271b1 !important;
  text-decoration: underline;
  cursor: pointer;
  font: inherit;
}
.zp-as-link:hover { color: #135e96 !important; }


/* enforce left + middle alignment for portal tables */
.zp-table-center th, .zp-table-center td,
.widefat th, .widefat td { text-align:left !important; vertical-align:middle !important; }