@import url("./colors.css");

/* Component color roles. Shared roles live in colors.css. */
:root {
	--legal-acceptance-accent: #d6682b;
	--legal-draft-border: #bc880e;
	--legal-draft-surface: #fff7df;
	--legal-error-text: #a21c24;
	--legal-footer-social-focus: #c45118;
	--legal-form-border: #aeb9b1;
	--legal-form-surface: #aa4816;
	--legal-kicker-text: #526057;
	--legal-page-border: #dde3df;
}

.legal-footer {box-sizing:border-box; flex-shrink:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; width:100%; max-width:1200px; margin:2rem auto 0; padding:1.2rem 1.5rem 2rem; border-top:1px solid var(--ui-border-cool); color:var(--ui-text-muted-strong); font-size:.85rem;}
.legal-footer nav,.legal-actions {display:flex; flex-wrap:wrap; gap:.6rem 1.2rem;}
.legal-footer a,.legal-actions a,.legal-compact a {color:inherit; text-underline-offset:3px;}
.legal-footer-feedback {margin:0; padding:0; border:0; background:none; color:inherit; font:inherit; text-decoration:underline; text-decoration-color:var(--ui-link-underline); text-underline-offset:3px; cursor:pointer;}
.legal-footer-feedback:hover {text-decoration-color:currentColor;}
.legal-footer-feedback:focus-visible {outline:3px solid var(--ui-focus-ring); outline-offset:2px;}
.legal-footer-brand {display:flex; align-items:center; gap:.4rem;}
.legal-footer-social {display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:6px;}
.legal-footer-social:hover {background:var(--ui-surface-cool-hover);}
.legal-footer-social:focus-visible {outline:2px solid var(--legal-footer-social-focus); outline-offset:2px;}
.content-report-footer {display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.5rem 1rem; margin-top:1rem; font-size:.8rem; line-height:1.5;}
.content-report-footer a,.legal-page .content-report-footer a {color:var(--ui-text-muted-strong); font-weight:400; text-decoration:none; text-underline-offset:3px;}
.content-report-footer a:hover,.content-report-footer a:focus-visible {text-decoration:underline;}
.legal-page {box-sizing:border-box; max-width:850px; margin:2rem auto; padding:clamp(1.2rem,4vw,2.5rem); background:var(--ui-surface); border:1px solid var(--ui-border-cool); border-radius:16px; line-height:1.7; color:var(--ui-text-heading-cool); overflow-wrap:anywhere;}
.legal-page h1 {font-size:clamp(1.65rem,4vw,2.25rem); line-height:1.2; margin:1rem 0;}
.legal-page h2 {font-size:1.2rem; margin:1.9rem 0 .6rem; line-height:1.4;}
.legal-page p,.legal-page ul {margin:.7rem 0;}
.legal-page li {margin:.4rem 0;}
.legal-page a {color:var(--ui-link); text-underline-offset:3px;}
.legal-page table {width:100%; border-collapse:collapse; font-size:.9rem;}
.legal-page td,.legal-page th {text-align:left; vertical-align:top; padding:.6rem; border:1px solid var(--legal-page-border);}
.legal-kicker {font-size:.8rem; font-weight:700; letter-spacing:.06em; color:var(--legal-kicker-text);}
.legal-draft,.legal-todo {background:var(--legal-draft-surface); border-left:3px solid var(--legal-draft-border); padding:.8rem 1rem;}
.legal-document-list {display:grid; gap:.7rem; margin-top:1.5rem;}
.legal-document-list a {padding:.8rem 1rem; border:1px solid var(--legal-page-border); border-radius:8px;}
.legal-acceptance {font-size:.86rem; line-height:1.5; margin:1.2rem 0; color:var(--ui-text-secondary-cool);}
.legal-acceptance label {display:flex; align-items:flex-start; gap:.55rem; text-align:left;}
.legal-acceptance input[type=checkbox] {width:18px; height:18px; flex:0 0 18px; margin:.2rem 0 0; accent-color:var(--legal-acceptance-accent);}
.legal-acceptance p {margin:.5rem 0;}
.legal-compact {position:relative; font-size:.8rem; color:var(--ui-text-muted-strong);}
.legal-compact summary {cursor:pointer; padding:.35rem .55rem;}
.legal-compact-panel {position:absolute; right:0; top:100%; z-index:100; width:min(310px,80vw); max-height:65vh; overflow:auto; display:grid; gap:.75rem; padding:1rem; border:1px solid var(--ui-border-cool); border-radius:10px; background:var(--ui-surface); box-shadow:0 6px 20px var(--ui-shadow-popover);}
.legal-form {display:grid; gap:1rem;}
.legal-form label:not(.legal-check) {display:grid; gap:.3rem;}
.legal-form input:not([type=checkbox]),.legal-form textarea,.legal-form select {box-sizing:border-box; width:100%; padding:.7rem; border:1px solid var(--legal-form-border); border-radius:7px; font:inherit;}
.legal-form button {justify-self:start; padding:.65rem 1rem; border:0; border-radius:8px; background:var(--legal-form-surface); color:var(--ui-text-on-accent); cursor:pointer; font:inherit;}
.legal-form .legal-check {display:flex; align-items:flex-start; gap:.6rem;}
.legal-form .legal-check input {margin-top:.45rem;}
.legal-error {color:var(--legal-error-text);}
.legal-pre {white-space:pre-wrap;}
.legal-receipt-code {display:block; padding:.7rem; background:var(--ui-surface-green-subtle); user-select:all; overflow-wrap:anywhere;}
@media print {.header,.legal-footer,.legal-actions,.background-overlay {display:none!important;} .legal-page {max-width:none; margin:0; padding:0; border:0;} body,.content {background:var(--document-paper)!important; padding:0!important;} .legal-page a {color:inherit;}}

.legal-compact nav {display:grid; gap:.7rem;}
.conversation-legal-link {display:block; width:fit-content; margin:0 auto; font-size:.75rem; color:var(--ui-text-muted-strong); padding:.4rem;}
.wb-info {margin-top:.35rem;}
.wb-info summary {list-style:none; width:fit-content; margin-left:auto;}
.wb-info summary::-webkit-details-marker {display:none;}
.wb-info .legal-compact-panel {position:static; box-sizing:border-box; width:min(344px,100%); margin:.35rem 0 0 auto;}
.legal-storage-controls label {display:flex; gap:.5rem; align-items:flex-start; margin:.7rem 0;}
.legal-storage-controls input {flex:0 0 auto; margin-top:.3rem;}