/* ══════════════════════════════════════════════════════════════
   BrickFlow – Komponenter
   Refererar BARA --color-*, --space-*, --text-*, --shadow-*,
   --radius-*, --weight-*, --transition-* från tokens.css.
   Inga hårdkodade hex-värden.
   ══════════════════════════════════════════════════════════════ */

/* ─── Pulse animation (used for "Pågår" dot on dashboard) ─── */
@keyframes pulse-dot {
  0%   { box-shadow: 0 0 0 0   rgba(5,150,105,0.40); }
  60%  { box-shadow: 0 0 0 6px rgba(5,150,105,0.00); }
  100% { box-shadow: 0 0 0 0   rgba(5,150,105,0.00); }
}


/* ─── Live Preview Editor (lpe) ───────────────────────────── */
.lpe-container          { display:flex; width:100%; height:100%; overflow:hidden; background:var(--color-bg-subtle); }
.lpe-editor             { width:36%; min-width:300px; max-width:480px; display:flex; flex-direction:column; background:var(--color-bg-surface); border-right:1.5px solid var(--color-border); overflow:visible; }
.lpe-editor-header      { padding:var(--space-6) var(--space-8); border-bottom:1.5px solid var(--color-border); display:flex; justify-content:space-between; align-items:center; background:var(--color-bg-surface); flex-shrink:0; gap:var(--space-4); flex-wrap:wrap; }
.lpe-editor-scroll      { flex:1; overflow-y:auto; padding:var(--space-9) var(--space-9) var(--space-12); }
.lpe-back-btn           { background:none; border:none; cursor:pointer; color:var(--color-text-muted); padding:var(--space-2) var(--space-4); border-radius:var(--radius-sm); font-size:var(--text-base); font-weight:var(--weight-semi); display:flex; align-items:center; gap:var(--space-2); transition:background var(--transition-base); }
.lpe-back-btn:hover     { background:var(--color-bg-subtle); }
.lpe-editor-title       { font-size:var(--text-lg); font-weight:var(--weight-bold); color:var(--color-text-primary); margin:0; }
.lpe-ai-btn             { background:linear-gradient(135deg,#6366F1,#8B5CF6); color:white; border:none; padding:7px 13px; border-radius:var(--radius-md); font-weight:var(--weight-semi); cursor:pointer; font-size:var(--text-sm); }
.lpe-preview            { flex:1; display:flex; flex-direction:column; overflow:hidden; background:var(--color-bg-preview); }
.lpe-preview-label      { background:var(--color-bg-surface); border-bottom:1.5px solid var(--color-border); padding:var(--space-5) var(--space-8); font-size:var(--text-base); font-weight:var(--weight-bold); color:var(--color-text-muted); flex-shrink:0; text-transform:uppercase; letter-spacing:0.5px; }
.lpe-preview-scroll     { flex:1; overflow-y:auto; padding:var(--space-8) var(--space-7) var(--space-11); display:flex; justify-content:center; align-items:flex-start; }
.lpe-doc                { background:var(--color-bg-surface); width:100%; max-width:820px; font-family:var(--font-doc); font-size:13.5px; color:var(--color-text-primary); min-height:860px; border:none; box-shadow:var(--shadow-sm); }
.lpe-doc-inner          { padding:var(--space-11) var(--space-12) 60px; }
.lpe-doc-titlerow       { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:22px; }
.lpe-doc-doctype        { font-size:var(--text-3xl); font-weight:var(--weight-bold); color:var(--color-text-primary); line-height:1; }
.lpe-doc-company-right  { font-size:var(--text-2xl); font-weight:var(--weight-semi); color:var(--color-text-disabled); text-align:right; line-height:1; }
.lpe-doc-metablock      { margin-bottom:28px; }
.lpe-doc-metarow        { display:flex; justify-content:space-between; gap:var(--space-5); font-size:var(--text-base); line-height:1.9; border-bottom:1px solid var(--color-bg-subtle); padding:1px 0; }
.lpe-doc-metalabel      { color:var(--color-text-muted); flex-shrink:0; font-size:var(--text-xs); text-transform:uppercase; letter-spacing:0.3px; font-weight:var(--weight-semi); }
.lpe-doc-metaval        { color:var(--color-text-primary); font-weight:var(--weight-semi); text-align:right; }
.lpe-doc-addrblock      { display:grid; grid-template-columns:1fr 1fr; gap:0; margin-bottom:0; padding-bottom:var(--space-9); border-bottom:1px solid var(--color-border); }
.lpe-doc-addr-company-name { font-size:13.5px; font-weight:var(--weight-bold); color:var(--color-text-primary); margin-bottom:3px; }
.lpe-doc-addr-label     { font-size:13.5px; font-weight:var(--weight-bold); color:var(--color-text-primary); margin-bottom:3px; }
.lpe-doc-addr-line      { font-size:var(--text-base); color:var(--color-text-secondary); line-height:var(--leading-normal); }
.lpe-doc-summary-line   { font-size:22px; font-weight:var(--weight-bold); color:var(--color-text-primary); margin:var(--space-9) 0 var(--space-2); line-height:var(--leading-tight); }
.lpe-doc-desc-note      { font-size:var(--text-base); color:var(--color-text-tertiary); margin-bottom:var(--space-9); font-style:italic; }
.lpe-doc-empty          { text-align:center; padding:var(--space-10); color:var(--color-text-disabled); font-size:var(--text-base); border:1.5px dashed var(--color-border); border-radius:var(--radius-md); margin:var(--space-7) 0; }
.lpe-doc-items          { width:100%; border-collapse:collapse; font-size:13.5px; margin-bottom:0; }
.lpe-doc-items thead tr { border-bottom:2px solid var(--color-text-primary); }
.lpe-doc-items th       { padding:var(--space-3) 0; text-align:left; font-size:var(--text-base); font-weight:var(--weight-normal); color:var(--color-text-tertiary); border:none; }
.lpe-doc-items th.r,
.lpe-doc-items td.r     { text-align:right; }
.lpe-doc-items th.c,
.lpe-doc-items td.c     { text-align:right; }
.lpe-doc-items td       { padding:11px 0; border-bottom:1px solid var(--color-border-subtle); color:var(--color-text-primary); vertical-align:top; border-top:none; border-left:none; border-right:none; }
.lpe-doc-items tr:last-child td { border-bottom:none; }
.lpe-doc-totalsblock    { display:flex; justify-content:flex-end; padding-top:var(--space-3); border-top:1px solid var(--color-border-subtle); margin-top:0; }
.lpe-doc-totals-inner   { width:320px; }
.lpe-doc-trow           { display:flex; justify-content:space-between; padding:5px 0; font-size:13.5px; color:var(--color-text-primary); border-bottom:1px solid var(--color-border-subtle); }
.lpe-doc-trow:last-child { border-bottom:none; font-weight:var(--weight-black); font-size:var(--text-md); padding-top:var(--space-3); }
.lpe-doc-trow.deduct    { color:var(--color-text-secondary); }
.lpe-doc-footer-rule    { border:none; border-top:1px solid var(--color-border-input); margin:var(--space-11) 0 0; }
.lpe-doc-footer-pg      { text-align:right; font-size:var(--text-sm); color:var(--color-text-disabled); padding:var(--space-3) 0 0; }
/* display:contents — samma som offers.html; barnet med .lpe-doc / inline A4 fyller kolumnen */
#offerPreviewDoc,
#invoicePreviewDoc       { display:contents; min-width:0; max-width:none; box-sizing:border-box; }


/* ─── Card ─────────────────────────────────────────────────── */
.card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  background: var(--color-bg-surface);
}


/* ─── Knappar ───────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  border: 1px solid var(--color-border-input);
  border-radius: var(--radius-md);
  background: var(--color-bg-surface);
  padding: var(--space-3) var(--space-6);
  cursor: pointer;
  font-size: var(--text-base);
  font-weight: var(--weight-medium);
  font-family: inherit;
  color: var(--color-text-secondary);
  transition: background var(--transition-base), border-color var(--transition-base);
  white-space: nowrap;
}
.btn:hover         { background: var(--color-bg-muted); }
.btn:focus-visible { outline: 2px solid var(--color-brand); outline-offset: 2px; }

.btn-primary {
  background: var(--color-brand);
  color: #fff;
  border-color: var(--color-brand);
}
.btn-primary:hover { background: var(--color-brand-dark); border-color: var(--color-brand-dark); }

.btn-danger {
  background: var(--color-status-error-bg-light);
  color: var(--color-status-error);
  border-color: var(--color-status-error-bg);
}
.btn-danger:hover { background: var(--color-status-error-bg); }

.btn-secondary {
  background: var(--color-bg-surface);
  color: var(--color-text-secondary);
  border-color: var(--color-border-input);
}
.btn-secondary:hover { background: var(--color-bg-muted); }

.btn-ghost {
  background: transparent;
  border-color: transparent;
  color: var(--color-text-muted);
}
.btn-ghost:hover { background: var(--color-bg-subtle); color: var(--color-text-primary); }

.btn-sm   { padding: var(--space-1) var(--space-4); font-size: var(--text-sm); }
.btn-lg   { padding: var(--space-4) var(--space-8); font-size: var(--text-md); }
.btn-icon { padding: var(--space-2) var(--space-4); font-size: var(--text-sm); }


/* ─── Formulär ──────────────────────────────────────────────── */
.form-group {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  margin-bottom: var(--space-5);
}
.form-group label,
.form-label {
  display: block;
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--space-2);
}
.form-group input,
.form-group select,
.form-group textarea,
.form-input,
.form-textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 0 var(--space-6);
  border: 1.5px solid var(--color-border-input);
  border-radius: var(--radius-md);
  font-size: var(--text-md);
  font-family: inherit;
  color: var(--color-text-primary);
  background: var(--color-bg-surface);
  outline: none;
  transition: border-color var(--transition-base), box-shadow var(--transition-base);
}
.form-input        { height: 44px; }
.form-group input,
.form-group select { height: 42px; }
.form-group textarea,
.form-textarea {
  padding: var(--space-5) var(--space-6);
  resize: vertical;
  line-height: var(--leading-normal);
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus,
.form-input:focus,
.form-textarea:focus {
  border-color: var(--color-brand);
  box-shadow: 0 0 0 3px var(--color-brand-focus);
}


/* ─── Tabell ────────────────────────────────────────────────── */
.table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--text-base);
  color: var(--color-text-secondary);
}
.table thead tr {
  background: var(--color-bg-muted);
  border-bottom: 1px solid var(--color-border);
}
.table thead th {
  padding: var(--space-3) var(--space-6);
  text-align: left;
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
  white-space: nowrap;
}
.table tbody tr {
  border-bottom: 1px solid var(--color-bg-subtle);
  transition: background var(--transition-fast);
}
.table tbody tr:last-child { border-bottom: none; }
.table tbody tr:hover      { background: var(--color-bg-muted); }
.table tbody td {
  padding: var(--space-4) var(--space-6);
  vertical-align: middle;
}
.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}


/* ─── Badge ─────────────────────────────────────────────────── */
.badge {
  display: inline-block;
  padding: 3px var(--space-3);
  border-radius: var(--radius-full);
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.badge-draft     { background: var(--color-bg-subtle);         color: var(--color-text-secondary); }
.badge-sent      { background: var(--color-status-info-bg);    color: var(--color-status-info); }
.badge-signed    { background: var(--color-status-success-bg); color: var(--color-status-success); }
.badge-invoiced  { background: var(--color-status-purple-bg);  color: var(--color-status-purple); }
.badge-paid      { background: var(--color-status-success-bg); color: var(--color-status-success); }
.badge-overdue   { background: var(--color-status-error-bg);   color: var(--color-status-error); }
.badge-cancelled { background: var(--color-bg-subtle);         color: var(--color-text-disabled); }
.badge-active    { background: var(--color-status-green-light); color: var(--color-status-green-dark); }
.badge-planned   { background: var(--color-status-info-bg);    color: var(--color-status-info); }
.badge-done      { background: var(--color-bg-subtle);         color: var(--color-text-secondary); }
.badge-approved  { background: var(--color-status-success-bg); color: var(--color-status-success); }
.badge-pending   { background: var(--color-status-warning-bg); color: var(--color-status-warning); }
.badge-rejected  { background: var(--color-status-error-bg);   color: var(--color-status-error); }


/* ─── Modal ─────────────────────────────────────────────────── */
.modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: var(--z-modal);
  background: rgba(0,0,0,0.45);
  align-items: center;
  justify-content: center;
  padding: var(--space-7);
  overflow-y: auto;
}
.modal.active { display: flex; }

.modal-content {
  background: var(--color-bg-surface);
  border-radius: var(--radius-2xl);
  width: 100%;
  padding: var(--space-9);
  box-shadow: var(--shadow-2xl);
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
}
.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-5);
  margin-bottom: var(--space-7);
}
.modal-title {
  margin: 0;
  font-size: var(--text-xl);
  font-weight: var(--weight-bold);
  color: var(--color-text-primary);
  line-height: var(--leading-tight);
}
.modal-close {
  background: none;
  border: none;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  color: var(--color-text-disabled);
  padding: 0 var(--space-1);
  flex-shrink: 0;
  transition: color var(--transition-fast);
}
.modal-close:hover { color: var(--color-text-secondary); }


/* ─── Job Detail Popup (jdp) ───────────────────────────────── */
.jdp-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: var(--z-popup);
  background: rgba(17,24,39,0.44);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  align-items: center;
  justify-content: center;
  padding: var(--space-7);
}
.jdp-backdrop.active { display: flex; }

.jdp-shell {
  position: relative;
  width: 380px;
  min-width: 360px;
  max-width: 400px;
  max-height: 88vh;
  background: var(--color-bg-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-3xl);
  box-shadow: var(--shadow-popup);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  opacity: 0;
  transform: translateY(8px) scale(0.98);
  transition: opacity 140ms ease-out, transform 140ms ease-out;
}
.jdp-backdrop.active .jdp-shell {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.jdp-backdrop.closing .jdp-shell {
  opacity: 0;
  transform: translateY(4px) scale(0.99);
  transition: opacity 110ms ease-in, transform 110ms ease-in;
}

.jdp-header           { flex-shrink:0; position:sticky; top:0; z-index:2; background:var(--color-bg-surface); padding:var(--space-7) var(--space-8) var(--space-6); border-bottom:1px solid var(--color-border-subtle); display:flex; align-items:flex-start; gap:var(--space-5); }
.jdp-header-left      { flex:1; min-width:0; }
.jdp-header-title     { font-size:var(--text-2xl); font-weight:var(--weight-bold); line-height:var(--leading-tight); color:var(--color-text-primary); margin:0 0 var(--space-1); overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.jdp-header-sub       { font-size:var(--text-base); font-weight:var(--weight-medium); color:var(--color-text-muted); margin:0; }
.jdp-status-badge     { display:inline-block; font-size:var(--text-sm); font-weight:var(--weight-semi); padding:var(--space-1) var(--space-4); border-radius:var(--radius-full); margin-bottom:var(--space-2); }
.jdp-close            { width:28px; height:28px; flex-shrink:0; background:none; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; border-radius:var(--radius-sm); color:var(--color-text-disabled); font-size:var(--text-md); transition:background var(--transition-fast),color var(--transition-fast); margin-top:2px; }
.jdp-close:hover      { background:var(--color-bg-subtle); color:var(--color-text-tertiary); }
.jdp-close:focus-visible { outline:2px solid var(--color-status-info-mid); }
.jdp-body             { flex:1; overflow-y:auto; padding:var(--space-1) 0; }
.jdp-section          { padding:var(--space-6) var(--space-8); border-bottom:1px solid var(--color-border-subtle); }
.jdp-section:last-child { border-bottom:none; }
.jdp-section-label    { font-size:var(--text-xs); font-weight:var(--weight-bold); text-transform:uppercase; letter-spacing:0.06em; color:var(--color-text-disabled); margin-bottom:var(--space-3); }

.jdp-completion       { display:flex; align-items:center; gap:var(--space-4); background:var(--color-bg-muted); border:1px solid var(--color-border); border-radius:var(--radius-lg); padding:var(--space-4) var(--space-5); cursor:pointer; font-size:var(--text-md); font-weight:var(--weight-medium); color:var(--color-text-secondary); user-select:none; transition:background var(--transition-fast); }
.jdp-completion:hover { background:var(--color-bg-subtle); }
.jdp-completion input[type="checkbox"] { width:16px; height:16px; accent-color:var(--color-status-success-mid); cursor:pointer; flex-shrink:0; }
.jdp-completion.checked { color:var(--color-status-success); }

.jdp-detail-row  { display:flex; justify-content:space-between; align-items:center; padding:var(--space-1) 0; font-size:var(--text-base); color:var(--color-text-tertiary); }
.jdp-detail-link { font-weight:var(--weight-semi); color:var(--color-brand); cursor:pointer; text-decoration:none; }
.jdp-detail-link:hover { text-decoration:underline; }
.jdp-detail-note { font-size:var(--text-base); color:var(--color-text-tertiary); line-height:var(--leading-normal); margin-top:var(--space-1); }

.jdp-team-row    { display:flex; flex-wrap:wrap; gap:var(--space-2); align-items:center; }
.jdp-chip        { display:inline-flex; align-items:center; gap:var(--space-2); height:30px; padding:0 var(--space-4); background:var(--color-bg-subtle); border-radius:var(--radius-full); font-size:var(--text-sm); font-weight:var(--weight-semi); color:var(--color-text-secondary); }
.jdp-chip-avatar { width:18px; height:18px; background:var(--color-border-input); border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:var(--text-2xs); font-weight:var(--weight-bold); color:var(--color-text-secondary); flex-shrink:0; }
.jdp-chip-more   { border:1.5px dashed var(--color-border-input); background:transparent; transition:background var(--transition-fast),border-color var(--transition-fast); }
.jdp-chip-more:hover { background:var(--color-border); border-color:var(--color-border); }

.jdp-location    { display:flex; align-items:flex-start; gap:7px; font-size:var(--text-base); color:var(--color-text-secondary); line-height:var(--leading-snug); }
.jdp-location svg { flex-shrink:0; margin-top:2px; }

.jdp-time-grid   { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-4); }
.jdp-time-card   { background:var(--color-bg-muted); border:1px solid var(--color-border); border-radius:var(--radius-lg); padding:var(--space-4) var(--space-5); }
.jdp-time-label  { font-size:var(--text-xs); font-weight:var(--weight-bold); text-transform:uppercase; color:var(--color-text-disabled); letter-spacing:0.04em; margin-bottom:3px; }
.jdp-time-date   { font-size:var(--text-base); font-weight:var(--weight-semi); color:var(--color-bg-topbar-border); }
.jdp-time-clock  { font-size:var(--text-base); font-weight:var(--weight-medium); color:var(--color-text-tertiary); }

.jdp-item-row              { display:flex; align-items:center; padding:var(--space-3) 0; border-bottom:1px solid var(--color-border-subtle); font-size:var(--text-base); color:var(--color-text-secondary); gap:var(--space-3); }
.jdp-item-row:last-of-type { border-bottom:none; }
.jdp-item-qty              { font-weight:var(--weight-semi); color:var(--color-text-muted); min-width:28px; flex-shrink:0; }
.jdp-item-name             { flex:1; font-weight:var(--weight-medium); }
.jdp-item-price            { font-weight:var(--weight-semi); text-align:right; white-space:nowrap; }
.jdp-item-total-row        { display:flex; justify-content:space-between; align-items:center; padding-top:var(--space-4); border-top:1px solid var(--color-border); margin-top:var(--space-1); }
.jdp-item-total-label      { font-size:15px; font-weight:var(--weight-bold); color:var(--color-text-primary); }
.jdp-item-total-val        { font-size:var(--text-lg); font-weight:var(--weight-black); color:var(--color-text-primary); }

.jdp-footer          { flex-shrink:0; position:sticky; bottom:0; background:var(--color-bg-surface); border-top:1px solid var(--color-border); padding:var(--space-6) var(--space-8); display:flex; gap:var(--space-4); justify-content:flex-end; }
.jdp-btn             { height:40px; padding:0 var(--space-7); border-radius:var(--radius-lg); font-size:var(--text-md); font-weight:var(--weight-semi); cursor:pointer; font-family:inherit; transition:background var(--transition-fast),border-color var(--transition-fast); display:inline-flex; align-items:center; gap:var(--space-2); }
.jdp-btn:focus-visible { outline:2px solid var(--color-status-info-mid); }
.jdp-btn-secondary   { background:var(--color-bg-surface); border:1.5px solid var(--color-border-input); color:var(--color-text-secondary); }
.jdp-btn-secondary:hover { background:var(--color-bg-muted); }
.jdp-btn-primary     { background:var(--color-brand); border:1.5px solid var(--color-brand); color:#fff; }
.jdp-btn-primary:hover { background:var(--color-brand-dark); border-color:var(--color-brand-dark); }

@media (max-width: 600px) {
  .jdp-shell { width:92vw; min-width:unset; max-width:520px; max-height:86vh; border-radius:var(--radius-2xl); }
}
@media (max-width: 360px) {
  .jdp-footer { flex-direction:column; }
  .jdp-btn    { width:100%; justify-content:center; }
}


/* ─── Send-modal ────────────────────────────────────────────── */
.send-modal-wrap              { max-width:var(--modal-max); overflow:hidden; border-radius:var(--radius-2xl); }
.send-modal-header            { display:flex; align-items:center; justify-content:space-between; padding:var(--space-8) var(--space-9) var(--space-7); border-bottom:1px solid var(--color-border); }
.send-modal-subtitle          { margin:var(--space-1) 0 0; font-size:var(--text-base); color:var(--color-text-muted); }
.send-modal-hint              { margin:0; padding:var(--space-4) var(--space-5); border-radius:var(--radius-md); background:#EFF6FF; border:1px solid #BFDBFE; color:#1E3A5F; font-size:var(--text-sm); line-height:1.45; }
.send-modal-hint strong       { font-weight:var(--weight-bold); }
.send-modal-body              { padding:var(--space-8) var(--space-9); display:flex; flex-direction:column; gap:var(--space-7); }
.send-modal-footer            { display:flex; gap:var(--space-4); justify-content:flex-end; padding:var(--space-7) var(--space-9); border-top:1px solid var(--color-border); background:var(--color-bg-surface-2); }
.send-modal-email-wrap        { display:flex; align-items:center; gap:var(--space-3); border:1.5px solid var(--color-border); border-radius:var(--radius-md); padding:var(--space-2) var(--space-5); background:var(--color-bg-surface-2); transition:border-color var(--transition-base),box-shadow var(--transition-base); }
.send-modal-email-wrap:focus-within { border-color:var(--color-brand); box-shadow:0 0 0 3px var(--color-brand-focus); }
.send-modal-email-input       { flex:1; border:none; background:transparent; font-size:var(--text-md); font-weight:var(--weight-semi); color:var(--color-brand); outline:none; font-family:inherit; }
.send-modal-attachment        { display:flex; align-items:center; gap:var(--space-5); padding:var(--space-4) var(--space-6); border:1.5px solid var(--color-border); border-radius:var(--radius-md); background:var(--color-bg-surface-2); }
.send-modal-attachment-icon   { width:36px; height:36px; background:var(--color-status-error-bg); border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.send-modal-attachment-info   { flex:1; min-width:0; }
.send-modal-attachment-name   { font-size:var(--text-base); font-weight:var(--weight-semi); color:var(--color-text-primary); }
.send-modal-attachment-meta   { font-size:var(--text-xs); color:var(--color-text-muted); margin-top:2px; }
.send-modal-pdf-status        { display:flex; align-items:center; gap:var(--space-2); flex-shrink:0; }
.send-modal-pdf-dot           { width:8px; height:8px; border-radius:50%; background:var(--color-border-input); transition:background 0.3s; }
.send-modal-pdf-label         { font-size:var(--text-xs); color:var(--color-text-muted); font-weight:var(--weight-medium); }
.send-modal-copy-label        { display:flex; align-items:center; gap:var(--space-4); cursor:pointer; font-size:var(--text-base); color:var(--color-text-secondary); user-select:none; }
.send-modal-copy-label input[type="checkbox"] { width:15px; height:15px; accent-color:var(--color-brand); cursor:pointer; }


/* ─── Kalender ───────────────────────────────────────────────── */
.cal-header         { display:grid; grid-template-columns:repeat(7,1fr); background:var(--color-bg-muted); border-bottom:1.5px solid var(--color-border); }
.cal-header-cell    { padding:var(--space-3) 0; text-align:center; font-size:var(--text-xs); font-weight:var(--weight-bold); letter-spacing:.07em; text-transform:uppercase; color:var(--color-text-muted); }
.cal-weekend-label  { color:var(--color-text-disabled); }
.cal-week           { border-bottom:1px solid var(--color-border); }
.cal-week-last      { border-bottom:none; }
.cal-dates-row      { display:grid; grid-template-columns:repeat(7,1fr); }
.cal-date-cell      { padding:7px var(--space-3) 5px; border-right:1px solid var(--color-bg-subtle); min-height:38px; cursor:pointer; transition:background var(--transition-fast); }
.cal-date-cell:last-child { border-right:none; }
.cal-date-cell:hover { background:var(--color-brand-subtle); }
.cal-out            { background:var(--color-bg-surface-2) !important; cursor:default !important; }
.cal-out:hover      { background:var(--color-bg-surface-2) !important; }
.cal-weekend-day    { background:var(--color-bg-muted); }
.cal-today          { background:var(--color-status-info-bg); }
.cal-date-num       { display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; font-size:var(--text-base); font-weight:var(--weight-semi); color:var(--color-text-secondary); border-radius:50%; }
.cal-date-today     { background:var(--color-brand); color:#fff; font-weight:var(--weight-bold); }
.cal-events-layer   { position:relative; overflow:hidden; }