/* Composition only. Controls, focus, fonts and surfaces belong to app.css. */
.cp-page { min-height:100vh; font-family:var(--rq-font-family-ui); font-size:var(--rq-font-size-body); font-weight:var(--rq-font-weight-regular); line-height:1.5; background:var(--rq-form-bg); color:#334155; }
.cp-page [hidden] { display:none!important; }
.cp-page h1,.cp-page h2,.cp-page h3,.cp-page strong { font-weight:var(--rq-font-weight-regular); }
.cp-page h1,.cp-page h2 { font-size:var(--rq-font-size-heading); }
.cp-page a { color:inherit; }
.cp-header { background:#fff; border-bottom:1px solid #e2e8f0; }
.cp-header-inner { max-width:1160px; min-height:68px; padding:12px 24px; margin:auto; display:flex; align-items:center; gap:16px; }
.cp-brand { font-family:Comfortaa,var(--rq-font-family-ui); color:#0369a1!important; text-decoration:none; white-space:nowrap; }
.cp-header-label { color:#64748b; font-size:var(--rq-font-size-secondary); }
.cp-account { display:flex; align-items:center; gap:12px; margin-left:auto; min-width:0; }
.cp-account-name { overflow-wrap:anywhere; }
.cp-main { max-width:1160px; margin:auto; padding:24px; min-height:calc(100vh - 126px); }
.cp-main:focus { outline:none; }
.cp-nav { display:flex; gap:12px; padding:0 0 12px; margin-bottom:12px; overflow-x:auto; white-space:nowrap; scrollbar-width:thin; }
.cp-nav a { display:flex; align-items:center; min-height:36px; padding:4px 12px; text-decoration:none; border-bottom:2px solid transparent; font-size:var(--rq-font-size-control); }
.cp-nav a[aria-current=page] { color:#0369a1; border-bottom-color:#0ea5e9; }
.cp-card { background:#fff; border:1px solid #e2e8f0; border-radius:8px; overflow:hidden; }
.cp-card-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:36px; padding:4px 12px; background:linear-gradient(to bottom right,#f1f5f9,#f8fafc); }
.cp-card-body { padding:12px; }
.cp-access { max-width:480px; margin:clamp(24px,8vh,80px) auto; }
.cp-access .cp-card-body>p { margin-bottom:16px; }
.cp-access-form { display:grid; gap:12px; }
.cp-email-field { display:grid; grid-template-columns:48px minmax(0,1fr); gap:12px; align-items:center; }
.cp-email-field input { width:100%; min-width:0; }
.cp-secondary { color:#64748b; font-size:var(--rq-font-size-secondary); overflow-wrap:anywhere; }
.cp-actions { display:flex; justify-content:flex-end; align-items:center; flex-wrap:wrap; gap:12px; margin-top:12px; }
.cp-client-list { display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); }
.cp-client-option { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; border:1px solid #e2e8f0; border-radius:var(--rq-control-radius); min-width:0; }
.cp-client-option>div { min-width:0; overflow-wrap:anywhere; }
.cp-shortcuts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.cp-shortcuts>a { display:flex; flex-direction:column; gap:8px; padding:12px; border:1px solid #e2e8f0; border-radius:var(--rq-control-radius); text-decoration:none; }
.cp-shortcuts>a:hover { background:#f8fafc; }
.cp-shortcut-title { display:flex; justify-content:space-between; gap:12px; color:#0369a1; }
.cp-documents { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:12px; }
.cp-document { display:flex; flex-direction:column; gap:12px; padding:12px; border:1px solid #e2e8f0; border-radius:var(--rq-control-radius); min-width:0; overflow-wrap:anywhere; }
.cp-document-header { display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.cp-details { display:grid; gap:8px; margin-bottom:12px; }
.cp-details>div { display:grid; grid-template-columns:110px minmax(0,1fr); gap:12px; }
.cp-details dt { color:#64748b; font-size:var(--rq-font-size-control); }
.cp-details dd { margin:0; overflow-wrap:anywhere; }
.cp-document .cp-actions { margin-top:auto; }
.cp-notice { padding:12px; margin-bottom:12px; border:1px solid #bae6fd; border-radius:var(--rq-control-radius); background:#f0f9ff; }
.cp-notice-error { color:#991b1b; border-color:#fecaca; background:#fef2f2; }
.cp-section-status:not(:empty) { padding:8px 0 12px; }
.cp-section-status[data-error=true] { color:#991b1b; }
.cp-empty { color:#64748b; }
.cp-footer { text-align:center; padding:12px 24px; color:#64748b; font-size:var(--rq-font-size-secondary); }
.cp-skip { position:fixed; top:0; left:12px; z-index:100; padding:8px 12px; transform:translateY(-120%); background:#fff; }
.cp-skip:focus { transform:translateY(0); }
@media (max-width:767px) {
 .cp-header-inner { padding:12px; flex-wrap:wrap; gap:8px 12px; }
 .cp-account { width:100%; gap:12px; }
 .cp-account-name { flex:1; font-size:var(--rq-font-size-control); }
 .cp-main { padding:12px; }
 .cp-shortcuts { grid-template-columns:1fr; }
 .cp-access { margin:24px auto; }
}
@media (pointer:coarse) {
 /* Extra touch space belongs to content/navigation, never changes control metrics. */
 .cp-nav a { min-height:44px; }
 .cp-client-option { padding-top:16px; padding-bottom:16px; }
 .cp-actions { column-gap:16px; row-gap:16px; }
}
.cp-order-summary { border-top:1px solid #e2e8f0; padding-top:12px; margin-top:12px; }
.cp-notes-field { display:grid; grid-template-columns:110px minmax(0,1fr); align-items:start; gap:12px; }
.cp-notes-field textarea { height:64px; resize:vertical; }
.cp-quantity-field { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.cp-quantity-field input { width:90px; }
.cp-event-form { display:grid; gap:12px; }
.cp-event-field { display:grid; grid-template-columns:100px minmax(0,1fr); align-items:center; gap:12px; }
.cp-event-form textarea { width:100%; height:64px; resize:vertical; }
