@import url('./tokens.css');
@import url('./components.css');
@import url('./design.css');
@import url('./responsive.css?v=15.0.11');
.task-select {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 2.75rem;
  padding: .72rem .8rem;
  border-radius: .75rem;
  font-size: 1rem;
  line-height: 1.35;
}
.customer-users-panel{margin-top:1.25rem;padding:1rem;border-radius:1.25rem;background:rgba(255,255,255,.42);box-shadow:inset 2px 2px 6px rgba(148,163,184,.2)}
.customer-user-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;margin:.85rem 0}.customer-user-form .portfolio-actions{grid-column:1/-1}.task-portfolio__item.requester{color:#557426;background:#edf6df}.requests-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;max-height:72vh;overflow:auto;padding:.25rem}.request-admin-card{padding:1rem;border-radius:1.1rem;background:#f1f5f9;box-shadow:6px 6px 15px #cbd5df,-6px -6px 15px #fff}.request-admin-card h3{margin:.7rem 0 .35rem}.request-admin-card>p{white-space:pre-wrap;line-height:1.5}.request-admin-meta,.request-admin-actions{display:flex;justify-content:space-between;align-items:center;gap:.6rem}.request-admin-meta{font-size:.75rem;color:#64748b}.request-admin-actions{margin-top:1rem}.request-admin-actions select,.request-admin-actions button,.request-admin-card textarea{border-radius:.75rem;padding:.6rem;border:1px solid #d6dee7}.request-admin-card details{margin-top:1rem;border-top:1px solid #d7e0e8;padding-top:.75rem}.request-admin-card details p{font-size:.8rem}.request-admin-card details form{display:grid;gap:.5rem}.request-admin-card details label{font-size:.75rem}
@media(max-width:800px){.customer-user-form,.requests-admin-grid{grid-template-columns:1fr}}

/* Portfolio-Dialog: feste Inhaltsgrenzen statt horizontalem Überlauf. */
#portfolio-dialog {
  width: min(94vw, 72rem) !important;
  max-width: calc(100vw - 2rem) !important;
  max-height: 92vh;
  padding: 0 !important;
  overflow: hidden;
  box-sizing: border-box;
  transform-origin: 50% 18%;
}
#portfolio-btn {
  transform-origin: center;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
#portfolio-btn.is-activating {
  animation: portfolio-button-feedback .32s cubic-bezier(.22, 1, .36, 1);
}
#portfolio-dialog[open] {
  animation: portfolio-dialog-in .42s cubic-bezier(.16, 1, .3, 1) both;
}
#portfolio-dialog[open]::backdrop {
  animation: portfolio-backdrop-in .34s ease-out both;
}
#portfolio-dialog[open].is-closing {
  animation: portfolio-dialog-out .24s cubic-bezier(.4, 0, 1, 1) both;
}
#portfolio-dialog[open].is-closing::backdrop {
  animation: portfolio-backdrop-out .24s ease-in both;
}
@keyframes portfolio-button-feedback {
  0% { transform: scale(1); }
  42% { transform: translateY(1px) scale(.95); filter: brightness(.96); }
  100% { transform: scale(1); }
}
@keyframes portfolio-dialog-in {
  0% { opacity: 0; transform: translateY(1.6rem) scale(.94); filter: blur(5px); }
  65% { opacity: 1; transform: translateY(-.2rem) scale(1.008); filter: blur(0); }
  100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}
@keyframes portfolio-dialog-out {
  from { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
  to { opacity: 0; transform: translateY(1rem) scale(.97); filter: blur(3px); }
}
@keyframes portfolio-backdrop-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes portfolio-backdrop-out {
  from { opacity: 1; }
  to { opacity: 0; }
}
#portfolio-dialog .portfolio-shell {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  max-height: 92vh;
  padding: 1.25rem;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
}
#portfolio-dialog .portfolio-shell *,
#requests-dialog * {
  box-sizing: border-box;
}
#portfolio-dialog .portfolio-grid,
#portfolio-dialog .portfolio-grid > section,
#portfolio-dialog .portfolio-settings,
#portfolio-dialog .portfolio-summary,
#portfolio-dialog .portfolio-form,
#portfolio-dialog .portfolio-row,
#portfolio-dialog .customer-users-panel,
#portfolio-dialog label {
  min-width: 0;
  max-width: 100%;
}
#portfolio-dialog input:not([type="checkbox"]),
#portfolio-dialog textarea,
#portfolio-dialog select {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 2.75rem;
  padding: .72rem .8rem;
  border-radius: .75rem;
  line-height: 1.35;
}
#portfolio-dialog textarea { min-height: 5rem; resize: vertical; }
#portfolio-dialog select[multiple] { min-height: 7rem; }
#portfolio-dialog .portfolio-form { align-content: start; }
#portfolio-dialog .portfolio-grid > section > h3 { margin-top: .25rem; }
#portfolio-dialog .portfolio-settings label {
  display: grid;
  gap: .4rem;
}
#portfolio-dialog .portfolio-actions button,
#portfolio-dialog .portfolio-primary {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}
#portfolio-dialog .portfolio-check input {
  width: 1.2rem;
  min-width: 1.2rem;
}

@media (max-width: 1100px) {
  #portfolio-dialog .portfolio-grid { grid-template-columns: 1fr; }
  #portfolio-dialog .customer-user-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  #portfolio-dialog {
    width: calc(100vw - 1rem) !important;
    max-width: calc(100vw - 1rem) !important;
    max-height: 96vh;
  }
  #portfolio-dialog .portfolio-shell {
    max-height: 96vh;
    padding: .9rem;
  }
  #portfolio-dialog .portfolio-settings,
  #portfolio-dialog .portfolio-grid,
  #portfolio-dialog .portfolio-row,
  #portfolio-dialog .customer-user-form {
    grid-template-columns: 1fr;
  }
  #portfolio-dialog .portfolio-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #portfolio-dialog .portfolio-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  #portfolio-dialog .portfolio-actions > *,
  #portfolio-dialog .portfolio-settings .portfolio-primary {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  #portfolio-btn,
  #portfolio-btn.is-activating,
  #portfolio-dialog[open],
  #portfolio-dialog[open]::backdrop,
  #portfolio-dialog[open].is-closing,
  #portfolio-dialog[open].is-closing::backdrop {
    animation: none !important;
    transition: none !important;
  }
}

/* Customer workflow 15.1.0 */
.request-admin-card.status-changes-requested {
  border-left: 4px solid #dc2626;
}

.request-admin-card details {
  margin-top: .9rem;
  border-top: 1px solid rgba(71, 85, 105, .18);
  padding-top: .8rem;
}

.request-admin-card details summary {
  cursor: pointer;
  font-weight: 800;
}

.request-files,
.request-messages {
  margin-top: .9rem;
  padding: 1rem;
  border-radius: 18px;
  background: rgba(228, 235, 242, .72);
}

.request-files ul {
  display: grid;
  gap: .45rem;
  padding-left: 1.2rem;
}

.request-files form,
.request-messages form {
  display: grid;
  gap: .7rem;
  margin-top: .8rem;
}

.request-acceptance-record {
  margin-top: .8rem;
  padding: .75rem 1rem;
  border-radius: 14px;
  background: rgba(143, 186, 69, .16);
  color: #39590d;
  font-weight: 750;
}
