/**
 * @file
 * addnodeui-combined.css
 * Shared styling for the Drupal "Add/Edit Article" (#node-article-form)
 * and "Add/Edit Image Gallery" (#node-image-gallery-form) node forms.
 * Built on top of the Samoa News theme design tokens (base.css).
 * Falls back to sensible defaults if those tokens aren't present.
 */

:root {
  --anui-primary: var(--color-primary, #A62C00);
  --anui-primary-hover: var(--color-primary-hover, #8B2500);
  --anui-primary-light: var(--color-primary-light, rgba(166, 44, 0, 0.1));
  --anui-secondary: var(--color-secondary, #00A25F);
  --anui-secondary-hover: var(--color-secondary-hover, #008A51);
  --anui-secondary-light: var(--color-secondary-light, rgba(0, 162, 95, 0.1));

  --anui-bg: var(--color-muted, #f5f5f5);
  --anui-surface: var(--color-card, #ffffff);
  --anui-text: var(--color-card-foreground, #171717);
  --anui-text-muted: var(--color-muted-foreground, #737373);
  --anui-border: var(--color-border, #e5e5e5);
  --anui-border-strong: #c9ced6;
  --anui-ring: var(--color-ring, var(--anui-primary));
  --anui-danger: var(--color-destructive, #dc2626);
  --anui-danger-foreground: var(--color-destructive-foreground, #ffffff);
  --anui-success: var(--color-success, #16a34a);

  --anui-radius-sm: var(--radius-md, 0.375rem);
  --anui-radius: var(--radius-lg, 0.5rem);
  --anui-radius-lg: var(--radius-xl, 0.75rem);

  --anui-shadow: var(--shadow-sm, 0 1px 2px 0 rgba(0, 0, 0, 0.05));
  --anui-shadow-md: var(--shadow, 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1));
  --anui-shadow-lg: var(--shadow-md, 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1));

  --anui-font: var(--font-sans, 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);

  --anui-transition: var(--transition-normal, 200ms) var(--transition-timing, cubic-bezier(0.4, 0, 0.2, 1));

  --anui-gap: var(--spacing-5, 1.25rem);
}

/* ---------------------------------------------------------------------
   Page / region wrapper
   --------------------------------------------------------------------- */
.region--content {
  font-family: var(--anui-font);
  color: var(--anui-text);
  background: var(--anui-bg);
  padding: var(--spacing-6, 1.5rem);
  border-radius: var(--anui-radius-lg);
}

/* =======================================================================
   SHARED RULES — apply to both #node-article-form and #node-image-gallery-form
   ======================================================================= */

#node-article-form,
#node-image-gallery-form,
#node-pdf-edition-form,
#node-simpleads-form {
  --anui-max-width: 960px;
  max-width: var(--anui-max-width);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--anui-gap);
  font-family: var(--anui-font);
  color: var(--anui-text);
}

/* Every top-level field wrapper becomes a "card" */
#node-article-form > .js-form-wrapper,
#node-article-form > .form-wrapper,
#node-image-gallery-form > .js-form-wrapper,
#node-image-gallery-form > .form-wrapper,
#node-pdf-edition-form > .js-form-wrapper,
#node-pdf-edition-form > .form-wrapper,
#node-simpleads-form > .js-form-wrapper,
#node-simpleads-form > .form-wrapper {
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius);
  box-shadow: var(--anui-shadow);
  padding: var(--spacing-6, 1.5rem);
  transition: box-shadow var(--anui-transition), border-color var(--anui-transition);
}

#node-article-form > .js-form-wrapper:hover,
#node-article-form > .form-wrapper:hover,
#node-image-gallery-form > .js-form-wrapper:hover,
#node-image-gallery-form > .form-wrapper:hover,
#node-pdf-edition-form > .js-form-wrapper:hover,
#node-pdf-edition-form > .form-wrapper:hover,
#node-simpleads-form > .js-form-wrapper:hover,
#node-simpleads-form > .form-wrapper:hover {
  box-shadow: var(--anui-shadow-md);
  border-color: var(--anui-border-strong);
}

#node-article-form > .js-form-wrapper:focus-within,
#node-article-form > .form-wrapper:focus-within,
#node-image-gallery-form > .js-form-wrapper:focus-within,
#node-image-gallery-form > .form-wrapper:focus-within,
#node-pdf-edition-form > .js-form-wrapper:focus-within,
#node-pdf-edition-form > .form-wrapper:focus-within,
#node-simpleads-form > .js-form-wrapper:focus-within,
#node-simpleads-form > .form-wrapper:focus-within {
  border-color: var(--anui-primary);
  box-shadow: 0 0 0 3px var(--anui-primary-light);
}

/* Labels */
#node-article-form label,
#node-image-gallery-form label,
#node-pdf-edition-form label,
#node-simpleads-form label {
  display: inline-block;
  font-weight: var(--font-medium, 500);
  font-size: var(--text-sm, 0.875rem);
  letter-spacing: 0.01em;
  color: var(--anui-text);
  margin-bottom: var(--spacing-2, 0.5rem);
}

#node-article-form label.js-form-required::after,
#node-article-form label.form-required::after,
#node-image-gallery-form label.js-form-required::after,
#node-image-gallery-form label.form-required::after,
#node-pdf-edition-form label.js-form-required::after,
#node-pdf-edition-form label.form-required::after,
#node-simpleads-form label.js-form-required::after,
#node-simpleads-form label.form-required::after {
  content: " *";
  color: var(--anui-primary);
  font-weight: var(--font-bold, 700);
}

#node-article-form label.visually-hidden,
#node-image-gallery-form label.visually-hidden,
#node-pdf-edition-form label.visually-hidden,
#node-simpleads-form label.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

/* Form items */
#node-article-form .form-item,
#node-article-form .js-form-item,
#node-image-gallery-form .form-item,
#node-image-gallery-form .js-form-item,
#node-pdf-edition-form .form-item,
#node-pdf-edition-form .js-form-item,
#node-simpleads-form .form-item,
#node-simpleads-form .js-form-item {
  display: flex;
  flex-direction: column;
  margin-bottom: var(--spacing-4, 1rem);
}

#node-article-form .form-item:last-child,
#node-article-form .js-form-item:last-child,
#node-image-gallery-form .form-item:last-child,
#node-image-gallery-form .js-form-item:last-child,
#node-pdf-edition-form .form-item:last-child,
#node-pdf-edition-form .js-form-item:last-child,
#node-simpleads-form .form-item:last-child,
#node-simpleads-form .js-form-item:last-child {
  margin-bottom: 0;
}

#node-article-form .description,
#node-image-gallery-form .description,
#node-pdf-edition-form .description,
#node-simpleads-form .description {
  font-size: var(--text-xs, 0.75rem);
  color: var(--anui-text-muted);
  margin-top: var(--spacing-2, 0.5rem);
  line-height: var(--leading-relaxed, 1.625);
}

/* Text inputs / textareas / selects */
#node-article-form input[type="text"],
#node-article-form input[type="email"],
#node-article-form input[type="number"],
#node-article-form textarea,
#node-article-form select.form-select,
#node-article-form .form-autocomplete,
#node-image-gallery-form input[type="text"],
#node-image-gallery-form input[type="email"],
#node-image-gallery-form input[type="number"],
#node-image-gallery-form textarea,
#node-image-gallery-form select.form-select,
#node-pdf-edition-form input[type="text"],
#node-pdf-edition-form input[type="email"],
#node-pdf-edition-form input[type="number"],
#node-pdf-edition-form textarea,
#node-pdf-edition-form select.form-select,
#node-pdf-edition-form .form-autocomplete,
#node-simpleads-form input[type="text"],
#node-simpleads-form input[type="email"],
#node-simpleads-form input[type="number"],
#node-simpleads-form textarea,
#node-simpleads-form select.form-select,
#node-simpleads-form .form-autocomplete {
  width: 100%;
  box-sizing: border-box;
  font-family: var(--anui-font);
  font-size: var(--text-base, 0.95rem);
  color: var(--anui-text);
  background-color: var(--anui-surface);
  border: 1px solid var(--color-input, var(--anui-border));
  border-radius: var(--anui-radius-sm);
  padding: 0.65rem 0.85rem;
  transition: border-color var(--anui-transition), box-shadow var(--anui-transition);
}

#node-article-form input[type="text"]:hover,
#node-article-form textarea:hover,
#node-article-form select.form-select:hover,
#node-image-gallery-form input[type="text"]:hover,
#node-image-gallery-form textarea:hover,
#node-image-gallery-form select.form-select:hover,
#node-pdf-edition-form input[type="text"]:hover,
#node-pdf-edition-form textarea:hover,
#node-pdf-edition-form select.form-select:hover,
#node-simpleads-form input[type="text"]:hover,
#node-simpleads-form textarea:hover,
#node-simpleads-form select.form-select:hover {
  border-color: var(--anui-border-strong);
}

#node-article-form input[type="text"]:focus,
#node-article-form input[type="email"]:focus,
#node-article-form textarea:focus,
#node-article-form select.form-select:focus,
#node-article-form .form-autocomplete:focus,
#node-image-gallery-form input[type="text"]:focus,
#node-image-gallery-form input[type="email"]:focus,
#node-image-gallery-form textarea:focus,
#node-image-gallery-form select.form-select:focus,
#node-pdf-edition-form input[type="text"]:focus,
#node-pdf-edition-form input[type="email"]:focus,
#node-pdf-edition-form textarea:focus,
#node-pdf-edition-form select.form-select:focus,
#node-pdf-edition-form .form-autocomplete:focus,
#node-simpleads-form input[type="text"]:focus,
#node-simpleads-form input[type="email"]:focus,
#node-simpleads-form textarea:focus,
#node-simpleads-form select.form-select:focus,
#node-simpleads-form .form-autocomplete:focus {
  outline: none;
  border-color: var(--anui-ring);
  box-shadow: 0 0 0 3px var(--anui-primary-light);
}

#node-article-form textarea,
#node-image-gallery-form textarea,
#node-pdf-edition-form textarea,
#node-simpleads-form textarea {
  resize: vertical;
  line-height: var(--leading-normal, 1.5);
}

/* Title field gets a little extra visual weight */
#edit-title-wrapper input#edit-title-0-value {
  font-size: var(--text-xl, 1.25rem);
  font-weight: var(--font-bold, 700);
  padding: 0.85rem 1rem;
  border-color: var(--anui-border);
}

#edit-title-wrapper input#edit-title-0-value:focus {
  border-color: var(--anui-primary);
}

/* Select (multi) - Section field, etc. */
#node-article-form select[multiple],
#node-image-gallery-form select[multiple],
#node-pdf-edition-form select[multiple],
#node-simpleads-form select[multiple] {
  min-height: 150px;
}

#node-article-form select option:checked,
#node-image-gallery-form select option:checked,
#node-pdf-edition-form select option:checked,
#node-simpleads-form select option:checked {
  background-color: var(--anui-primary-light);
  color: var(--anui-primary);
}

/* Featured checkboxes (fieldset) */
#node-article-form fieldset,
#node-image-gallery-form fieldset,
#node-pdf-edition-form fieldset,
#node-simpleads-form fieldset {
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius-sm);
  padding: 1rem 1.1rem 1.1rem;
  margin: 0;
}

#node-article-form fieldset > legend,
#node-article-form fieldset .fieldset-legend,
#node-image-gallery-form fieldset > legend,
#node-image-gallery-form fieldset .fieldset-legend {
  font-weight: var(--font-bold, 700);
  font-size: var(--text-sm, 0.875rem);
  padding: 0 0.35rem;
  color: var(--anui-primary);
}

#node-article-form .form-checkboxes,
#node-image-gallery-form .form-checkboxes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1.4rem;
  margin-top: 0.6rem;
}

#node-article-form .form-checkboxes .form-item,
#node-article-form .form-checkboxes .js-form-item,
#node-image-gallery-form .form-checkboxes .form-item,
#node-image-gallery-form .form-checkboxes .js-form-item {
  flex-direction: row;
  align-items: center;
  margin-bottom: 0;
  gap: 0.5rem;
  background: var(--anui-bg);
  border: 1px solid transparent;
  border-radius: var(--radius-full, 9999px);
  padding: 0.4rem 0.85rem 0.4rem 0.6rem;
  transition: background-color var(--anui-transition), border-color var(--anui-transition);
}

#node-article-form .form-checkboxes .form-item:has(input:checked),
#node-article-form .form-checkboxes .js-form-item:has(input:checked),
#node-image-gallery-form .form-checkboxes .form-item:has(input:checked),
#node-image-gallery-form .form-checkboxes .js-form-item:has(input:checked) {
  background: var(--anui-secondary-light);
  border-color: var(--anui-secondary);
}

#node-article-form input[type="checkbox"].form-checkbox,
#node-image-gallery-form input[type="checkbox"].form-checkbox {
  width: 1.1rem;
  height: 1.1rem;
  accent-color: var(--anui-secondary);
  cursor: pointer;
}

#node-article-form .form-checkboxes label.option,
#node-image-gallery-form .form-checkboxes label.option {
  font-weight: var(--font-medium, 500);
  font-size: var(--text-sm, 0.875rem);
  margin-bottom: 0;
  cursor: pointer;
}

/* Tags table (multi-value field) */
#node-article-form table.field-multiple-table,
#node-image-gallery-form table.field-multiple-table {
  width: 100%;
  border-collapse: collapse;
}

#node-article-form table.field-multiple-table thead th,
#node-image-gallery-form table.field-multiple-table thead th {
  text-align: left;
  font-size: var(--text-xs, 0.75rem);
  color: var(--anui-text-muted);
  font-weight: var(--font-medium, 500);
  padding-bottom: var(--spacing-2, 0.5rem);
  border-bottom: 1px solid var(--anui-border);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

#node-article-form table.field-multiple-table td,
#node-image-gallery-form table.field-multiple-table td {
  padding: 0.45rem 0.45rem 0.45rem 0;
  vertical-align: middle;
}

#node-article-form .tabledrag-handle,
#node-image-gallery-form .tabledrag-handle {
  display: inline-block;
  width: 1.2rem;
  height: 1.2rem;
  cursor: grab;
  opacity: 0.45;
}

#node-article-form .tabledrag-handle:hover,
#node-image-gallery-form .tabledrag-handle:hover {
  opacity: 0.9;
}

#node-article-form .tabledrag-toggle-weight-wrapper,
#node-article-form .tableresponsive-toggle-columns,
#node-image-gallery-form .tabledrag-toggle-weight-wrapper,
#node-image-gallery-form .tableresponsive-toggle-columns {
  display: none; /* declutter the UI */
}

#node-article-form .button--small,
#node-article-form input.field-add-more-submit,
#node-image-gallery-form .button--small,
#node-image-gallery-form input.field-add-more-submit {
  font-size: var(--text-xs, 0.8rem);
  padding: 0.45rem 0.9rem;
}

/* Buttons (generic) */
#node-article-form input[type="submit"],
#node-article-form button,
#node-article-form .button,
#node-image-gallery-form input[type="submit"],
#node-image-gallery-form button,
#node-image-gallery-form .button,
#node-simpleads-form input[type="submit"],
#node-simpleads-form button,
#node-simpleads-form .button {
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.9rem);
  font-weight: var(--font-medium, 600);
  border-radius: var(--anui-radius-sm);
  border: 1px solid var(--anui-border-strong);
  background: var(--anui-surface);
  color: var(--anui-text);
  padding: 0.6rem 1rem;
  cursor: pointer;
  transition: background-color var(--anui-transition), border-color var(--anui-transition),
    color var(--anui-transition), transform 80ms ease;
}

#node-article-form input[type="submit"]:hover,
#node-article-form button:hover,
#node-article-form .button:hover,
#node-image-gallery-form input[type="submit"]:hover,
#node-image-gallery-form button:hover,
#node-image-gallery-form .button:hover,
#node-simpleads-form input[type="submit"]:hover,
#node-simpleads-form button:hover,
#node-simpleads-form .button:hover {
  border-color: var(--anui-border-strong);
  background: var(--anui-bg);
}

#node-article-form input[type="submit"]:active,
#node-article-form .button:active,
#node-image-gallery-form input[type="submit"]:active,
#node-image-gallery-form .button:active,
#node-simpleads-form input[type="submit"]:active,
#node-simpleads-form .button:active {
  transform: translateY(1px);
}

#node-article-form input[type="submit"]:focus-visible,
#node-article-form .button:focus-visible,
#node-image-gallery-form input[type="submit"]:focus-visible,
#node-image-gallery-form .button:focus-visible,
#node-simpleads-form input[type="submit"]:focus-visible,
#node-simpleads-form .button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--anui-primary-light);
}

/* Remove (tag delete / item remove) button reads as a danger action */
#node-article-form input[id^="edit-field-tags-0-actions-delete"],
#node-article-form input[name$="_remove_button"],
#node-image-gallery-form input[name$="_remove_button"] {
  background: #fff5f5;
  border-color: #f3b9b0;
  color: var(--anui-danger);
}

#node-article-form input[id^="edit-field-tags-0-actions-delete"]:hover,
#node-article-form input[name$="_remove_button"]:hover,
#node-image-gallery-form input[name$="_remove_button"]:hover {
  background: var(--anui-danger);
  border-color: var(--anui-danger);
  color: var(--anui-danger-foreground);
}

/* Primary action buttons (Save) use the brand primary color */
#node-article-form input.button--primary,
#node-image-gallery-form input.button--primary,
#node-simpleads-form input.button--primary {
  background: var(--anui-primary);
  border-color: var(--anui-primary);
  color: #ffffff;
}

#node-article-form input.button--primary:hover,
#node-image-gallery-form input.button--primary:hover,
#node-simpleads-form input.button--primary:hover {
  background: var(--anui-primary-hover);
  border-color: var(--anui-primary-hover);
}

/* Upload button(s) use the secondary (green) brand color.
   Matches both the article field_image and gallery field_images widgets. */
#node-article-form input[id^="edit-field-image-0-upload-button"],
#node-image-gallery-form input[id^="edit-field-images-0-upload-button"],
#node-simpleads-form input[id^="edit-field-ad-image-0-upload-button"] {
  background: var(--anui-secondary);
  border-color: var(--anui-secondary);
  color: #ffffff;
}

#node-article-form input[id^="edit-field-image-0-upload-button"]:hover,
#node-image-gallery-form input[id^="edit-field-images-0-upload-button"]:hover,
#node-simpleads-form input[id^="edit-field-ad-image-0-upload-button"]:hover {
  background: var(--anui-secondary-hover);
  border-color: var(--anui-secondary-hover);
}

/* Preview button: quiet outline in the primary color */
#node-article-form #edit-preview,
#node-image-gallery-form #edit-preview,
#node-simpleads-form #edit-preview {
  background: transparent;
  border-color: var(--anui-primary);
  color: var(--anui-primary);
}

#node-article-form #edit-preview:hover,
#node-image-gallery-form #edit-preview:hover,
#node-simpleads-form #edit-preview:hover {
  background: var(--anui-primary-light);
}

/* CKEditor 5 integration (Body, Google Ad, etc.) */
#node-article-form .ck.ck-editor,
#node-image-gallery-form .ck.ck-editor {
  border: 1px solid var(--color-input, var(--anui-border));
  border-radius: var(--anui-radius-sm);
  overflow: hidden;
}

#node-article-form .ck.ck-toolbar,
#node-image-gallery-form .ck.ck-toolbar {
  background: var(--anui-bg) !important;
  border-bottom: 1px solid var(--anui-border) !important;
  border: none !important;
}

#node-article-form .ck.ck-content.ck-editor__editable,
#node-image-gallery-form .ck.ck-content.ck-editor__editable {
  padding: 1rem 1.1rem !important;
  font-size: var(--text-base, 0.95rem);
  line-height: var(--leading-relaxed, 1.625);
}

#node-article-form .ck.ck-content.ck-editor__editable.ck-focused,
#node-image-gallery-form .ck.ck-content.ck-editor__editable.ck-focused {
  box-shadow: 0 0 0 3px var(--anui-primary-light) !important;
  border-color: var(--anui-primary) !important;
}

#node-article-form .ck-button.ck-on,
#node-image-gallery-form .ck-button.ck-on {
  color: var(--anui-primary) !important;
}

#node-article-form .js-filter-wrapper,
#node-image-gallery-form .js-filter-wrapper {
  margin-top: var(--spacing-3, 0.75rem);
}

#node-article-form .js-filter-wrapper select,
#node-image-gallery-form .js-filter-wrapper select {
  max-width: 220px;
}

#node-article-form .filter-guidelines,
#node-article-form a[id$="format-help-about"],
#node-image-gallery-form .filter-guidelines,
#node-image-gallery-form a[id$="format-help-about"] {
  font-size: var(--text-xs, 0.78rem);
  color: var(--anui-text-muted);
}

#node-article-form a[id$="format-help-about"]:hover,
#node-image-gallery-form a[id$="format-help-about"]:hover {
  color: var(--anui-primary);
}

#node-article-form .filter-guidelines ul,
#node-image-gallery-form .filter-guidelines ul {
  margin: 0.4rem 0 0;
  padding-left: 1.1rem;
}

/* Image upload widget (details / image-widget) */
#node-article-form details,
#node-image-gallery-form details,
#node-simpleads-form details {
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius-sm);
  padding: 0;
  overflow: hidden;
}

#node-article-form details > summary,
#node-image-gallery-form details > summary {
  background: var(--anui-bg);
  font-weight: var(--font-bold, 700);
  font-size: var(--text-sm, 0.9rem);
  padding: 0.85rem 1.1rem;
  cursor: pointer;
  border-bottom: 1px solid var(--anui-border);
  list-style: none;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

#node-article-form details > summary::-webkit-details-marker,
#node-image-gallery-form details > summary::-webkit-details-marker {
  display: none;
}

#node-article-form details > summary::before,
#node-image-gallery-form details > summary::before {
  content: "▾";
  color: var(--anui-text-muted);
  transition: transform var(--anui-transition);
}

#node-article-form details:not([open]) > summary::before,
#node-image-gallery-form details:not([open]) > summary::before {
  transform: rotate(-90deg);
}

#node-article-form details[open],
#node-image-gallery-form details[open] {
  padding-bottom: 0;
}

#node-article-form details > div,
#node-article-form details .fieldset-wrapper,
#node-image-gallery-form details > div,
#node-image-gallery-form details .fieldset-wrapper {
  padding: 1.1rem;
}

#node-article-form .image-widget.form-managed-file,
#node-image-gallery-form .image-widget.form-managed-file {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.7rem;
}

#node-article-form input[type="file"].form-file,
#node-image-gallery-form input[type="file"].form-file {
  border: 1px dashed var(--anui-border-strong);
  background: var(--anui-bg);
  padding: 0.85rem;
  cursor: pointer;
  border-radius: var(--anui-radius-sm);
  width: 100%;
  box-sizing: border-box;
}

#node-article-form input[type="file"].form-file:hover,
#node-image-gallery-form input[type="file"].form-file:hover {
  border-color: var(--anui-secondary);
  background: var(--anui-secondary-light);
}

/* Vertical tabs (Revision information, etc.) */
#node-article-form .vertical-tabs,
#node-image-gallery-form .vertical-tabs {
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius-sm);
  overflow: hidden;
  padding: 12px;
}

#node-article-form .vertical-tabs__menu,
#node-image-gallery-form .vertical-tabs__menu {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  background: var(--anui-bg);
  border-bottom: 1px solid var(--anui-border);
  overflow-x: auto;
}

#node-article-form .vertical-tabs__menu-item a,
#node-image-gallery-form .vertical-tabs__menu-item a {
  display: block;
  padding: 0.7rem 1.1rem;
  text-decoration: none;
  color: var(--anui-text-muted);
  font-size: var(--text-sm, 0.85rem);
  font-weight: var(--font-medium, 600);
  white-space: nowrap;
}

#node-article-form .vertical-tabs__menu-item.is-selected a,
#node-image-gallery-form .vertical-tabs__menu-item.is-selected a {
  color: var(--anui-primary);
  border-bottom: 2px solid var(--anui-primary);
}

#node-article-form .vertical-tabs__menu-item-summary,
#node-image-gallery-form .vertical-tabs__menu-item-summary {
  display: block;
  font-weight: var(--font-normal, 400);
  color: var(--anui-text-muted);
  font-size: var(--text-xs, 0.75rem);
}

#node-article-form .vertical-tabs__panes details,
#node-image-gallery-form .vertical-tabs__panes details {
  border: none;
  border-radius: 0;
}

#node-article-form .vertical-tabs__panes details > summary,
#node-image-gallery-form .vertical-tabs__panes details > summary {
  display: none; /* tab nav already shows the label */
}

/* Body field: Summary toggle link */
#node-article-form .link-edit-summary,
#node-image-gallery-form .link-edit-summary {
  background: none;
  border: none;
  color: var(--anui-primary);
  font-size: var(--text-xs, 0.78rem);
  font-weight: var(--font-medium, 500);
  cursor: pointer;
  padding: 0;
  text-decoration: underline;
}

#node-article-form .text-summary-wrapper,
#node-image-gallery-form .text-summary-wrapper {
  margin-bottom: var(--spacing-3, 0.75rem);
  padding-bottom: var(--spacing-3, 0.75rem);
  border-bottom: 1px dashed var(--anui-border);
}

/* Moderation state / footer */
.entity-content-form-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--spacing-4, 1rem);
}

#node-article-form .container-inline.form-item,
#node-article-form .container-inline.js-form-item,
#node-image-gallery-form .container-inline.form-item,
#node-image-gallery-form .container-inline.js-form-item {
  flex-direction: row;
  align-items: center;
  gap: 0.7rem;
}

#node-article-form .container-inline label,
#node-image-gallery-form .container-inline label {
  margin-bottom: 0;
}

#node-article-form select#edit-moderation-state-0-state,
#node-image-gallery-form select#edit-moderation-state-0-state {
  width: auto;
  min-width: 190px;
  border-color: var(--anui-border-strong);
}

/* Actions bar (Save / Preview) */
#node-article-form #edit-actions,
#node-image-gallery-form #edit-actions {
  display: flex;
  gap: 0.85rem;
  padding-top: var(--spacing-4, 1rem);
  border-top: 1px solid var(--anui-border);
  margin-top: var(--spacing-2, 0.5rem);
}

#node-article-form #edit-actions input[type="submit"],
#node-image-gallery-form #edit-actions input[type="submit"] {
  padding: 0.7rem 1.6rem;
}

/* ---------------------------------------------------------------------
   Responsive
   --------------------------------------------------------------------- */
@media (max-width: 768px) {
  #node-article-form > .js-form-wrapper,
  #node-article-form > .form-wrapper,
  #node-image-gallery-form > .js-form-wrapper,
  #node-image-gallery-form > .form-wrapper {
    padding: var(--spacing-5, 1.25rem);
  }

  #node-article-form select[multiple],
  #node-image-gallery-form select[multiple] {
    min-height: 120px;
  }
  #node-article-form input[type="submit"],
  #node-article-form button,
  #node-article-form .button,
  #node-image-gallery-form input[type="submit"],
  #node-image-gallery-form button,
  #node-image-gallery-form .button {
    font-size: var(--text-sm, 0.85rem);
    padding: 0.55rem 0.9rem;
  }
}

@media (max-width: 600px) {
  .region--content {
    padding: var(--spacing-3, 0.75rem);
    border-radius: var(--anui-radius-sm);
  }

  #node-article-form,
  #node-image-gallery-form {
    gap: var(--spacing-4, 1rem);
  }

  #node-article-form > .js-form-wrapper,
  #node-article-form > .form-wrapper,
  #node-image-gallery-form > .js-form-wrapper,
  #node-image-gallery-form > .form-wrapper {
    padding: var(--spacing-4, 1rem);
    border-radius: var(--anui-radius-sm);
  }

  #edit-title-wrapper input#edit-title-0-value {
    font-size: var(--text-lg, 1.1rem);
    padding: 0.7rem 0.85rem;
  }

  #node-article-form .form-checkboxes,
  #node-image-gallery-form .form-checkboxes {
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
  }

  #node-article-form .form-checkboxes .form-item,
  #node-article-form .form-checkboxes .js-form-item,
  #node-image-gallery-form .form-checkboxes .form-item,
  #node-image-gallery-form .form-checkboxes .js-form-item {
    border-radius: var(--anui-radius-sm);
  }

  #node-article-form table.field-multiple-table,
  #node-article-form table.field-multiple-table tbody,
  #node-article-form table.field-multiple-table tr,
  #node-image-gallery-form table.field-multiple-table,
  #node-image-gallery-form table.field-multiple-table tbody,
  #node-image-gallery-form table.field-multiple-table tr {
    display: block;
    width: 100%;
  }

  #node-article-form table.field-multiple-table thead,
  #node-image-gallery-form table.field-multiple-table thead {
    display: none;
  }

  #node-article-form table.field-multiple-table td,
  #node-image-gallery-form table.field-multiple-table td {
    display: block;
    width: 100%;
    padding: 0.3rem 0;
  }

  #node-article-form .image-widget.form-managed-file,
  #node-image-gallery-form .image-widget.form-managed-file {
    flex-direction: column;
    align-items: stretch;
  }

  .entity-content-form-footer {
    flex-direction: column;
    align-items: stretch;
  }

  #node-article-form select#edit-moderation-state-0-state,
  #node-image-gallery-form select#edit-moderation-state-0-state {
    width: 100%;
  }

  /* Sticky action bar so Save/Preview are always reachable */
  #node-article-form #edit-actions,
  #node-image-gallery-form #edit-actions {
    flex-direction: column;
    position: sticky;
    bottom: 0;
    background: var(--anui-surface);
    padding: var(--spacing-3, 0.75rem);
    margin: 0 calc(-1 * var(--spacing-4, 1rem)) calc(-1 * var(--spacing-4, 1rem));
    box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.06);
    border-top: 1px solid var(--anui-border);
  }

  #node-article-form #edit-actions input[type="submit"],
  #node-image-gallery-form #edit-actions input[type="submit"] {
    width: 100%;
  }
  #node-article-form input[type="submit"],
  #node-article-form button,
  #node-article-form .button,
  #node-image-gallery-form input[type="submit"],
  #node-image-gallery-form button,
  #node-image-gallery-form .button {
    width: 100%;
    min-height: 44px;
    font-size: var(--text-base, 0.95rem);
    padding: 0.7rem 1rem;
    white-space: normal;
  }
}

@media (min-width: 1200px) {
  #node-article-form,
  #node-image-gallery-form {
    max-width: 1040px;
  }
}


/* ==================================== btn style ========================================== */

/* ---------------------------------------------------------------------
   Wrapper article
   --------------------------------------------------------------------- */
.region--content article.contextual-region {
  font-family: var(--anui-font);
  color: var(--anui-text);
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius);
  box-shadow: var(--anui-shadow);
  padding: var(--spacing-6, 1.5rem);
  max-width: 640px;
  margin: 0 auto;
}

/* ---------------------------------------------------------------------
   Profile action buttons
   --------------------------------------------------------------------- */
.samoa-roles-dashboard__profile-actions {
  margin-bottom: var(--spacing-5, 1.25rem);
}

.samoa-roles-dashboard__profile-actions-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.samoa-roles-dashboard__profile-actions-links li {
  margin: 0;
}

.samoa-roles-dashboard__profile-actions-links a.button {
  display: inline-block;
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.9rem);
  font-weight: var(--font-medium, 600);
  text-decoration: none;
  border-radius: var(--anui-radius-sm);
  border: 1px solid var(--anui-border-strong);
  padding: 0.6rem 1.2rem;
  cursor: pointer;
  transition: background-color var(--anui-transition), border-color var(--anui-transition),
    color var(--anui-transition), transform 80ms ease;
}

.samoa-roles-dashboard__profile-actions-links a.button:active {
  transform: translateY(1px);
}

/* Primary action: Roles dashboard */
.samoa-roles-dashboard__profile-actions-links a.button--primary {
  background: var(--anui-primary);
  border-color: var(--anui-primary);
  color: #ffffff;
}

.samoa-roles-dashboard__profile-actions-links a.button--primary:hover {
  background: var(--anui-primary-hover);
  border-color: var(--anui-primary-hover);
}

/* Secondary action: Reporter / Writer panel */
.samoa-roles-dashboard__profile-actions-links a.button--small {
  background: var(--anui-surface);
  color: var(--anui-text);
  font-size: var(--text-xs, 0.82rem);
  padding: 0.55rem 1rem;
}

.samoa-roles-dashboard__profile-actions-links a.button--small:hover {
  background: var(--anui-bg);
  border-color: var(--anui-border-strong);
}

/* ---------------------------------------------------------------------
   "Member for" meta line
   --------------------------------------------------------------------- */
.region--content article.contextual-region .form-item- {
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
  padding-top: var(--spacing-4, 1rem);
  border-top: 1px solid var(--anui-border);
  margin: 0;
}

.region--content article.contextual-region .form-item- h4.label {
  font-size: var(--text-sm, 0.85rem);
  font-weight: var(--font-medium, 600);
  color: var(--anui-text-muted);
  margin: 0;
}

/* ---------------------------------------------------------------------
   Responsive
   --------------------------------------------------------------------- */
@media (max-width: 600px) {
  .region--content article.contextual-region {
    padding: var(--spacing-4, 1rem);
    border-radius: var(--anui-radius-sm);
  }

  .samoa-roles-dashboard__profile-actions-links {
    flex-direction: column;
    align-items: stretch;
  }

  .samoa-roles-dashboard__profile-actions-links a.button {
    text-align: center;
    width: 100%;
  }
}

/* =======================================================================
   ADMIN PEOPLE PAGE — /admin/people  (also applies to /admin/content)
   Selectors verified against real rendered HTML (Twig debug output).
   ======================================================================= */

/* ---------------------------------------------------------------------
   Page wrapper
   --------------------------------------------------------------------- */
.content-main {
  font-family: var(--anui-font);
  color: var(--anui-text);
}

/* ---------------------------------------------------------------------
   Local action button  (e.g. "Add user", "Add content")
   Real HTML: <a href="..." class="button button-action">
   --------------------------------------------------------------------- */
#block-samoanewsbootstrap-local-actions {
  background: transparent;
  padding: 0 0 var(--spacing-4, 1rem) 0;
  border-radius: 0;
}

#block-samoanewsbootstrap-local-actions ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

#block-samoanewsbootstrap-local-actions li {
  margin: 0;
  padding: 0;
}

#block-samoanewsbootstrap-local-actions a.button.button-action {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-surface);
  background: var(--anui-primary);
  border: 1px solid var(--anui-primary);
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 1.1rem;
  text-decoration: none;
  transition: background var(--anui-transition), border-color var(--anui-transition);
}

#block-samoanewsbootstrap-local-actions a.button.button-action:hover {
  background: var(--anui-primary-hover);
  border-color: var(--anui-primary-hover);
}

/* ---------------------------------------------------------------------
   Views wrapper block (system main)
   --------------------------------------------------------------------- */
#block-samoanewsbootstrap-seven-system-main {
  background: transparent;
  padding: 0;
  border-radius: 0;
}

/* ---------------------------------------------------------------------
   View outer containers — people & content views
   --------------------------------------------------------------------- */
.view--user-admin-people,
.view--content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4, 1rem);
}

/* ---------------------------------------------------------------------
   Exposed filter forms — people & content
   Real IDs: views-exposed-form-user-admin-people-page-1
             views-exposed-form-content-page-1
   --------------------------------------------------------------------- */
#views-exposed-form-user-admin-people-page-1,
#views-exposed-form-content-page-1 {
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius);
  box-shadow: var(--anui-shadow);
  padding: var(--spacing-5, 1.25rem) var(--spacing-6, 1.5rem);
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--spacing-4, 1rem);
}

#views-exposed-form-user-admin-people-page-1 .js-form-item,
#views-exposed-form-user-admin-people-page-1 .form-item,
#views-exposed-form-content-page-1 .js-form-item,
#views-exposed-form-content-page-1 .form-item {
  display: flex;
  flex-direction: column;
  flex: 1 1 160px;
  min-width: 0;
  margin: 0;
}

#views-exposed-form-user-admin-people-page-1 label,
#views-exposed-form-content-page-1 label {
  font-size: var(--text-xs, 0.75rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0.35rem;
}

#views-exposed-form-user-admin-people-page-1 input[type="text"],
#views-exposed-form-user-admin-people-page-1 select.form-select,
#views-exposed-form-content-page-1 input[type="text"],
#views-exposed-form-content-page-1 select.form-select {
  width: 100%;
  box-sizing: border-box;
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  color: var(--anui-text);
  background: var(--anui-surface);
  border: 1px solid var(--color-input, var(--anui-border));
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 0.75rem;
  transition: border-color var(--anui-transition), box-shadow var(--anui-transition);
}

#views-exposed-form-user-admin-people-page-1 input[type="text"]:focus,
#views-exposed-form-user-admin-people-page-1 select.form-select:focus,
#views-exposed-form-content-page-1 input[type="text"]:focus,
#views-exposed-form-content-page-1 select.form-select:focus {
  outline: none;
  border-color: var(--anui-ring);
  box-shadow: 0 0 0 3px var(--anui-primary-light);
}

#views-exposed-form-user-admin-people-page-1 input[type="text"]:hover,
#views-exposed-form-user-admin-people-page-1 select.form-select:hover,
#views-exposed-form-content-page-1 input[type="text"]:hover,
#views-exposed-form-content-page-1 select.form-select:hover {
  border-color: var(--anui-border-strong);
}

#views-exposed-form-user-admin-people-page-1 .form-actions,
#views-exposed-form-content-page-1 .form-actions {
  flex: 0 0 auto;
  margin: 0;
  display: flex;
  align-items: flex-end;
}

#views-exposed-form-user-admin-people-page-1 input[type="submit"],
#views-exposed-form-content-page-1 input[type="submit"] {
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-surface);
  background: var(--anui-primary);
  border: 1px solid var(--anui-primary);
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 1.2rem;
  cursor: pointer;
  transition: background var(--anui-transition), border-color var(--anui-transition);
  white-space: nowrap;
}

#views-exposed-form-user-admin-people-page-1 input[type="submit"]:hover,
#views-exposed-form-content-page-1 input[type="submit"]:hover {
  background: var(--anui-primary-hover);
  border-color: var(--anui-primary-hover);
}

/* ---------------------------------------------------------------------
   Bulk operations bar — Action select + "Apply to selected items"
   Real HTML: select#edit-action  +  input#edit-submit  inside
              .form-actions#edit-actions--2 at the bottom of the bulk form
   --------------------------------------------------------------------- */
#views-form-user-admin-people-page-1 select#edit-action,
#views-form-content-page-1 select#edit-action {
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  color: var(--anui-text);
  background: var(--anui-surface);
  border: 1px solid var(--color-input, var(--anui-border));
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 0.75rem;
  min-width: 220px;
  box-sizing: border-box;
  transition: border-color var(--anui-transition), box-shadow var(--anui-transition);
}

#views-form-user-admin-people-page-1 select#edit-action:focus,
#views-form-content-page-1 select#edit-action:focus {
  outline: none;
  border-color: var(--anui-ring);
  box-shadow: 0 0 0 3px var(--anui-primary-light);
}

#edit-actions--2 {
  margin-top: var(--spacing-3, 0.75rem);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--spacing-3, 0.75rem);
}

#edit-actions--2 input[type="submit"] {
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-surface);
  background: var(--anui-secondary);
  border: 1px solid var(--anui-secondary);
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 1.1rem;
  cursor: pointer;
  transition: background var(--anui-transition);
}

#edit-actions--2 input[type="submit"]:hover {
  background: var(--anui-secondary-hover);
  border-color: var(--anui-secondary-hover);
}

/* ---------------------------------------------------------------------
   Admin views table (people & content)
   --------------------------------------------------------------------- */
.view--user-admin-people table.responsive-enabled,
.view--content table.responsive-enabled {
  width: 100%;
  border-collapse: collapse;
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius);
  box-shadow: var(--anui-shadow);
  overflow: hidden;
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
}

.view--user-admin-people table.responsive-enabled thead tr,
.view--content table.responsive-enabled thead tr {
  background: var(--anui-bg);
  border-bottom: 2px solid var(--anui-border);
}

.view--user-admin-people table.responsive-enabled thead th,
.view--content table.responsive-enabled thead th {
  padding: 0.7rem 0.9rem;
  text-align: left;
  font-size: var(--text-xs, 0.75rem);
  font-weight: var(--font-bold, 700);
  color: var(--anui-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.view--user-admin-people table.responsive-enabled thead th a,
.view--content table.responsive-enabled thead th a {
  color: var(--anui-text-muted);
  text-decoration: none;
}

.view--user-admin-people table.responsive-enabled thead th a:hover,
.view--content table.responsive-enabled thead th a:hover {
  color: var(--anui-primary);
}

.view--user-admin-people table.responsive-enabled tbody tr,
.view--content table.responsive-enabled tbody tr {
  border-bottom: 1px solid var(--anui-border);
  transition: background var(--anui-transition);
}

.view--user-admin-people table.responsive-enabled tbody tr:last-child,
.view--content table.responsive-enabled tbody tr:last-child {
  border-bottom: none;
}

.view--user-admin-people table.responsive-enabled tbody tr:hover,
.view--content table.responsive-enabled tbody tr:hover {
  background: var(--anui-bg);
}

.view--user-admin-people table.responsive-enabled tbody td,
.view--content table.responsive-enabled tbody td {
  padding: 0.65rem 0.9rem;
  vertical-align: middle;
  color: var(--anui-text);
}

.view--user-admin-people table.responsive-enabled tbody td a,
.view--content table.responsive-enabled tbody td a {
  color: var(--anui-primary);
  text-decoration: none;
  font-weight: var(--font-medium, 500);
}

.view--user-admin-people table.responsive-enabled tbody td a:hover,
.view--content table.responsive-enabled tbody td a:hover {
  color: var(--anui-primary-hover);
  text-decoration: underline;
}

/* Checkbox bulk-form column */
.view--user-admin-people table.responsive-enabled .views-field-user-bulk-form,
.view--content table.responsive-enabled .views-field-node-bulk-form {
  width: 2.2rem;
  padding-left: 0.9rem;
}

.view--user-admin-people table.responsive-enabled input[type="checkbox"].form-checkbox,
.view--content table.responsive-enabled input[type="checkbox"].form-checkbox {
  width: 1rem;
  height: 1rem;
  cursor: pointer;
  accent-color: var(--anui-primary);
}

/* ---------------------------------------------------------------------
   Status column — people (Active / Blocked)
   --------------------------------------------------------------------- */
.view--user-admin-people tbody td.views-field-status,
.view--content tbody td.views-field-status {
  font-size: var(--text-xs, 0.72rem);
  font-weight: var(--font-bold, 700);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--anui-text-muted);
  white-space: nowrap;
}

/* ---------------------------------------------------------------------
   Roles / Member-for / Last-access columns
   --------------------------------------------------------------------- */
.view--user-admin-people tbody td.views-field-roles-target-id {
  font-size: var(--text-xs, 0.72rem);
  color: var(--anui-text-muted);
}

.view--user-admin-people tbody td.views-field-created,
.view--user-admin-people tbody td.views-field-access {
  font-size: var(--text-xs, 0.72rem);
  color: var(--anui-text-muted);
  white-space: nowrap;
}

/* ---------------------------------------------------------------------
   Content-type / Changed columns (content view)
   --------------------------------------------------------------------- */
.view--content .views-field-type {
  font-size: var(--text-xs, 0.75rem);
  color: var(--anui-text-muted);
  white-space: nowrap;
}

.view--content .views-field-changed time {
  font-size: var(--text-xs, 0.72rem);
  color: var(--anui-text-muted);
  white-space: nowrap;
}

/* Sort indicator */
.view--user-admin-people thead th .tablesort,
.view--content thead th .tablesort {
  display: inline-block;
  margin-left: 0.25rem;
  opacity: 0.5;
  font-size: 0.65rem;
}

/* ---------------------------------------------------------------------
   Dropbutton / Operations column
   --------------------------------------------------------------------- */
.view--user-admin-people .views-field-operations,
.view--content .views-field-operations {
  white-space: nowrap;
}

.view--user-admin-people .dropbutton-wrapper,
.view--content .dropbutton-wrapper {
  display: inline-flex;
}

.view--user-admin-people .dropbutton-widget,
.view--content .dropbutton-widget {
  position: relative;
  display: inline-flex;
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius-sm);
  overflow: visible;
  background: var(--anui-surface);
}

.view--user-admin-people .dropbutton .dropbutton-action > a,
.view--user-admin-people .dropbutton .dropbutton-action > button,
.view--content .dropbutton .dropbutton-action > a,
.view--content .dropbutton .dropbutton-action > button {
  display: inline-block;
  font-family: var(--anui-font);
  font-size: var(--text-xs, 0.78rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-text);
  background: var(--anui-surface);
  padding: 0.35rem 0.7rem;
  text-decoration: none;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--anui-transition), color var(--anui-transition);
}

.view--user-admin-people .dropbutton .dropbutton-action > a:hover,
.view--user-admin-people .dropbutton .dropbutton-action > button:hover,
.view--content .dropbutton .dropbutton-action > a:hover,
.view--content .dropbutton .dropbutton-action > button:hover {
  background: var(--anui-bg);
  color: var(--anui-primary);
}

.view--user-admin-people .dropbutton-toggle button,
.view--content .dropbutton-toggle button {
  background: var(--anui-bg);
  border: none;
  border-left: 1px solid var(--anui-border);
  padding: 0.35rem 0.55rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  transition: background var(--anui-transition);
}

.view--user-admin-people .dropbutton-toggle button:hover,
.view--content .dropbutton-toggle button:hover {
  background: var(--anui-border);
}

.view--user-admin-people .dropbutton .secondary-action > a,
.view--content .dropbutton .secondary-action > a {
  display: block;
  font-family: var(--anui-font);
  font-size: var(--text-xs, 0.78rem);
  color: var(--anui-text);
  background: var(--anui-surface);
  padding: 0.35rem 0.85rem;
  text-decoration: none;
  border-top: 1px solid var(--anui-border);
  white-space: nowrap;
  transition: background var(--anui-transition), color var(--anui-transition);
}

.view--user-admin-people .dropbutton .secondary-action > a:hover,
.view--content .dropbutton .secondary-action > a:hover {
  background: var(--anui-bg);
  color: var(--anui-primary);
}

/* ---------------------------------------------------------------------
   Pager  (shared — same Twig template for all views)
   --------------------------------------------------------------------- */
.view--user-admin-people .pager,
.view--content .pager {
  margin-top: var(--spacing-4, 1rem);
}

.view--user-admin-people .pager__items,
.view--content .pager__items {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
  justify-content: center;
}

.view--user-admin-people .pager__item a,
.view--user-admin-people .pager__item.is-active a,
.view--content .pager__item a,
.view--content .pager__item.is-active a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  padding: 0 0.55rem;
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-text);
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius-sm);
  text-decoration: none;
  transition: background var(--anui-transition), border-color var(--anui-transition), color var(--anui-transition);
}

.view--user-admin-people .pager__item a:hover,
.view--content .pager__item a:hover {
  background: var(--anui-bg);
  border-color: var(--anui-border-strong);
  color: var(--anui-primary);
}

.view--user-admin-people .pager__item.is-active a,
.view--content .pager__item.is-active a {
  background: var(--anui-primary);
  border-color: var(--anui-primary);
  color: var(--anui-surface);
  pointer-events: none;
}

.view--user-admin-people .pager__item--next a,
.view--user-admin-people .pager__item--last a,
.view--user-admin-people .pager__item--prev a,
.view--user-admin-people .pager__item--first a,
.view--content .pager__item--next a,
.view--content .pager__item--last a,
.view--content .pager__item--prev a,
.view--content .pager__item--first a {
  font-weight: var(--font-bold, 700);
  color: var(--anui-primary);
}

.view--user-admin-people .pager__item--ellipsis,
.view--content .pager__item--ellipsis {
  display: inline-flex;
  align-items: center;
  padding: 0 0.3rem;
  color: var(--anui-text-muted);
  font-size: var(--text-sm, 0.875rem);
}

/* ---------------------------------------------------------------------
   Hide tableresponsive toggle button (declutter)
   --------------------------------------------------------------------- */
.view--user-admin-people .tableresponsive-toggle-columns,
.view--content .tableresponsive-toggle-columns {
  display: none;
}

/* =======================================================================
   ADVERTISEMENT SUBMISSIONS PAGE — /user/{uid}/drafts
   Selectors verified against real rendered HTML (Twig debug output).
   ======================================================================= */

/* ---------------------------------------------------------------------
   View outer container
   --------------------------------------------------------------------- */
.view--advertisement-submissions {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4, 1rem);
}

/* ---------------------------------------------------------------------
   Bulk operations bar (top & bottom)
   --------------------------------------------------------------------- */
.view--advertisement-submissions #edit-node-bulk-form--2,
.view--advertisement-submissions #edit-node-bulk-form {
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius);
  box-shadow: var(--anui-shadow);
  padding: var(--spacing-4, 1rem) var(--spacing-5, 1.25rem);
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--spacing-4, 1rem);
}

.view--advertisement-submissions .js-form-item-action {
  display: flex;
  flex-direction: column;
  flex: 1 1 220px;
  min-width: 0;
  margin: 0;
}

.view--advertisement-submissions .js-form-item-action label {
  font-size: var(--text-xs, 0.75rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0.35rem;
}

.view--advertisement-submissions select#edit-action {
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  color: var(--anui-text);
  background: var(--anui-surface);
  border: 1px solid var(--color-input, var(--anui-border));
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 0.75rem;
  min-width: 200px;
  box-sizing: border-box;
  transition: border-color var(--anui-transition), box-shadow var(--anui-transition);
}

.view--advertisement-submissions select#edit-action:focus {
  outline: none;
  border-color: var(--anui-ring);
  box-shadow: 0 0 0 3px var(--anui-primary-light);
}

.view--advertisement-submissions #edit-actions--2,
.view--advertisement-submissions #edit-actions {
  margin: 0;
  display: flex;
  align-items: flex-end;
}

.view--advertisement-submissions #edit-actions--2 input[type="submit"],
.view--advertisement-submissions #edit-actions input[type="submit"] {
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-surface);
  background: var(--anui-primary);
  border: 1px solid var(--anui-primary);
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 1.2rem;
  cursor: pointer;
  transition: background var(--anui-transition), border-color var(--anui-transition);
  white-space: nowrap;
}

.view--advertisement-submissions #edit-actions--2 input[type="submit"]:hover,
.view--advertisement-submissions #edit-actions input[type="submit"]:hover {
  background: var(--anui-primary-hover);
  border-color: var(--anui-primary-hover);
}

/* ---------------------------------------------------------------------
   Submissions table
   --------------------------------------------------------------------- */
.view--advertisement-submissions table {
  width: 100%;
  border-collapse: collapse;
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius);
  box-shadow: var(--anui-shadow);
  overflow: hidden;
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
}

.view--advertisement-submissions table thead tr {
  background: var(--anui-bg);
  border-bottom: 2px solid var(--anui-border);
}

.view--advertisement-submissions table thead th {
  padding: 0.7rem 0.9rem;
  text-align: left;
  font-size: var(--text-xs, 0.75rem);
  font-weight: var(--font-bold, 700);
  color: var(--anui-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.view--advertisement-submissions table thead th a {
  color: var(--anui-text-muted);
  text-decoration: none;
}

.view--advertisement-submissions table thead th a:hover {
  color: var(--anui-primary);
}

.view--advertisement-submissions table tbody tr {
  border-bottom: 1px solid var(--anui-border);
  transition: background var(--anui-transition);
}

.view--advertisement-submissions table tbody tr:last-child {
  border-bottom: none;
}

.view--advertisement-submissions table tbody tr:hover {
  background: var(--anui-bg);
}

.view--advertisement-submissions table tbody td {
  padding: 0.65rem 0.9rem;
  vertical-align: middle;
  color: var(--anui-text);
}

/* Title link column */
.view--advertisement-submissions table tbody td.views-field-title a {
  color: var(--anui-primary);
  text-decoration: none;
  font-weight: var(--font-medium, 500);
}

.view--advertisement-submissions table tbody td.views-field-title a:hover {
  color: var(--anui-primary-hover);
  text-decoration: underline;
}

/* Name column */
.view--advertisement-submissions table tbody td.views-field-name {
  font-size: var(--text-sm, 0.875rem);
  color: var(--anui-text);
  white-space: nowrap;
}

/* Status column */
.view--advertisement-submissions table tbody td.views-field-status {
  font-size: var(--text-xs, 0.72rem);
  font-weight: var(--font-bold, 700);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--anui-text-muted);
  white-space: nowrap;
}

/* Ad Group column */
.view--advertisement-submissions table tbody td.views-field-field-ad-category {
  font-size: var(--text-xs, 0.78rem);
  color: var(--anui-text-muted);
}

/* Placement zone column */
.view--advertisement-submissions table tbody td.views-field-field-ad-placement {
  font-size: var(--text-xs, 0.78rem);
  color: var(--anui-text-muted);
  white-space: nowrap;
}

/* Checkbox bulk-form column */
.view--advertisement-submissions table .views-field-node-bulk-form {
  width: 2.2rem;
  padding-left: 0.9rem;
}

.view--advertisement-submissions table input[type="checkbox"].form-checkbox {
  width: 1rem;
  height: 1rem;
  cursor: pointer;
  accent-color: var(--anui-primary);
}

/* ---------------------------------------------------------------------
   Mini pager
   --------------------------------------------------------------------- */
.view--advertisement-submissions .js-pager__items {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 0.35rem;
  justify-content: flex-end;
}

.view--advertisement-submissions .js-pager__items li a,
.view--advertisement-submissions .js-pager__items li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  padding: 0 0.5rem;
  font-size: var(--text-sm, 0.875rem);
  font-weight: var(--font-medium, 500);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius-sm);
  background: var(--anui-surface);
  color: var(--anui-text);
  text-decoration: none;
  transition: background var(--anui-transition), border-color var(--anui-transition);
}

.view--advertisement-submissions .js-pager__items li a:hover {
  background: var(--anui-bg);
  border-color: var(--anui-border-strong);
}

.view--advertisement-submissions .js-pager__items li.is-active span,
.view--advertisement-submissions .js-pager__items li span:not([class]) {
  background: var(--anui-primary);
  border-color: var(--anui-primary);
  color: #ffffff;
}

/* ---------------------------------------------------------------------
   Responsive — advertisement submissions page
   --------------------------------------------------------------------- */
@media (max-width: 768px) {
  .view--advertisement-submissions table thead th.priority-low,
  .view--advertisement-submissions table tbody td.priority-low {
    display: none;
  }

  .view--advertisement-submissions table tbody td.views-field-field-ad-category,
  .view--advertisement-submissions table tbody td.views-field-field-ad-placement {
    display: none;
  }
}

/* =======================================================================
   IMAGE GALLERY SUBMISSIONS PAGE — /user/{uid}/image-gallery-submissions
   Selectors verified against real rendered HTML (Twig debug output).
   ======================================================================= */

/* ---------------------------------------------------------------------
   View outer container
   --------------------------------------------------------------------- */
.view--image-gallery-submissions {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4, 1rem);
}

/* ---------------------------------------------------------------------
   Bulk operations bar (top & bottom)
   --------------------------------------------------------------------- */
.view--image-gallery-submissions #edit-node-bulk-form--2,
.view--image-gallery-submissions #edit-node-bulk-form {
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius);
  box-shadow: var(--anui-shadow);
  padding: var(--spacing-4, 1rem) var(--spacing-5, 1.25rem);
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--spacing-4, 1rem);
}

.view--image-gallery-submissions .js-form-item-action {
  display: flex;
  flex-direction: column;
  flex: 1 1 220px;
  min-width: 0;
  margin: 0;
}

.view--image-gallery-submissions .js-form-item-action label {
  font-size: var(--text-xs, 0.75rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0.35rem;
}

.view--image-gallery-submissions select#edit-action {
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  color: var(--anui-text);
  background: var(--anui-surface);
  border: 1px solid var(--color-input, var(--anui-border));
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 0.75rem;
  min-width: 200px;
  box-sizing: border-box;
  transition: border-color var(--anui-transition), box-shadow var(--anui-transition);
}

.view--image-gallery-submissions select#edit-action:focus {
  outline: none;
  border-color: var(--anui-ring);
  box-shadow: 0 0 0 3px var(--anui-primary-light);
}

.view--image-gallery-submissions #edit-actions--2,
.view--image-gallery-submissions #edit-actions {
  margin: 0;
  display: flex;
  align-items: flex-end;
}

.view--image-gallery-submissions #edit-actions--2 input[type="submit"],
.view--image-gallery-submissions #edit-actions input[type="submit"] {
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-surface);
  background: var(--anui-primary);
  border: 1px solid var(--anui-primary);
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 1.2rem;
  cursor: pointer;
  transition: background var(--anui-transition), border-color var(--anui-transition);
  white-space: nowrap;
}

.view--image-gallery-submissions #edit-actions--2 input[type="submit"]:hover,
.view--image-gallery-submissions #edit-actions input[type="submit"]:hover {
  background: var(--anui-primary-hover);
  border-color: var(--anui-primary-hover);
}

/* ---------------------------------------------------------------------
   Submissions table
   --------------------------------------------------------------------- */
.view--image-gallery-submissions table {
  width: 100%;
  border-collapse: collapse;
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius);
  box-shadow: var(--anui-shadow);
  overflow: hidden;
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
}

.view--image-gallery-submissions table thead tr {
  background: var(--anui-bg);
  border-bottom: 2px solid var(--anui-border);
}

.view--image-gallery-submissions table thead th {
  padding: 0.7rem 0.9rem;
  text-align: left;
  font-size: var(--text-xs, 0.75rem);
  font-weight: var(--font-bold, 700);
  color: var(--anui-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.view--image-gallery-submissions table thead th a {
  color: var(--anui-text-muted);
  text-decoration: none;
}

.view--image-gallery-submissions table thead th a:hover {
  color: var(--anui-primary);
}

.view--image-gallery-submissions table tbody tr {
  border-bottom: 1px solid var(--anui-border);
  transition: background var(--anui-transition);
}

.view--image-gallery-submissions table tbody tr:last-child {
  border-bottom: none;
}

.view--image-gallery-submissions table tbody tr:hover {
  background: var(--anui-bg);
}

.view--image-gallery-submissions table tbody td {
  padding: 0.65rem 0.9rem;
  vertical-align: middle;
  color: var(--anui-text);
}

/* Title link column */
.view--image-gallery-submissions table tbody td.views-field-title a {
  color: var(--anui-primary);
  text-decoration: none;
  font-weight: var(--font-medium, 500);
}

.view--image-gallery-submissions table tbody td.views-field-title a:hover {
  color: var(--anui-primary-hover);
  text-decoration: underline;
}

/* Body column — preformatted text */
.view--image-gallery-submissions table tbody td.views-field-body {
  font-size: var(--text-xs, 0.78rem);
  color: var(--anui-text-muted);
  white-space: pre-line;
  line-height: 1.5;
  max-width: 360px;
}

/* Name column */
.view--image-gallery-submissions table tbody td.views-field-name {
  font-size: var(--text-sm, 0.875rem);
  color: var(--anui-text);
  white-space: nowrap;
}

/* Status column */
.view--image-gallery-submissions table tbody td.views-field-status {
  font-size: var(--text-xs, 0.72rem);
  font-weight: var(--font-bold, 700);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--anui-text-muted);
  white-space: nowrap;
}

/* Checkbox bulk-form column */
.view--image-gallery-submissions table .views-field-node-bulk-form {
  width: 2.2rem;
  padding-left: 0.9rem;
}

.view--image-gallery-submissions table input[type="checkbox"].form-checkbox {
  width: 1rem;
  height: 1rem;
  cursor: pointer;
  accent-color: var(--anui-primary);
}

/* ---------------------------------------------------------------------
   Responsive — image gallery submissions page
   --------------------------------------------------------------------- */
@media (max-width: 768px) {
  .view--image-gallery-submissions table thead th.priority-low,
  .view--image-gallery-submissions table tbody td.priority-low {
    display: none;
  }

  .view--image-gallery-submissions table tbody td.views-field-body {
    max-width: 200px;
  }
}

/* =======================================================================
   ADMIN MEDIA PAGE — /admin/content/media
   Selectors verified against real rendered HTML (Twig debug output).
   ======================================================================= */

/* ---------------------------------------------------------------------
   View outer container
   --------------------------------------------------------------------- */
.view--media {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4, 1rem);
}

/* ---------------------------------------------------------------------
   Exposed filter form
   Real ID: views-exposed-form-media-media-page-list
   --------------------------------------------------------------------- */
#views-exposed-form-media-media-page-list {
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius);
  box-shadow: var(--anui-shadow);
  padding: var(--spacing-5, 1.25rem) var(--spacing-6, 1.5rem);
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--spacing-4, 1rem);
}

#views-exposed-form-media-media-page-list .js-form-item,
#views-exposed-form-media-media-page-list .form-item {
  display: flex;
  flex-direction: column;
  flex: 1 1 160px;
  min-width: 0;
  margin: 0;
}

#views-exposed-form-media-media-page-list label {
  font-size: var(--text-xs, 0.75rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0.35rem;
}

#views-exposed-form-media-media-page-list input[type="text"],
#views-exposed-form-media-media-page-list select.form-select {
  width: 100%;
  box-sizing: border-box;
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  color: var(--anui-text);
  background: var(--anui-surface);
  border: 1px solid var(--color-input, var(--anui-border));
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 0.75rem;
  transition: border-color var(--anui-transition), box-shadow var(--anui-transition);
}

#views-exposed-form-media-media-page-list input[type="text"]:focus,
#views-exposed-form-media-media-page-list select.form-select:focus {
  outline: none;
  border-color: var(--anui-ring);
  box-shadow: 0 0 0 3px var(--anui-primary-light);
}

#views-exposed-form-media-media-page-list input[type="text"]:hover,
#views-exposed-form-media-media-page-list select.form-select:hover {
  border-color: var(--anui-border-strong);
}

#views-exposed-form-media-media-page-list .form-actions {
  flex: 0 0 auto;
  margin: 0;
  display: flex;
  align-items: flex-end;
}

#views-exposed-form-media-media-page-list input[type="submit"] {
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-surface);
  background: var(--anui-primary);
  border: 1px solid var(--anui-primary);
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 1.2rem;
  cursor: pointer;
  transition: background var(--anui-transition), border-color var(--anui-transition);
  white-space: nowrap;
}

#views-exposed-form-media-media-page-list input[type="submit"]:hover {
  background: var(--anui-primary-hover);
  border-color: var(--anui-primary-hover);
}

/* ---------------------------------------------------------------------
   Bulk operations bar
   --------------------------------------------------------------------- */
#views-form-media-media-page-list select#edit-action {
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  color: var(--anui-text);
  background: var(--anui-surface);
  border: 1px solid var(--color-input, var(--anui-border));
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 0.75rem;
  min-width: 220px;
  box-sizing: border-box;
  transition: border-color var(--anui-transition), box-shadow var(--anui-transition);
}

#views-form-media-media-page-list select#edit-action:focus {
  outline: none;
  border-color: var(--anui-ring);
  box-shadow: 0 0 0 3px var(--anui-primary-light);
}

/* ---------------------------------------------------------------------
   Media table
   --------------------------------------------------------------------- */
.view--media table {
  width: 100%;
  border-collapse: collapse;
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius);
  box-shadow: var(--anui-shadow);
  overflow: hidden;
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
}

.view--media table thead tr {
  background: var(--anui-bg);
  border-bottom: 2px solid var(--anui-border);
}

.view--media table thead th {
  padding: 0.7rem 0.9rem;
  text-align: left;
  font-size: var(--text-xs, 0.75rem);
  font-weight: var(--font-bold, 700);
  color: var(--anui-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.view--media table thead th a {
  color: var(--anui-text-muted);
  text-decoration: none;
}

.view--media table thead th a:hover {
  color: var(--anui-primary);
}

.view--media table tbody tr {
  border-bottom: 1px solid var(--anui-border);
  transition: background var(--anui-transition);
}

.view--media table tbody tr:last-child {
  border-bottom: none;
}

.view--media table tbody tr:hover {
  background: var(--anui-bg);
}

.view--media table tbody td {
  padding: 0.65rem 0.9rem;
  vertical-align: middle;
  color: var(--anui-text);
}

.view--media table tbody td a {
  color: var(--anui-primary);
  text-decoration: none;
  font-weight: var(--font-medium, 500);
}

.view--media table tbody td a:hover {
  color: var(--anui-primary-hover);
  text-decoration: underline;
}

/* Empty state */
.view--media table tbody td.views-empty {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--anui-text-muted);
  font-style: italic;
}

/* Thumbnail column */
.view--media table .views-field-thumbnail__target-id {
  width: 80px;
}

.view--media table .views-field-thumbnail__target-id img {
  display: block;
  width: 60px;
  height: 45px;
  object-fit: cover;
  border-radius: var(--anui-radius-sm);
  border: 1px solid var(--anui-border);
}

/* Checkbox bulk-form column */
.view--media table .views-field-media-bulk-form {
  width: 2.2rem;
  padding-left: 0.9rem;
}

.view--media table input[type="checkbox"].form-checkbox {
  width: 1rem;
  height: 1rem;
  cursor: pointer;
  accent-color: var(--anui-primary);
}

/* Status column */
.view--media table tbody td.views-field-status {
  font-size: var(--text-xs, 0.72rem);
  font-weight: var(--font-bold, 700);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--anui-text-muted);
  white-space: nowrap;
}

/* Updated column */
.view--media table tbody td.views-field-changed time {
  font-size: var(--text-xs, 0.72rem);
  color: var(--anui-text-muted);
  white-space: nowrap;
}

/* Type column */
.view--media table tbody td.views-field-bundle {
  font-size: var(--text-xs, 0.75rem);
  color: var(--anui-text-muted);
  white-space: nowrap;
}

/* Sort indicator */
.view--media thead th .tablesort {
  display: inline-block;
  margin-left: 0.25rem;
  opacity: 0.5;
  font-size: 0.65rem;
}

/* ---------------------------------------------------------------------
   Dropbutton / Operations column
   --------------------------------------------------------------------- */
.view--media .views-field-operations {
  white-space: nowrap;
}

.view--media .dropbutton-wrapper {
  display: inline-flex;
}

.view--media .dropbutton-widget {
  position: relative;
  display: inline-flex;
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius-sm);
  overflow: visible;
  background: var(--anui-surface);
}

.view--media .dropbutton .dropbutton-action > a,
.view--media .dropbutton .dropbutton-action > button {
  display: inline-block;
  font-family: var(--anui-font);
  font-size: var(--text-xs, 0.78rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-text);
  background: var(--anui-surface);
  padding: 0.35rem 0.7rem;
  text-decoration: none;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--anui-transition), color var(--anui-transition);
}

.view--media .dropbutton .dropbutton-action > a:hover,
.view--media .dropbutton .dropbutton-action > button:hover {
  background: var(--anui-bg);
  color: var(--anui-primary);
}

.view--media .dropbutton-toggle button {
  background: var(--anui-bg);
  border: none;
  border-left: 1px solid var(--anui-border);
  padding: 0.35rem 0.55rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  transition: background var(--anui-transition);
}

.view--media .dropbutton-toggle button:hover {
  background: var(--anui-border);
}

.view--media .dropbutton .secondary-action > a {
  display: block;
  font-family: var(--anui-font);
  font-size: var(--text-xs, 0.78rem);
  color: var(--anui-text);
  background: var(--anui-surface);
  padding: 0.35rem 0.85rem;
  text-decoration: none;
  border-top: 1px solid var(--anui-border);
  white-space: nowrap;
  transition: background var(--anui-transition), color var(--anui-transition);
}

.view--media .dropbutton .secondary-action > a:hover {
  background: var(--anui-bg);
  color: var(--anui-primary);
}

/* ---------------------------------------------------------------------
   Hide tableresponsive toggle
   --------------------------------------------------------------------- */
.view--media .tableresponsive-toggle-columns {
  display: none;
}

/* ---------------------------------------------------------------------
   Responsive — media page
   --------------------------------------------------------------------- */
@media (max-width: 768px) {
  #views-exposed-form-media-media-page-list {
    flex-direction: column;
    gap: var(--spacing-3, 0.75rem);
  }

  #views-exposed-form-media-media-page-list .js-form-item,
  #views-exposed-form-media-media-page-list .form-item {
    flex: 1 1 100%;
  }

  .view--media table thead th.priority-low,
  .view--media table tbody td.priority-low {
    display: none;
  }
}

/* =======================================================================
   TAXONOMY VOCABULARIES PAGE — /admin/structure/taxonomy
   Selectors verified against real rendered HTML (Twig debug output).
   ======================================================================= */

/* ---------------------------------------------------------------------
   Taxonomy table wrapper
   --------------------------------------------------------------------- */
#taxonomy-overview-vocabularies {
  font-family: var(--anui-font);
  color: var(--anui-text);
}

/* ---------------------------------------------------------------------
   tabledrag weight toggle & tableresponsive toggle — hide clutter
   --------------------------------------------------------------------- */
#taxonomy-overview-vocabularies .tabledrag-toggle-weight-wrapper,
#taxonomy-overview-vocabularies .tableresponsive-toggle-columns {
  display: none;
}

/* ---------------------------------------------------------------------
   Vocabulary table
   --------------------------------------------------------------------- */
#taxonomy table#taxonomy {
  width: 100%;
  border-collapse: collapse;
  background: var(--anui-surface);
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius);
  box-shadow: var(--anui-shadow);
  overflow: hidden;
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
}

#taxonomy table#taxonomy thead tr {
  background: var(--anui-bg);
  border-bottom: 2px solid var(--anui-border);
}

#taxonomy table#taxonomy thead th {
  padding: 0.7rem 0.9rem;
  text-align: left;
  font-size: var(--text-xs, 0.75rem);
  font-weight: var(--font-bold, 700);
  color: var(--anui-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

#taxonomy table#taxonomy tbody tr {
  border-bottom: 1px solid var(--anui-border);
  transition: background var(--anui-transition);
}

#taxonomy table#taxonomy tbody tr:last-child {
  border-bottom: none;
}

#taxonomy table#taxonomy tbody tr:hover {
  background: var(--anui-bg);
}

#taxonomy table#taxonomy tbody td {
  padding: 0.65rem 0.9rem;
  vertical-align: middle;
  color: var(--anui-text);
}

/* Vocabulary name — first column with drag handle */
#taxonomy table#taxonomy tbody td:first-child {
  font-weight: var(--font-medium, 500);
}

#taxonomy table#taxonomy tbody td:first-child a.tabledrag-handle {
  margin-right: 0.5rem;
  opacity: 0.4;
  transition: opacity var(--anui-transition);
}

#taxonomy table#taxonomy tbody td:first-child a.tabledrag-handle:hover {
  opacity: 1;
}

/* Description column */
#taxonomy table#taxonomy tbody td:nth-child(2) {
  font-size: var(--text-sm, 0.875rem);
  color: var(--anui-text-muted);
  max-width: 480px;
}

#taxonomy table#taxonomy tbody td:nth-child(2) a {
  color: var(--anui-primary);
  text-decoration: none;
}

#taxonomy table#taxonomy tbody td:nth-child(2) a:hover {
  color: var(--anui-primary-hover);
  text-decoration: underline;
}

/* ---------------------------------------------------------------------
   Dropbutton / Operations column
   --------------------------------------------------------------------- */
#taxonomy-overview-vocabularies .dropbutton-wrapper {
  display: inline-flex;
}

#taxonomy-overview-vocabularies .dropbutton-widget {
  position: relative;
  display: inline-flex;
  border: 1px solid var(--anui-border);
  border-radius: var(--anui-radius-sm);
  overflow: visible;
  background: var(--anui-surface);
}

#taxonomy-overview-vocabularies .dropbutton .dropbutton-action > a,
#taxonomy-overview-vocabularies .dropbutton .dropbutton-action > button {
  display: inline-block;
  font-family: var(--anui-font);
  font-size: var(--text-xs, 0.78rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-text);
  background: var(--anui-surface);
  padding: 0.35rem 0.7rem;
  text-decoration: none;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--anui-transition), color var(--anui-transition);
}

#taxonomy-overview-vocabularies .dropbutton .dropbutton-action > a:hover,
#taxonomy-overview-vocabularies .dropbutton .dropbutton-action > button:hover {
  background: var(--anui-bg);
  color: var(--anui-primary);
}

#taxonomy-overview-vocabularies .dropbutton-toggle button {
  background: var(--anui-bg);
  border: none;
  border-left: 1px solid var(--anui-border);
  padding: 0.35rem 0.55rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  transition: background var(--anui-transition);
}

#taxonomy-overview-vocabularies .dropbutton-toggle button:hover {
  background: var(--anui-border);
}

#taxonomy-overview-vocabularies .dropbutton .secondary-action > a {
  display: block;
  font-family: var(--anui-font);
  font-size: var(--text-xs, 0.78rem);
  color: var(--anui-text);
  background: var(--anui-surface);
  padding: 0.35rem 0.85rem;
  text-decoration: none;
  border-top: 1px solid var(--anui-border);
  white-space: nowrap;
  transition: background var(--anui-transition), color var(--anui-transition);
}

#taxonomy-overview-vocabularies .dropbutton .secondary-action > a:hover {
  background: var(--anui-bg);
  color: var(--anui-primary);
}

/* ---------------------------------------------------------------------
   Save button
   --------------------------------------------------------------------- */
#taxonomy-overview-vocabularies #edit-actions {
  margin-top: var(--spacing-4, 1rem);
}

#taxonomy-overview-vocabularies #edit-actions input[type="submit"] {
  font-family: var(--anui-font);
  font-size: var(--text-sm, 0.875rem);
  font-weight: var(--font-medium, 500);
  color: var(--anui-surface);
  background: var(--anui-primary);
  border: 1px solid var(--anui-primary);
  border-radius: var(--anui-radius-sm);
  padding: 0.5rem 1.4rem;
  cursor: pointer;
  transition: background var(--anui-transition), border-color var(--anui-transition);
}

#taxonomy-overview-vocabularies #edit-actions input[type="submit"]:hover {
  background: var(--anui-primary-hover);
  border-color: var(--anui-primary-hover);
}

/* ---------------------------------------------------------------------
   Responsive — taxonomy page
   --------------------------------------------------------------------- */
@media (max-width: 768px) {
  #taxonomy table#taxonomy tbody td:nth-child(2) {
    display: none;
  }
}

/* ---------------------------------------------------------------------
   Responsive — admin people / content pages
   --------------------------------------------------------------------- */
@media (max-width: 768px) {
  #views-exposed-form-user-admin-people-page-1,
  #views-exposed-form-content-page-1 {
    flex-direction: column;
    gap: var(--spacing-3, 0.75rem);
  }

  #views-exposed-form-user-admin-people-page-1 .js-form-item,
  #views-exposed-form-user-admin-people-page-1 .form-item,
  #views-exposed-form-content-page-1 .js-form-item,
  #views-exposed-form-content-page-1 .form-item {
    flex: 1 1 100%;
  }

  .view--user-admin-people table.responsive-enabled thead th.priority-low,
  .view--user-admin-people table.responsive-enabled tbody td.priority-low,
  .view--content table.responsive-enabled thead th.priority-low,
  .view--content table.responsive-enabled tbody td.priority-low {
    display: none;
  }
}