/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Shared app shell: tables own their overflow; forms and headings use one width. */
.admin-shell { width: 100%; max-width: 72rem; margin-inline: auto; min-width: 0; }
.admin-shell > div, .admin-shell > turbo-frame { max-width: 100%; min-width: 0; }
.admin-page form, .admin-page input, .admin-page select, .admin-page textarea { max-width: 100%; min-width: 0; }
.admin-table-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.admin-table-scroll pre { max-width: 30rem; }
.btn-primary { background: #047857; color: white; }
.btn-primary:hover { background: #065f46; }
.btn-secondary { border: 1px solid #e5e7eb; background: white; color: #374151; }
.skip-content { position: fixed; top: -5rem; left: 1rem; z-index: 100; padding: .75rem; background: white; color: #065f46; }
.skip-content:focus { top: 1rem; }
@media (max-width: 639px) {
  .admin-page .flex { flex-wrap: wrap; }
  .admin-page .whitespace-nowrap { white-space: normal; }
  .admin-page table[data-mobile-stack] { display: block; min-width: 0; }
  .admin-page table[data-mobile-stack] thead { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; }
  .admin-page table[data-mobile-stack] tbody, .admin-page table[data-mobile-stack] tr { display: block; width: 100%; }
  .admin-page table[data-mobile-stack] td { display: block; text-align: left; padding: .5rem .75rem; overflow-wrap: anywhere; }
  .admin-page table[data-mobile-stack] td[data-label]::before { content: attr(data-label) ": "; display: inline; font-weight: 600; color: #4b5563; }
  .admin-page table[data-mobile-stack] td[data-label=""]::before { content: none; }
}
.admin-page .btn-primary { background-color: #047857; color: #fff; }
.admin-page .btn-primary:hover { background-color: #065f46; }
.admin-page .btn-primary:disabled { opacity: .5; cursor: not-allowed; }

/* Keep closed disclosure controls out of layout and hit testing, including flex children. */
.admin-page details:not([open]) > :not(summary) { display: none !important; }