:root{
  --bg:#f4f7fb;--panel:#fff;--text:#172033;--muted:#6b7280;--line:#e4e9f1;
  --nav:#0d1b2a;--nav2:#12263a;--accent:#2359d6;--accent2:#e8efff;--success:#16794a;
  --shadow:0 10px 30px rgba(16,35,65,.08);--radius:16px
}
*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--accent);text-decoration:none}.app-shell{min-height:100vh;display:grid;grid-template-columns:260px 1fr;align-items:start;background:linear-gradient(180deg,var(--nav),var(--nav2)) 0 0/260px 100% no-repeat,var(--bg)}
.sidebar{background:linear-gradient(180deg,var(--nav),var(--nav2));color:#d7e1ef;padding:24px 18px;position:sticky;top:0;min-height:100vh;max-height:100vh;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column}
.brand{display:flex;gap:12px;align-items:center;color:#fff;margin-bottom:28px}.brand span{display:block;color:#8fa6bf;font-size:12px;margin-top:2px}
.brand-mark{width:40px;height:40px;border-radius:12px;background:#fff;color:var(--nav);display:grid;place-items:center;font-weight:800;letter-spacing:-.04em}.brand-mark.large{width:56px;height:56px;margin:auto;font-size:20px}
nav{display:grid;gap:5px}nav a{color:#dce7f4;padding:10px 12px;border-radius:10px}nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.nav-label{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#6f8aa6;padding:18px 12px 6px}.sidebar-bottom{margin-top:auto;border-top:1px solid rgba(255,255,255,.1);padding-top:16px;padding-bottom:8px;background:transparent}
.small{font-size:13px}.link-button{background:none;border:0;color:#9fb3c8;padding:8px 0;cursor:pointer}
.main{min-width:0;background:var(--bg)}.topbar{height:78px;background:#fff;border-bottom:1px solid var(--line);padding:14px 30px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:5}
.eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#8491a3}.top-title{font-size:20px;font-weight:750}.role-chip,.badge{font-size:12px;padding:6px 9px;border-radius:999px;background:var(--accent2);color:#244a9d;display:inline-block}
.content{padding:28px;max-width:1500px;margin:auto}.hero{background:linear-gradient(135deg,#0e2237,#173f65);color:#fff;padding:32px;border-radius:20px;display:flex;justify-content:space-between;gap:24px;align-items:end;box-shadow:var(--shadow)}
.hero h1{margin:8px 0 8px;font-size:32px;max-width:700px}.hero p{margin:0;color:#c7d7e8;max-width:720px}.hero .eyebrow{color:#8eb5db}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:#fff;color:var(--text);padding:10px 14px;border-radius:10px;font-weight:650;cursor:pointer}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.ghost{background:transparent}.btn.full{width:100%}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:18px 0}.stat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
.stat span,.stat a{display:block}.stat strong{display:block;font-size:38px;margin:8px 0}.stat a{font-size:13px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}.panel.narrow{max-width:900px;margin:auto}
.panel-head,.detail-head,.toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px}.panel h2{font-size:17px;margin:0 0 16px}.panel-head h2{margin:0}
.item-row{display:flex;justify-content:space-between;gap:15px;padding:14px 0;border-top:1px solid var(--line);color:var(--text)}.item-row span{display:block;color:var(--muted);font-size:12px;margin-top:3px}.item-row time{font-size:12px;color:var(--muted);white-space:nowrap}
.toolbar{margin-bottom:16px}.filters{display:flex;gap:8px;flex-wrap:wrap}.filters input,.filters select,.form-control,input,select,textarea{border:1px solid #ced6e0;border-radius:9px;padding:10px 12px;background:#fff;max-width:100%}
.filters input{min-width:280px}.table-wrap{overflow:auto;padding:0}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top}th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#7b8798;background:#fafbfd}.muted,.hint{color:var(--muted);font-size:13px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.card{display:block;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;color:var(--text);box-shadow:var(--shadow)}.card:hover{transform:translateY(-1px)}.card-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted)}.card h3{margin:14px 0 7px}.card p{color:var(--muted);margin:0;line-height:1.5}
.detail-head{margin-bottom:18px}.detail-head h1{margin:8px 0 4px}.detail-head p{margin:0;color:var(--muted)}.actions{display:flex;gap:8px;flex-wrap:wrap}
.meta{display:grid;grid-template-columns:150px 1fr;gap:10px 14px}.meta dt{color:var(--muted)}.meta dd{margin:0}.note{margin-top:18px;padding:14px;border-radius:12px;background:#f7f9fc}.note.subtle{background:#fbfbfc}
.timeline{display:grid;grid-template-columns:14px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}.timeline .dot{width:8px;height:8px;margin-top:6px;border-radius:50%;background:var(--accent)}.timeline span{display:block;color:var(--muted);font-size:12px;margin:2px 0 7px}pre{white-space:pre-wrap;font-family:inherit;background:#f7f9fc;padding:12px;border-radius:10px}
.comment{padding:12px 0;border-bottom:1px solid var(--line)}.comment div{display:flex;justify-content:space-between;gap:10px}.comment span{font-size:12px;color:var(--muted)}.comment p{margin:8px 0 0}
.attachments{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.attachment{border:1px solid var(--line);border-radius:10px;padding:12px;color:var(--text)}.attachment span{display:block;color:var(--muted);font-size:11px;margin-top:5px}.inline-form{margin-top:16px;display:flex;gap:10px;align-items:end;flex-wrap:wrap}
.stack p{display:grid;gap:6px}.stack label{font-size:13px;font-weight:650}.stack input,.stack select,.stack textarea{width:100%}.stack.compact{margin-top:16px}.empty{color:var(--muted)}
.messages{padding:12px 28px 0}.message{padding:10px 14px;border-radius:10px;background:#eef3ff}.message.success{background:#e9f8f0;color:#176541}.message.error{background:#fff0f0;color:#9e2d2d}
.login-shell{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top,#203d5d,#091421)}.login-card{width:min(92vw,420px);background:#fff;border-radius:20px;padding:32px;box-shadow:0 30px 80px rgba(0,0,0,.28);text-align:center}.login-card h1{margin-bottom:8px}.login-card .stack{text-align:left;margin-top:20px}
.article{max-width:1000px;margin:auto}.article-body{line-height:1.7;font-size:16px}
@media(max-width:1000px){.app-shell{grid-template-columns:210px 1fr}.grid-2,.cards{grid-template-columns:1fr}.stats{grid-template-columns:1fr}.hero{align-items:start;flex-direction:column}}
@media(max-width:760px){.app-shell{display:block}.sidebar{position:relative;height:auto}.sidebar nav{grid-template-columns:1fr 1fr}.nav-label{grid-column:1/-1}.main{width:100%}.topbar{position:relative}.content{padding:16px}.toolbar,.detail-head{align-items:stretch;flex-direction:column}.filters{width:100%}.filters input,.filters select{width:100%;min-width:0}.attachments{grid-template-columns:1fr}.meta{grid-template-columns:1fr}.meta dt{margin-top:8px}}

.stats.stats-three{grid-template-columns:repeat(3,minmax(0,1fr))}.stat small{display:block;color:var(--muted);margin-top:6px}.stats-hero{margin-bottom:18px}
@media(max-width:1000px){.stats.stats-three{grid-template-columns:1fr}}

.planner-nav{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}.planner-nav-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;display:flex;gap:14px;align-items:center;color:var(--text);box-shadow:var(--shadow)}.planner-nav-card span{display:block}.planner-nav-card div span{color:var(--muted);font-size:13px;margin-top:3px}.planner-icon{width:42px;height:42px;border-radius:12px;background:var(--accent2);display:grid!important;place-items:center;font-size:21px;color:var(--accent)}
.todo-card{padding:14px 0;border-bottom:1px solid var(--line)}.todo-card:last-child{border-bottom:0}.todo-main{display:flex;justify-content:space-between;gap:16px}.todo-meta{display:flex;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:12px;margin:8px 0 12px}.todo-done{opacity:.58}.todo-done strong{text-decoration:line-through}
.calendar-titlebar{display:flex;align-items:center;gap:12px}.calendar-titlebar h1{font-size:22px;margin:0;min-width:190px;text-align:center}.calendar-legend{display:flex;gap:18px;margin:0 0 12px;font-size:13px;color:var(--muted)}.legend{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}.legend.personal{background:#2359d6}.legend.shared{background:#16794a}.calendar-panel{padding:0;overflow:auto}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(135px,1fr));min-width:945px}.calendar-head>div{padding:10px 12px;background:#fafbfd;border-bottom:1px solid var(--line);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#7b8798}.calendar-day{min-height:132px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:8px;background:#fff}.calendar-day:nth-child(7n){border-right:0}.calendar-empty{background:#f7f9fc}.day-number{font-weight:750;font-size:13px;margin-bottom:6px}.day-events{display:grid;gap:5px}.calendar-event{display:block;border-radius:7px;padding:6px 7px;font-size:11px;line-height:1.3}.calendar-event strong,.calendar-event span{display:block}.calendar-event span{opacity:.75;margin-top:2px}.calendar-event.personal{background:#e8efff;color:#244a9d}.calendar-event.shared{background:#e9f8f0;color:#176541}@media(max-width:760px){.planner-nav{grid-template-columns:1fr}}


/* =========================================================
   v1.6 - Shared Inbox
   ========================================================= */
.shared-mail-hero{margin-bottom:18px}
.shared-mail-list{padding:0;overflow:hidden}
.mail-thread-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 18px;border-bottom:1px solid var(--line);color:var(--text);background:#fff}
.mail-thread-row:last-child{border-bottom:0}.mail-thread-row:hover{background:#f8faff}.mail-thread-row.closed{opacity:.7}
.mail-thread-person{display:flex;align-items:center;gap:12px;min-width:0}.mail-thread-person>div{min-width:0}.mail-thread-person strong,.mail-thread-person span{display:block}.mail-thread-person span{color:var(--muted);font-size:13px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:780px}
.mail-avatar{width:38px;height:38px;flex:0 0 38px;border-radius:50%;display:grid;place-items:center;background:#e8efff;color:#244a9d;font-weight:800}
.mail-thread-meta{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;font-size:12px;color:var(--muted);white-space:nowrap}.mail-assigned{background:#f3f6fa;padding:5px 8px;border-radius:999px}
.mail-help{margin-top:18px}.mail-help code{background:#f3f6fa;padding:2px 6px;border-radius:6px}
.mail-thread-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:18px;align-items:start}
.mail-conversation{display:grid;gap:14px}.mail-message{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;box-shadow:var(--shadow)}
.mail-message.inbound{border-left:4px solid #7d96b2}.mail-message.outbound{border-left:4px solid #2359d6;background:#f8faff}
.mail-message header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.mail-message header time{font-size:12px;color:var(--muted);white-space:nowrap}
.mail-message-direction{display:flex;gap:10px;align-items:center}.mail-message-direction strong,.mail-message-direction span{display:block}.mail-message-direction span{font-size:12px;color:var(--muted);margin-top:2px}
.direction-icon{width:30px;height:30px;border-radius:9px;display:grid!important;place-items:center!important;font-size:17px!important;margin:0!important}.direction-icon.inbound{background:#eef2f6;color:#40566d}.direction-icon.outbound{background:#e8efff;color:#2359d6}
.mail-addresses{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin:12px 0}.mail-message h3{font-size:16px;margin:12px 0}.mail-body{line-height:1.65;white-space:normal;overflow-wrap:anywhere}
.mail-attachments{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px}.reply-panel{margin-top:2px}.mail-thread-sidebar{position:sticky;top:96px}.compact-meta{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
@media(max-width:1000px){.mail-thread-layout{grid-template-columns:1fr}.mail-thread-sidebar{position:static}.mail-thread-row{align-items:flex-start}.mail-thread-meta{justify-content:flex-start}}
@media(max-width:700px){.mail-thread-row{flex-direction:column}.mail-thread-person span{max-width:75vw}.mail-attachments{grid-template-columns:1fr}}


/* =========================================================
   v1.6.2 - Systemdiagnostik
   ========================================================= */
.diagnostics-hero{margin-bottom:18px}
.diagnostic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.diagnostic-card{display:grid;grid-template-columns:46px minmax(0,1fr);gap:14px}
.diagnostic-icon{width:44px;height:44px;border-radius:12px;background:#eef3ff;color:#2359d6;display:grid;place-items:center;font-size:21px;font-weight:800}
.diagnostic-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.diagnostic-card h2{margin:3px 0 16px}
.diagnostic-meta{grid-template-columns:78px 1fr;font-size:13px;margin-bottom:18px}
.diagnostic-card .hint{line-height:1.45;margin:10px 0 0}
.break-anywhere{overflow-wrap:anywhere}
.diagnostics-note{margin-top:18px}
.mail-flow{display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding:14px 0}
.mail-flow span{background:#f6f8fb;border:1px solid var(--line);padding:8px 10px;border-radius:9px}
.mail-flow strong{color:var(--muted);font-size:12px}
@media(max-width:1100px){.diagnostic-grid{grid-template-columns:1fr}}


/* =========================================================
   v1.6.3 - Extended IMAP certificate diagnostics
   ========================================================= */
.diagnostic-result{
  margin-top:16px;
  border:1px solid var(--line);
  border-radius:12px;
  padding:14px;
  background:#fafbfd;
}
.diagnostic-result h3{margin:0 0 12px}
.diagnostic-status-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-bottom:14px;
}
.diagnostic-status-grid>div{
  border:1px solid var(--line);
  border-radius:9px;
  padding:9px 10px;
  background:#fff;
}
.diagnostic-status-grid span{
  display:block;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--muted);
  margin-bottom:3px;
}
.diagnostic-ok{border-left:4px solid #4a9f67}
.diagnostic-error{border-left:4px solid #c95858}
.certificate-box{
  margin-top:12px;
  padding:12px;
  border-radius:10px;
  background:#fff;
  border:1px solid var(--line);
}
.certificate-box h4{margin:0 0 10px}
.diagnostic-result-meta{margin-top:10px}
.status-danger{color:#b63f3f}
.status-success{color:#2d7c48}
.diagnostic-error-text{
  margin-top:10px;
  padding:9px 10px;
  border-radius:8px;
  background:#fff3f3;
  overflow-wrap:anywhere;
}
.diagnostic-security-note{
  margin:12px 0 0;
  font-size:12px;
  line-height:1.45;
  color:var(--muted);
}
@media(max-width:600px){
  .diagnostic-status-grid{grid-template-columns:1fr}
}


/* =========================================================
   v1.6.4 - Certifi CA / IMAP TLS
   ========================================================= */
.ca-comparison{
  margin-top:12px;
  padding:12px;
  border-radius:10px;
  background:#fff;
  border:1px solid var(--line);
}
.ca-comparison h4{margin:0 0 10px}
.ca-comparison small{
  display:block;
  margin-top:5px;
  color:var(--muted);
  overflow-wrap:anywhere;
  line-height:1.35;
}
.runtime-ca-info{
  margin-top:12px;
  padding:10px 12px;
  border-radius:9px;
  background:#f7f9fc;
  border:1px solid var(--line);
  font-size:12px;
  line-height:1.6;
}

/* =========================================================
   v1.7.0 - Mail templates, copy view and rich text editor
   ========================================================= */
.compose-intro{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.compose-intro h2{margin:0 0 6px}.compose-intro p{margin:0}
.rich-editor-shell{border:1px solid #ced6e0;border-radius:10px;background:#fff;overflow:hidden}
.rich-editor-toolbar{display:flex;gap:5px;flex-wrap:wrap;padding:8px;background:#f7f9fc;border-bottom:1px solid var(--line)}
.rich-editor-btn{border:1px solid #d4dbe5;background:#fff;color:var(--text);border-radius:7px;padding:6px 9px;font:inherit;font-size:12px;cursor:pointer}
.rich-editor-btn:hover{background:#eef3ff;border-color:#b9c8ea}
.rich-editor{min-height:260px;padding:14px 16px;outline:none;line-height:1.6;overflow-wrap:anywhere}
.rich-editor:empty:before{content:attr(data-placeholder);color:#9aa4b2;pointer-events:none}
.rich-editor p{margin:0 0 12px}.rich-editor h2,.rich-editor h3{margin:14px 0 8px}.rich-editor ul,.rich-editor ol{padding-left:24px}
.wysiwyg-source-hidden{display:none!important}
.locked-recipient-note{margin:12px 0 16px;padding:11px 13px;border:1px solid #cfd9ec;border-radius:9px;background:#f3f7ff;color:#314a70;font-size:13px;line-height:1.45}
input[disabled].form-control{background:#f4f6f9;color:#536172;cursor:not-allowed}
.template-detail-grid{align-items:start}.template-body-heading{margin-top:24px!important}
.copy-field{padding:12px 14px;border:1px solid var(--line);border-radius:9px;background:#f9fafc;margin:0 0 10px;overflow-wrap:anywhere}
.template-preview{min-height:240px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:18px;line-height:1.65;overflow-wrap:anywhere}
.template-preview p,.rich-mail-body p{margin:0 0 12px}.template-preview ul,.template-preview ol,.rich-mail-body ul,.rich-mail-body ol{padding-left:24px}
.template-copy-actions{margin-top:12px}.table-actions{display:flex;gap:12px;flex-wrap:wrap;white-space:nowrap}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:760px){.compose-intro{flex-direction:column}.rich-editor-toolbar{gap:4px}.rich-editor-btn{padding:6px 7px}}


/* =========================================================
   v1.7.1 - Manuella bud
   ========================================================= */
.manual-bid-filters{
  display:grid;
  grid-template-columns:minmax(280px,1fr) 170px auto;
  gap:10px;
}
.table-wrap{overflow-x:auto}
.manual-bids-table{min-width:1120px}
.manual-bids-table .num{text-align:right;white-space:nowrap}
.manual-bids-table .actions{text-align:right}
.form-grid.two{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.form-grid .full-span{grid-column:1/-1}
.manual-bid-form h2{
  margin-top:26px;
  margin-bottom:12px;
  font-size:18px;
}
.manual-bid-form h2:first-of-type{margin-top:0}
.calculated-value{
  min-height:42px;
  display:flex;
  align-items:center;
  padding:9px 12px;
  border-radius:9px;
  background:#f5f8fc;
  border:1px solid var(--line);
  font-size:18px;
  font-weight:700;
}
.detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-bottom:18px;
}
.detail-list{
  display:grid;
  grid-template-columns:180px minmax(0,1fr);
  gap:10px 16px;
}
.detail-list dt{
  color:var(--muted);
  font-weight:600;
}
.detail-list dd{
  margin:0;
  overflow-wrap:anywhere;
}
.bid-metrics{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}
.bid-metrics>div{
  padding:14px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#f8fafc;
}
.bid-metrics span{
  display:block;
  color:var(--muted);
  font-size:12px;
  margin-bottom:5px;
}
.bid-metrics strong{font-size:17px}
.preline{white-space:pre-line}
.danger-zone{margin-top:18px}
.btn.danger{
  border-color:#c84d4d;
  color:#a83737;
  background:#fff;
}
@media(max-width:1050px){
  .bid-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:850px){
  .manual-bid-filters{grid-template-columns:1fr}
  .form-grid.two,.detail-grid,.bid-metrics{grid-template-columns:1fr}
  .form-grid .full-span{grid-column:auto}
  .detail-list{grid-template-columns:1fr;gap:3px 0}
  .detail-list dd{margin-bottom:9px}
}


/* =========================================================
   v1.7.2 - Manual bid workflow
   ========================================================= */
.manual-bid-form-head,
.manual-bids-head{
  align-items:flex-end;
}
.manual-bid-workflow{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.workflow-steps{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:8px;
  margin-bottom:2px;
}
.workflow-steps span{
  padding:9px 10px;
  border-radius:9px;
  background:#eaf0fb;
  color:#3d5f91;
  font-size:12px;
  font-weight:700;
  text-align:center;
}
.workflow-card{
  padding:22px;
}
.workflow-card-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding-bottom:18px;
  margin-bottom:18px;
  border-bottom:1px solid var(--line);
}
.workflow-card-head h2{
  margin:0 0 4px;
  font-size:18px;
}
.workflow-card-head p{
  margin:0;
  color:var(--muted);
  font-size:13px;
}
.step-number{
  flex:0 0 34px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#245dd8;
  color:#fff;
  font-weight:800;
}
.party-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.party-card{
  padding:16px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#f9fbfe;
}
.party-title{
  margin-bottom:12px;
  font-size:15px;
  font-weight:800;
}
.party-inline{
  display:grid;
  grid-template-columns:minmax(0,1fr) 110px;
  gap:12px;
}
.country-field input{
  text-transform:uppercase;
}
.pricing-flow{
  display:grid;
  grid-template-columns:minmax(140px,1fr) auto minmax(140px,1fr) auto minmax(140px,1fr) auto minmax(140px,1fr);
  gap:12px;
  align-items:end;
}
.pricing-arrow{
  padding-bottom:14px;
  color:#7d8da5;
  font-size:22px;
  font-weight:700;
}
.metric-field input,
.metric-field .calculated-value{
  min-height:44px;
}
.bid-highlight input{
  border-color:#7aa2f7;
  box-shadow:0 0 0 2px rgba(36,93,216,.07);
}
.pricing-meta{
  margin-top:18px;
}
.workflow-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  padding:4px 0 18px;
}
.manual-bid-toolbar{
  margin-bottom:14px;
}
.manual-bid-table-panel{
  padding:0;
  overflow:hidden;
}
.manual-bids-table{
  margin:0;
}
.manual-bids-table th{
  white-space:nowrap;
}
.table-subtext{
  margin-top:3px;
  color:var(--muted);
  font-size:11px;
  line-height:1.3;
}
.listing-link{
  display:inline-flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;
  font-weight:700;
  text-decoration:none;
}
.listing-link:hover{
  text-decoration:underline;
}
.search-grow{
  min-width:0;
}
.search-grow input{
  width:100%;
}
@media(max-width:1150px){
  .pricing-flow{
    grid-template-columns:1fr 1fr;
  }
  .pricing-arrow{
    display:none;
  }
}
@media(max-width:850px){
  .workflow-steps{
    grid-template-columns:1fr;
  }
  .workflow-steps span{
    text-align:left;
  }
  .party-grid{
    grid-template-columns:1fr;
  }
  .party-inline{
    grid-template-columns:1fr 100px;
  }
  .pricing-flow{
    grid-template-columns:1fr;
  }
  .workflow-actions{
    justify-content:stretch;
  }
  .workflow-actions .btn{
    flex:1;
    text-align:center;
  }
}


/* =========================================================
   v1.8.0 - Wiki + Ordlista
   ========================================================= */
.wiki-index-head,.glossary-head,.wiki-form-head{align-items:flex-end}
.wiki-search-panel,.glossary-tools{margin-bottom:16px}
.wiki-search-form,.glossary-search{display:flex;gap:10px;align-items:center}
.wiki-search-form input,.glossary-search input{min-width:280px;flex:1}
.wiki-search-form select{min-width:190px}
.wiki-index-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.wiki-index-card{padding:20px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:0 1px 2px rgba(19,36,60,.03)}
.wiki-index-card h2{margin:8px 0 8px;font-size:20px;line-height:1.25}.wiki-index-card h2 a{text-decoration:none;color:var(--text)}
.wiki-index-card h2 a:hover{text-decoration:underline}.wiki-index-card p{margin:0 0 14px;color:#536172;line-height:1.55}
.wiki-card-meta{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:11px}.wiki-category{display:inline-flex;padding:4px 8px;border-radius:999px;background:#edf3ff;color:#315f9d;font-size:11px;font-weight:700}
.wiki-read-more{font-weight:700;text-decoration:none}.wiki-empty{grid-column:1/-1}
.glossary-tools{display:flex;align-items:center;justify-content:space-between;gap:16px}.glossary-count{color:var(--muted);white-space:nowrap;font-size:13px}
.alphabet-index{display:flex;gap:5px;flex-wrap:wrap;margin:0 0 16px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#fff;position:sticky;top:10px;z-index:2}
.alphabet-index a{display:grid;place-items:center;min-width:30px;height:30px;border-radius:7px;text-decoration:none;font-size:12px;font-weight:800;color:#315f9d}.alphabet-index a:hover{background:#edf3ff}
.glossary-sheet{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.glossary-letter-section{display:grid;grid-template-columns:68px minmax(0,1fr);border-bottom:1px solid var(--line);scroll-margin-top:68px}.glossary-letter-section:last-child{border-bottom:0}
.glossary-letter{padding:22px 16px;background:#f5f8fc;color:#204d86;font-size:24px;font-weight:800;text-align:center}
.glossary-entries{min-width:0}.glossary-entry{padding:18px 22px;border-bottom:1px solid #edf0f4;scroll-margin-top:78px}.glossary-entry:last-child{border-bottom:0}
.glossary-term-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.glossary-term-row h2{margin:0 0 5px;font-size:17px}.glossary-definition{line-height:1.55;color:#3d4856}.glossary-category{margin-top:7px;color:var(--muted);font-size:11px}.glossary-edit{font-size:11px;text-decoration:none;white-space:nowrap}
.wiki-breadcrumb{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-bottom:14px;color:var(--muted);font-size:12px}.wiki-breadcrumb a{text-decoration:none;font-weight:700}
.wiki-article-layout{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:20px;align-items:start}.wiki-article{background:#fff;border:1px solid var(--line);border-radius:12px;padding:30px;min-width:0}
.wiki-article-header{padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:24px}.wiki-article-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.wiki-article-title-row h1{font-size:34px;line-height:1.15;margin:8px 0 0;letter-spacing:-.02em}
.wiki-lead{font-size:17px;line-height:1.65;color:#465567;max-width:820px;margin:16px 0 10px}.wiki-article-meta{font-size:11px;color:var(--muted)}
.wiki-article-body{font-size:15px;line-height:1.72;color:#263444}.wiki-article-body p{margin:0 0 16px}.wiki-article-body h2{font-size:23px;margin:32px 0 12px;padding-bottom:7px;border-bottom:1px solid #dde3eb;scroll-margin-top:20px}.wiki-article-body h3{font-size:18px;margin:24px 0 10px;scroll-margin-top:20px}.wiki-article-body ul,.wiki-article-body ol{padding-left:26px;margin:0 0 18px}.wiki-article-body blockquote{margin:18px 0;padding:12px 16px;border-left:4px solid #9db7de;background:#f5f8fc;color:#45566c}.wiki-article-body a{overflow-wrap:anywhere}
.wiki-article-footer{display:flex;justify-content:space-between;gap:16px;margin-top:32px;padding-top:16px;border-top:1px solid var(--line);font-size:11px;color:var(--muted)}
.wiki-toc{position:sticky;top:18px;padding:16px;border:1px solid var(--line);border-radius:10px;background:#fff}.wiki-toc-title{font-weight:800;margin-bottom:10px}.wiki-toc nav{display:flex;flex-direction:column;gap:7px}.wiki-toc a{text-decoration:none;font-size:12px;line-height:1.35;color:#405b7d}.wiki-toc a:hover{text-decoration:underline}.wiki-toc a.toc-level-3{padding-left:12px;color:#68788c}
.wiki-form{display:flex;flex-direction:column;gap:16px}.wiki-form-main{padding:22px}.wiki-form-type-row{display:grid;grid-template-columns:220px 1fr;gap:16px;align-items:end;margin-bottom:16px}.wiki-active-field{display:flex;align-items:center;padding-bottom:9px}.wiki-active-field label,.visibility-check label{display:flex;gap:8px;align-items:center;font-weight:600}.wiki-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.wiki-form-main>.field,.wiki-form-main>.wiki-form-grid{margin-bottom:16px}.wiki-visibility-panel{padding:0}.wiki-visibility-panel summary{cursor:pointer;padding:16px 20px;font-weight:800}.wiki-visibility-content{padding:0 20px 20px}.wiki-form-actions{display:flex;justify-content:flex-end;gap:10px;padding-bottom:18px}
.rich-editor blockquote{margin:14px 0;padding:10px 14px;border-left:4px solid #9db7de;background:#f5f8fc}
@media(max-width:1000px){.wiki-article-layout{grid-template-columns:1fr}.wiki-toc{position:static;order:-1}.wiki-index-grid{grid-template-columns:1fr}}
@media(max-width:760px){.wiki-search-form,.glossary-search,.glossary-tools{flex-direction:column;align-items:stretch}.wiki-search-form input,.glossary-search input{min-width:0}.glossary-count{text-align:right}.glossary-letter-section{grid-template-columns:46px 1fr}.glossary-letter{padding:18px 8px;font-size:18px}.glossary-entry{padding:16px}.wiki-article{padding:20px}.wiki-article-title-row{flex-direction:column}.wiki-article-title-row h1{font-size:28px}.wiki-article-footer{flex-direction:column}.wiki-form-grid,.wiki-form-type-row{grid-template-columns:1fr}.alphabet-index{position:static}}

/* =========================================================
   v1.9.0 - OTP, versionsnummer och Arkiv
   ========================================================= */
.portal-version{font-size:11px;color:#6f8aa6;margin-top:6px}
.login-version{margin-top:18px;font-size:11px;color:var(--muted)}
.otp-form input[name="code"]{font-size:25px;letter-spacing:.28em;text-align:center;font-weight:800}
.otp-resend{margin:12px 0 8px}.otp-resend .link-button{color:var(--accent);font-weight:700}
.archive-toolbar{align-items:flex-end}.archive-breadcrumb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 16px;font-size:13px;color:var(--muted)}
.archive-breadcrumb a{font-weight:700}.archive-folder-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.archive-folder-card{display:flex;align-items:center;gap:12px;padding:16px;background:#fff;border:1px solid var(--line);border-radius:12px;color:var(--text);box-shadow:var(--shadow)}
.archive-folder-card:hover{transform:translateY(-1px)}.archive-folder-card span{display:block;color:var(--muted);font-size:11px;margin-top:4px}
.archive-folder-icon{width:38px;height:38px;border-radius:10px;background:var(--accent2);color:var(--accent);display:grid;place-items:center;font-size:17px}
.archive-documents{margin-top:4px}.archive-actions{display:flex;gap:7px;justify-content:flex-end}.archive-actions form{margin:0}.danger-zone .hint{margin-top:8px}
@media(max-width:1100px){.archive-folder-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.archive-folder-grid{grid-template-columns:1fr}.archive-actions{flex-direction:column}.archive-actions .btn{width:100%}}



.archive-back-row{margin:0 0 14px}
.archive-back-button{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;font-weight:700;border-color:var(--line);box-shadow:var(--shadow)}
.archive-back-button:hover{background:#f7f9fc}

/* =========================================================
   v1.9.4 - Responsive tablet + mobile UI
   ========================================================= */

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  max-width:100%;
}
body{
  min-width:0;
  max-width:100%;
}
img,svg,video,canvas{
  max-width:100%;
  height:auto;
}
button,input,select,textarea{
  font:inherit;
}
.main,.content,.panel,.card,.stat,.hero{
  min-width:0;
}
.topbar-main{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.topbar-copy{
  min-width:0;
}
.mobile-menu-button,
.mobile-nav-close,
.mobile-nav-backdrop{
  display:none;
}
.mobile-menu-button{
  flex:0 0 44px;
  width:44px;
  height:44px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#fff;
  cursor:pointer;
}
.mobile-menu-button span{
  display:block;
  height:2px;
  margin:4px 0;
  border-radius:99px;
  background:var(--nav);
}
.mobile-nav-close{
  position:absolute;
  top:12px;
  right:12px;
  width:44px;
  height:44px;
  border:0;
  border-radius:11px;
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.mobile-nav-backdrop{
  position:fixed;
  inset:0;
  z-index:40;
  width:100%;
  height:100%;
  padding:0;
  border:0;
  background:rgba(5,15,28,.48);
  backdrop-filter:blur(2px);
}
.mobile-nav-backdrop[hidden]{
  display:none!important;
}

/* Tablet */
@media(max-width:1100px) and (min-width:821px){
  .app-shell{
    grid-template-columns:220px minmax(0,1fr);
    background:
      linear-gradient(180deg,var(--nav),var(--nav2)) 0 0/220px 100% no-repeat,
      var(--bg);
  }
  .sidebar{
    padding:20px 14px;
  }
  .sidebar nav a{
    padding:10px;
    font-size:14px;
  }
  .content{
    padding:22px 20px;
  }
  .topbar{
    padding-left:20px;
    padding-right:20px;
  }
  .hero{
    padding:24px;
  }
  .hero h1{
    font-size:28px;
  }
  .cards{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .attachments{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Phone + small tablet: off-canvas menu */
@media(max-width:820px){
  body.mobile-nav-open{
    overflow:hidden;
    touch-action:none;
  }
  .app-shell{
    display:block;
    min-height:100dvh;
    background:var(--bg);
  }
  .sidebar{
    display:flex;
    position:fixed;
    inset:0 auto 0 0;
    z-index:50;
    width:min(320px,88vw);
    height:100dvh;
    min-height:100dvh;
    max-height:100dvh;
    padding:
      calc(18px + env(safe-area-inset-top))
      16px
      calc(18px + env(safe-area-inset-bottom));
    overflow-y:auto;
    overflow-x:hidden;
    transform:translateX(-104%);
    transition:transform .22s ease;
    box-shadow:20px 0 50px rgba(4,14,26,.22);
    overscroll-behavior:contain;
  }
  body.mobile-nav-open .sidebar{
    transform:translateX(0);
  }
  .sidebar .brand{
    padding-right:48px;
    margin-bottom:18px;
  }
  .sidebar nav{
    display:grid;
    grid-template-columns:1fr;
    gap:4px;
  }
  .sidebar nav a{
    min-height:44px;
    display:flex;
    align-items:center;
    padding:10px 12px;
  }
  .sidebar .nav-label{
    grid-column:auto;
    padding-top:16px;
  }
  .mobile-menu-button,
  .mobile-nav-close{
    display:block;
  }
  .mobile-nav-backdrop:not([hidden]){
    display:block;
  }
  .main{
    width:100%;
    min-height:100dvh;
  }
  .topbar{
    position:sticky;
    top:0;
    z-index:30;
    height:auto;
    min-height:64px;
    padding:
      calc(9px + env(safe-area-inset-top))
      14px
      9px;
    gap:10px;
  }
  .topbar-main{
    flex:1 1 auto;
    min-width:0;
  }
  .topbar-copy{
    min-width:0;
  }
  .top-title{
    font-size:17px;
    line-height:1.2;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:58vw;
  }
  .topbar .eyebrow{
    font-size:9px;
  }
  .role-chip{
    flex:0 0 auto;
    max-width:28vw;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:10px;
    padding:5px 7px;
  }
  .messages{
    padding:10px 14px 0;
  }
  .content{
    width:100%;
    max-width:none;
    padding:16px 14px calc(28px + env(safe-area-inset-bottom));
  }
  .hero{
    padding:21px 18px;
    border-radius:15px;
    gap:18px;
    align-items:stretch;
  }
  .hero h1{
    font-size:25px;
    line-height:1.15;
  }
  .hero-actions,
  .page-actions,
  .actions{
    width:100%;
  }
  .panel{
    padding:16px;
    border-radius:13px;
  }
  .stat{
    padding:17px;
  }
  .stat strong{
    font-size:32px;
  }
  .stats,
  .stats.stats-three,
  .grid-2,
  .cards,
  .attachments,
  .planner-nav,
  .wiki-index-grid,
  .diagnostic-grid,
  .detail-grid,
  .party-grid,
  .bid-metrics{
    grid-template-columns:1fr;
  }
  .panel-head,
  .detail-head,
  .toolbar,
  .page-head,
  .manual-bid-form-head,
  .manual-bids-head,
  .wiki-index-head,
  .glossary-head,
  .wiki-form-head{
    flex-direction:column;
    align-items:stretch;
  }
  .toolbar,
  .detail-head,
  .panel-head{
    gap:12px;
  }
  .filters,
  .wiki-search-form,
  .glossary-search,
  .glossary-tools{
    width:100%;
    display:grid;
    grid-template-columns:1fr;
    align-items:stretch;
  }
  .filters input,
  .filters select,
  .filters button,
  .wiki-search-form input,
  .wiki-search-form select,
  .wiki-search-form button,
  .glossary-search input,
  .glossary-search button{
    width:100%;
    min-width:0;
  }
  .btn,
  .link-button,
  input,
  select,
  textarea{
    min-height:44px;
  }
  .btn{
    padding:10px 13px;
  }
  .inline-form{
    align-items:stretch;
  }
  .inline-form input,
  .inline-form select,
  .inline-form textarea{
    width:100%;
  }
  .form-grid,
  .form-grid.two,
  .wiki-form-grid,
  .wiki-form-type-row,
  .pricing-flow{
    grid-template-columns:1fr;
  }
  .form-grid .full-span{
    grid-column:auto;
  }
  .meta,
  .detail-list{
    grid-template-columns:1fr;
    gap:4px;
  }
  .meta dd,
  .detail-list dd{
    margin-bottom:10px;
  }
  .item-row,
  .todo-main,
  .compose-intro,
  .mail-message header{
    flex-direction:column;
    align-items:flex-start;
  }
  .item-row time,
  .mail-message header time{
    white-space:normal;
  }
  .table-wrap{
    max-width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }
  .table-wrap table{
    min-width:720px;
  }
  .manual-bids-table{
    min-width:1040px!important;
  }
  th,td{
    padding:12px 13px;
  }
  .table-actions{
    gap:8px;
  }
  .mail-thread-layout{
    grid-template-columns:1fr;
  }
  .mail-thread-sidebar{
    position:static;
  }
  .mail-thread-row{
    flex-direction:column;
    align-items:flex-start;
  }
  .mail-thread-person{
    width:100%;
  }
  .mail-thread-person span{
    max-width:calc(100vw - 98px);
  }
  .mail-thread-meta{
    justify-content:flex-start;
    white-space:normal;
  }
  .mail-attachments{
    grid-template-columns:1fr;
  }
  .diagnostic-status-grid{
    grid-template-columns:1fr;
  }
  .workflow-steps{
    grid-template-columns:1fr;
  }
  .workflow-steps span{
    text-align:left;
  }
  .pricing-arrow{
    display:none;
  }
  .workflow-actions{
    justify-content:stretch;
  }
  .workflow-actions .btn{
    flex:1 1 auto;
  }
  .calendar-titlebar{
    flex-wrap:wrap;
    justify-content:center;
  }
  .calendar-titlebar h1{
    width:100%;
    min-width:0;
    order:-1;
  }
  .calendar-legend{
    flex-wrap:wrap;
    gap:8px 14px;
  }
  .calendar-panel{
    width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }
  .wiki-article{
    padding:19px 17px;
  }
  .wiki-article-title-row{
    flex-direction:column;
  }
  .wiki-article-title-row h1{
    font-size:27px;
  }
  .wiki-article-body{
    font-size:15px;
  }
  .wiki-article-body pre,
  pre{
    max-width:100%;
    overflow-x:auto;
  }
  .alphabet-index{
    position:static;
  }
  .glossary-tools{
    gap:10px;
  }
  .archive-folder-grid{
    grid-template-columns:1fr;
  }
  .archive-actions{
    flex-direction:column;
    align-items:stretch;
  }
  .archive-actions .btn{
    width:100%;
  }
  .login-shell{
    padding:
      calc(18px + env(safe-area-inset-top))
      14px
      calc(18px + env(safe-area-inset-bottom));
  }
  .login-card{
    width:100%;
    max-width:430px;
    padding:25px 20px;
    border-radius:16px;
  }
}

/* Narrow phones */
@media(max-width:520px){
  .content{
    padding-left:10px;
    padding-right:10px;
  }
  .messages{
    padding-left:10px;
    padding-right:10px;
  }
  .panel,
  .card,
  .stat{
    border-radius:11px;
  }
  .hero{
    padding:19px 16px;
  }
  .hero h1{
    font-size:23px;
  }
  .hero-actions,
  .actions,
  .page-actions,
  .workflow-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .hero-actions .btn,
  .actions .btn,
  .page-actions .btn,
  .workflow-actions .btn{
    width:100%;
  }
  .role-chip{
    max-width:24vw;
  }
  .top-title{
    max-width:54vw;
  }
  .party-inline{
    grid-template-columns:1fr;
  }
  .glossary-letter-section{
    grid-template-columns:40px minmax(0,1fr);
  }
  .glossary-letter{
    padding-left:6px;
    padding-right:6px;
  }
}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){
  .sidebar{
    transition:none!important;
  }
  .card:hover,
  .archive-folder-card:hover,
  .planner-nav-card:hover{
    transform:none;
  }
}



/* =========================================================
   v1.9.5 - Professional shared mailbox
   ========================================================= */

.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

.mailbox-hero{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
}
.mailbox-summary{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.mailbox-summary-card{
  min-width:88px;
  padding:11px 14px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:12px;
  background:rgba(255,255,255,.08);
  color:#fff;
}
.mailbox-summary-card strong,
.mailbox-summary-card span{
  display:block;
}
.mailbox-summary-card strong{
  font-size:23px;
  line-height:1;
}
.mailbox-summary-card span{
  margin-top:4px;
  font-size:11px;
  color:rgba(255,255,255,.72);
}
.mailbox-summary-card.unread{
  background:rgba(84,147,255,.22);
  border-color:rgba(139,184,255,.45);
}

.mailbox-toolbar{
  align-items:center;
}
.mailbox-filters{
  flex:1 1 auto;
}
.mailbox-filters input{
  min-width:280px;
  flex:1 1 340px;
}
.mailbox-list-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  gap:18px;
  padding:9px 18px;
  border-bottom:1px solid var(--line);
  background:#f8fafc;
  color:var(--muted);
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.055em;
}
.mailbox-list-head span:last-child{
  text-align:right;
}
.professional-mailbox .mail-thread-row{
  display:grid;
  grid-template-columns:12px minmax(0,1fr) 300px;
  align-items:center;
  gap:12px;
  min-height:86px;
  padding:14px 18px;
  transition:background .14s ease, box-shadow .14s ease;
}
.professional-mailbox .mail-thread-row:hover{
  position:relative;
  z-index:1;
  background:#f7faff;
  box-shadow:inset 3px 0 0 #5b84e8;
}
.professional-mailbox .mail-thread-row.unread{
  background:#f5f8ff;
}
.professional-mailbox .mail-thread-row.unread:hover{
  background:#eef4ff;
}
.professional-mailbox .mail-thread-row.closed{
  opacity:.67;
}
.mail-unread-marker{
  width:12px;
  display:grid;
  place-items:center;
}
.mail-unread-marker span{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#2f67dc;
  box-shadow:0 0 0 3px rgba(47,103,220,.12);
}
.mail-thread-copy{
  min-width:0;
}
.mail-thread-sender-line{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
}
.mail-thread-sender-line strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:600;
}
.mail-thread-row.unread .mail-thread-sender-line strong,
.mail-thread-row.unread .mail-thread-subject{
  color:#122b53;
  font-weight:800;
}
.mail-thread-subject{
  display:block!important;
  margin-top:4px!important;
  color:var(--text)!important;
  font-size:14px!important;
  font-weight:600;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.mail-thread-preview{
  display:block!important;
  margin-top:3px!important;
  color:var(--muted)!important;
  font-size:12px!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.mail-direction-chip{
  display:inline-flex!important;
  flex:0 0 auto;
  width:auto!important;
  margin:0!important;
  padding:3px 7px;
  border-radius:999px;
  font-size:10px!important;
  font-weight:700;
  line-height:1.2;
}
.mail-direction-chip.inbound{
  background:#edf2f7;
  color:#4b5e73!important;
}
.mail-direction-chip.outbound{
  background:#e9f0ff;
  color:#2456ba!important;
}
.mail-thread-statuses{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  flex-wrap:wrap;
}
.mail-count{
  color:var(--muted);
}
.mailbox-empty{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:28px 20px;
}
.mailbox-empty span{
  color:var(--muted);
  font-size:13px;
}
.compact-mail-help{
  padding-top:16px;
  padding-bottom:16px;
}

.mail-thread-head-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}
.mail-thread-head-actions form{
  margin:0;
}
.mail-thread-heading-meta{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin-bottom:8px;
}
.status-open{
  background:#e8f7ee;
  color:#227448;
}
.muted-badge{
  background:#edf0f4;
  color:#627083;
}

.mail-conversation{
  position:relative;
}
.mail-message{
  overflow:hidden;
  padding:0;
  border-radius:15px;
  background:#fff;
}
.mail-message.inbound{
  border-left:1px solid var(--line);
}
.mail-message.outbound{
  border-left:1px solid #cbd9fb;
  background:#f8faff;
}
.mail-message>header{
  padding:15px 17px 13px;
  border-bottom:1px solid #edf0f4;
  background:#fbfcfe;
}
.mail-message.outbound>header{
  background:#f0f5ff;
}
.direction-icon{
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid!important;
  place-items:center;
  flex:0 0 34px;
  margin:0!important;
  font-size:17px!important;
  font-weight:900;
}
.direction-icon.inbound{
  background:#edf1f5;
  color:#50667d!important;
}
.direction-icon.outbound{
  background:#dfe9ff;
  color:#2456ba!important;
}
.mail-message-time{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:3px;
}
.mail-direction-label{
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.045em;
  color:#7c8896;
}
.mail-address-details{
  margin:0;
  padding:9px 17px;
  border-bottom:1px solid #edf0f4;
  background:#fff;
  font-size:12px;
}
.mail-address-details summary{
  cursor:pointer;
  color:#66778b;
  font-weight:600;
  user-select:none;
}
.mail-address-details>div{
  display:grid;
  gap:5px;
  margin-top:9px;
  color:#66778b;
}
.mail-document-wrap{
  padding:18px;
  background:#fff;
}
.mail-message.outbound .mail-document-wrap{
  background:#fff;
}
.mail-document{
  max-width:820px;
  min-height:34px;
  color:#202b38;
  line-height:1.6;
  overflow-wrap:anywhere;
}
.mail-document p{
  margin:0 0 12px;
}
.mail-document p:last-child{
  margin-bottom:0;
}
.mail-document h1,
.mail-document h2,
.mail-document h3,
.mail-document h4{
  margin:18px 0 9px;
  line-height:1.28;
  color:#172536;
}
.mail-document h1{font-size:24px}
.mail-document h2{font-size:20px}
.mail-document h3{font-size:17px}
.mail-document h4{font-size:15px}
.mail-document blockquote{
  margin:14px 0;
  padding:9px 13px;
  border-left:3px solid #ccd5e1;
  background:#f8fafc;
  color:#526173;
}
.mail-document ul,
.mail-document ol{
  margin:10px 0;
  padding-left:24px;
}
.mail-document a{
  color:#245ccb;
  text-decoration:underline;
  overflow-wrap:anywhere;
}
.mail-document table{
  width:auto;
  max-width:100%;
  border-collapse:collapse;
  margin:10px 0;
}
.mail-document td,
.mail-document th{
  padding:5px 7px;
  vertical-align:top;
}
.mail-document pre{
  max-width:100%;
  overflow:auto;
  padding:10px;
  border-radius:8px;
  background:#f5f7fa;
  white-space:pre-wrap;
}
.mail-plain-text{
  white-space:normal;
}
.mail-message .mail-attachments{
  padding:0 18px 18px;
  margin-top:0;
}
.mail-message .attachment{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fafbfc;
  color:var(--text);
}
.mail-message .attachment:hover{
  border-color:#aabbd3;
  background:#f4f7fb;
}
.attachment-icon{
  flex:0 0 auto;
  font-size:18px;
}
.mail-message .attachment strong,
.mail-message .attachment small{
  display:block;
}
.mail-message .attachment small{
  margin-top:2px;
  color:var(--muted);
}

.shared-mail-reply-form>p{
  margin:0;
}
.shared-mail-reply-form label{
  display:block;
  margin-bottom:6px;
  font-weight:700;
}
.shared-mail-reply-form .helptext{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:12px;
}
.mail-signature-preview{
  overflow:hidden;
  border:1px solid #d9e1ea;
  border-radius:12px;
  background:#fff;
}
.mail-signature-preview-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:9px 12px;
  border-bottom:1px solid #e6ebf0;
  background:#f7f9fb;
}
.mail-signature-preview-head span{
  color:var(--muted);
  font-size:11px;
}
.signature-document{
  padding:13px 14px;
  font-size:13px;
  color:#425166;
}
.reply-actions{
  display:flex;
  justify-content:flex-end;
}

/* Keep incoming e-mail tables usable on narrow screens. */
@media(max-width:1000px){
  .mailbox-list-head{
    display:none;
  }
  .professional-mailbox .mail-thread-row{
    grid-template-columns:12px minmax(0,1fr);
  }
  .professional-mailbox .mail-thread-meta{
    grid-column:2;
    align-items:flex-start;
    justify-content:flex-start;
  }
  .professional-mailbox .mail-thread-statuses{
    justify-content:flex-start;
  }
}
@media(max-width:820px){
  .mailbox-hero{
    align-items:stretch;
  }
  .mailbox-summary{
    justify-content:flex-start;
  }
  .mailbox-summary-card{
    flex:1 1 82px;
    min-width:0;
  }
  .mailbox-filters{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }
  .mailbox-filters input{
    min-width:0;
  }
  .professional-mailbox .mail-thread-row{
    display:grid;
    grid-template-columns:12px minmax(0,1fr);
    gap:8px 9px;
    min-height:0;
    padding:14px 12px;
  }
  .professional-mailbox .mail-thread-person{
    width:100%;
  }
  .professional-mailbox .mail-thread-meta{
    width:100%;
    grid-column:2;
    gap:6px;
  }
  .mail-thread-sender-line{
    align-items:flex-start;
    flex-wrap:wrap;
  }
  .mail-thread-subject,
  .mail-thread-preview{
    max-width:none!important;
  }
  .mail-thread-head-actions{
    width:100%;
  }
  .mail-thread-head-actions form,
  .mail-thread-head-actions .btn{
    flex:1 1 auto;
  }
  .mail-thread-head-actions .btn{
    width:100%;
  }
  .mail-message>header{
    padding:13px;
  }
  .mail-message-time{
    align-items:flex-start;
  }
  .mail-address-details{
    padding:9px 13px;
  }
  .mail-document-wrap{
    overflow-x:auto;
    padding:14px 13px;
    -webkit-overflow-scrolling:touch;
  }
  .mail-document table{
    min-width:480px;
  }
  .mail-message .mail-attachments{
    padding:0 13px 14px;
  }
  .mail-signature-preview-head{
    flex-direction:column;
  }
  .reply-actions .btn{
    width:100%;
  }
}
@media(max-width:520px){
  .mailbox-summary{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    width:100%;
  }
  .mailbox-summary-card{
    padding:10px 8px;
    text-align:center;
  }
  .mailbox-summary-card strong{
    font-size:20px;
  }
  .mail-avatar{
    width:34px;
    height:34px;
    flex-basis:34px;
  }
  .mail-direction-chip{
    display:none!important;
  }
}