/* AMS - Arion Management System. RC-F visual foundation (CA-PROPOSAL-RC-F-Brand-Translation Rev 1).
   All colours are tokens; templates must not carry raw brand/semantic hex values. */

@font-face { font-family: "Titillium Web"; font-weight: 600; font-display: swap; src: url(../fonts/titillium-web-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Titillium Web"; font-weight: 700; font-display: swap; src: url(../fonts/titillium-web-latin-700-normal.woff2) format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 400; font-display: swap; src: url(../fonts/source-sans-3-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 600; font-display: swap; src: url(../fonts/source-sans-3-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 700; font-display: swap; src: url(../fonts/source-sans-3-latin-700-normal.woff2) format("woff2"); }

:root {
  /* brand (AES Brand Manual) */
  --ams-navy: #2C2D44;
  --ams-navy-700: #3A3B57;
  --ams-navy-600: #4A4C6B;
  --ams-red: #963132;
  --ams-red-tint: #DB7779;
  --ams-indigo: #3C3E77;
  --ams-indigo-500: #505398;
  --ams-indigo-100: #EEEEF7;
  /* neutrals */
  --ams-bg: #F4F4F6;
  --ams-surface: #FFFFFF;
  --ams-surface-alt: #F9F9FB;
  --ams-row-hover: #FAFAFC;
  --ams-border: #DCDDE3;
  --ams-border-strong: #8E90A3;
  --ams-text: #2C2D44;
  --ams-text-muted: #5B5D72;
  --ams-on-navy: #FFFFFF;
  --ams-on-navy-muted: #C9CADB;
  /* semantic */
  --ams-success: #1E6B41; --ams-success-bg: #EAF4EE; --ams-success-bd: #9CCBAE;
  --ams-warning: #8A5300; --ams-warning-bg: #FFF5DD; --ams-warning-bd: #E9B949;
  --ams-error:   #B42318; --ams-error-bg:   #FEF1F0; --ams-error-bd:   #F3B3AE;
  --ams-info:    #3C3E77; --ams-info-bg:    #EEEEF7; --ams-info-bd:    #B9BADB;
  /* type */
  --ams-font-brand: "Titillium Web", "Segoe UI", system-ui, sans-serif;
  --ams-font-ui: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
  --ams-font-ref: ui-monospace, "Cascadia Mono", Consolas, monospace;
  /* shape */
  --ams-radius: 4px;
  --ams-focus: 0 0 0 2px #FFFFFF, 0 0 0 4px var(--ams-indigo-500);
  --ams-topbar-h: 72px;
  --ams-sidebar-w: 272px;
  /* brand texture: isometric cube tessellation (manual motif), login and home band only */
  --ams-hex: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='69.28' height='120' viewBox='0 0 69.28 120'%3E%3Cg fill='none' stroke='%232C2D44' stroke-opacity='.07' stroke-width='1'%3E%3Cpath d='M34.64 0 69.28 20v40L34.64 80 0 60V20z'/%3E%3Cpath d='M34.64 40V80M34.64 40 0 20M34.64 40l34.64-20'/%3E%3Cpath d='M0 60 34.64 80v40M69.28 60 34.64 80'/%3E%3C/g%3E%3Cg fill='%232C2D44' fill-opacity='.025'%3E%3Cpath d='M34.64 40 69.28 20v40L34.64 80z'/%3E%3C/g%3E%3C/svg%3E");
}

/* ------------------------------------------------------------------ base */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--ams-bg); color: var(--ams-text); font: 400 15px/1.5 var(--ams-font-ui); -webkit-font-smoothing: antialiased; }
a { color: var(--ams-indigo); text-underline-offset: 2px; }
a:hover { color: var(--ams-navy); }
:focus-visible { outline: none; box-shadow: var(--ams-focus); border-radius: 2px; }
h1, h2, h3 { font-family: var(--ams-font-brand); color: var(--ams-navy); letter-spacing: 0; margin: 0 0 .5em; }
h1 { font-size: 28px; line-height: 1.2; font-weight: 700; }
h2 { font-size: 19px; line-height: 1.3; font-weight: 600; margin-top: 1.4em; }
h3 { font-size: 16px; font-weight: 600; }
p { margin: 0 0 .8em; }
.ref { font-family: var(--ams-font-ref); font-size: 13px; color: var(--ams-text-muted); }
.muted { color: var(--ams-text-muted); }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: 8px; top: -48px; z-index: 50; background: var(--ams-surface); padding: 8px 12px; border-radius: var(--ams-radius); }
.skip-link:focus { top: 8px; }

/* ------------------------------------------------------------------ top bar */
.topbar { height: var(--ams-topbar-h); background: var(--ams-surface); display: flex; align-items: center; gap: 24px; padding: 0 24px; position: relative; z-index: 20; }
.topbar .brand { display: flex; align-items: center; padding: 0; flex: none; }
.topbar .brand img { height: 24px; width: auto; display: block; }      /* clear space 24 px = "A" height */
.topbar .product { font: 600 15px/24px var(--ams-font-brand); color: var(--ams-text-muted); padding-left: 20px; border-left: 1px solid var(--ams-border); white-space: nowrap; }
.topbar .search { flex: 1; max-width: 560px; position: relative; margin: 0; }
.topbar .search input { width: 100%; height: 40px; border: 1px solid var(--ams-border-strong); border-radius: var(--ams-radius); padding: 0 12px 0 38px; font: 400 15px var(--ams-font-ui); color: var(--ams-text); background: var(--ams-surface); }
.topbar .search svg { position: absolute; left: 12px; top: 11px; pointer-events: none; }
.topbar .search button { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.topbar .searchlink { display: none; margin-left: auto; padding: 10px; }

/* user menu */
.usermenu { margin-left: auto; position: relative; }
.usermenu summary { list-style: none; display: flex; align-items: center; gap: 10px; cursor: pointer; padding: 6px 8px; border-radius: var(--ams-radius); color: var(--ams-text-muted); font-size: 14px; }
.usermenu summary::-webkit-details-marker { display: none; }
.usermenu .avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--ams-indigo-100); color: var(--ams-indigo); font: 600 13px/32px var(--ams-font-brand); text-align: center; }
.usermenu .menu { position: absolute; right: 0; top: calc(100% + 6px); min-width: 240px; background: var(--ams-surface); border: 1px solid var(--ams-border); border-radius: var(--ams-radius); box-shadow: 0 6px 18px rgba(44, 45, 68, .12); padding: 8px 0; }
.usermenu .menu .who { padding: 6px 16px 10px; border-bottom: 1px solid var(--ams-border); margin-bottom: 6px; font-size: 13.5px; color: var(--ams-text-muted); overflow-wrap: anywhere; }
.usermenu .menu a, .usermenu .menu button { display: block; width: 100%; text-align: left; padding: 9px 16px; font: 400 14.5px var(--ams-font-ui); color: var(--ams-text); text-decoration: none; background: none; border: 0; margin: 0; cursor: pointer; }
.usermenu .menu a:hover, .usermenu .menu button:hover { background: var(--ams-surface-alt); }
.usermenu .menu form { margin: 0; }

/* signature brand rule: navy bar ending in angled tint + red segments. Once per screen. */
.brand-rule { height: 5px; display: flex; overflow: hidden; }
.brand-rule::before { content: ""; flex: 1; background: var(--ams-navy); }
.brand-rule i { width: 72px; margin-left: -4px; transform: skewX(-35deg); }
.brand-rule i.t { background: var(--ams-indigo-500); }
.brand-rule i.r { background: var(--ams-red); margin-right: 8px; }

/* ------------------------------------------------------------------ layout */
.layout { display: grid; grid-template-columns: var(--ams-sidebar-w) minmax(0, 1fr); min-height: calc(100vh - var(--ams-topbar-h) - 5px); }
.main { padding: 24px 40px 56px; min-width: 0; }
.main-inner { max-width: 1180px; }

/* ------------------------------------------------------------------ sidebar */
.sidenav { background: var(--ams-navy); color: var(--ams-on-navy); padding: 16px 0 32px; }
.sidenav-desktop { position: sticky; top: 0; align-self: start; max-height: 100vh; overflow-y: auto; min-height: calc(100vh - var(--ams-topbar-h) - 5px); }
.sidenav ul { list-style: none; margin: 0; padding: 0; }
.sidenav .group { font: 600 13px var(--ams-font-brand); color: var(--ams-on-navy-muted); padding: 18px 24px 6px; margin: 0; }
.sidenav a { display: flex; gap: 12px; align-items: baseline; min-height: 36px; padding: 8px 24px 8px 21px; border-left: 3px solid transparent; color: var(--ams-on-navy); text-decoration: none; font-size: 14.5px; line-height: 1.35; }
.sidenav a .n { font: 600 12px var(--ams-font-brand); color: var(--ams-on-navy-muted); min-width: 18px; flex: none; }
.sidenav a:hover { background: var(--ams-navy-700); color: var(--ams-on-navy); }
.sidenav a[aria-current="page"] { background: var(--ams-navy-700); border-left-color: var(--ams-red-tint); font-weight: 600; }
.sidenav a.sub { padding-left: 54px; font-size: 14px; color: var(--ams-on-navy-muted); }
.sidenav a.sub[aria-current="page"] { color: var(--ams-on-navy); }
.sidenav li.domain.open > a { font-weight: 600; }
.sidenav hr { border: 0; border-top: 1px solid var(--ams-navy-600); margin: 14px 24px; }
.sidenav a:focus-visible, .sidenav summary:focus-visible { box-shadow: inset 0 0 0 2px var(--ams-on-navy); border-radius: 0; }

/* collapsible groups (Applicability Views, Administration) */
.sidenav details.navgroup > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; min-height: 36px; padding: 14px 24px 6px; font: 600 13px var(--ams-font-brand); color: var(--ams-on-navy-muted); }
.sidenav details.navgroup > summary::-webkit-details-marker { display: none; }
.sidenav details.navgroup > summary::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); margin-right: 4px; transition: transform .12s; }
.sidenav details.navgroup[open] > summary::after { transform: rotate(45deg); }
.sidenav details.navgroup > summary:hover { color: var(--ams-on-navy); }

/* mobile / tablet navigation (rendered as a <details> disclosure; hidden on desktop) */
.mnav { display: none; }
.mnav > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--ams-radius); }
.mnav > summary::-webkit-details-marker { display: none; }
.mnav > .sidenav { position: absolute; left: 0; right: 0; top: calc(var(--ams-topbar-h) + 5px); max-height: calc(100vh - var(--ams-topbar-h) - 5px); overflow-y: auto; box-shadow: 0 10px 24px rgba(44, 45, 68, .25); }
.mnav .sidenav .mnav-user { padding: 12px 24px; border-top: 1px solid var(--ams-navy-600); margin-top: 12px; color: var(--ams-on-navy-muted); font-size: 13.5px; overflow-wrap: anywhere; }
.mnav .sidenav .mnav-user a, .mnav .sidenav .mnav-user button { color: var(--ams-on-navy); background: none; border: 0; padding: 8px 0; font: 400 14.5px var(--ams-font-ui); cursor: pointer; display: block; min-height: 0; }

/* ------------------------------------------------------------------ page content defaults
   (pre-F2 templates rely on these element styles; F2 replaces them with components) */
.main nav[aria-label="Breadcrumb"] { font-size: 13.5px !important; color: var(--ams-text-muted); margin-bottom: 14px !important; }
.main nav[aria-label="Breadcrumb"] a { color: var(--ams-text-muted); }
.main table { width: 100%; border-collapse: collapse; background: var(--ams-surface); border: 1px solid var(--ams-border); border-radius: var(--ams-radius); margin: .6rem 0 1.2rem; font-size: 14.5px; }
.main th { text-align: left; font: 600 13px var(--ams-font-ui); color: var(--ams-text-muted); background: var(--ams-surface-alt); padding: 9px 16px; border-bottom: 1px solid var(--ams-border); vertical-align: top; }
.main td { padding: 10px 16px; border-bottom: 1px solid var(--ams-border); vertical-align: top; }
.main tr:last-child td, .main tr:last-child th { border-bottom: 0; }
.main tr:hover td { background: var(--ams-row-hover); }
.main label { display: block; margin: .8rem 0 .3rem; font-weight: 600; font-size: 14px; }
.main input[type=text], .main input[type=email], .main input[type=password], .main input[type=number], .main input[type=date], .main select, .main textarea,
.plain input[type=text], .plain input[type=email], .plain input[type=password] {
  width: 100%; max-width: 520px; height: 40px; padding: 0 12px; border: 1px solid var(--ams-border-strong); border-radius: var(--ams-radius); font: 400 15px var(--ams-font-ui); color: var(--ams-text); background: var(--ams-surface); }
.main textarea { height: auto; min-height: 80px; padding: 8px 12px; }
.main input[type=checkbox] { width: auto; height: auto; }
.main button, .plain button, .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 16px; margin-top: .8rem; border-radius: var(--ams-radius); border: 1px solid var(--ams-border-strong); background: var(--ams-surface); color: var(--ams-navy); font: 600 14.5px var(--ams-font-brand); cursor: pointer; text-decoration: none; }
.main button[type=submit]:not(.secondary), .plain button[type=submit], .btn-primary { background: var(--ams-navy); border-color: var(--ams-navy); color: var(--ams-on-navy); }
.main button[type=submit]:not(.secondary):hover, .plain button[type=submit]:hover, .btn-primary:hover { background: var(--ams-navy-700); color: var(--ams-on-navy); }
.main table button { min-height: 32px; margin-top: 0; padding: 0 10px; font-size: 13.5px; background: var(--ams-surface) !important; color: var(--ams-navy) !important; border-color: var(--ams-border-strong) !important; }

/* messages (existing kinds: error, info; plus success, warning) */
.msg { display: block; padding: 10px 14px; margin: .8rem 0; border: 1px solid; border-left-width: 4px; border-radius: var(--ams-radius); font-size: 14.5px; }
.msg.info { color: var(--ams-info); background: var(--ams-info-bg); border-color: var(--ams-info-bd); border-left-color: var(--ams-info); }
.msg.success { color: var(--ams-success); background: var(--ams-success-bg); border-color: var(--ams-success-bd); border-left-color: var(--ams-success); }
.msg.warning { color: var(--ams-warning); background: var(--ams-warning-bg); border-color: var(--ams-warning-bd); border-left-color: var(--ams-warning); }
.msg.error { color: var(--ams-error); background: var(--ams-error-bg); border-color: var(--ams-error-bd); border-left-color: var(--ams-error); }

/* badges: colour + text, never colour alone */
.badge { display: inline-flex; align-items: center; gap: 5px; font: 600 12.5px/1 var(--ams-font-ui); padding: 4px 8px; border-radius: 3px; border: 1px solid; white-space: nowrap; }
.badge.dot::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.b-active { color: var(--ams-success); background: var(--ams-success-bg); border-color: var(--ams-success-bd); }
.b-current { color: var(--ams-navy); background: var(--ams-surface); border-color: var(--ams-navy); }
.b-neutral { color: var(--ams-text-muted); background: var(--ams-surface-alt); border-color: var(--ams-border); }
.b-warning { color: var(--ams-warning); background: var(--ams-warning-bg); border-color: var(--ams-warning-bd); }
.b-error { color: var(--ams-error); background: var(--ams-error-bg); border-color: var(--ams-error-bd); }
.b-info { color: var(--ams-info); background: var(--ams-info-bg); border-color: var(--ams-info-bd); }

/* ------------------------------------------------------------------ RC-F F2 reader components */
.crumbs { font-size: 13.5px; color: var(--ams-text-muted); margin: 0 0 14px; display: flex; flex-wrap: wrap; gap: 0 6px; align-items: baseline; }
.crumbs a { color: var(--ams-text-muted); }
.crumbs .sep { color: var(--ams-border-strong); }
.crumbs [aria-current="page"] { color: var(--ams-text); }
.pagehead { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin: 0 0 20px; }
.pagehead h1 { margin: 0; }
.pagehead .count { margin: 0; color: var(--ams-text-muted); font-size: 14.5px; }
.pagehead .pagehead-link { margin-left: auto; font-size: 14.5px; }
.areatitle .n, .arealist .n { font-family: var(--ams-font-brand); font-weight: 700; color: var(--ams-red); margin-right: 12px; }
.panel { background: var(--ams-surface); border: 1px solid var(--ams-border); border-radius: var(--ams-radius); margin: 0 0 20px; overflow: hidden; }
.panel > header { display: flex; align-items: baseline; gap: 12px; padding: 13px 20px; border-bottom: 1px solid var(--ams-border); }
.panel > header h2 { font-size: 17px; margin: 0; }
.panel > header .count, .panel > header .more { margin-left: auto; font-size: 13.5px; color: var(--ams-text-muted); }
.panel > header .more { color: var(--ams-indigo); }
.panel > .body { padding: 16px 20px; }
.panel > .empty, .panel .body > .empty:only-child { margin: 0; }
.panel > .empty { padding: 16px 20px; }
.empty { color: var(--ams-text-muted); margin: 0; }
.blank { color: var(--ams-text-muted); font-style: italic; }
.note { display: block; color: var(--ams-text-muted); font-size: 13.5px; }

/* document tables: compact rows (sections hold up to ~120 documents) */
.main table.doctable, .main table.datatable { border: 0; border-radius: 0; margin: 0; }
.main table.doctable td, .main table.datatable td { padding: 9px 20px; }
.main table.doctable th, .main table.datatable th { padding: 8px 20px; }
.doctable .c-num { width: 26%; white-space: nowrap; }
.doctable .c-num a, .datatable a.strong { font-weight: 600; color: var(--ams-navy); text-decoration: none; }
.doctable .c-num a:hover, .datatable a.strong:hover { text-decoration: underline; }
.doctable .c-extra, .doctable .c-status { width: 18%; white-space: nowrap; }
.relgroup { font-size: 14.5px; margin: 0; padding: 12px 20px 6px; color: var(--ams-text-muted); border-top: 1px solid var(--ams-border); }
.panel > header + .relgroup { border-top: 0; }

/* area lists (Home, section children) */
.arealist, .qflist, .plainlist, .chips { list-style: none; margin: 0; padding: 0; }
.arealist a { display: flex; align-items: baseline; gap: 0; padding: 11px 20px; border-bottom: 1px solid var(--ams-border); text-decoration: none; color: var(--ams-navy); min-height: 44px; }
.arealist li:last-child a { border-bottom: 0; }
.arealist a:hover { background: var(--ams-row-hover); }
.arealist a:hover .t { text-decoration: underline; }
.arealist .t { font: 600 15.5px/1.35 var(--ams-font-brand); }
.arealist .n { min-width: 28px; }
.arealist .c { margin-left: auto; padding-left: 16px; font-size: 13.5px; color: var(--ams-text-muted); white-space: nowrap; }
.arealist.sub .t { font: 600 15px/1.35 var(--ams-font-ui); }
.qflist li { display: flex; flex-direction: column; padding: 10px 20px; border-bottom: 1px solid var(--ams-border); font-size: 14.5px; }
.qflist li:last-child { border-bottom: 0; }
.qflist a { font-weight: 600; color: var(--ams-navy); text-decoration: none; }
.qflist a:hover { text-decoration: underline; }
.qflist span { color: var(--ams-text-muted); }
.qflist .kw { font-size: 13px; }
.plainlist li { padding: 3px 0; }
.chips { display: flex; flex-direction: column; gap: 8px; }
.chips .incl { font-size: 13px; color: var(--ams-text-muted); }

/* Home */
.homeband { background: var(--ams-surface) var(--ams-hex); border: 1px solid var(--ams-border); border-radius: var(--ams-radius); padding: 28px 28px 24px; margin: 0 0 24px; }
.homeband h1 { font-size: 30px; margin: 0 0 6px; }
.homeband .lede { color: var(--ams-text-muted); font-size: 16px; margin: 0 0 18px; }
.bigsearch { display: flex; gap: 8px; max-width: 720px; }
.main .bigsearch input[type=text] { max-width: none; flex: 1; height: 46px; font-size: 16px; }
.main .bigsearch button { margin: 0; min-height: 46px; }
.homecols { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.homecols.single { grid-template-columns: minmax(0, 1fr); max-width: 860px; }

/* document page */
.dochead { display: flex; align-items: flex-start; gap: 24px; padding-bottom: 20px; margin-bottom: 24px; border-bottom: 1px solid var(--ams-border); }
.dochead-main { min-width: 0; }
.dochead h1 { margin: 0; overflow-wrap: anywhere; }
.dochead .doctitle { font-size: 18px; margin: 4px 0 12px; }
.docmeta { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 10px; }
.dochead-action { margin-left: auto; flex: none; }
.dochead-action .btn { margin: 0; text-decoration: none; }
.docgrid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; align-items: start; }
dl.kv { display: grid; grid-template-columns: 160px minmax(0, 1fr); margin: 0; font-size: 14.5px; }
dl.kv.narrow { grid-template-columns: 130px minmax(0, 1fr); font-size: 14px; }
dl.kv dt { color: var(--ams-text-muted); padding: 8px 12px 8px 0; border-bottom: 1px solid var(--ams-border); }
dl.kv dd { margin: 0; padding: 8px 0; border-bottom: 1px solid var(--ams-border); overflow-wrap: anywhere; }
dl.kv > :nth-last-child(-n+2) { border-bottom: 0; }

/* search */
.searchform .searchrow { display: flex; gap: 8px; }
.main .searchform input[type=text] { max-width: none; flex: 1; }
.main .searchform .searchrow button { margin: 0; }
.main label.check { font-weight: 400; display: flex; gap: 8px; align-items: center; margin-top: 12px; }

/* applicability view detail: collapsible General list */
details.generalgroup > summary { list-style: none; cursor: pointer; display: flex; align-items: baseline; gap: 12px; padding: 13px 20px; min-height: 44px; }
details.generalgroup > summary::-webkit-details-marker { display: none; }
details.generalgroup > summary::before { content: ""; width: 7px; height: 7px; border-right: 2px solid var(--ams-text-muted); border-bottom: 2px solid var(--ams-text-muted); transform: rotate(-45deg); align-self: center; transition: transform .12s; }
details.generalgroup[open] > summary::before { transform: rotate(45deg); }
details.generalgroup[open] > summary { border-bottom: 1px solid var(--ams-border); }
details.generalgroup .h2like { font: 600 17px var(--ams-font-brand); color: var(--ams-navy); }
details.generalgroup .count { margin-left: auto; font-size: 13.5px; color: var(--ams-text-muted); }
details.generalgroup .hint { color: var(--ams-text-muted); font-size: 13.5px; padding: 10px 20px 0; margin: 0 0 6px; }
details.generalgroup > .empty { padding: 10px 20px 16px; }

/* RC-F F3: revision history + Home sync line */
.histtable .lbl { display: none; }
.histtable .strong { font-weight: 600; color: var(--ams-navy); }
.note-small { font-size: 13px; max-width: 80ch; }
/* RC-F F5: administration pages */
.lede-admin { margin: -8px 0 20px; max-width: 80ch; font-size: 14.5px; }
.sectionhead { margin: 28px 0 6px; }
.subhead { font-size: 15.5px; margin: 20px 0 8px; }
.formgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px 16px; align-items: end; }
.formgrid .field label { display: block; margin: 0 0 6px; font-weight: 600; font-size: 13.5px; }
.formgrid .field input, .formgrid .field select { width: 100%; max-width: none; margin: 0; }
.formgrid .narrowfield { max-width: 140px; }
.formgrid .fieldbtn button, .formactions button { margin-top: 0; }
.formactions { margin-top: 14px; }
.panel > .addform { border-top: 1px solid var(--ams-border); background: var(--ams-surface-alt); }
.main table.admintable td { vertical-align: middle; }
.main table.admintable.inset { border: 1px solid var(--ams-border); margin: 12px 0; }
.admintable .strongcell { font-weight: 600; color: var(--ams-navy); }
.admintable .sub { display: block; font-size: 13px; color: var(--ams-text-muted); margin-top: 2px; }
.admintable .c-order { width: 70px; }
.inlineform { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.inlineform select { width: auto; min-width: 160px; margin: 0; }
.rowform { margin-top: 8px; }
.main .inlineform button { margin-top: 0; }
.main button.secondary, .main table button.secondary { background: var(--ams-surface); color: var(--ams-navy); border-color: var(--ams-border-strong); }
.main button.secondary:hover { background: var(--ams-surface-alt); }
.rowactions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px; }
.admintable .chips { flex-direction: row; flex-wrap: wrap; gap: 6px; }
.chip { flex: 0 0 auto; width: max-content; max-width: 100%; display: inline-flex; align-items: center; gap: 6px; padding: 2px 4px 2px 10px; border: 1px solid var(--ams-border); border-radius: 14px; background: var(--ams-surface-alt); font-size: 13.5px; }
.main table button.chipbtn { min-height: 24px; padding: 0 8px; font-size: 12px; border-radius: 12px; }
details.inlineedit { display: inline-block; }
details.inlineedit > summary { display: inline-flex; align-items: center; min-height: 32px; padding: 0 10px; border: 1px solid var(--ams-border-strong); border-radius: var(--ams-radius); font: 600 13.5px var(--ams-font-brand); color: var(--ams-navy); cursor: pointer; list-style: none; background: var(--ams-surface); }
details.inlineedit > summary::-webkit-details-marker { display: none; }
details.inlineedit[open] > summary { background: var(--ams-surface-alt); }
details.inlineedit form { margin-top: 8px; padding: 12px; border: 1px solid var(--ams-border); border-radius: var(--ams-radius); background: var(--ams-surface-alt); display: grid; gap: 8px; min-width: 260px; }
details.inlineedit label { font-weight: 600; font-size: 13px; display: grid; gap: 4px; margin: 0; }
details.inlineedit input { margin: 0; }
.main table details.inlineedit form button { justify-self: start; background: var(--ams-navy) !important; color: var(--ams-on-navy) !important; border-color: var(--ams-navy) !important; }
.subnav { display: flex; gap: 4px; margin: -6px 0 18px; border-bottom: 1px solid var(--ams-border); }
.subnav a { padding: 8px 14px; color: var(--ams-text-muted); text-decoration: none; font-weight: 600; font-size: 14.5px; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.subnav a[aria-current="page"] { color: var(--ams-navy); border-bottom-color: var(--ams-navy); }
.focusline { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 16px 0 4px; }

/* RC-F F6: retired scope entities (admin only) */
details.retiredgroup { border-top: 1px solid var(--ams-border); }
details.retiredgroup > summary { padding: 10px 20px; cursor: pointer; font: 600 14px var(--ams-font-brand); color: var(--ams-text-muted); background: var(--ams-surface-alt); }
details.retiredgroup[open] > summary { border-bottom: 1px solid var(--ams-border); }
details.retiredgroup table.admintable { background: var(--ams-surface-alt); }
details.inlineedit select { width: 100%; margin: 0; }

/* RC-F F4: Document Control / Mapping Required (read only) */
.navcount { display: inline-block; min-width: 20px; margin-left: 6px; padding: 1px 6px; border-radius: 10px; background: rgba(255, 255, 255, 0.16); color: #fff; font: 700 11.5px/1.5 var(--ams-font-ui); text-align: center; }
.filterbar .filterrow { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: flex-end; }
.filterbar .filterrow label { display: flex; flex-direction: column; gap: 4px; font-weight: 600; font-size: 13.5px; margin: 0; }
.main .filterbar select { min-width: 200px; max-width: 100%; }
.main .filterbar button { margin: 0; }
.mqtable .c-date { width: 14%; white-space: nowrap; }
.mqtable .c-reason { width: 26%; }
.mqtable .c-status { width: 12%; white-space: nowrap; }
.mqtable .c-subject .sub, .mqtable .c-reason .sub { display: block; font-size: 13.5px; color: var(--ams-text-muted); margin-top: 2px; }
.mqtable .path, .contrib .path { overflow-wrap: anywhere; font-size: 13px; }
/* AMS V1 Step 1 - Mapping Required management (same components; no new visual language) */
.dcactions { display: flex; flex-direction: column; gap: 8px; }
.subnav.dctabs { flex-wrap: wrap; }
/* AMS V1 Step 2: Excel register export action above the Document Control tabs (display only). */
.dcexport { display: flex; justify-content: flex-end; margin: -8px 0 12px; }
.dcexport .btn { margin: 0; text-decoration: none; }
.dcactions .btn { margin-top: 0; width: 100%; }
.dcactions h3 { margin: 6px 0 0; font-size: 13px; color: var(--ams-text-muted); text-transform: uppercase; letter-spacing: .04em; }
.main label.checkline { display: flex; align-items: flex-start; gap: 8px; font-weight: 400; margin: .8rem 0 0; max-width: 80ch; }
.main label.checkline input { margin-top: 3px; flex: 0 0 auto; }
.main .formstack textarea { max-width: 640px; }
.dcform fieldset { border: 0; margin: 0; padding: 0; }
.dcform legend { font-weight: 600; font-size: 14px; margin: .8rem 0 .3rem; padding: 0; }
.dcform .hint { display: block; font-weight: 400; color: var(--ams-text-muted); font-size: 13px; margin-top: 2px; }
.contrib + .contrib { border-top: 1px solid var(--ams-border); }
.contrib h3 { margin: 0 0 8px; font: 600 15px var(--ams-font-brand); color: var(--ams-navy); }
.syncline { margin: 14px 0 0; font-size: 13.5px; color: var(--ams-text-muted); }
.homeband .syncinfo { margin: 14px 0 0; max-width: 720px; }

/* ------------------------------------------------------------------ plain layout (login, password, errors) */
.plain-top { height: var(--ams-topbar-h); background: var(--ams-surface); display: flex; align-items: center; padding: 0 24px; }
.plain-top img { height: 24px; width: auto; display: block; }
.plain { max-width: 560px; margin: 48px auto; padding: 0 16px; }
.plain .card { background: var(--ams-surface); border: 1px solid var(--ams-border); border-radius: var(--ams-radius); padding: 32px; }
.plain label { display: block; margin: 14px 0 6px; font-weight: 600; font-size: 14px; }
.plain button[type=submit] { margin-top: 22px; }

/* error pages */
.errorpage .code { font: 700 15px var(--ams-font-brand); color: var(--ams-text-muted); margin-bottom: 4px; }
.errorpage .actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 16px; }

/* login */
.login { display: grid; grid-template-columns: 46% 1fr; min-height: 100vh; background: var(--ams-surface); position: relative; overflow: hidden; }
.login .brandpanel { background: var(--ams-navy); clip-path: polygon(0 0, 100% 0, 78% 100%, 0 100%); color: var(--ams-on-navy); position: relative; display: flex; align-items: center; }
.login .brandpanel::before { content: ""; position: absolute; inset: 0; background-image: var(--ams-hex); filter: invert(1); opacity: .55; }
.login .redcut { position: absolute; left: calc(46% * .78 - 2px); bottom: 0; width: 10px; height: 34%; background: var(--ams-red); transform: skewX(-8.6deg); transform-origin: bottom left; }
.login .brandpanel .inner { position: relative; padding: 0 30% 0 72px; }
.login .brandpanel .title { color: var(--ams-on-navy); font: 700 44px/1.08 var(--ams-font-brand); margin: 10px 0 18px; }
.login .brandpanel .kick { font: 600 15px var(--ams-font-brand); color: var(--ams-on-navy-muted); margin: 0; }
.login .brandpanel .lede { font-size: 17px; color: var(--ams-on-navy-muted); max-width: 30ch; margin: 0; }
.login .formside { position: relative; display: flex; align-items: center; padding: 48px 72px; }
.login .wm { position: absolute; right: -120px; bottom: -130px; width: 440px; opacity: .045; pointer-events: none; }
.login .formcard { position: relative; width: 100%; max-width: 380px; }
.login .formcard .logo { height: 36px; width: auto; display: block; margin: 0 0 36px; }
.login .formcard h1 { font-size: 22px; margin: 0 0 4px; }
.login .formcard .sub { margin: 0 0 18px; }
.login label { display: block; font-weight: 600; font-size: 14px; margin: 14px 0 6px; }
.login input[type=email], .login input[type=password] { width: 100%; height: 42px; border: 1px solid var(--ams-border-strong); border-radius: var(--ams-radius); padding: 0 12px; font: 400 15px var(--ams-font-ui); color: var(--ams-text); }
.login button[type=submit] { width: 100%; justify-content: center; align-items: center; margin-top: 22px; display: inline-flex; min-height: 42px; border-radius: var(--ams-radius); border: 1px solid var(--ams-navy); background: var(--ams-navy); color: var(--ams-on-navy); font: 600 14.5px var(--ams-font-brand); cursor: pointer; }
.login button[type=submit]:hover { background: var(--ams-navy-700); }
.login .note { font-size: 13.5px; color: var(--ams-text-muted); margin-top: 22px; }

/* ------------------------------------------------------------------ responsive */
@media (max-width: 1199px) {
  .docgrid, .homecols { grid-template-columns: minmax(0, 1fr); }
  .layout { grid-template-columns: minmax(0, 1fr); }
  .sidenav-desktop { display: none; }
  .mnav { display: block; order: -1; }
  .usermenu .who-name { display: none; }
  .topbar { gap: 16px; padding: 0 16px; }
  .main { padding: 20px 24px 48px; }
}
@media (max-width: 767px) {
  .dochead { flex-direction: column; gap: 14px; }
  .dochead-action { margin-left: 0; width: 100%; }
  .dochead-action .btn { width: 100%; min-height: 46px; }
  .dcexport .btn { width: 100%; min-height: 46px; }
  .homeband { padding: 20px 16px; }
  .homeband h1 { font-size: 24px; }
  .bigsearch { flex-direction: column; }
  .main .bigsearch input[type=text] { flex: none; }
  .arealist .c { display: none; }
  dl.kv, dl.kv.narrow { grid-template-columns: 120px minmax(0, 1fr); }
  .main table.doctable thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .main table.doctable, .main table.doctable tbody, .main table.doctable tr, .main table.doctable td { display: block; width: auto; }
  .main table.doctable tr { padding: 10px 16px; border-bottom: 1px solid var(--ams-border); }
  .main table.doctable tr:hover td { background: none; }
  .main table.doctable td { padding: 0; border: 0; white-space: normal; }
  .main table.doctable td.c-num { margin-bottom: 2px; }
  .main table.doctable td.c-extra, .main table.doctable td.c-status { margin-top: 4px; font-size: 13.5px; color: var(--ams-text-muted); }
  .main table.admintable thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .main table.admintable, .main table.admintable tbody, .main table.admintable tr, .main table.admintable td { display: block; width: auto; }
  .main table.admintable tr { padding: 12px 16px; border-bottom: 1px solid var(--ams-border); }
  .main table.admintable td { padding: 3px 0; border: 0; }
  .inlineform select { min-width: 0; flex: 1; }
  .formgrid .narrowfield { max-width: none; }
  .main table.mqtable td.c-date { font-size: 13px; color: var(--ams-text-muted); margin-bottom: 2px; }
  .main table.mqtable td.c-reason { margin-top: 4px; font-size: 14px; }
  .filterbar .filterrow label, .main .filterbar select { width: 100%; }
  .main table.histtable td { display: flex; gap: 8px; font-size: 14px; margin-top: 2px; }
  .main table.histtable td:first-child { margin-top: 0; }
  .histtable .lbl { display: inline-block; flex: 0 0 132px; color: var(--ams-text-muted); }
  .topbar { gap: 24px; }                       /* keeps 24 px clear space beside the logo */
  .topbar .product, .topbar .search, .usermenu { display: none; }
  .topbar .searchlink { display: block; }
  .main { padding: 16px 16px 40px; }
  h1 { font-size: 24px; }
  .login { grid-template-columns: 1fr; }
  .login .brandpanel { clip-path: none; min-height: 180px; }
  .login .brandpanel .inner { padding: 32px 24px; }
  .login .brandpanel .title { font-size: 30px; }
  .login .redcut { display: none; }
  .login .formside { padding: 32px 24px; }
  .main button, .plain button, .btn { min-height: 44px; }
}

/* ------------------------------------------------------------------ print */
@media print {
  .sidenav, .mnav, .topbar .search, .topbar .searchlink, .usermenu, .skip-link, .brand-rule { display: none !important; }
  .layout { display: block; }
  .main { padding: 0; }
  body { background: #FFFFFF; }
  a { color: inherit; text-decoration: none; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
.msg.daterev p { margin: .2rem 0; }
.srcdocs .btn { margin: 0 6px 4px 0; }
