/* Shared Frostinger panel styles. Individual workspaces supply their own layout. */
:root {
  --navy: #172338;
  --muted: #4e5d72;
  --line: #dfe5ee;
  --bg: #f4f6fa;
  --accent: #b83c1e;
  --accent-strong: #943018;
  --tint: #fff0e9;
  --radius: 13px;
}

.layout {
  --panel-sidebar: #fff;
  --panel-shadow: 0 1px 2px #17233808;
  --panel-gutter: clamp(19px, 3vw, 42px);
  grid-template-columns: 230px minmax(0, 1fr);
}
.sidebar { gap: 11px; padding: 20px 13px 12px; }
.sidebar .brand { padding: 2px 9px 10px; }
.sidebar .workspace { background: #f4f7fb; }
.app-nav { gap: 8px; }
.app-nav a { min-height: 35px; font-weight: 620; }
.app-nav a:hover, .nav-group > summary:hover { background: #f2f5fa; }
.app-nav a[aria-current=page] { background: #fff0e9; box-shadow: inset 3px 0 var(--accent); }
.nav-group > summary { color: #526178; font-size: .72rem; font-weight: 740; letter-spacing: .025em; }
.panel-search-button { background: #f7f9fc; border-color: var(--line); }
.topbar { min-height: 61px; color: #3b4b63; }
.topbar-title { letter-spacing: -.015em; }
.page-heading { margin-bottom: 18px; align-items: center; }
.page-heading h1 { font-size: clamp(1.8rem, 2.8vw, 2.45rem); letter-spacing: -.048em; }
.page-heading p { font-size: .9rem; line-height: 1.48; }
.page { padding-top: clamp(18px, 2.45vw, 34px); }
.layout .card { border-color: var(--line); }
.primary, .secondary { border-radius: 8px; line-height: 1.25; }
.secondary { color: #2c3c54; }
.secondary:hover { border-color: #b6c3d5; background: #f1f5fb; color: #233652; }
input:not([type=checkbox], [type=radio], [type=range], [type=file]), select, textarea {
  border-color: #cbd5e2;
}
input:user-invalid, textarea:user-invalid, select:user-invalid { border-color: #ac3043; }
:focus-visible { outline: 2px solid #2459ac; outline-offset: 3px; }
.pill, .demo-tag { min-height: 24px; border-radius: 7px; line-height: 1.2; }
.toast { background: #172338; color: white; }
.empty { color: var(--muted); line-height: 1.55; }
.error:not(:empty) { background: #fff0f2; border-radius: 7px; padding: 8px 10px; }
dialog {
  max-height: calc(100dvh - 26px);
  border-radius: 14px;
  border-color: #d4deec;
  box-shadow: 0 16px 52px #14233c33;
  overscroll-behavior: contain;
}
dialog::backdrop { background: #111c3063; }
dialog .dialog-heading { padding-bottom: 10px; border-bottom: 1px solid var(--line); align-items: center; }
dialog .dialog-heading h2 { font-size: 1.28rem; }
dialog .form-section, .rd-form-section { border-color: var(--line); }

.access-shell {
  grid-template-columns: minmax(300px, 480px) minmax(300px, 420px);
  gap: clamp(22px, 5vw, 74px);
  background: #f0f3f8;
}
.access-shell::before { content: none; }
.access-intro {
  min-height: 415px; display: grid; gap: 26px; align-content: space-between;
  background: #172338; color: white; padding: clamp(22px, 4vw, 43px); border-radius: 18px;
}
.access-intro img { display: block; width: 151px; height: auto; padding: 6px 8px; background: white; border-radius: 7px; }
.access-intro h2 { font-size: clamp(1.8rem, 3.3vw, 3rem); line-height: 1.08; letter-spacing: -.05em; margin: 7px 0 12px; }
.access-intro p { color: #d1dceb; line-height: 1.5; }
.access-intro ul { margin: 0; padding: 12px 0 0; border-top: 1px solid #42516a; list-style: none; display: grid; gap: 7px; font-size: .88rem; }
.access-intro li::before { content: "✓"; margin-right: 8px; color: #ffb29a; }
.access-card { padding: clamp(20px, 3vw, 32px); box-shadow: 0 2px 14px #1723380a; }
@media (min-width: 761px) { .access-card .access-wordmark { display: none; } }

.rd-subscription { max-width: 1180px; margin-inline: auto; }
.rd-subscription-overview { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 13px; margin-bottom: 15px; }
.rd-subscription .subscription-card { max-width: none; }
.rd-subscription-overview .subscription-card { margin: 0; align-content: start; }
.rd-current-plan { background: #172338; color: white; display: grid; align-content: start; justify-items: start; gap: 9px; padding: 19px; }
.rd-current-plan h2 { font-size: clamp(1.45rem, 2.7vw, 2.15rem); }
.rd-current-plan p, .rd-current-plan small, .rd-current-plan dt { color: #d2dded; }
.rd-current-plan p { max-width: 46ch; line-height: 1.5; }
.rd-current-price { display: flex; align-items: baseline; gap: 8px; }
.rd-current-price strong { font-size: 1.42rem; font-variant-numeric: tabular-nums; }
.rd-plan-usage { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; margin: 6px 0 0; }
.rd-plan-usage div { background: #24354d; border-radius: 8px; padding: 9px; }
.rd-plan-usage dt { font-size: .78rem; }
.rd-plan-usage dd { margin: 4px 0 0; font-size: 1rem; font-weight: 700; }
.rd-plan-usage dd small { font-size: .76rem; font-weight: 500; }
.rd-subscription-next { display: grid; gap: 8px; color: var(--muted); }
.rd-subscription-next h2 { color: var(--navy); }
.rd-subscription .subscription-billing-details { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(130px, 100%), 1fr)); gap: 7px; }
.rd-subscription .subscription-billing-details > div { background: #f2f5fa; border: 0; border-radius: 7px; padding: 8px 9px; }
.rd-plan-compare > header { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.rd-subscription .rd-plan-card { display: grid; gap: 9px; min-width: 0; margin: 0; padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: #f7f9fc; align-content: start; }
.rd-subscription .rd-plan-card[data-tier=plus] { border-color: #e7b9a7; background: #fff3ed; }
.rd-subscription label.rd-plan-card { grid-template-columns: auto minmax(0,1fr); }
.rd-subscription .rd-plan-card:has(:checked) { box-shadow: inset 0 0 0 1px var(--accent); }
.rd-plan-name { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 9px; font-size: 1.15rem; font-weight: 750; }
.rd-plan-name small { padding: 2px 5px; font-size: .7rem; background: #e7edf7; color: #344f77; border-radius: 5px; }
.rd-plan-features { display: grid; gap: 5px; font-size: .83rem; color: var(--muted); font-weight: 500; line-height: 1.4; }
.rd-plan-features [role=listitem] { display: list-item; margin-left: 1.02rem; list-style: disc; }
.rd-payment-history td small { display: block; }
.rd-subscription .subscription-verification { padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: #f7f9fc; }

.rd-company-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(225px,.34fr); gap: 13px; align-items: start; }
.rd-company-layout > * { margin: 0; }
.rd-company-layout .platform-admin-filters { grid-template-columns: minmax(150px,1.6fr) repeat(3,minmax(80px,1fr)); }
.rd-company-layout .platform-admin-review-queue ul { max-height: 520px; overflow: auto; }
.rd-company-layout .platform-admin-review-queue li { flex-wrap: wrap; }
.rd-pagination { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 6px; padding: 9px 14px; border-top: 1px solid var(--line); font-size: .85rem; }
.rd-pagination span { margin-right: auto; color: var(--muted); }
.platform-admin { --admin-ink: #172338; --admin-muted: #4e5d72; --admin-border: #dfe5ee; --admin-cream: #f2f5fa; }
.platform-admin-metric { background: #fff; }
.admin-toolbar { background: #fff; }
.rd-ops-filter { min-width: 0; }
.rd-ops-filter.admin-toolbar { grid-template-columns: minmax(95px,.55fr) minmax(165px,1fr) minmax(165px,1fr); }
.rd-ops-count { margin: -5px 0 11px; font-size: .8rem; }
.rd-ops-sections { display: grid; gap: 10px; }
.rd-ops-sections .admin-block { margin: 0; }
.rd-ops-sections .admin-summary { margin-bottom: 3px; }
.rd-ops-sections .admin-summary > :first-child { background: #172338; }
.rd-ops-sections .admin-summary > :first-child :is(dt,dd) { color: #fff; }
.rd-ops-sections .admin-pricing > form { display: grid; gap: 10px; }
.rd-ops-sections .admin-pricing button { justify-self: start; }
.rd-support-detail { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(235px,1fr); gap: 13px; align-items: start; }
.rd-support-desk { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(250px,1fr); gap: 13px; align-items: start; }
.rd-support-ticket-header { grid-column: 1 / -1; }
.rd-support-ticket-header .admin-fields { margin: 10px 0 0; }
.rd-support-filters { display: grid; grid-template-columns: minmax(0,2fr) minmax(0,1fr); gap: 10px; margin-bottom: 10px; }
.rd-support-list-summary { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; }
.rd-audit-list { padding: 0; }
.rd-audit-list h2 { padding: 15px 16px 4px; }
.rd-audit-list h2 small { margin-left: 7px; font-weight: 500; }
.rd-audit-list :is(th, td) { overflow-wrap: anywhere; }
.rd-config-plans > p { margin: 5px 0 12px; }
.rd-config-plans form[data-plan=plus] { border-top: 3px solid var(--accent); }
.rd-config-units { display: grid; grid-template-columns: minmax(200px,.65fr) minmax(0,1fr); gap: 18px; }
.rd-config-units [data-units] { padding: 10px; border-radius: 8px; background: #f5f7fb; }
.rd-presets-layout { display: grid; grid-template-columns: minmax(220px,.75fr) minmax(0,1.25fr); gap: 13px; align-items: start; }

@media (max-width: 1100px) { .rd-company-layout { grid-template-columns: minmax(0,1fr); } }
@media (max-width: 800px) {
  .layout { --panel-gutter: 14px; grid-template-columns: minmax(0,1fr); }
  .sidebar { padding: 6px max(8px,env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); }
  .app-nav a { min-height: 44px; }
  .mobile-nav a[aria-current=page] { background: var(--tint); }
  .page-heading { align-items: flex-start; }
  .rd-support-detail, .rd-support-desk, .rd-presets-layout, .rd-config-units { grid-template-columns: minmax(0,1fr); }
  .rd-support-ticket-header { grid-column: auto; }
}
@media (max-width: 760px) {
  .access-shell { grid-template-columns: minmax(0,460px); }
  .access-intro { display: none; }
  .rd-subscription-overview { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 620px) {
  .rd-ops-filter.admin-toolbar { grid-template-columns: minmax(0,1fr); }
  .rd-ops-filter.admin-toolbar label:nth-child(2) { grid-row: auto; }
  .rd-company-layout .platform-admin-filters { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .rd-payment-history table, .rd-payment-history tbody, .rd-audit-list table, .rd-audit-list tbody { display: block; }
  .rd-payment-history thead, .rd-audit-list thead { position: absolute; clip-path: inset(50%); height: 1px; width: 1px; overflow: hidden; }
  .rd-payment-history tr, .rd-audit-list tr { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px 10px; border-bottom: 1px solid var(--line); padding: 10px; }
  .rd-payment-history td, .rd-audit-list td { display: grid; border: 0; gap: 4px; padding: 0; min-width: 0; }
  .rd-payment-history td::before, .rd-audit-list td::before { content: attr(data-label); color: var(--muted); font-size: .73rem; }
  .rd-payment-history td .pill { justify-self: start; }
}