/* ============================================================
   STOCKISIMO WMS — Unified Modern Admin CSS
   Version: 3.0 — Single source of truth
   Loads on EVERY admin page via base_site.html
   Per-page CSS files emptied — everything lives here.
   ============================================================ */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   1. DESIGN TOKENS
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
:root {
  --adm-bg:           #f4f5f7;
  --adm-card:         #ffffff;
  --adm-border:       #e2e5ea;
  --adm-fg:           #111827;
  --adm-fg-soft:      #374151;
  --adm-muted:        #6b7280;
  --adm-primary:      #18181b;
  --adm-primary-fg:   #ffffff;
  --adm-accent:       #ebc808;
  --adm-accent-soft:  rgba(235,200,8,.12);
  --adm-success:      #16a34a;
  --adm-danger:       #dc2626;
  --adm-warning:      #f59e0b;
  --adm-radius:       12px;
  --adm-radius-sm:    8px;
  --adm-shadow:       0 1px 4px rgba(0,0,0,.06), 0 0 0 1px rgba(0,0,0,.04);
  --adm-shadow-lg:    0 8px 24px rgba(0,0,0,.10);
  --adm-transition:   0.18s cubic-bezier(.22,1,.36,1);
  --dd-duration:      .28s;
  --dd-ease:          cubic-bezier(.22,1,.36,1);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   2. GLOBAL ANIMATIONS
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@keyframes fadeInUp {
  from { opacity:0; transform:translateY(16px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes fadeIn {
  from { opacity:0; } to { opacity:1; }
}
@keyframes slideInLeft {
  from { opacity:0; transform:translateX(-12px); }
  to   { opacity:1; transform:translateX(0); }
}
@keyframes scaleIn {
  from { opacity:0; transform:scale(.96); }
  to   { opacity:1; transform:scale(1); }
}
@keyframes dd-fade-in {
  from { opacity:0; transform:translateY(-6px) scale(.98); }
  to   { opacity:1; transform:translateY(0) scale(1); }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   3. PAGE & LAYOUT
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
body { background: var(--adm-bg) !important; color: #374151 !important; }
#content-main { animation: fadeInUp .45s cubic-bezier(.22,1,.36,1) both; }
#content      { animation: fadeIn .35s ease both; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   4. HEADER
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#header {
  background: #18181b !important;
  border-bottom: 1px solid #27272a !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.18) !important;
}
#header a,
#header #user-tools,
#header #user-tools a,
#branding h1,
#branding h1 a {
  color: #fff !important;
  transition: color var(--adm-transition) !important;
}
#header a:hover,
#header #user-tools a:hover { color: var(--adm-accent) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   5. DROPDOWNS & SELECT2 (from modern_base_site.css)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.select2-dropdown {
  transform-origin: top center;
  animation: dd-fade-in var(--dd-duration) var(--dd-ease);
  transition: opacity var(--dd-duration) var(--dd-ease), transform var(--dd-duration) var(--dd-ease);
}
.select2-results__option {
  transition: background-color .12s ease, color .12s ease;
}
.sidebar-popup-container,
.related-popup-container {
  transform-origin: top left;
  animation: dd-fade-in .26s var(--dd-ease);
}
.theme-chooser,
.changeform-tabs,
.jet-tabs,
.module .tabs {
  transition: opacity var(--dd-duration) var(--dd-ease), transform var(--dd-duration) var(--dd-ease);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   6. CARDS / MODULES
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.module,
.inline-group {
  background: var(--adm-card) !important;
  border: 1px solid var(--adm-border) !important;
  border-radius: var(--adm-radius) !important;
  box-shadow: var(--adm-shadow) !important;
  overflow: hidden;
  animation: scaleIn .3s cubic-bezier(.22,1,.36,1) both;
  transition: box-shadow var(--adm-transition);
}
.module:hover { box-shadow: var(--adm-shadow-lg) !important; }
.module h2,
.inline-group h2,
.grp-group h2 {
  background-color: rgb(255 255 255 / 0%) !important;
  color: inherit !important;
  text-transform: none;
  letter-spacing: .01em;
  font-size: 15px !important;
  font-weight: 600;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 16px !important;
  border-radius: 0 !important;
  margin: 0 !important;
  border: 0 !important;
}
.inline-group { border: 1px solid var(--adm-border) !important; border-radius: var(--adm-radius) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   7. TABLES — CHANGELISTS (all models)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
body.change-list #content-main > #changelist,
body.change-list #content-main .module#changelist {
  background: var(--adm-card);
  border: 1px solid var(--adm-border);
  border-radius: var(--adm-radius);
  box-shadow: var(--adm-shadow);
  overflow: hidden;
  animation: fadeInUp .4s cubic-bezier(.22,1,.36,1) both;
}
#result_list thead th,
.results table thead th,
#rp-table-card table thead th,
#rp-table-card table thead td,
#card_table thead th {
  background: #f8f9fa !important;
  color: #64748b !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 12px 16px !important;
  border: none !important;
  border-bottom: 1px solid #e5e7eb !important;
  position: sticky;
  top: 0;
  z-index: 2;
}
#result_list thead th a,
.results table thead th a,
#rp-table-card table thead th a { color: #64748b !important; }
#result_list thead th a:hover,
.results table thead th a:hover,
#rp-table-card table thead th a:hover { color: #18181b !important; }

/* Authentication > Users: slightly wider Username column */
body.app-authentication.model-user.change-list #result_list th.column-username,
body.app-authentication.model-user.change-list #result_list td.field-username,
body.app-authentication.model-user.change-list .results table th.column-username,
body.app-authentication.model-user.change-list .results table td.field-username {
  min-width: 170px !important;
}

#result_list tbody tr,
.results table tbody tr { transition: background var(--adm-transition); }
#result_list tbody tr:hover,
.results table tbody tr:hover { background: #f8f9fa !important; }
#result_list tbody tr:nth-child(even),
.results table tbody tr:nth-child(even) { background: #fafafa; }

#result_list tbody td,
.results table tbody td,
#card_table tbody td {
  border-bottom: 1px solid #f1f3f5 !important;
  font-size: 12.5px !important;
  color: var(--adm-fg);
  padding: 8px 10px !important;
  vertical-align: middle;
}
#card_table tbody tr:hover { background: #f6f7f9 !important; }

/* Staggered row fade-in */
#result_list tbody tr { animation: fadeIn .25s ease both; }
#result_list tbody tr:nth-child(1)  { animation-delay:.03s; }
#result_list tbody tr:nth-child(2)  { animation-delay:.06s; }
#result_list tbody tr:nth-child(3)  { animation-delay:.09s; }
#result_list tbody tr:nth-child(4)  { animation-delay:.12s; }
#result_list tbody tr:nth-child(5)  { animation-delay:.15s; }
#result_list tbody tr:nth-child(6)  { animation-delay:.18s; }
#result_list tbody tr:nth-child(7)  { animation-delay:.21s; }
#result_list tbody tr:nth-child(8)  { animation-delay:.24s; }
#result_list tbody tr:nth-child(9)  { animation-delay:.27s; }
#result_list tbody tr:nth-child(10) { animation-delay:.30s; }

/* Results overflow scroll */
body.change-list #changelist .results,
#rp-table-card .results {
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   8. BUTTONS & OBJECT TOOLS
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.object-tools a,
.object-tools .addlink,
.object-tools .changelink {
  background: #FFD700 !important;
  border: 1px solid #FFD700 !important;
  color: #18181b !important;
  border-radius: var(--adm-radius-sm) !important;
  font-weight: 700 !important;
  padding: 7px 14px !important;
  transition: background var(--adm-transition), transform var(--adm-transition), box-shadow var(--adm-transition) !important;
  text-decoration: none;
}
.object-tools a:hover {
  background: #2d2d30 !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,.2) !important;
}
input[type=submit], button[type=submit], .button {
  border-radius: var(--adm-radius-sm) !important;
  font-weight: 600 !important;
  transition: transform var(--adm-transition), box-shadow var(--adm-transition) !important;
  cursor: pointer;
}
input[type=submit]:hover, button[type=submit]:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(0,0,0,.15) !important;
}
.submit-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  background: #fafbfc !important;
  border: 1px solid var(--adm-border) !important;
  border-radius: var(--adm-radius-sm) !important;
  padding: 10px 12px !important;
  animation: fadeIn .3s ease both;
}
.submit-row input,
.submit-row a,
.submit-row button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 32px !important;
  padding: 0 14px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  cursor: pointer !important;
  vertical-align: middle !important;
}
/* Primary submit — black */
.submit-row input[type=submit],
.submit-row .grp-button,
.submit-row .grp-default {
  background: #FFD700 !important;
  color: #18181b !important;
  border: 1.5px solid #FFD700 !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.18) !important;
}
.submit-row input[type=submit]:hover,
.submit-row .grp-button:hover {
  background: #e5c200 !important;
}
/* Cancel link — outlined */
.submit-row a.cancel-link,
.submit-row a.closelink {
  background: #fff !important;
  color: #374151 !important;
  border: 1.5px solid #e5e7eb !important;
  box-shadow: none !important;
}
.submit-row a.cancel-link:hover,
.submit-row a.closelink:hover {
  background: #f9fafb !important;
  border-color: #d1d5db !important;
}
/* Delete link — red */
.submit-row a.deletelink {
  background: #fee2e2 !important;
  color: #dc2626 !important;
  border: 1.5px solid #fca5a5 !important;
}
.submit-row a.deletelink:hover {
  background: #fecaca !important;
}
/* Actions bar buttons bold */
.actions .button, .actions button,
.actions input[type="submit"], .actions input[type="button"],
#changelist-form .actions .button,
#rp-table-card .actions .button { font-weight: 700 !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   9. FORMS & INPUTS
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
input[type=text], input[type=email], input[type=password],
input[type=number], input[type=url], input[type=search],
select, textarea {
  border: 1px solid var(--adm-border) !important;
  border-radius: var(--adm-radius-sm) !important;
  padding: 7px 10px !important;
  font-size: 13px !important;
  min-height: 34px;
  transition: border-color var(--adm-transition), box-shadow var(--adm-transition) !important;
}
input:focus, select:focus, textarea:focus {
  border-color: #18181b !important;
  box-shadow: 0 0 0 3px rgba(24,24,27,.1) !important;
  outline: none !important;
}
.form-row {
  padding: 8px 10px !important;
  border-bottom: 1px solid #f1f3f5 !important;
}
.form-row:last-child { border-bottom: 0 !important; }
.form-row label {
  color: var(--adm-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
/* Change-form wrappers */
body.change-form #content-main > form,
body.change-form #content-main > .module,
body.change-form #content-main > .inline-group {
  background: var(--adm-card);
  border: 1px solid var(--adm-border);
  border-radius: var(--adm-radius);
  box-shadow: var(--adm-shadow);
}
/* Tabs */
.changeform-tabs, .jet-tabs, .module .tabs {
  background: #18181b !important;
  border-radius: var(--adm-radius-sm);
  padding: 4px !important;
  border: 1px solid #27272a !important;
}
.changeform-tabs a, .changeform-tabs-item a,
.jet-tabs a, .module .tabs a { color: #fff !important; }
.changeform-tabs a:hover, .changeform-tabs-item a:hover,
.jet-tabs a:hover, .module .tabs a:hover {
  color: #e5e7eb !important;
  background: rgba(255,255,255,.08) !important;
  border-radius: 6px;
}
/* Inline tabular tables */
.inline-group .tabular { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   10. SEARCH & FILTER
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* ── Modern changelist search toolbar ── */
#changelist-search {
  background: var(--adm-card) !important;
  border: 1px solid var(--adm-border) !important;
  border-radius: var(--adm-radius) !important;
  box-shadow: var(--adm-shadow) !important;
  padding: 10px 12px !important;
  margin-bottom: 10px !important;
}
#changelist-search > div {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}
/* Icon label */
#changelist-search label[for=searchbar] {
  display: inline-flex !important;
  align-items: center !important;
  flex-shrink: 0;
  opacity: 0.4;
}
#changelist-search label[for=searchbar] img {
  width: 15px !important;
  height: 15px !important;
  display: block;
}
/* Search input */
#changelist-search #searchbar,
#changelist-search input[type=text] {
  height: 32px !important;
  min-width: 180px !important;
  flex: 1 1 180px;
  border: 1px solid var(--adm-border) !important;
  border-radius: 8px !important;
  padding: 0 10px !important;
  font-size: 12px !important;
  background: var(--adm-bg) !important;
  color: var(--adm-fg) !important;
  transition: border-color var(--adm-transition), box-shadow var(--adm-transition) !important;
  min-height: unset !important;
}
#changelist-search input[type=text]:focus,
#changelist-search #searchbar:focus {
  border-color: #18181b !important;
  box-shadow: 0 0 0 3px rgba(24,24,27,.08) !important;
  background: #fff !important;
  outline: none !important;
}
/* Filter select wrappers */
#changelist-search .changelist-filter-select-wrapper {
  display: inline-flex !important;
  align-items: center !important;
}
/* Select2 pill overrides */
#changelist-search .select2-container--jet .select2-selection--single {
  height: 30px !important;
  border: 1px solid var(--adm-border) !important;
  border-radius: 20px !important;
  background: var(--adm-bg) !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 26px 0 10px !important;
  box-sizing: border-box;
  transition: border-color var(--adm-transition) !important;
}
#changelist-search .select2-container--jet .select2-selection--single:hover {
  border-color: #18181b !important;
}
#changelist-search .select2-container--jet .select2-selection__rendered {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--adm-fg) !important;
  line-height: 30px !important;
  padding: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#changelist-search .select2-container--jet .select2-selection__arrow {
  right: 6px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  height: auto !important;
}
/* Submit button */
#changelist-search input[type=submit] {
  height: 32px !important;
  padding: 0 14px !important;
  background: #FFD700 !important;
  color: #18181b !important;
  border: none !important;
  border-radius: 8px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  letter-spacing: .04em !important;
  flex-shrink: 0 !important;
  min-height: unset !important;
  transition: background var(--adm-transition) !important;
}
#changelist-search input[type=submit]:hover {
  background: #e5c200 !important;
}
#changelist-filter {
  background: var(--adm-card) !important;
  border: 1px solid var(--adm-border) !important;
  border-radius: var(--adm-radius) !important;
  box-shadow: var(--adm-shadow) !important;
  overflow: hidden;
  animation: slideInLeft .35s ease both;
}
#changelist-filter h2 {
  background: #18181b !important;
  color: #fff !important;
  padding: 10px 14px !important;
  font-size: 11px !important;
  text-transform: uppercase;
  letter-spacing: .06em;
}
#changelist-filter h3 {
  font-size: 11px !important;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--adm-muted) !important;
  padding: 8px 14px 4px !important;
}
#changelist-filter li a {
  display: block;
  padding: 3px 14px !important;
  font-size: 12.5px !important;
  transition: color var(--adm-transition), padding-left var(--adm-transition) !important;
}
#changelist-filter li a:hover { color: #18181b !important; padding-left: 18px !important; }
#changelist-filter li.selected a { font-weight: 700 !important; color: #18181b !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   11. BREADCRUMBS
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.breadcrumbs {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  padding: 7px 14px !important;
  color: var(--adm-muted) !important;
  background: var(--adm-card) !important;
  border-bottom: 1px solid var(--adm-border) !important;
  animation: slideInLeft .3s ease both;
}
.breadcrumbs a {
  color: var(--adm-muted) !important;
  text-decoration: none !important;
  padding: 2px 7px !important;
  border-radius: 6px !important;
  transition: background var(--adm-transition), color var(--adm-transition) !important;
}
.breadcrumbs a:hover {
  background: var(--adm-bg) !important;
  color: var(--adm-fg) !important;
}
/* Current page — last text node */
.breadcrumbs > *:last-child {
  color: var(--adm-fg) !important;
  font-weight: 600 !important;
}
/* Separator arrow */
.breadcrumbs .breadcrumbs-separator,
.breadcrumbs-separator {
  color: #d1d5db !important;
  font-size: 10px !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   12. PAGINATOR
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.paginator {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  flex-wrap: wrap !important;
  padding: 8px 12px !important;
  background: var(--adm-card) !important;
  border-top: 1px solid var(--adm-border) !important;
}
.paginator a, .paginator .this-page {
  border-radius: 6px !important;
  padding: 4px 10px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  transition: background var(--adm-transition) !important;
  text-decoration: none !important;
}
.paginator a:hover { background: var(--adm-muted) !important; color: #fff !important; }
.paginator .this-page { background: #18181b !important; color: #fff !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   13. MESSAGES / ALERTS
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.messagelist li {
  border-radius: var(--adm-radius-sm) !important;
  padding: 10px 14px !important;
  margin-bottom: 8px !important;
  font-size: 13px !important;
  animation: slideInLeft .3s ease both;
}
.messagelist .success { background:#f0fdf4 !important; border-left:4px solid var(--adm-success) !important; color:#166534 !important; }
.messagelist .error   { background:#fef2f2 !important; border-left:4px solid var(--adm-danger)  !important; color:#991b1b !important; }
.messagelist .warning { background:#fffbeb !important; border-left:4px solid var(--adm-warning) !important; color:#92400e !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   14. DASHBOARD WIDGETS
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.dashboard-item {
  border-radius: var(--adm-radius) !important;
  overflow: hidden;
  animation: scaleIn .35s cubic-bezier(.22,1,.36,1) both;
  transition: transform var(--adm-transition), box-shadow var(--adm-transition);
}
.dashboard-item:hover {
  transform: translateY(-2px);
  box-shadow: var(--adm-shadow-lg) !important;
}
.dashboard-item-header {
  border-bottom: 1px solid var(--adm-border) !important;
  padding: 10px 14px !important;
}
.dashboard-item-content { padding: 12px 14px !important; }
.dashboard-item-content.contrast .operation-status-scroll-table {
  min-width: 100%;
  width: max-content;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   15. APP INDEX (from modern_app_index.css)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.app-index-modern__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  background: var(--adm-card);
  border: 1px solid var(--adm-border);
  border-radius: var(--adm-radius);
  box-shadow: var(--adm-shadow);
  padding: 10px 12px;
  margin-bottom: 10px;
}
.app-index-modern__title { margin: 0; font-size: 14px; color: var(--adm-fg); }
.app-index-modern__hint  { margin: 0; font-size: 11px; color: var(--adm-muted); }
.app-index-modern__grid  { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 10px; }

.app-index-card {
  background: var(--adm-card);
  border: 1px solid var(--adm-border);
  border-radius: var(--adm-radius);
  box-shadow: var(--adm-shadow);
  overflow: hidden;
  transition: box-shadow var(--adm-transition), transform var(--adm-transition);
  animation: scaleIn .35s cubic-bezier(.22,1,.36,1) both;
}
.app-index-card:hover { transform: translateY(-2px); box-shadow: var(--adm-shadow-lg); }
.app-index-card__table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.app-index-card__header { margin:0; padding:9px 11px; background: var(--adm-primary); }
.app-index-card__header a {
  color: #fff !important;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-decoration: none;
}
.app-index-card__table { width: 100%; border-collapse: collapse; }
#content-main .app-index-card__table thead th,
#content-main .app-index-card__table thead td {
  background: #18181b !important;
  color: #fff !important;
  padding: 10px 12px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .06em;
  text-transform: uppercase;
  border-bottom: 1px solid #333 !important;
  text-align: left;
}
#content-main .app-index-card__table thead th:first-child {
  border-radius: 8px 0 0 0;
}
#content-main .app-index-card__table thead th:last-child {
  border-radius: 0 8px 0 0;
}
#content-main .app-index-card__table thead th a,
#content-main .app-index-card__table thead td a { color: #fff !important; }
body.app-index #content-main .app-index-card__table thead { display: table-header-group !important; }
body.app-index #content-main .app-index-card__table thead tr { display: table-row !important; }
body.app-index #content-main .app-index-card__table thead th,
body.app-index #content-main .app-index-card__table thead td { display: table-cell !important; }
.app-index-card__table tbody td {
  padding: 8px 10px;
  border-bottom: 1px solid #f1f3f5;
  color: var(--adm-fg);
  font-size: 12px;
  vertical-align: middle;
}
.app-index-card__table tbody tr:last-child td { border-bottom: 0; }
.app-index-card__table tbody tr { transition: background var(--adm-transition); }
.app-index-card__table tbody tr:hover { background: #f8f9fa; }
.app-index-model-link { color: var(--adm-fg) !important; text-decoration: none; font-weight: 600; }
.app-index-model-link:hover { color: var(--adm-primary) !important; }
.app-index-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.app-index-action {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 24px; padding: 0 8px;
  border-radius: 7px; border: 1px solid var(--adm-border);
  color: var(--adm-muted) !important; text-decoration: none;
  font-size: 11px; font-weight: 600; background: #fff;
  transition: background var(--adm-transition), color var(--adm-transition);
}
.app-index-action--primary {
  background: var(--adm-primary); color: #fff !important; border-color: var(--adm-primary);
}
.app-index-action:hover { background: var(--adm-primary); color: #fff !important; }
.app-index-empty {
  background: var(--adm-card); border: 1px solid var(--adm-border);
  border-radius: var(--adm-radius); box-shadow: var(--adm-shadow);
  padding: 12px; color: var(--adm-muted); font-size: 12px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   16. IMPORT EXCEL & RP TABLE (from modern_import_excel.css)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.rp-toolbar {
  background: var(--adm-card);
  border: 1px solid var(--adm-border);
  border-radius: var(--adm-radius);
  box-shadow: var(--adm-shadow);
  padding: 10px 12px;
  margin-bottom: 10px;
}
.rp-toolbar-row {
  display: flex; align-items: center; justify-content: flex-end;
  gap: 8px; flex-wrap: wrap;
}
.rp-btn {
  height: 32px;
  padding: 0 14px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  text-decoration: none;
  border: 1.5px solid var(--adm-border);
  letter-spacing: .01em;
  white-space: nowrap;
  box-sizing: border-box;
  transition: background var(--adm-transition), transform var(--adm-transition), box-shadow var(--adm-transition), border-color var(--adm-transition);
  cursor: pointer;
  color: #000 !important;
}
.rp-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,.12);
}
.rp-btn:active { transform: translateY(0); box-shadow: none; }

/* Primary — black */
.rp-btn-primary {
  background: #FFD700;
  color: #18181b !important;
  border-color: #FFD700;
  box-shadow: 0 1px 4px rgba(0,0,0,.18);
}
.rp-btn-primary:hover {
  background: #e5c200;
  border-color: #e5c200;
  box-shadow: 0 4px 14px rgba(0,0,0,.22);
  color: #000 !important;
}

/* Secondary — white outlined */
.rp-btn-secondary {
  background: #fff;
  color: #000 !important;
  border-color: #e5e7eb;
}
.rp-btn-secondary:hover {
  background: #f9fafb;
  border-color: #d1d5db;
  color: #000 !important;
}

/* Icon inside button */
.rp-btn i, .rp-btn svg {
  font-size: 11px;
  opacity: 0.85;
  flex-shrink: 0;
}
.rp-tabs { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.rp-tab {
  height: 26px; padding: 0 10px; border-radius: 7px; font-size: 11px;
  display: inline-flex; align-items: center; text-decoration: none;
  transition: background var(--adm-transition);
}
.rp-tab.is-active { background: var(--adm-primary); color: #fff !important; }
.rp-tab:not(.is-active) { background: transparent; color: var(--adm-muted) !important; }
.rp-tab:not(.is-active):hover { background: #f1f3f6; color: var(--adm-fg) !important; }
.rp-card {
  background: var(--adm-card); border: 1px solid var(--adm-border);
  border-radius: var(--adm-radius); box-shadow: var(--adm-shadow); overflow: hidden;
}
.rp-footer {
  border-top: 1px solid var(--adm-border); background: #fafbfc;
  padding: 8px 10px; display: flex; justify-content: space-between; align-items: center;
}
.rp-footer .button { margin: 0 !important; }
.wrapper { background: transparent !important; }
.header {
  background: #6b7280 !important; border: 0 !important;
  border-radius: 0 !important; padding: 10px 12px !important;
}
.line { padding-top: 0 !important; gap: 4px !important; }
.rp-client-block { display: flex; flex-direction: column; }
.rp-client-block.is-hidden { visibility: hidden; }
.rp-client-name { font-size: 1.2em; display: block; padding: 3px 0; }
#table_wrapper { overflow-x: auto; }
#card_table { width: 100%; table-layout: auto; }
#card_table thead tr th {
  font-size: 10px !important;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 6px 8px !important;
}
#card_table tbody td { padding: 6px 8px !important; font-size: 12px !important; }
#card_table tbody tr { border-bottom: 1px solid #f0f1f3 !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   17. GENERATE EAN (from modern_generate_ean.css)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
body.model-hu .modern-generate-ean .changeform-tabs {
  display: flex; gap: 8px; margin: 0 0 12px; padding: 0;
  background: transparent !important; border: none !important; border-radius: 0 !important;
}
body.model-hu .modern-generate-ean .changeform-tabs-item { list-style: none; margin: 0; }
body.model-hu .modern-generate-ean .changeform-tabs-item-link {
  display: inline-block; padding: 7px 12px;
  border-radius: var(--adm-radius-sm); border: 1px solid var(--adm-border);
  background: #fff; color: var(--adm-fg) !important; font-weight: 700; text-decoration: none;
  transition: background var(--adm-transition), color var(--adm-transition);
}
body.model-hu .modern-generate-ean .changeform-tabs-item.selected .changeform-tabs-item-link {
  background: #18181b; border-color: #18181b; color: #fff !important;
}
body.model-hu .modern-generate-ean form {
  background: #fff; border: 1px solid var(--adm-border);
  border-radius: var(--adm-radius); box-shadow: var(--adm-shadow);
  padding: 12px 12px 4px;
}
body.model-hu .modern-generate-ean fieldset.module.aligned { margin: 0 0 12px; }
body.model-hu .modern-generate-ean .submit-row { margin-top: 4px; border-top: 1px solid #e5e7eb; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   18. ITEM CHANGE FORM extras (from modern_item_change_form.css)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.inline-group .tabular tr th {
  color: var(--adm-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
.form-row input[type="text"],
.form-row input[type="number"],
.form-row input[type="email"],
.form-row input[type="url"],
.form-row textarea,
.form-row select,
.inline-group input[type="text"],
.inline-group input[type="number"],
.inline-group select {
  background: #fff !important;
  color: var(--adm-fg) !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   19. MOBILE RESPONSIVE — 960px
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media only screen and (max-width: 960px) {
  #content { padding: 8px !important; }
  #content-main { padding: 0 !important; }

  /* All tables scroll horizontally */
  .results, #table_wrapper, .inline-group { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  #result_list, .results table { min-width: max-content !important; width: 100% !important; }
  #rp-table-card .results { padding: 0 10px !important; }
  #rp-table-card .results table { margin: 0 !important; min-width: max-content !important; }

  /* Changelists padding */
  body.change-list #changelist .results { padding-left:10px !important; padding-right:10px !important; }
  body.change-list #changelist #result_list,
  body.change-list #changelist .results table { margin:0 !important; width:max-content !important; min-width:100% !important; }

  /* Forms */
  body.change-form #content-main { padding-left:10px !important; padding-right:10px !important; }
  .form-row { flex-direction: column !important; }
  .field-box { width: 100% !important; margin-right: 0 !important; }

  /* Submit row */
  .submit-row { flex-wrap: wrap !important; gap: 8px !important; }
  .submit-row input, .submit-row a { width:100% !important; text-align:center !important; box-sizing:border-box !important; }

  /* Object tools */
  .object-tools { flex-wrap: wrap !important; gap: 6px !important; }

  /* Filter */
  #changelist-filter { float:none !important; width:100% !important; margin:8px 0 !important; }

  /* App index */
  .app-index-modern__grid { grid-template-columns: 1fr !important; }
  .app-index-card__table { min-width: 360px; }

  /* Generate EAN */
  body.model-hu .modern-generate-ean { padding-left:10px; padding-right:10px; }
  body.model-hu .modern-generate-ean .changeform-tabs {
    overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap; padding-bottom: 4px;
  }

  /* HULabel change form */
  body.change-form.model-hulabel #content-main { display:flex !important; justify-content:center !important; }
  body.change-form.model-hulabel #content-main > form {
    width: calc(100% - 20px) !important; max-width: 760px;
    margin-left:auto !important; margin-right:auto !important;
  }
  body.change-form.model-hulabel .inline-group .tabular { overflow-x:auto !important; padding:0 10px !important; }
  body.change-form.model-hulabel .inline-group .tabular table { width:max-content !important; min-width:100% !important; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   20. MOBILE — 600px
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media only screen and (max-width: 600px) {
  #header { padding: 8px 12px !important; }
  #header #user-tools { font-size: 11px !important; }
  .module h2, .inline-group h2 { font-size: 10px !important; padding: 8px 10px !important; }
  #result_list thead th, .results table thead th { font-size: 9px !important; }
  #result_list tbody td, .results table tbody td { font-size: 11px !important; padding: 6px 8px !important; }
  .breadcrumbs { font-size: 11px !important; }
  .object-tools a { padding: 5px 10px !important; font-size: 11px !important; }
  .paginator a, .paginator .this-page { padding: 3px 7px !important; font-size: 11px !important; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   21. ACTIONS BAR — dropdown + GO button (pod/nad tabulkami)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Container */
#changelist-form .actions,
#rp-table-card .actions,
.changelist-form .actions,
div.actions {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 10px 14px !important;
  background: var(--adm-card) !important;
  border-top: 1px solid var(--adm-border) !important;
  border-bottom: 1px solid var(--adm-border) !important;
  margin: 0 !important;
}

/* Label "Action:" */
#changelist-form .actions label,
div.actions label {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  color: var(--adm-muted) !important;
  white-space: nowrap !important;
  margin: 0 !important;
}

/* Dropdown select */
#changelist-form .actions select[name="action"],
div.actions select[name="action"],
#rp-table-card .actions select {
  height: 34px !important;
  min-width: 200px !important;
  max-width: 320px !important;
  padding: 0 32px 0 10px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: var(--adm-fg) !important;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  border: 1.5px solid var(--adm-border) !important;
  border-radius: var(--adm-radius-sm) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.06) !important;
  cursor: pointer !important;
  transition: border-color var(--adm-transition), box-shadow var(--adm-transition) !important;
}
#changelist-form .actions select[name="action"]:focus,
div.actions select[name="action"]:focus {
  border-color: #18181b !important;
  box-shadow: 0 0 0 3px rgba(24,24,27,.1) !important;
  outline: none !important;
}
#changelist-form .actions select[name="action"]:hover,
div.actions select[name="action"]:hover {
  border-color: #9ca3af !important;
}

/* GO tlačítko */
#changelist-form .actions input.button[value="Go"],
#changelist-form .actions button.button,
div.actions input.button[value="Go"],
div.actions > input[type="submit"],
#rp-table-card .actions input[type="submit"] {
  height: 34px !important;
  padding: 0 18px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .04em !important;
  color: #18181b !important;
  background: #FFD700 !important;
  border: 1.5px solid #FFD700 !important;
  border-radius: var(--adm-radius-sm) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.18) !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: background var(--adm-transition), transform var(--adm-transition), box-shadow var(--adm-transition) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
#changelist-form .actions input.button[value="Go"]:hover,
div.actions input.button[value="Go"]:hover,
div.actions > input[type="submit"]:hover {
  background: #2d2d30 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.22) !important;
}
#changelist-form .actions input.button[value="Go"]:active,
div.actions input.button[value="Go"]:active {
  transform: translateY(0) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.18) !important;
}

/* Checkbox "select across" span */
#changelist-form .actions .select-across,
div.actions .select-across {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12px !important;
  color: var(--adm-muted) !important;
  margin-left: auto !important;
}

/* Action counter "X of Y selected" */
#changelist-form .actions .action-counter,
div.actions .action-counter {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--adm-muted) !important;
  background: #f1f3f6 !important;
  border: 1px solid var(--adm-border) !important;
  border-radius: 20px !important;
  padding: 2px 10px !important;
  white-space: nowrap !important;
}

/* RP toolbar actions (custom changelist toolbar) */
#rp-toolbar .actions,
#rp-toolbar-row .actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Mobile — stack actions vertically */
@media only screen and (max-width: 640px) {
  #changelist-form .actions,
  div.actions {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  #changelist-form .actions select[name="action"],
  div.actions select[name="action"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  #changelist-form .actions input.button[value="Go"],
  div.actions input.button[value="Go"],
  div.actions > input[type="submit"] {
    width: 100% !important;
  }
  #changelist-form .actions .select-across,
  div.actions .select-across {
    margin-left: 0 !important;
  }
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CUSTOM CHECKBOXES (overrides Django Jet icon-based checkboxes)
   Jet hides real <input> and uses label:before with icon font.
   We re-show the real input and style it properly.
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Show real checkbox, override Jet's display:none */
input[type='checkbox'] {
  display: inline-block !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  border: 2px solid #d1d5db !important;
  border-radius: 4px !important;
  background: #fff !important;
  cursor: pointer !important;
  position: relative !important;
  transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease !important;
  vertical-align: middle !important;
  flex-shrink: 0 !important;
  margin: 0 2px !important;
  box-sizing: border-box !important;
}

/* Keep action-toggle (select all) hidden – Jet controls it via JS */
input[type='checkbox']#action-toggle {
  display: none !important;
}

input[type='checkbox']:hover {
  border-color: #18181b !important;
}

input[type='checkbox']:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(24, 24, 27, 0.12) !important;
}

/* Checked – black fill + SVG checkmark via background-image */
input[type='checkbox']:checked {
  background-color: #18181b !important;
  border-color: #18181b !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M2 6l3 3 5-5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 10px 10px !important;
}

/* Indeterminate (select-all partial state) */
input[type='checkbox']:indeterminate {
  background-color: #18181b !important;
  border-color: #18181b !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 4'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' d='M0 2h12'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 10px 10px !important;
}

input[type='checkbox']:disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
}

/* Hide Jet's fake label:before icon – real input is now visible */
input[type='checkbox'] + label::before,
input[type='checkbox'] + label:before {
  display: none !important;
}

/* Position changelist – object-tools buttons inline */
body.app-positions.model-position.change-list .object-tools li {
  display: inline-block !important;
}

/* Global – center text/icon vertically in ALL object-tools buttons */
.object-tools a,
.object-tools .addlink,
.object-tools .changelink {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SEARCH BARS — icon + input inline
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Standard changelist #searchbar — show Jet's hidden icon label, inline layout */
#toolbar form {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  flex-wrap: wrap !important;
}
#toolbar form label[for=searchbar] {
  display: inline-flex !important;
  align-items: center !important;
  opacity: 0.45;
  flex-shrink: 0;
}
#toolbar form label[for=searchbar] img {
  width: 16px !important;
  height: 16px !important;
  display: block;
}

/* rp-search-input — icon inside via absolute position, needs left padding */
#rp-search-input {
  padding-left: 30px !important;
}

/* ── Date hierarchy toplinks ── */
nav.toplinks,
ul.toplinks,
.change-list ul.toplinks {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  padding: 8px 12px !important;
  background: var(--adm-card) !important;
  border: 1px solid var(--adm-border) !important;
  border-radius: var(--adm-radius) !important;
  box-shadow: var(--adm-shadow) !important;
  margin-bottom: 10px !important;
  list-style: none !important;
}

nav.toplinks a,
.change-list ul.toplinks a,
.change-list ul.toplinks li a {
  display: inline-flex !important;
  align-items: center !important;
  height: 26px !important;
  padding: 0 10px !important;
  border-radius: 20px !important;
  border: 1px solid var(--adm-border) !important;
  background: #fff !important;
  color: var(--adm-fg) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: background var(--adm-transition), color var(--adm-transition), border-color var(--adm-transition) !important;
  white-space: nowrap !important;
}

nav.toplinks a:hover,
.change-list ul.toplinks a:hover {
  background: #FFD700 !important;
  color: #18181b !important;
  border-color: #FFD700 !important;
}

/* ‹ 2026 back link — subtle */
nav.toplinks a.date-back,
.change-list ul.toplinks .date-back a {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--adm-muted) !important;
  font-weight: 400 !important;
}

nav.toplinks a.date-back:hover,
.change-list ul.toplinks .date-back a:hover {
  background: var(--adm-bg) !important;
  border-color: var(--adm-border) !important;
  color: var(--adm-fg) !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CHANGELIST FOOTER — sticky bottom bar (actions + paginator)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.changelist-footer {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 50 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  background: #fff !important;
  border-top: 1px solid var(--adm-border) !important;
  box-shadow: 0 -2px 12px rgba(0,0,0,.07) !important;
  padding: 0 !important;
  margin-top: 0 !important;
}

/* Actions inside footer — no double border */
.changelist-footer .actions,
.changelist-footer div.actions {
  border-top: none !important;
  border-bottom: none !important;
  background: var(--adm-card) !important;
  padding: 8px 14px !important;
  flex: 1 !important;
  min-width: 0 !important;
}

/* Paginator inside footer */
.changelist-footer .paginator,
.changelist-footer p.paginator {
  padding: 8px 14px !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

/* Select2 inside actions — pill style */
.actions .select2-container--jet,
div.actions .select2-container--jet {
  width: auto !important;
  min-width: 160px !important;
}
.actions .select2-container--jet .select2-selection--single,
div.actions .select2-container--jet .select2-selection--single {
  height: 32px !important;
  border: 1.5px solid var(--adm-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 28px 0 10px !important;
  box-sizing: border-box !important;
}
.actions .select2-container--jet .select2-selection__rendered,
div.actions .select2-container--jet .select2-selection__rendered {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--adm-fg) !important;
  line-height: 32px !important;
  padding: 0 !important;
}
.actions .select2-container--jet .select2-selection__arrow,
div.actions .select2-container--jet .select2-selection__arrow {
  right: 6px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  height: auto !important;
}

/* Select2 dropdown z-index fix — no clipping during scroll */
.select2-dropdown {
  z-index: 9999 !important;
}
.select2-container--open {
  z-index: 9999 !important;
}

/* Action counter badge */
.changelist-footer .actions .action-counter,
.changelist-footer div.actions .action-counter,
.changelist-footer .labels .action-counter {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--adm-muted) !important;
  background: #f1f3f6 !important;
  border: 1px solid var(--adm-border) !important;
  border-radius: 20px !important;
  padding: 2px 10px !important;
  white-space: nowrap !important;
}

/* ── Hide client-filter badge + user-tools on all pages except dashboard ── */
body:not(.dashboard) .client-filter,
body:not(.dashboard) .client-filter.hidden-xs,
body:not(.dashboard) .client-filter-badge {
  display: none !important;
  visibility: hidden !important;
}
body:not(.dashboard) ul.sidebar-dependent {
  display: none !important;
  visibility: hidden !important;
}

/* ── Modern refresh: visible STOCKISIMO-aligned polish ───────────────────── */
body {
  background:
    radial-gradient(1200px circle at 8% -15%, rgba(59,130,246,.10), transparent 55%),
    radial-gradient(1100px circle at 94% -10%, rgba(16,185,129,.08), transparent 50%),
    var(--adm-bg) !important;
}

#header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  box-shadow: 0 8px 22px rgba(0, 0, 0, .20) !important;
}

@media only screen and (max-width: 960px) {
  body:not(.login) #header {
    display: none !important;
  }

  #header {
    position: relative !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: 0 !important;
  }

  .sidebar-header.sidebar-dependent {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-right: 10px !important;
  }

  .sidebar-header-logout,
  .sidebar-header-logout:visited,
  .sidebar-header-logout:hover {
    display: inline-block !important;
    color: #ffd700 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    line-height: 44px !important;
    padding: 0 10px !important;
  }
}

#content {
  max-width: 1680px;
  margin: 0 auto !important;
}

body.dashboard #content-main,
body.app-index #content-main {
  background: rgba(255, 255, 255, .78) !important;
  border: 1px solid rgba(226, 229, 234, .95) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 32px rgba(2, 6, 23, .10) !important;
  padding: 62px 12px 12px !important;
}

/* Keep dashboard controls detached from widget layout on desktop */
@media only screen and (min-width: 961px) {
  body.dashboard .dashboard-tools {
    position: fixed !important;
    top: 20px !important;
    right: 360px !important;
    transform: none !important;
    z-index: 2005 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    pointer-events: auto !important;
  }
}

body.dashboard .dashboard-tools .select2-container,
body.dashboard .dashboard-tools .select2-selection,
body.dashboard .dashboard-tools .add-dashboard-link,
body.dashboard .dashboard-tools .reset-dashboard-link,
body.dashboard .dashboard-tools .button {
  position: relative !important;
  z-index: 21 !important;
  pointer-events: auto !important;
}

#nav-sidebar,
.sidebar,
.sidebar-menu {
  background: linear-gradient(180deg, #ffffff, #f8fafc) !important;
  border-right: 1px solid #e5e7eb !important;
}

.sidebar-menu li > a,
#nav-sidebar a {
  border-radius: 10px !important;
  margin: 2px 6px !important;
  transition: background var(--adm-transition), color var(--adm-transition), transform var(--adm-transition) !important;
}

.sidebar-menu li > a:hover,
#nav-sidebar a:hover {
  background: #eef2ff !important;
  color: #1e1b4b !important;
  transform: translateX(1px) !important;
}

.sidebar-menu li.current > a,
.sidebar-menu li.active > a,
#nav-sidebar .current-model > a {
  background: #18181b !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(24, 24, 27, .24) !important;
}

.object-tools {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

.object-tools a,
.button,
button,
input[type=submit],
input[type=button] {
  border-radius: 10px !important;
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}

.object-tools a:hover,
.button:hover,
button:hover,
input[type=submit]:hover,
input[type=button]:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, .12) !important;
}

/* ━━━ Global button color override — #FFD700 gold, black text ━━━ */
/* Catch any remaining hard-coded #18181b on buttons */
.rp-btn-primary,
.object-tools a, .object-tools .addlink, .object-tools .changelink,
div.actions input.button[value=Go], div.actions > input[type=submit],
div.actions button.button,
#changelist-form .actions input.button[value=Go],
#changelist-form .actions button.button,
.navigator-button, .navigator-button:visited, .navigator-button:link,
.filter-files-container .filter-files-button,
.changelist-footer .actions input[type=submit],
.submit-row input[type=submit], .submit-row .grp-button, .submit-row .grp-default,
#changelist-search input[type=submit],
.app-index-action--primary,
.app-index-action:hover,
.rp-tab.is-active {
  background: #FFD700 !important;
  color: #18181b !important;
  border-color: #FFD700 !important;
}

.rp-btn-primary:hover,
.object-tools a:hover,
div.actions input.button[value=Go]:hover,
div.actions > input[type=submit]:hover,
.navigator-button:hover,
.submit-row input[type=submit]:hover,
#changelist-search input[type=submit]:hover {
  background: #e5c200 !important;
  border-color: #e5c200 !important;
  color: #18181b !important;
}

/* Dashboard header */
.dashboard-widget-header { background: #FFD700 !important; color: #18181b !important; }

/* App-index card header */
.app-index-card__header { background: #FFD700 !important; }
.app-index-card__header a { color: #18181b !important; }

/* Table thead black bg stays, not changed */
#content-main .app-index-card__table thead th,
#content-main .app-index-card__table thead td {
  background: #18181b !important;
  color: #fff !important;
}

/* Signpost tile icon */
.tile-icon { background: #FFD700 !important; color: #18181b !important; }

/* Paginator active */
.paginator .this-page { background: #FFD700 !important; color: #18181b !important; }

/* Changelist footer sticky */
.changelist-footer { border-top-color: #FFD700 !important; }

/* ━━━ Status badge pills — span.button (table status indicators) ━━━ */
span.button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 22px !important;
  padding: 0 10px !important;
  border-radius: 9999px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  /* Default (ok/available) — green */
  background: #c6f5da !important;
  color: #006035 !important;
  border: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: opacity 0.15s !important;
  cursor: default !important;
}

span.button:hover { opacity: 0.85 !important; transform: none !important; }

/* Missing (red class) — amber warning, oklch(0.94 0.08 60) / oklch(0.48 0.14 60) */
span.button.red { background: #fef3d7 !important; color: #b87500 !important; }

/* Overplus (orange class) — soft blue/info (unexpected surplus) */
span.button.orange { background: #eff6ff !important; color: #1d4ed8 !important; }

/* Damage (shadow class) — soft red, danger */
span.button.shadow { background: #fee2e2 !important; color: #991b1b !important; }

/* Inactive / Unavailable — muted gray bg, dark text */
span.button.inactive { background: rgba(243,244,246,0.6) !important; color: #141b24 !important; }

/* a.button in tables — keep as action link, not pill */
a.button { border-radius: 8px !important; }



/* Unavailable / disabled status pill — matches bg-muted/60 text-foreground/80 */
span.button.unavailable,
span.button.disabled,
a.button.inactive { 
  background: rgba(243,244,246,0.6) !important;
  color: #141b24 !important;
  border-radius: 9999px !important;
  height: 22px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

/* ━━━ Kill all Jet blues — replace #1cacfc / #5EADDE / #1B75B1 everywhere ━━━ */

/* Jet hover blue → gold */
table thead th.sortable:hover,
.paginator .pages-wrapper a:focus,
.paginator .pages-wrapper a:hover {
  background: #FFD700 !important;
  color: #18181b !important;
}

/* Keep sorted header same as default header style (no highlighted column) */
table thead th.sorted {
  background: transparent !important;
  color: #64748b !important;
}

/* Jet input focus glow → neutral */
input[type=text]:focus,
input[type=email]:focus,
input[type=password]:focus,
input[type=url]:focus,
input[type=number]:focus,
select:focus,
textarea:focus {
  box-shadow: 0 0 0 3px rgba(221,176,73,.2) !important;
  border-color: #FFD700 !important;
}

/* Jet blue links in changelist */
.change-list a:focus,
.change-list a:hover,
#content-main a:hover { color: #18181b !important; }

/* Select2 focus green → gold */
.select2-container--jet .select2-results__option[aria-selected=true] { color: #FFD700 !important; }
.select2-container--jet .select2-results__option--highlighted { background: #FFD700 !important; color: #18181b !important; }

/* Jet sidebar hover blue → gold */
.sidebar-link:hover,
.sidebar-link.selected { color: #FFD700 !important; }

/* Jet button hover blue */
.button:hover,
.button:focus,
input[type=submit]:hover,
input[type=submit]:focus {
  background-color: #e5c200 !important;
  color: #18181b !important;
}

/* Jet .object-tools hover blue already handled but just in case */
.object-tools a:hover { background: #e5c200 !important; border-color: #e5c200 !important; }

/* Jet changelist selected row */
#changelist table tbody tr.selected {
  background-color: #fef9ec !important;
  border-color: #FFD700 !important;
}

/* ━━━ Modern table headers — matching design system ━━━ */

/* thead tr — muted/30 background + bottom border */
#content-main table thead tr,
#content-main .results table thead tr,
#rp-table-card table thead tr,
#changelist table thead tr,
.dashboard-widget-body table thead tr {
  background: rgba(243,244,246,0.3) !important;
  border-bottom: 1px solid #e5e7eb !important;
}

/* th — 11px semibold uppercase with letter-spacing */
#content-main table thead th,
#content-main table thead td,
#content-main .results table thead th,
#rp-table-card table thead th,
#rp-table-card table thead td,
#changelist table thead th,
.dashboard-widget-body table thead th {
  background: transparent !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  padding: 12px 16px !important;
  border-bottom: none !important;
  white-space: nowrap !important;
}

/* Sortable/sorted th links */
#content-main table thead th a,
#rp-table-card table thead th a,
#changelist table thead th a {
  color: #64748b !important;
  text-decoration: none !important;
}

#content-main table thead th a:hover,
#changelist table thead th a:hover {
  color: #18181b !important;
}

/* tbody rows — subtle bottom border, no strong border */
#content-main table tbody tr,
#rp-table-card table tbody tr,
#changelist table tbody tr {
  border-bottom: 1px solid #f1f3f5 !important;
}

#content-main table tbody tr:last-child,
#rp-table-card table tbody tr:last-child {
  border-bottom: none !important;
}

/* tbody td — consistent padding */
#content-main table tbody td,
#content-main table tbody th,
#rp-table-card table tbody td {
  padding: 10px 16px !important;
  font-size: 13px !important;
  vertical-align: middle !important;
}

/* Table container — rounded corners via overflow hidden */
#rp-table-card,
.module .results,
#changelist .results {
  border-radius: 10px !important;
  overflow: hidden !important;
  border: 1px solid #e5e7eb !important;
}

/* ━━━ Table header exact spec — 40px row, muted/30 bg, no vertical lines ━━━ */
table thead tr {
  height: 40px !important;
  background: #f8f9fa !important;
  border-bottom: 1px solid #e5e7eb !important;
}

table thead th,
table thead td {
  background: transparent !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  padding: 12px 16px !important;
  border-right: none !important;
  border-left: none !important;
  border-top: none !important;
  border-bottom: none !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
  box-shadow: none !important;
}

table thead th a,
table thead td a {
  color: #64748b !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

table thead th a:hover,
table thead td a:hover {
  color: #18181b !important;
}

/* Override Jet's thead background completely */
table thead th.sortable:hover {
  background: rgba(221,176,73,0.15) !important;
  color: #18181b !important;
}


/* ── #changelist glassmorphism ── */
#changelist {
  background-color: rgba(255, 255, 255, 0.55) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  background-image: none !important;
}
