/* Phase 82.7.6.38.5.8.1.27 · Detail / Form / Feedback Foundation
   Presentation only. Builds on .1.24 UI + .1.25 responsive + .1.26 components.
   Scope: platform/admin detail & form flows plus employee standalone pages.
   Customer ordering, POS and legacy KDS remain isolated. */

:root {
  --ui-field-h:44px;
  --ui-field-radius:11px;
  --ui-field-border:#CBD5E1;
  --ui-field-focus:#0F766E;
  --ui-field-focus-ring:rgba(15,118,110,.14);
  --ui-section-gap:18px;
  --ui-feedback-pad:12px 14px;
}

/* ---------- Admin / platform form controls ---------- */
html:not(.legacy-kds-view) .admin-shell :where(.settings-form,.branding-form,.hours-rules-panel,.weekly-hours-panel,.closure-panel,.panel-card,.modal-card) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),select),
.platform-shell .platform-modal :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),select),
.ui-foundation-page :where(.card,form) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),select) {
  min-height:var(--ui-field-h);
  width:100%;
  box-sizing:border-box;
  border:1px solid var(--ui-field-border);
  border-radius:var(--ui-field-radius);
  background:#fff;
  color:var(--ui-text,#0F172A);
  padding:9px 11px;
  font:inherit;
  line-height:1.25;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
html:not(.legacy-kds-view) .admin-shell :where(.settings-form,.branding-form,.hours-rules-panel,.weekly-hours-panel,.closure-panel,.panel-card,.modal-card) textarea,
.platform-shell .platform-modal textarea,
.ui-foundation-page :where(.card,form) textarea {
  width:100%;
  box-sizing:border-box;
  min-height:108px;
  resize:vertical;
  border:1px solid var(--ui-field-border);
  border-radius:var(--ui-field-radius);
  background:#fff;
  color:var(--ui-text,#0F172A);
  padding:10px 11px;
  font:inherit;
  line-height:1.5;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
html:not(.legacy-kds-view) .admin-shell :where(.settings-form,.branding-form,.hours-rules-panel,.weekly-hours-panel,.closure-panel,.panel-card,.modal-card) :where(input,select,textarea):focus,
.platform-shell .platform-modal :where(input,select,textarea):focus,
.ui-foundation-page :where(.card,form) :where(input,select,textarea):focus {
  outline:0;
  border-color:var(--ui-field-focus);
  box-shadow:0 0 0 3px var(--ui-field-focus-ring);
}
html:not(.legacy-kds-view) .admin-shell :where(.settings-form,.branding-form,.hours-rules-panel,.weekly-hours-panel,.closure-panel,.panel-card,.modal-card) :where(input,select,textarea):disabled,
html:not(.legacy-kds-view) .admin-shell :where(.settings-form,.branding-form,.hours-rules-panel,.weekly-hours-panel,.closure-panel,.panel-card,.modal-card) :where(input,textarea)[readonly],
.platform-shell .platform-modal :where(input,select,textarea):disabled,
.ui-foundation-page :where(.card,form) :where(input,select,textarea):disabled,
.ui-foundation-page :where(.card,form) :where(input,textarea)[readonly] {
  color:#64748B;
  background:#F8FAFC;
  cursor:not-allowed;
}

/* ---------- Field hierarchy ---------- */
html:not(.legacy-kds-view) .admin-shell :where(.settings-form,.branding-form,.modal-card) > label,
html:not(.legacy-kds-view) .admin-shell :where(.settings-form,.branding-form,.modal-card) .form-grid > label,
.platform-shell .platform-modal > label,
.platform-shell .platform-modal .form-grid > label,
.ui-foundation-page label.field,
.ui-foundation-page .card form > label,
.ui-foundation-page .card form > .two > label {
  display:grid;
  gap:6px;
  color:var(--ui-text-soft,#334155);
  font-size:13px;
  font-weight:700;
}
html:not(.legacy-kds-view) .admin-shell .form-help,
html:not(.legacy-kds-view) .admin-shell label > small,
.platform-shell .platform-modal label > small,
.ui-foundation-page .muted,
.ui-foundation-page .form-help {
  color:var(--ui-muted,#64748B);
}

/* ---------- Form / detail sections ---------- */
html:not(.legacy-kds-view) .admin-shell :where(.settings-form,.branding-form,.hours-rules-panel,.weekly-hours-panel,.closure-panel),
.platform-shell .platform-modal,
.ui-foundation-page .card {
  position:relative;
}
html:not(.legacy-kds-view) .admin-shell :where(.settings-form,.branding-form) > h2,
html:not(.legacy-kds-view) .admin-shell :where(.hours-rules-panel,.weekly-hours-panel,.closure-panel) > :where(h2,.panel-heading,.panel-head),
.ui-foundation-page .card > h2 {
  color:var(--ui-text,#0F172A);
  letter-spacing:-.01em;
}
html:not(.legacy-kds-view) .admin-shell .detail-grid,
html:not(.legacy-kds-view) .admin-shell .summary-grid,
html:not(.legacy-kds-view) .admin-shell .metadata-grid,
.platform-shell .detail-grid,
.ui-foundation-page .detail-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px 18px;
}
html:not(.legacy-kds-view) .admin-shell :where(.detail-grid,.summary-grid,.metadata-grid) > *,
.platform-shell .detail-grid > *,
.ui-foundation-page .detail-grid > * {
  min-width:0;
  padding:12px 0;
  border-bottom:1px solid var(--ui-border,#E2E8F0);
}
html:not(.legacy-kds-view) .admin-shell :where(.detail-grid,.summary-grid,.metadata-grid) small,
.platform-shell .detail-grid small,
.ui-foundation-page .detail-grid small {
  display:block;
  margin-bottom:3px;
  color:var(--ui-muted,#64748B);
  font-size:12px;
  font-weight:700;
}

/* ---------- Action hierarchy ---------- */
html:not(.legacy-kds-view) .admin-shell :where(.modal-card,.settings-form,.branding-form) > footer,
html:not(.legacy-kds-view) .admin-shell .form-actions,
.platform-shell .platform-modal > footer,
.ui-foundation-page form > .actions:last-child {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
html:not(.legacy-kds-view) .admin-shell :where(.modal-card,.settings-form,.branding-form) > footer .primary-button,
.platform-shell .platform-modal > footer .primary-button,
.ui-foundation-page form > .actions:last-child .btn:not(.alt):not(.danger) {
  order:2;
}
html:not(.legacy-kds-view) .admin-shell :where(.modal-card,.settings-form,.branding-form) > footer .secondary-button,
.platform-shell .platform-modal > footer .secondary-button,
.ui-foundation-page form > .actions:last-child .btn.alt {
  order:1;
}

/* destructive actions are separated from primary save flows */
html:not(.legacy-kds-view) .admin-shell :where(.danger-zone,.danger-panel),
.platform-shell :where(.danger-zone,.danger-panel),
.ui-foundation-page :where(.danger-zone,.danger-panel) {
  border:1px solid #FECACA;
  border-radius:16px;
  background:#FFF7F7;
}
html:not(.legacy-kds-view) .admin-shell :where(.danger-zone,.danger-panel) :where(h2,h3),
.platform-shell :where(.danger-zone,.danger-panel) :where(h2,h3),
.ui-foundation-page :where(.danger-zone,.danger-panel) :where(h2,h3) { color:#991B1B; }

/* ---------- Feedback language ---------- */
html:not(.legacy-kds-view) .admin-shell :where(.form-error,.form-success,.inline-message,.report-notice,.inventory-notice),
.platform-shell :where(.form-error,.form-success,.inline-message),
.ui-foundation-page :where(.ok,.bad,.err,.notice,.alert,.form-error,.form-success,.inline-message) {
  border-radius:12px;
  padding:var(--ui-feedback-pad);
  line-height:1.45;
  font-size:13px;
  font-weight:650;
}
html:not(.legacy-kds-view) .admin-shell .form-error,
.platform-shell .form-error,
.ui-foundation-page :where(.bad,.err,.form-error,.alert.bad) {
  color:#991B1B;
  background:#FEF2F2;
  border:1px solid #FECACA;
}
html:not(.legacy-kds-view) .admin-shell :where(.form-success,.inline-message),
.platform-shell :where(.form-success,.inline-message),
.ui-foundation-page :where(.ok,.form-success,.alert.good) {
  color:#166534;
  background:#F0FDF4;
  border:1px solid #BBF7D0;
}
html:not(.legacy-kds-view) .admin-shell :where(.inventory-notice.warning,.report-notice),
.ui-foundation-page :where(.notice,.alert.warn) {
  color:#9A3412;
  background:#FFF7ED;
  border:1px solid #FED7AA;
}
.ui-foundation-page .alerts { display:grid; gap:8px; margin:14px 0; }
.ui-foundation-page .alerts .alert { margin:0; }

/* ---------- Checkboxes / radio rows ---------- */
html:not(.legacy-kds-view) .admin-shell :where(.switch-label,.check-row,.checkbox-label),
.ui-foundation-page :where(.check,.checks label) {
  min-height:44px;
  display:flex;
  align-items:center;
  gap:9px;
}
html:not(.legacy-kds-view) .admin-shell input[type="checkbox"],
html:not(.legacy-kds-view) .admin-shell input[type="radio"],
.platform-shell input[type="checkbox"],
.platform-shell input[type="radio"],
.ui-foundation-page input[type="checkbox"],
.ui-foundation-page input[type="radio"] {
  width:18px;
  height:18px;
  accent-color:var(--ui-primary,#0F766E);
  flex:0 0 auto;
}

/* ---------- File inputs ---------- */
html:not(.legacy-kds-view) .admin-shell input[type="file"],
.platform-shell input[type="file"],
.ui-foundation-page input[type="file"] {
  width:100%;
  min-height:44px;
  padding:7px 9px;
  border:1px dashed var(--ui-field-border);
  border-radius:var(--ui-field-radius);
  background:#F8FAFC;
  color:var(--ui-muted,#64748B);
}

/* ---------- Read-only / submitted states ---------- */
.ui-foundation-page form.readonly,
html:not(.legacy-kds-view) .admin-shell .readonly-form {
  opacity:.86;
}
.ui-foundation-page form.readonly :where(input,select,textarea,button),
html:not(.legacy-kds-view) .admin-shell .readonly-form :where(input,select,textarea,button) {
  cursor:not-allowed;
}

/* ---------- Mobile: forms become one task per screen ---------- */
@media (max-width:767px) {
  html:not(.legacy-kds-view) .admin-shell :where(.detail-grid,.summary-grid,.metadata-grid),
  .platform-shell .detail-grid,
  .ui-foundation-page .detail-grid { grid-template-columns:1fr; gap:0; }

  html:not(.legacy-kds-view) .admin-shell :where(.modal-card,.settings-form,.branding-form) > footer,
  html:not(.legacy-kds-view) .admin-shell .form-actions,
  .platform-shell .platform-modal > footer,
  .ui-foundation-page form > .actions:last-child {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:100%;
  }
  html:not(.legacy-kds-view) .admin-shell :where(.modal-card,.settings-form,.branding-form) > footer > *,
  html:not(.legacy-kds-view) .admin-shell .form-actions > *,
  .platform-shell .platform-modal > footer > *,
  .ui-foundation-page form > .actions:last-child > * {
    width:100%;
    min-height:46px;
    justify-content:center;
  }
  html:not(.legacy-kds-view) .admin-shell :where(.modal-card,.settings-form,.branding-form) > footer > :only-child,
  html:not(.legacy-kds-view) .admin-shell .form-actions > :only-child,
  .platform-shell .platform-modal > footer > :only-child,
  .ui-foundation-page form > .actions:last-child > :only-child { grid-column:1 / -1; }

  .ui-foundation-page .card { scroll-margin-top:12px; }
  .ui-foundation-page :where(.ok,.bad,.err,.notice,.alert,.form-error,.form-success,.inline-message) { font-size:13px; }
}

/* Keep customer / POS / KDS out of this layer by design: no customer/store/POS/KDS selectors below. */