/* Layout adaptations and semantic states. Shared cards live in dashboard-ui.css. */
/* Administration uses the same card headings and controls as the timing pages. */
body:is([data-page="flag"], [data-page="users"], [data-page="licenses"], [data-page="track-rights"]) main {
  max-width:none;
}
body:is([data-page="flag"], [data-page="users"], [data-page="licenses"], [data-page="track-rights"]) .page-heading {
  margin-bottom:27px;
}
body:is([data-page="flag"], [data-page="users"], [data-page="licenses"], [data-page="track-rights"]) :is(.panel-card, .flag-sidebar, .flag-card, .flag-log-panel) {
  position:relative;
}
body:is([data-page="flag"], [data-page="users"], [data-page="licenses"], [data-page="track-rights"]) :is(.panel-card, .flag-sidebar, .flag-card, .flag-log-panel)::before {
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:1px;
  background:linear-gradient(90deg,transparent,color-mix(in srgb, var(--ui-accent) 55%, transparent),transparent);
  pointer-events:none;
}
body main :is(.users-panel-head, .users-section-head, .license-list-heading, .flag-sidebar-heading, .flag-section-heading) {
  min-height:61px;
  padding:16px 20px;
  border-bottom:1px solid var(--border);
  box-sizing:border-box;
  gap:12px;
}
body main :is(.users-panel-head, .users-section-head, .license-list-heading, .flag-sidebar-heading, .flag-section-heading) h2,
body main .license-create-card > h2 {
  display:flex;
  align-items:center;
  gap:9px;
  font-size:13px;
  line-height:1.5;
  letter-spacing:0;
  margin:0;
}
body main :is(.users-panel-head, .users-section-head, .license-list-heading, .flag-sidebar-heading, .flag-section-heading) h2::before,
body main .license-create-card > h2::before {
  content:"";
  flex:0 0 3px;
  height:12px;
  border-radius:1px;
  background:var(--red);
}
body main :is(.users-panel-head, .users-section-head, .license-list-heading) :is(.users-panel-kicker, .license-panel-kicker),
body main .license-create-card > .license-panel-kicker,
body main .flag-section-heading .eyebrow {
  display:none;
}
body[data-page="users"] :is(.users-panel-head, .users-section-head) {
  margin:-18px -18px 18px;
  flex-wrap:wrap;
}
body[data-page="users"] .users-panel-head { flex-shrink:0; }
body[data-page="users"] .user-editor .panel-card { padding:18px; }
body[data-page="flag"] .flag-card { padding:20px; }
body[data-page="flag"] .flag-card > .flag-section-heading { margin:-20px -20px 20px; }
body[data-page="flag"] .flag-section-heading { flex-wrap:wrap; }
body:is([data-page="licenses"], [data-page="track-rights"]) .license-create-card > h2 {
  margin:-20px -20px 16px;
  padding:16px 20px;
  min-height:61px;
  border-bottom:1px solid var(--border);
}
body:is([data-page="licenses"], [data-page="track-rights"]) .license-toolbar {
  padding:18px 20px;
  gap:14px;
  background:rgba(255,255,255,.025);
}
body:is([data-page="users"], [data-page="licenses"], [data-page="track-rights"]) :is(.comp-field, .user-filters label) {
  color:#afb0b8;
  font-size:11px;
  font-weight:400;
  letter-spacing:0;
  text-transform:none;
}

body:is([data-page="flag"], [data-page="track-rights"]) :is(.table-wrap, .flag-history) {
  overflow:auto;
  border:0;
  border-radius:0;
  scrollbar-width:thin;
  scrollbar-color:#3b3d44 #151619;
}
body:is([data-page="flag"], [data-page="track-rights"]) table { border-collapse:collapse; }
body:is([data-page="flag"], [data-page="track-rights"]) th {
  height:40px;
  padding:10px 17px;
  font-size:9px;
  background:#111215;
  border-bottom:1px solid var(--border);
}
body:is([data-page="flag"], [data-page="track-rights"]) td {
  padding:13px 17px;
  font-size:12px;
  border-bottom:1px solid #24262b;
}
body main :is(.users-stats, .detail-kpis, .license-stats) article {
  background:#101113;
  border-radius:8px;
}
@media(max-width:600px) {
  body[data-page="users"] .users-browser { padding:18px; }
  body main .users-section-head.with-action > button { flex-shrink:1; white-space:normal; }
  body:is([data-page="licenses"], [data-page="track-rights"]) .license-create-card { padding:20px; }
}
body .topbar-right .navbar-logout{flex-shrink:0}
body .topbar-right .navbar-logout:hover:not(:disabled){color:#ff526c}
body .topbar-right .navbar-logout::after{background:#ff526c}
.topbar-right .navbar-logout[hidden]{display:none}
/* Keep mobile navigation on one row as toolbar actions grow. */
@media(max-width:800px) {
 body .topbar,body .topbar:has(.shell-profile:not([hidden])) { box-sizing:border-box;height:61px;min-height:61px;flex-wrap:nowrap;gap:10px;padding:0 12px; }
 body .topbar .breadcrumb { flex:1 1 auto;min-width:0;gap:8px; }
 body .topbar:has(.shell-profile:not([hidden])) .breadcrumb { flex-basis:auto; }
 body .topbar .breadcrumb strong { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
 body .topbar .topbar-right,body .topbar:has(.shell-profile:not([hidden])) .topbar-right { flex:0 0 auto;width:auto;gap:7px;justify-content:flex-end; }
 body .topbar .icon-button { box-sizing:border-box;width:34px;min-width:34px;height:34px;min-height:34px;padding:7px;flex:0 0 34px; }
 body .topbar .shell-profile { position:relative;flex:0 0 32px;max-width:32px;gap:0; }
 body .topbar .shell-profile .person-avatar { width:32px;height:32px;flex:0 0 32px; }
 body .topbar .shell-profile-name { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap; }
}
@media(max-width:600px) {
 body .topbar-right .shell-clock { display:none; }
}
@media(max-width:360px) {
 body .topbar,body .topbar:has(.shell-profile:not([hidden])) { padding:0 8px;gap:6px; }
 body .topbar .topbar-right { gap:5px; }
 body .topbar .breadcrumb strong { font-size:10px; }
}