/*
 * simamor administrative components, loaded after each module's layout.
 * Never style public theme renderers, monograms, swatches or Pix artwork.
 * Status/category colors remain semantic; only navigation and neutral surfaces
 * use the platform palette. Keep dimensions and interactive contracts intact.
 */
.app-shell {
  --app-tint: #fff3f4;
  --app-tint-hover: #fbe8ed;
  --app-selected-border: #b45c76;
  --app-chart-track: #efe3e7;
  --app-shadow: 0 .35rem 1.25rem rgb(114 13 43 / 4%);
}

/* Existing module tokens, without changing success/danger/category tokens. */
.app-shell .guest-admin {
  --guest-border: var(--app-border);
  --guest-muted: var(--app-muted);
  color: var(--app-ink);
}
.app-shell .catalog-admin {
  --catalog-border: var(--app-border);
  --catalog-muted: var(--app-muted);
  --catalog-accent: var(--app-wine);
  color: var(--app-ink);
}
.app-shell .finance {
  --fin-ink: var(--app-ink);
  --fin-muted: var(--app-muted);
  --fin-border: var(--app-border);
}
.app-shell :is(.planner, .pl-drawer, .pl-check-preview-panel) {
  --pl-ink: var(--app-ink);
  --pl-muted: var(--app-muted);
  --pl-line: var(--app-border);
  --pl-soft: var(--app-tint);
  --pl-warm: var(--app-canvas);
}
.app-shell .photos-admin {
  --photo-border: var(--app-border);
  --photo-muted: var(--app-muted);
  --photo-navy: var(--app-wine);
}
.app-shell .design-studio {
  --studio-ink: var(--app-ink);
  --studio-muted: var(--app-muted);
  --studio-border: var(--app-border);
  --studio-accent: var(--app-wine);
}
.app-shell :is(.wa-admin, .chat-admin, .gift-editor, .party-pix) {
  color: var(--app-ink);
}

/* Shared actions. Public/internal wedding previews are explicitly excluded. */
.app-shell .btn:not(:where(.site-preview *)) {
  min-height: 2.75rem;
  gap: .45rem;
  border-radius: .55rem;
  font-weight: 600;
  box-shadow: none;
}
.app-shell .btn-primary:not(:where(.site-preview *)) {
  color: #fff;
  background: var(--app-wine);
  border-color: var(--app-wine);
}
.app-shell .btn-primary:not(:where(.site-preview *)):is(:hover, :active) {
  color: #fff;
  background: var(--app-wine-dark);
  border-color: var(--app-wine-dark);
}
.app-shell :is(.btn-outline-primary, .btn-outline-secondary):not(:where(.site-preview *)) {
  color: var(--app-wine-dark);
  background: var(--app-surface);
  border-color: var(--app-input-border);
}
.app-shell :is(.btn-outline-primary, .btn-outline-secondary):not(:where(.site-preview *)):hover {
  color: var(--app-wine-dark);
  background: var(--app-tint-hover);
  border-color: var(--app-selected-border);
}
.app-shell .btn-secondary:not(:where(.site-preview *)) {
  color: var(--app-wine-dark);
  background: var(--app-accent-soft);
  border-color: var(--app-border);
}
.app-shell .btn-secondary:not(:where(.site-preview *)):hover {
  background: var(--app-sidebar-hover);
  border-color: var(--app-selected-border);
}
.app-shell .app-content :is(button.secondary, .button.secondary):not(:where(.site-preview *)) {
  color: var(--app-wine-dark);
  background: var(--app-accent-soft);
  border-color: var(--app-border);
  box-shadow: none;
}
.app-shell .app-content :is(button.secondary, .button.secondary):not(:where(.site-preview *)):hover {
  color: var(--app-wine-dark);
  background: var(--app-tint-hover);
  border-color: var(--app-selected-border);
  transform: none;
}
.app-shell :is(.btn-ghost-primary, .btn-ghost-secondary, .btn-link):not(:where(.site-preview *)) {
  color: var(--app-wine);
}
.app-shell :is(.btn-ghost-primary, .btn-ghost-secondary):not(:where(.site-preview *)):hover {
  color: var(--app-wine-dark);
  background: var(--app-tint-hover);
}
.app-shell :is(.btn, .button, button):not(:where(.site-preview *)):is(:disabled, [aria-disabled="true"]) {
  opacity: .55;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}
.app-shell :is(.app-content, .pl-drawer) :focus-visible:not(:where(.site-preview *)) {
  outline: 3px solid var(--app-focus);
  outline-offset: 3px;
}

/* Fields retain their module layout, native affordances and error semantics. */
.app-shell :is(.app-content, .pl-drawer)
  :is(input, select, textarea):not(:where(
    [type="hidden"], [type="checkbox"], [type="radio"], [type="color"],
    [type="range"], .site-preview *
  )) {
  color: var(--app-ink);
  border-color: var(--app-field-border, var(--app-input-border));
  background-color: var(--app-surface);
  border-radius: .55rem;
}
.app-shell :is(.app-content, .pl-drawer)
  :is(input, select, textarea):not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="range"]):not(:where(.site-preview *)):focus {
  border-color: var(--app-field-border, var(--app-focus));
  outline: 2px solid var(--app-focus);
  outline-offset: 2px;
  box-shadow: 0 0 0 .2rem rgb(151 5 47 / 8%);
}
.app-shell :is(.app-content, .pl-drawer)
  :is(input, select, textarea):not(:where(.site-preview *))::placeholder {
  color: var(--app-muted);
  opacity: 1;
}
.app-shell :is(.app-content, .pl-drawer)
  :is(input, select, textarea):not(:where(.site-preview *)):is(:disabled, [readonly]) {
  color: var(--app-muted);
  background-color: var(--app-canvas);
}
.app-shell :is(.app-content, .pl-drawer)
  :is(input[type="checkbox"], input[type="radio"], input[type="range"]):not(:where(.site-preview *)) {
  accent-color: var(--app-wine);
}
.app-shell .app-content input[type="file"]:not(:where(.site-preview *))::file-selector-button {
  padding: .55rem .75rem;
  margin-right: .75rem;
  border: 1px solid var(--app-border);
  border-radius: .4rem;
  color: var(--app-wine-dark);
  background: var(--app-accent-soft);
  font: inherit;
  cursor: pointer;
}
.app-shell :is(.app-content, .pl-drawer) :is(.fin-field--error, .guest-field--error, .pl-field-error, .wa-phone-row--error)
  :is(input, select, textarea),
.app-shell :is(.app-content, .pl-drawer) [aria-invalid="true"]:not(:where(.site-preview *)) {
  --app-field-border: #a33636;
  border-color: #a33636;
}

/* Table structure is shared, while mobile card layouts stay in their modules. */
.app-shell .app-content table:not(:where(.site-preview *)),
.app-shell .app-content :is(th, td):not(:where(.site-preview *)) {
  border-color: var(--app-border);
}
.app-shell .app-content th:not(:where(.site-preview *)) {
  color: var(--app-wine-dark);
  background: var(--app-tint);
}
.app-shell .app-content tbody tr:nth-child(even):not(:where(.site-preview *, .is-selected, [data-dirty="true"])) {
  background: #fdfafb;
}
@media (hover: hover) {
  .app-shell .app-content tbody tr:hover:not(:where(.site-preview *, .is-selected, [data-dirty="true"])) {
    background: var(--app-tint);
  }
}
.app-shell .app-content :is(tr.is-selected, .wa-person.is-selected) {
  background: var(--app-accent-soft);
}

/* Neutral module panels and secondary surfaces. */
.app-shell :is(
  .guest-panel, .catalog-panel, .fin-panel, .fin-kpi, .pl-card, .pl-stat,
  .wa-panel, .wa-metrics article, .chat-panel, .chat-side-panel, .photos-panel,
  .photos-stat, .pix-card, .pix-save, .pix-preview-panel, .gift-editor-save
) {
  border-color: var(--app-border);
  box-shadow: var(--app-shadow);
}
.app-shell :is(
  .guest-filters, .catalog-filters, .rsvp-filters, .rsvp-person-filters,
  .group-add, .group-results-heading, .group-results-pages, .chat-timeline,
  .fin-weekdays, .fin-context, .pl-view-switch, .pl-model-confirm,
  .pl-detail-grid, .pl-status-form, .guest-buffet-counts > div, .wa-bulk-tools
) {
  background: var(--app-canvas);
  border-color: var(--app-border);
}
.app-shell :is(
  .guest-avatar, .group-count, .rsvp-guide-icon, .rsvp-steps li > span,
  .fin-icon, .fin-section-title > span, .builder-group__icon,
  .builder-module-card__icon, .builder-group__count, .builder-onboarding__icon,
  .section-editor__module-icon, .gift-editor-badge, .pix-step-number,
  .pix-steps b, .chat-avatar, .rsvp-settings-step, .wa-phone-avatar,
  .wa-recipient-avatar
) {
  color: var(--app-wine);
  background: var(--app-accent-soft);
}
.app-shell :is(
  .wa-eyebrow, .wa-metrics strong, .builder-eyebrow, .pl-eyebrow,
  .rsvp-stat-action, .group-count, .chat-open, .pix-eyebrow,
  .pl-percent, .pl-symbol, .pl-more summary
) {
  color: var(--app-wine);
}
.app-shell :is(
  .catalog-notice, .guest-new-group-note, .wa-notice, .section-editor__guidance,
  .gift-editor-intro, .builder-access:not(.builder-access--readonly),
  .fin-progress-panel, .fin-notice:not(.fin-notice--error), .pl-notice,
  .pl-gantt-guide, .photos-stat--highlight, .pix-notice, .pix-tip,
  .rsvp-settings-note, .rsvp-thanks-status
) {
  color: var(--app-ink);
  background: var(--app-tint);
  border-color: var(--app-border);
}
.app-shell :is(.gift-editor-intro, .section-editor__guidance, .pl-gantt-guide) {
  border-left-color: var(--app-coral);
}
.app-shell :is(
  .gift-editor-hint, .gift-editor-section-hint, .gift-editor-save [role="status"],
  .wa-help, .wa-field small, .wa-metrics small, .wa-list-row small,
  .chat-phone, .chat-preview, .chat-contact-meta time, .chat-help,
  .chat-pagination, .chat-message-label, .chat-message footer,
  .chat-side-panel p, .chat-side-panel small, .chat-side-help p,
  .wa-phone-person small, .wa-phone-field label, .wa-phone-guide .wa-help,
  .fin-progress-panel p, .fin-context p, .pl-gantt-guide p
) {
  color: var(--app-muted);
}
.app-shell :is(.wa-tabs, .studio-tabs, .guest-tabs, .catalog-tabs, .fin-tabs, .pl-tabs) {
  border-color: var(--app-border);
}
.app-shell :is(.wa-tabs, .studio-tabs, .guest-tabs, .catalog-tabs, .fin-tabs, .pl-tabs)
  a:is([aria-current], [aria-selected="true"]) {
  color: var(--app-wine);
  border-bottom-color: var(--app-wine);
}
.app-shell :is(.rsvp-tracking-tabs, .pl-chips, .pl-view-switch) a[aria-current] {
  color: var(--app-wine);
  background: var(--app-accent-soft);
  border-color: var(--app-selected-border);
}
.app-shell :is(.rsvp-selection-bar, .wa-bulk-bar, .wa-bulk-count) {
  color: var(--app-wine-dark);
  background: var(--app-accent-soft);
  border-color: var(--app-border);
}
.app-shell .wa-phone-columns {
  color: var(--app-wine-dark);
  background: var(--app-tint);
}
.app-shell .wa-phone-savebar { border-color: var(--app-border); }
.app-shell :is(.wa-consent-option, .wa-mode label):has(input:checked) {
  background: var(--app-tint);
  border-color: var(--app-selected-border);
}
.app-shell .wa-consent-option input[type="checkbox"]:checked {
  background: var(--app-wine);
  border-color: var(--app-wine);
}
.app-shell .pix-preview-panel { background: var(--app-accent-soft); }
.app-shell .pix-modes label:has(input:checked) {
  border-color: var(--app-wine);
  background: var(--app-tint);
  box-shadow: 0 0 0 1px var(--app-wine);
}
.app-shell .rsvp-setting-toggle {
  background: var(--app-canvas);
  border-color: var(--app-border);
}
.app-shell .rsvp-setting-toggle:has(input:checked) {
  background: var(--app-tint);
  border-color: var(--app-selected-border);
}
.app-shell :is(.guest-buffet-amount, .rsvp-stat) { color: var(--app-ink); }
.app-shell a.rsvp-stat:hover { color: var(--app-ink); background: var(--app-tint); }

/* Finance charts: wine = contracted/contributed, coral = category/open amount.
 * Paid progress and overdue badges keep their existing semantic colors. */
.app-shell .fin-kpi--main {
  color: #fff;
  background: var(--app-wine-dark);
  border-color: var(--app-wine-dark);
}
.app-shell .fin-kpi--main > :is(span, small) { color: #f7e1e8; }
.app-shell :is(.fin-welcome, .pl-overview) {
  background: linear-gradient(115deg, var(--app-accent-soft), #fff9f8);
  border-color: var(--app-border);
}
.app-shell :is(.fin-welcome p, .fin-welcome small) { color: var(--app-muted); }
.app-shell .fin-ring__track { stroke: var(--app-chart-track); }
.app-shell .fin-ring text { fill: var(--app-ink); }
.app-shell .finance meter {
  background: var(--app-chart-track);
  accent-color: var(--app-wine);
}
.app-shell .finance meter::-webkit-meter-bar { background: var(--app-chart-track); }
.app-shell .finance meter::-webkit-meter-optimum-value { background: var(--app-wine); }
.app-shell .finance meter::-moz-meter-bar { background: var(--app-wine); }
.app-shell .finance :is(.fin-bar-row--warm meter, .fin-meter-open) {
  accent-color: var(--app-coral-ink);
}
.app-shell .finance :is(.fin-bar-row--warm meter, .fin-meter-open)::-webkit-meter-optimum-value {
  background: var(--app-coral-ink);
}
.app-shell .finance :is(.fin-bar-row--warm meter, .fin-meter-open)::-moz-meter-bar {
  background: var(--app-coral-ink);
}
.app-shell .fin-day--due { background: var(--app-tint); }
.app-shell .fin-day--today > span:first-child { color: var(--app-wine); }
.app-shell .fin-day strong { color: var(--app-wine); }
.app-shell .fin-day-dot { background: var(--app-coral-ink); }

/* Planning progress and Gantt framing, not task status/category colors. */
.app-shell .planner progress { accent-color: var(--app-wine); background: var(--app-chart-track); }
.app-shell .planner progress::-webkit-progress-bar { background: var(--app-chart-track); }
.app-shell .planner progress::-webkit-progress-value { background: var(--app-wine); }
.app-shell .planner progress::-moz-progress-bar { background: var(--app-wine); }
.app-shell :is(.pl-date, .pl-gantt-scroll, .pl-gantt-label, .pl-gantt-heading) {
  border-color: var(--app-border);
}
.app-shell :is(.pl-gantt-heading, .pl-gantt-heading .pl-gantt-label) {
  color: var(--app-wine-dark);
  background: var(--app-tint);
}
.app-shell .pl-gantt-label h3 a { color: var(--app-ink); }
.app-shell .pl-gantt-today-key { color: var(--app-coral-ink); border-color: var(--app-coral-ink); }
.app-shell .pl-gantt-scroll { scrollbar-color: var(--app-input-border) var(--app-canvas); }
.app-shell .pl-task-row:hover { background: var(--app-canvas); }
.app-shell .pl-model-card:nth-child(2) { background: var(--app-tint); }
.app-shell .pl-model-card:nth-child(3) { background: #fff9f8; }

/* Conversation direction remains explicit in the label, not color alone. */
.app-shell .chat-message--out { background: var(--app-tint); border-color: var(--app-border); }
.app-shell .chat-badge { color: #fff; background: var(--app-wine); }
.app-shell :is(.chat-contact, .chat-stats a) { color: var(--app-ink); border-color: var(--app-border); }
.app-shell .chat-contact--unread {
  background: var(--app-tint);
  box-shadow: inset 3px 0 var(--app-wine);
}
.app-shell .chat-contact:is(:hover, :focus-visible) { background: var(--app-accent-soft); }
.app-shell .wa-message-preview { background: var(--app-canvas); border-color: var(--app-border); }
.app-shell .wa-list-row:nth-child(even) { background: var(--app-canvas); }

/* Rich-text and photo/editor controls only; artwork and customer swatches stay unchanged. */
.app-shell :is(.gift-rich-text__toolbar, .site-rich-text__toolbar) {
  background: var(--app-canvas);
  border-color: var(--app-border);
}
.app-shell .app-content :is(.gift-rich-text__toolbar, .site-rich-text__toolbar) button {
  color: var(--app-wine-dark);
  background: var(--app-surface);
  border-color: var(--app-input-border);
  box-shadow: none;
}
.app-shell .app-content :is(.gift-rich-text__toolbar, .site-rich-text__toolbar) button:hover {
  color: var(--app-wine-dark);
  background: var(--app-tint-hover);
  transform: none;
}
.app-shell :is(.gift-rich-text__editor, .site-rich-text__editor) {
  color: var(--app-ink);
  border-color: var(--app-input-border);
}
.app-shell :is(.gift-rich-text__editor, .site-rich-text__editor):focus {
  border-color: var(--app-focus);
  outline: 2px solid var(--app-focus);
  outline-offset: 2px;
  box-shadow: 0 0 0 .2rem rgb(151 5 47 / 8%);
}
.app-shell .gift-photo-picker button[aria-pressed="true"] {
  border-color: var(--app-wine);
  background: var(--app-accent-soft);
}
.app-shell .design-studio :is(.studio-filters, .studio-monogram-styles, .studio-preview-controls) button {
  color: var(--app-wine-dark);
  background: var(--app-surface);
  border-color: var(--app-border);
  box-shadow: none;
}
.app-shell .design-studio :is(.studio-filters, .studio-monogram-styles) button:not(.active):hover,
.app-shell .builder-module-card:hover {
  color: var(--app-wine-dark);
  background: var(--app-tint);
  border-color: var(--app-selected-border);
}
.app-shell .design-studio .studio-filters button.active { background: var(--app-wine); color: #fff; }
.app-shell .design-studio .studio-monogram-styles button[aria-pressed="true"] {
  color: var(--app-wine-dark);
  background: var(--app-tint);
  border-color: var(--app-wine);
  box-shadow: 0 0 0 1px var(--app-wine);
}
.app-shell .design-studio .studio-preview-controls button[aria-pressed="true"] {
  color: #fff;
  background: var(--app-wine);
  border-color: var(--app-wine);
}
.app-shell :is(.guest-new-group-dialog, .pl-drawer, .pl-check-preview-panel) {
  color: var(--app-ink);
  border-color: var(--app-border);
}
.app-shell :is(.app-content, .pl-drawer, .pl-check-preview-panel)
  button:is(.guest-dialog-close, .pl-close, .pl-check-preview-close) {
  color: var(--app-wine);
  background: #fff;
  border-color: var(--app-border);
  box-shadow: none;
  transform: none;
}
.app-shell :is(.app-content, .pl-drawer, .pl-check-preview-panel)
  button:is(.guest-dialog-close, .pl-close, .pl-check-preview-close):hover {
  color: var(--app-wine-dark);
  background: var(--app-tint-hover);
}
.app-shell :is(.planner, .pl-drawer) button.pl-check-button {
  color: var(--app-wine);
  background: var(--app-tint);
  border-color: var(--app-selected-border);
  box-shadow: none;
  transform: none;
}
.app-shell :is(.planner, .pl-drawer) .pl-checked button.pl-check-button {
  color: #fff;
  background: var(--pl-green);
  border-color: var(--pl-green);
}
.app-shell :is(.planner, .pl-drawer) button.pl-text-button {
  color: #9b3030;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  transform: none;
}
.app-shell :is(.planner, .pl-drawer) button.pl-text-button:hover {
  color: #7f2525;
  background: #fff0f0;
}
@media (prefers-reduced-motion: reduce) {
  .app-shell :is(.btn, .button, button):not(:where(.site-preview *)) { transition: none; }
}