/* Product list actions and inline disclosure editor. */

.product-status-actions {
  display:flex; align-items:center; justify-content:space-between;
  width:100%; gap:var(--s-2);
}
.product-mobile-action-column,.product-mobile-action { display:none; }

.icon-button.product-edit-toggle {
  width:36px; min-width:36px; height:36px; color:var(--accent-label);
  background:var(--accent-weak); border-color:var(--accent-border);
}
.product-edit-toggle[aria-expanded="true"] {
  color:var(--accent); border-color:var(--accent); background:var(--accent-weak);
  box-shadow:var(--ring);
}

.product-editor-row[hidden] { display:none; }
.product-editor-row > td { padding:0; background:var(--surface-2); }
.product-editor {
  padding:var(--s-5); border-block:1px solid var(--accent-border);
}
.product-editor__header {
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:var(--s-4); margin-bottom:var(--s-4);
}
.product-editor__header h2 { font-size:1rem; }
.product-editor__header p { margin-top:var(--s-1); color:var(--text-muted); font-size:.85rem; }
.product-editor__form { display:flex; flex-direction:column; gap:var(--s-4); }
.product-editor__grid {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-4);
}
.product-editor__wide { grid-column:1/-1; }
.product-mode-field { min-width:0; margin:0; padding:0; border:0; }
.product-mode-field legend { margin-bottom:var(--s-2); font-size:.9rem; font-weight:600; }
.product-mode-options {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-1);
  padding:var(--s-1); min-height:44px; background:var(--control-bg);
  border:1px solid var(--control-border); border-radius:var(--radius-sm);
}
.product-mode-options label { position:relative; min-width:0; cursor:pointer; }
.product-mode-options input { position:absolute; width:1px; height:1px; opacity:0; }
.product-mode-options span {
  display:flex; align-items:center; justify-content:center; min-height:34px;
  padding:var(--s-1) var(--s-2); border:1px solid transparent;
  border-radius:calc(var(--radius-sm) - 2px); color:var(--text-muted);
  font-size:.85rem; font-weight:500;
}
.product-mode-options input:checked + span {
  color:var(--accent-label); background:var(--accent-weak); border-color:var(--accent-border);
}
.product-mode-options input:focus-visible + span { box-shadow:var(--ring); }
.product-editor__check {
  display:flex; align-items:center; gap:var(--s-2); min-height:44px;
  align-self:end; font-size:.9rem; font-weight:600;
}
.product-editor__check input { width:20px; min-height:20px; margin:0; accent-color:var(--accent); }
.product-editor__footer {
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:var(--s-4); padding-top:var(--s-4); border-top:1px solid var(--border);
}
.product-editor__actions { display:flex; flex-wrap:wrap; gap:var(--s-2); margin-left:auto; }
.product-editor__danger {
  display:flex; align-items:center; gap:var(--s-3); color:var(--text-muted);
  font-size:.82rem;
}
.product-editor__delete { display:flex; margin-top:var(--s-3); }

.product-create-form {
  max-width:900px;
}

.product-brief {
  min-width:0;
  margin:0;
  padding:var(--s-4);
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
}

.product-brief[hidden] {
  display:none;
}

.product-brief__heading {
  display:flex;
  min-width:0;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--s-4);
}

.product-brief__heading legend {
  padding:0;
  font-size:1rem;
  font-weight:700;
}

.product-brief__heading p {
  margin-top:var(--s-1);
  color:var(--text-muted);
  font-size:.84rem;
}

.product-brief__list {
  display:grid;
  margin-top:var(--s-4);
  gap:var(--s-3);
}

.product-brief-question {
  min-width:0;
  background:var(--surface-2);
  border:1px solid var(--border);
  border-left:3px solid var(--accent-border);
  border-radius:var(--radius-sm);
}

.product-brief-question__summary {
  display:grid;
  min-height:52px;
  padding:var(--s-3) var(--s-4);
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:var(--s-3);
  cursor:pointer;
  list-style:none;
}

.product-brief-question__summary::-webkit-details-marker {
  display:none;
}

.product-brief-question__summary::after {
  content:"";
  width:8px;
  height:8px;
  border-right:2px solid var(--text-muted);
  border-bottom:2px solid var(--text-muted);
  transform:rotate(45deg);
}

.product-brief-question[open] > .product-brief-question__summary::after {
  transform:rotate(225deg);
}

.product-brief-question__summary:focus-visible {
  border-radius:var(--radius-sm);
  box-shadow:var(--ring);
  outline:0;
}

.product-brief-question__title {
  min-width:0;
  overflow:hidden;
  color:var(--text);
  font-size:.9rem;
  font-weight:400;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.product-brief-question__content {
  display:grid;
  min-width:0;
  padding:0 var(--s-4) var(--s-4);
  gap:var(--s-4);
  border-top:1px solid var(--border);
}

.product-brief-question__content > .field:first-child {
  padding-top:var(--s-4);
}

.product-brief-options__heading {
  display:flex;
  min-width:0;
  align-items:center;
  justify-content:space-between;
  gap:var(--s-3);
}

.product-brief-question__number {
  color:var(--accent-label);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.07em;
  text-transform:uppercase;
}

.product-brief-question__remove {
  min-height:44px;
  color:var(--danger);
}

.product-brief-question__actions {
  display:flex;
  justify-content:flex-end;
}

.product-brief-question__settings {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(220px,.7fr);
  align-items:end;
  gap:var(--s-4);
}

.product-brief-type {
  min-width:0;
  margin:0;
  padding:0;
  border:0;
}

.product-brief-type legend {
  margin-bottom:var(--s-2);
  font-size:.88rem;
  font-weight:600;
}

.product-brief-type__options {
  display:grid;
  min-height:44px;
  padding:var(--s-1);
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--s-1);
  background:var(--control-bg);
  border:1px solid var(--control-border);
  border-radius:var(--radius-sm);
}

.product-brief-type__options label {
  position:relative;
  min-width:0;
  cursor:pointer;
}

.product-brief-type__options input {
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
}

.product-brief-type__options span {
  display:flex;
  min-height:34px;
  padding:var(--s-1) var(--s-2);
  align-items:center;
  justify-content:center;
  color:var(--text-muted);
  border:1px solid transparent;
  border-radius:calc(var(--radius-sm) - 2px);
  font-size:.82rem;
  text-align:center;
}

.product-brief-type__options input:checked + span {
  color:var(--accent-label);
  background:var(--accent-weak);
  border-color:var(--accent-border);
}

.product-brief-type__options input:focus-visible + span {
  box-shadow:var(--ring);
}

.product-brief-required {
  display:flex;
  min-height:44px;
  align-items:center;
  gap:var(--s-2);
  font-size:.88rem;
  font-weight:600;
}

.product-brief-required input {
  width:20px;
  min-height:20px;
  margin:0;
  accent-color:var(--accent);
}

.product-brief-options {
  display:grid;
  padding-top:var(--s-3);
  gap:var(--s-3);
  border-top:1px solid var(--border);
}

.product-brief-options[hidden] {
  display:none;
}

.product-brief-options__heading strong,
.product-brief-options__heading span {
  display:block;
}

.product-brief-options__heading strong {
  font-size:.88rem;
}

.product-brief-options__heading span {
  margin-top:2px;
  color:var(--text-muted);
  font-size:.76rem;
}

.product-brief-options__list {
  display:grid;
  gap:var(--s-2);
}

.product-brief-option {
  display:grid;
  min-width:0;
  grid-template-columns:minmax(0,1fr) 44px;
  gap:var(--s-2);
}

.product-brief-option__remove {
  width:44px;
  min-width:44px;
  height:44px;
  color:var(--danger);
}

.product-brief__empty {
  margin-top:var(--s-4);
  padding:var(--s-4);
  color:var(--text-muted);
  background:var(--surface-2);
  border:1px dashed var(--border-strong);
  border-radius:var(--radius-sm);
  font-size:.84rem;
  text-align:center;
}

.product-brief__empty[hidden] {
  display:none;
}

@media (max-width:640px) {
  .product-table tr:not(.product-editor-row) td { justify-items:end; text-align:right; }
  .product-table tr:not(.product-editor-row) td::before {
    justify-self:start; text-align:left;
  }
  .product-table tr:not(.product-editor-row) td > .badge,
  .product-table tr:not(.product-editor-row) td > code,
  .product-status-actions { justify-self:end; }
  .product-status-actions { justify-content:flex-end; }
  .product-edit-toggle--desktop { display:none; }
  .product-table tr:not(.product-editor-row) .product-mobile-action {
    display:block; width:100%; padding:var(--s-1) 0 0; border-bottom:0;
  }
  .product-table .product-mobile-action::before { content:none; }
  .icon-button.product-edit-toggle--mobile {
    position:relative; display:flex; width:100%; min-width:100%; height:44px;
    color:var(--accent-label); background:transparent; border-color:transparent;
  }
  .product-edit-toggle--mobile::before {
    content:""; position:absolute; z-index:0; inset:3px 0;
    background:var(--accent-weak); border:1px solid var(--accent-border);
    border-radius:var(--radius-sm);
  }
  .product-edit-toggle--mobile .icon { position:relative; z-index:1; }
  .product-table .product-editor-row { padding:0; border-color:var(--accent-border); }
  .product-table .product-editor-row > td { display:block; padding:0; border:0; }
  .product-table .product-editor-row > td::before { content:none; }
  .product-editor { padding:var(--s-4); border:0; }
  .product-editor__grid { grid-template-columns:1fr; }
  .product-editor__wide { grid-column:auto; }
  .product-editor__check { align-self:stretch; }
  .product-editor__footer,.product-editor__danger { align-items:stretch; flex-direction:column; }
  .product-editor__actions { width:100%; margin:0; }
  .product-editor__actions .btn,.product-editor__delete .btn { width:100%; }

  .product-brief {
    padding:var(--s-3);
  }

  .product-brief__heading,
  .product-brief-options__heading {
    align-items:stretch;
    flex-direction:column;
  }

  .product-brief__heading .btn,
  .product-brief-options__heading .btn {
    width:100%;
    min-height:44px;
  }

  .product-brief-question {
    border-left-width:2px;
  }

  .product-brief-question__summary {
    min-height:48px;
    padding:var(--s-3);
    gap:var(--s-2);
  }

  .product-brief-question__content {
    padding:0 var(--s-3) var(--s-3);
    gap:var(--s-3);
  }

  .product-brief-question__content > .field:first-child {
    padding-top:var(--s-3);
  }

  .product-brief-question__settings {
    grid-template-columns:1fr;
  }
}

@media (max-width:400px) {
  .product-brief-type__options {
    grid-template-columns:1fr;
  }
}

@media (pointer:coarse) {
  .product-edit-toggle { width:44px; min-width:44px; height:44px; }
}
