:root { color-scheme: light; font-family: Tahoma, Arial, sans-serif; color: #243447; background: #f4f6f9; line-height: 1.8; }
.unread-badge { display: inline-block; min-width: 1.5em; padding: 0 .35em; border-radius: 1em; background: #b42332; color: white; font-size: .8rem; text-align: center; }
* { box-sizing: border-box; }
body { margin: 0; }
a { color: #195c9b; text-decoration: none; }
a:hover { text-decoration: underline; }
.container { width: min(1100px, 92%); margin: auto; }
header { background: white; border-bottom: 1px solid #dce2ea; }
.navigation, nav, .heading, .search, .pagination { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.navigation { padding: 16px 0; }
.navigation nav { flex: 1; }
.brand { font-weight: bold; }
main { padding: 28px 0; }
h1 { font-size: 1.5rem; margin: 0 0 22px; }
h2 { font-size: 1rem; margin: 0; font-weight: normal; }
.panel { background: white; border: 1px solid #dce2ea; border-radius: 10px; padding: 24px; margin-bottom: 20px; }
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.count { display: block; font-size: 2.4rem; color: #195c9b; }
.heading { justify-content: space-between; margin-bottom: 16px; }
.heading h1 { margin: 0; }
button, .button { border: 0; border-radius: 6px; background: #195c9b; color: white; padding: 9px 20px; font: inherit; cursor: pointer; display: inline-block; }
.secondary { background: #eaf0f6; color: #243447; }
input, select, textarea { width: 100%; padding: 10px; border: 1px solid #aab7c5; border-radius: 6px; font: inherit; background: white; color: inherit; }
textarea { resize: vertical; }
label { display: block; margin-bottom: 5px; }
.search input { flex: 1; min-width: 160px; }
.search label { margin: 0; }
.editor { max-width: 720px; margin-inline: auto; }
.login { max-width: 430px; margin: 35px auto; }
.helptext { display: block; font-size: .8rem; color: #536376; }
.errorlist { color: #a31d2d; padding-inline-start: 22px; }
.message { padding: 12px 18px; background: #e1f3e9; border-radius: 6px; }
.table-wrap { overflow-x: auto; padding: 0; }
table { width: 100%; border-collapse: collapse; text-align: right; }
th, td { padding: 14px; border-bottom: 1px solid #e5eaf0; }
th { background: #edf2f7; white-space: nowrap; }
td { overflow-wrap: anywhere; min-width: 90px; }
.date { white-space: nowrap; }
dl { display: grid; grid-template-columns: 140px 1fr; gap: 14px; }
dt { font-weight: bold; }
dd { margin: 0; overflow-wrap: anywhere; }
.cancel { margin-inline-start: 14px; }
:focus-visible { outline: 3px solid #79a8d7; outline-offset: 3px; }
@media (max-width: 600px) { .stats { grid-template-columns: 1fr; gap: 0; } .navigation nav { flex-basis: 100%; } .search input { flex-basis: 100%; } dl { grid-template-columns: 1fr; gap: 6px; } dd { margin-bottom: 12px; } }

.mail-sections { margin-bottom: 20px; }
.mail-sections a { display: inline-block; padding: 10px 18px; background: #e2edf8; border: 1px solid #a8c5e1; border-radius: 5px; }
.mail-panel { background: #f0f6fc; border-color: #a8c5e1; }
td form { display: inline; }
td button, td .row-action { display: inline-flex; align-items: center; justify-content: center; width: 120px; height: 40px; padding: 4px 8px; margin: 3px 0; border: 0; border-radius: 4px; background: #195c9b; color: white; font-size: .8rem; line-height: 1.3; vertical-align: middle; text-decoration: none; }

.mail-panel th, .mail-panel td { border: 1px solid #b9cde0; }
.mail-panel td .row-action, .mail-panel td button { font-family: inherit; font-size: .8rem; font-weight: normal; font-style: normal; letter-spacing: normal; box-sizing: border-box; width: 120px; height: 40px; padding: 4px 8px; margin: 3px 0; border: 1px solid #195c9b; border-radius: 4px; background: #195c9b; color: white; line-height: 1.3; text-align: center; }

header { position: sticky; top: 0; z-index: 100; box-shadow: 0 2px 8px #24344715; }
.logo-bar { padding-top: 6px; overflow: hidden; }
.company-logo { display: block; width: 190px; max-width: 100%; height: 65px; max-height: 65px; object-fit: contain; }
.mail-status { white-space: nowrap; font-size: .78rem; min-width: 0; }
.cc-note { display: block; font-size: .8rem; }
.letter-paper { max-width: 850px; margin-inline: auto; padding: 32px; box-shadow: 0 3px 14px #24344718; }
.letter-body { min-height: 160px; padding: 22px 0; line-height: 2; overflow-wrap: anywhere; }
.password-box { display: block; position: relative; }
.password-box input { padding-left: 52px; }
.password-eye { position: absolute; left: 3px; top: 3px; bottom: 3px; padding: 0 10px; background: #eaf0f6; color: #243447; }
@media (max-width: 600px) { .company-logo { width: 140px; height: 42px; } .navigation { gap: 8px; padding: 6px 0; } .navigation nav { gap: 10px; } .letter-paper { padding: 18px; } }

.document-fields { border: 1px solid #a8c5e1; border-radius: 6px; padding: 16px; margin-bottom: 16px; }
.document-fields input[type=checkbox] { width: auto; }
.message-layout { max-width: 1100px; display: grid; grid-template-columns: 210px minmax(0,1fr); gap: 24px; }
.message-main { grid-column: 2; grid-row: 1; min-width: 0; }
.message-sidebar { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; gap: 12px; }
.message-sidebar .button { font-size: .82rem; text-align: center; }
.message-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; padding: 10px; border: 1px solid #cbd7e3; background: #f0f6fc; font-size: .8rem; }
.message-meta span + span { border-inline-start: 1px solid #cbd7e3; padding-inline-start: 10px; }
.document-preview { margin-top: 20px; border-top: 1px solid #cbd7e3; padding-top: 16px; }
@media (max-width: 700px) { .message-layout { display: flex; flex-direction: column; } .message-sidebar { order: 1; } }

/* Shared, compact header and dashboard. */
body { font-size:14px; }
button, .button { min-height:40px; font-size:.875rem; line-height:1.5; }
.app-header { display:flex; align-items:center; gap:16px; padding:10px 0; }
.app-header .company-logo { width:220px; height:76px; max-height:76px; }
.home-button { margin-inline-start:auto; display:grid; place-items:center; width:40px; height:40px; border-radius:8px; background:#0865a8; color:white!important; font-size:26px; }
.main-nav { padding:0 0 12px; gap:8px; }
.main-nav a { padding:6px 12px; border-radius:6px; background:#f0f5fa; }
.user-menu { position:relative; }
.user-menu summary { cursor:pointer; list-style:none; width:40px; height:40px; border-radius:50%; background:#e3eff9; display:grid; place-items:center; color:#195c9b; font-weight:bold; }
.user-menu summary::-webkit-details-marker { display:none; }
.user-menu summary img { width:40px; height:40px; object-fit:cover; border-radius:50%; }
.user-menu-content { position:absolute; left:0; top:48px; width:220px; max-width:85vw; padding:16px; background:white; border:1px solid #dce2ea; border-radius:10px; box-shadow:0 8px 24px #24344722; display:grid; gap:8px; }
.user-menu-content strong { overflow-wrap:anywhere; }
.user-menu-content button { width:100%; }
.login-page { min-height:100vh; display:grid; place-items:center; }
.login-page main { width:min(430px,92%); padding:24px 0; }
.login-page .login { margin:0; }
.login-brand { text-align:center; }
.login-brand img { width:220px; max-width:100%; height:76px; object-fit:contain; }
.login-brand h1 { margin:12px 0 0; }
.dashboard-actions { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:20px; }
.stats .panel { margin-bottom:0; }
.stats { margin-bottom:20px; }
.action-panel { border-inline-start:4px solid #0865a8; }
.action-panel small { color:#536376; }
.tracking-form { display:flex; flex-wrap:wrap; gap:10px; align-items:end; }
.tracking-form label { flex-basis:100%; }
.tracking-form input { flex:1; min-width:150px; }
@media(max-width:600px) {
 .app-header .company-logo { width:160px; height:55px; }
 .app-header { gap:10px; }
 .main-nav { gap:6px; }
 .main-nav a { padding:5px 8px; font-size:.82rem; }
 .panel { padding:18px; }
 .table-wrap { padding:0; }
 .stats { gap:12px; }
 main { padding:18px 0; }
}

/* Both correspondence menus use the same component and theme. */
.mail-menu { position:relative; }
.mail-menu summary { cursor:pointer; list-style:none; padding:6px 12px; border-radius:6px; background:#f0f5fa; color:var(--theme-color,#195c9b); }
.mail-menu summary::-webkit-details-marker { display:none; }
.dashboard-actions { align-items:center; }
.dashboard-actions .mail-menu summary { padding:9px 20px; min-height:40px; line-height:1.5; font-size:.875rem; background:var(--theme-color,#195c9b); color:white; }
.mail-menu-content { position:absolute; inset-inline-start:0; top:calc(100% + 6px); z-index:110; width:200px; max-width:85vw; display:grid; padding:8px; background:white; border:1px solid var(--theme-color,#195c9b); border-radius:8px; box-shadow:0 6px 18px #0002; }
.mail-menu-content a { display:block; padding:8px 12px; border-radius:5px; }
.user-menu summary, .user-menu-content { color:var(--theme-color,#195c9b); background:color-mix(in srgb,var(--theme-color,#195c9b) 8%,white); border:1px solid var(--theme-color,#195c9b); }
.user-menu-content a, .user-menu-content button { color:var(--theme-color,#195c9b); background:color-mix(in srgb,var(--theme-color,#195c9b) 12%,white); border-radius:6px; padding:8px 12px; }
.user-menu-content a:hover, .user-menu-content button:hover, .mail-menu-content a:hover { background:var(--theme-color,#195c9b); color:white; text-decoration:none; }
.user-menu summary:focus-visible, .user-menu-content :focus-visible { outline-color:var(--theme-color,#195c9b); }

/* Parsian workspace: presentation only, no external assets or fonts. */
.icon-definitions { position:absolute; width:0; height:0; overflow:hidden; }
.icon { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; vertical-align:middle; }

.workspace header { margin-inline-start:240px; background:var(--surface); border-color:var(--line); box-shadow:none; }
.workspace .app-header { width:auto; margin:0 32px; min-height:84px; gap:18px; }
.workspace .app-header .company-logo { width:172px; height:60px; max-height:60px; }
.workspace .logo-link { border-radius:8px; background:white; padding:0 6px; }
.workspace .home-button { margin:0; width:36px; height:36px; background:var(--soft); color:var(--theme-color)!important; }
.header-search { display:flex; align-items:center; gap:10px; margin-inline-start:auto; width:min(420px,45%); }
.workspace .header-search input { border:0; background:transparent; padding:8px 0; font-size:12px; }
.workspace .header-search button { padding:6px 12px; font-size:12px; }
.workspace a, .workspace .count { color:var(--theme-color); }
.workspace button:not(.secondary), .workspace .button:not(.secondary), .workspace td .row-action { background:var(--theme-color); border-color:var(--theme-color); color:var(--surface); }
.workspace .secondary, .workspace .button.secondary { background:var(--soft); color:var(--theme-color); }
.workspace button, .workspace .button { border-radius:9px; display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.workspace input, .workspace select, .workspace textarea { background:var(--surface); color:var(--text); border-color:var(--line); }
.workspace input::placeholder { color:var(--muted); }
.workspace .panel { background:var(--surface); border-color:var(--line); border-radius:16px; box-shadow:0 3px 16px #1b345003; }
.workspace main.container { width:auto; max-width:1600px; margin:0 272px 0 32px; padding:22px 0 36px; }
.workspace main > p:has(.back-button) { margin:0 0 18px; }
.workspace .back-button { min-height:30px; padding:4px 12px; font-size:11px; background:transparent; color:var(--muted); }
.workspace-nav { position:fixed; inset:0 0 0 auto; width:240px; z-index:110; display:flex; flex-direction:column; align-items:stretch; flex-wrap:nowrap; gap:5px; padding:26px 18px; overflow-y:auto; background:var(--surface); border-inline-end:1px solid var(--line); }
.sidebar-title { padding:4px 14px 22px; font-weight:bold; font-size:21px; color:var(--text); }
.sidebar-title small, .sidebar-note small { display:block; font-size:11px; font-weight:normal; color:var(--muted); }
.nav-caption { font-size:10px; color:var(--muted); padding:18px 14px 6px; }
.workspace .workspace-nav a, .workspace-nav .mail-menu summary, .coming { display:flex; align-items:center; gap:12px; padding:10px 14px; border-radius:9px; font-size:12px; color:var(--muted); background:transparent; }
.workspace .workspace-nav a:hover, .workspace .workspace-nav a[aria-current=page] { background:var(--soft); color:var(--theme-color); text-decoration:none; }
.workspace-nav .mail-menu summary::before { content:'✉'; width:22px; font-size:22px; line-height:1; text-align:center; }
.workspace-nav .mail-menu-content { position:static; width:auto; max-width:none; padding:2px 12px 2px 0; border:0; box-shadow:none; background:var(--surface); }
.coming { opacity:.8; }
.coming small { margin-inline-start:auto; padding:1px 6px; border-radius:5px; background:var(--canvas); font-size:9px; white-space:nowrap; }
.sidebar-note { margin-top:auto; padding:28px 14px 0; font-size:12px; border-top:1px solid var(--line); color:var(--muted); }
.sidebar-toggle { display:none!important; }
.workspace .user-menu summary, .workspace .user-menu-content { color:var(--text); background:var(--surface); border:1px solid var(--line); }
.workspace .user-menu summary { background:var(--soft); color:var(--theme-color); }
.workspace .user-menu-content { z-index:150; text-align:right; box-shadow:0 12px 35px #0002; }
.workspace .user-menu-content a, .workspace .user-menu-content button { color:var(--theme-color); background:var(--soft); }
.workspace .user-menu-content a:hover, .workspace .user-menu-content button:hover { background:var(--theme-color); color:var(--surface); }
.workspace .user-menu-content small, .workspace .user-menu-content label { font-size:11px; color:var(--muted); }
.dashboard-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:28px; }
.dashboard-heading h1 { font-size:23px; margin:4px 0; letter-spacing:-.5px; }
.dashboard-heading p { color:var(--muted); font-size:12px; margin:0; }
.dashboard-heading .eyebrow { color:var(--theme-color); font-size:11px; }
.workspace .stats { gap:18px; margin-bottom:24px; }
.workspace .stat-card { position:relative; padding:24px; border:1px solid color-mix(in srgb,var(--tone) 18%,var(--line)); background:color-mix(in srgb,var(--tone) 7%,var(--surface)); }
.blue-card { --tone:#488ac3; }.green-card { --tone:#4c9a7e; }.purple-card { --tone:#9374bf; }
.stat-card h2, .stat-card h2 a { font-size:12px; color:var(--text); }
.stat-card .count { color:var(--text); font-size:34px; font-weight:bold; line-height:1.6; padding-top:12px; }
.stat-card small { font-size:10px; color:var(--muted); }
.stat-icon { position:absolute; left:22px; top:22px; display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background:color-mix(in srgb,var(--tone) 14%,var(--surface)); color:var(--tone); }
.section-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:20px; }
.section-heading h2, .tracking-panel h2 { font-size:14px; font-weight:bold; color:var(--text); }
.section-heading small, .section-heading > a { font-size:10px; }
.section-heading small { color:var(--muted); }
.workspace .quick-panel { padding:20px 24px; }
.quick-panel .dashboard-actions { margin:0; }
.workspace .dashboard-actions .mail-menu summary { background:var(--soft); color:var(--theme-color); border-radius:9px; }
.workspace .mail-menu-content { background:var(--surface); border-color:var(--line); }
.workspace .mail-menu-content a:hover { background:var(--soft); color:var(--theme-color); }
.dashboard-grid { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:20px; align-items:start; }
.workspace .correspondence-panel { min-width:0; padding:24px 0 8px; }
.correspondence-panel .section-heading { padding:0 24px; }
.workspace th { background:var(--canvas); color:var(--muted); font-size:11px; font-weight:normal; }
.workspace td, .workspace th { border-color:var(--line); padding:14px 16px; font-size:11px; }
.workspace .mail-panel { background:var(--surface); }
.workspace .message-meta { background:var(--soft); color:var(--text); border-color:var(--line); }
.workspace .message { background:var(--soft); color:var(--text); }
.status-pill { display:inline-block; white-space:nowrap; padding:3px 8px; border-radius:6px; color:var(--muted); background:var(--canvas); font-size:10px; }
.status-pill.is-unread { color:var(--theme-color); background:var(--soft); }
.empty-state { text-align:center; padding:42px 20px!important; color:var(--muted); }
.empty-state > .icon { width:32px; height:32px; opacity:.6; }
.empty-state p { margin:10px 0 4px; }.empty-state small { font-size:10px; }
.workspace .tracking-panel { background:color-mix(in srgb,#c7aa78 8%,var(--surface)); }
.tracking-panel p { color:var(--muted); font-size:11px; }
.tracking-icon { display:grid; place-items:center; width:40px; height:40px; border-radius:12px; background:var(--surface); color:var(--theme-color); margin-bottom:14px; }
.tracking-panel .tracking-form { display:grid; gap:10px; }
.tracking-panel label { font-size:10px; color:var(--muted); margin:0; }
.tracking-panel input { min-width:0; font-size:11px; }
.tracking-panel button { width:100%; font-size:12px; }
@media(min-width:1850px) { .workspace main.container { margin-inline-end:auto; margin-inline-start:280px; } }
@media(max-width:1150px) { .dashboard-grid { grid-template-columns:1fr; }.tracking-panel .tracking-form { grid-template-columns:1fr auto; }.tracking-panel label { grid-column:1/-1; }.header-search { width:40%; }.workspace main.container { margin:0 262px 0 22px; } }
@media(max-width:850px) {
 .workspace header { margin:0; }.workspace .app-header { margin:0 18px; gap:12px; min-height:74px; }
 .workspace .sidebar-toggle { display:inline-flex!important; padding:8px 12px; }
 .workspace-nav { display:none; top:74px; box-shadow:-12px 12px 35px #0002; }
 .nav-open .workspace-nav { display:flex; }
 .workspace main.container { margin:0 20px; }
 .header-search { width:auto; flex:1; }.header-search input { min-width:50px; }.header-search button { display:none; }
 .workspace .app-header .company-logo { width:132px; height:46px; }
 .dashboard-heading h1 { font-size:20px; }
}
@media(max-width:600px) {
 .workspace .app-header { flex-wrap:wrap; padding:12px 0; gap:10px; }
 .workspace .home-button { margin-inline-start:auto; }.header-search { order:5; flex-basis:100%; background:var(--canvas); border-radius:8px; padding:0 10px; }
 .workspace-nav { top:120px; }.workspace main.container { margin:0 14px; padding-top:14px; }
 .dashboard-heading { align-items:flex-start; flex-direction:column; gap:12px; margin-bottom:18px; }
 .dashboard-heading > .button { font-size:12px; }.workspace .stats { grid-template-columns:1fr; gap:12px; }
 .workspace .stat-card { padding:18px 22px; }.stat-card .count { font-size:30px; padding-top:4px; }
 .workspace .quick-panel { padding:18px; }.dashboard-actions { gap:8px; }
 .dashboard-actions > a, .workspace .dashboard-actions .mail-menu summary { padding:9px 12px; font-size:11px; }
 .section-heading { gap:8px; }.section-heading > small { display:none; }.workspace .panel { border-radius:12px; }
 .workspace .user-menu-content { width:210px; }
}

/* Operation colors follow the live theme; Final Save is deliberately fixed gold. */
.workspace .mail-panel td, .workspace .mail-panel th { border-color:var(--line); }
.workspace td button.secondary { background:var(--soft); border-color:var(--line); color:var(--theme-color); }
.workspace td :is(button,.row-action):not(.final-save):hover { background:color-mix(in srgb,var(--theme-color) 85%,var(--text)); border-color:var(--theme-color); color:var(--surface); }
.workspace tbody tr:hover { background:var(--soft); }
.workspace :focus-visible { outline-color:var(--theme-color); }
.workspace .workspace-nav a.backup-button, .workspace .mail-panel td .row-action.final-save { background:linear-gradient(135deg,#fff5c9 0%,#eed388 45%,#fff0b3 65%,#ddbd6b 100%); border:1px solid #c5a44e; color:#493913; box-shadow:inset 0 1px 0 #fff9df; }
.workspace .workspace-nav a.backup-button:hover, .workspace .mail-panel td .row-action.final-save:hover { background:linear-gradient(135deg,#fff0b3,#e4c373 45%,#ffedac 65%,#d4af55); border-color:#ae8c36; color:#493913; }
.workspace .workspace-nav a.backup-button:focus-visible, .workspace .mail-panel td .row-action.final-save:focus-visible { outline-color:#ae8c36; }
