/* Shared workspace refinements. Brand assets and logo remain unchanged. */
:root { --border: #e5dce0; --muted: #65565c; --shadow: 0 3px 14px #24121b09; --radius: 14px; }
body { background: #f6f4f3; }
.main { min-width: 0; }
.panel, .entity-card, .metric, .calendar-shell { background: #fff; box-shadow: var(--shadow); border-color: var(--border); }
.panel-header { border-bottom-color: #ede7e9; gap: 16px; }
.panel-title { font-size: 18px; line-height: 1.4; font-weight: 700; }
.button { min-height: 40px; font-size: 13px; border-radius: 9px; font-weight: 600; box-shadow: none; }
.button:not(.secondary):not(.danger) { background: #9e2942; color: #fff; }
.button.secondary { background: #fff; color: #6e2437; border-color: #d8c9cf; }
.button:hover { transform: none; }
.icon-button { min-width: 40px; min-height: 40px; }
:focus-visible { outline: 3px solid #9e2942; outline-offset: 3px; }
.field label { font-size: 13px; font-weight: 600; }
.field input:not([type=checkbox]):not([type=radio]):not([type=color]), .field select, .field textarea { font-size: 14px; min-height: 40px; border-radius: 8px; border-color: #cdbfc5; }
.muted, .field small { color: var(--muted); }
.table-wrap { overflow: auto; max-width: 100%; }
th { font-size: 12px; color: #64545c; }
td { font-size: 13px; vertical-align: top; }
.badge { font-size: 12px; line-height: 1.45; }
.badge.success { background: #e5f4ef; color: #17664c; }
.badge.danger { background: #fbe8e9; color: #a42136; }
.badge.warning { background: #fff2d8; color: #7d5100; }
.badge.info { background: #f6e8ed; color: #82223c; }
.compose-hero, .crm-hero, .mail-hero, .workspace-nav { background: #fff; box-shadow: none; border: 1px solid var(--border); }
.compose-hero { padding: 20px 24px; border-radius: 14px; }
.compose-hero h2 { font-size: 24px; max-width: none; line-height: 1.25; }
.compose-hero p { margin-bottom: 0; font-size: 14px; }
.compose-section { padding: 22px 24px; }
.compose-setup .section-helper { display: none; }
.compose-ai-helper { background: #faf7f8; box-shadow: none; }
.editor-canvas { min-height: 280px; font-size: 16px; line-height: 1.6; }
.compose-footer { background: #fff; border-top: 1px solid var(--border); }
.email-content-frame { display: block; width: 100%; height: 62vh; min-height: 320px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.email-reader-body { padding: 16px; }
.email-reader-dialog { width: min(1120px, 95vw); }
.attachment-list { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; list-style: none; }
.attachment-list a { display: block; padding: 12px 14px; border: 1px solid #d8c9cf; border-radius: 8px; color: #82223c; overflow-wrap: anywhere; }
.calendar-more { background: #f7e8ed; border: 1px solid #e8c9d3; color: #82223c; border-radius: 6px; min-height: 32px; padding: 5px 8px; cursor: pointer; }
.calendar-event { font-size: 12px; min-height: 32px; }
.event-dialog [data-event-content] { max-height: 65vh; overflow: auto; }
dialog { max-width: calc(100vw - 24px); max-height: calc(100dvh - 32px); }
dialog::backdrop { background: #21101c70; backdrop-filter: blur(2px); }
.alert { overflow-wrap: anywhere; }
.empty, .empty-state { color: #65565c; padding: 28px; }
[aria-busy=true] { cursor: progress; opacity: .7; }
@media (max-width: 760px) {
  .button, .icon-button { min-height: 44px; }
  .icon-button { min-width: 44px; }
  .field input:not([type=checkbox]):not([type=radio]), .field textarea, .field select { font-size: 16px; }
  .compose-section, .compose-hero { padding: 16px; }
  .compose-hero h2 { font-size: 21px; }
  .panel-header, .toolbar, .compose-footer { flex-wrap: wrap; }
  .email-reader-meta { grid-template-columns: 1fr; }
  .email-reader-actions { flex-wrap: wrap; }
  .email-content-frame { height: 55vh; }
  .calendar-shell { overflow-x: auto; }
  .calendar-month { min-width: 680px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid > .field, .form-grid > [class*=span-] { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Email content builder: compact flat controls, clear focus, and safe responsive preview. */
.email-content-hero .panel-header { align-items: center; }
.email-content-hero .eyebrow { display: block; margin-bottom: 4px; color: #9e2942; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.variable-guide { margin-top: 16px; }
.variable-guide > summary { cursor: pointer; }
.variable-guide > summary::marker { color: #9e2942; }
.variable-table { min-width: 760px; }
.variable-table code { color: #82223c; font-size: 12px; white-space: nowrap; }
.variable-table small { display: block; max-width: 230px; margin-top: 3px; line-height: 1.4; }
.helper-note { min-height: 1.2em; margin: 10px 0 0; color: #17664c; font-size: 13px; }
.email-builder-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin: 16px 0 12px; padding: 10px; border: 1px solid var(--border); border-radius: 10px; background: #faf7f8; }
.email-builder-toolbar button, .email-builder-toolbar select { min-height: 40px; border: 1px solid #d8c9cf; border-radius: 7px; background: #fff; color: #5f2535; font: inherit; font-size: 12px; font-weight: 700; }
.email-builder-toolbar button { min-width: 40px; padding: 7px 10px; cursor: pointer; }
.email-builder-toolbar button:hover, .email-builder-toolbar select:hover { border-color: #9e2942; }
.email-builder-toolbar button svg { width: 16px; height: 16px; vertical-align: middle; }
.email-builder-toolbar select { max-width: 180px; padding: 7px 9px; }
.email-builder-toolbar button.secondary { background: #fff; color: #6e2437; }
.email-builder-toolbar .brand-color { width: 30px; min-width: 30px; height: 30px; min-height: 30px; padding: 0; border: 3px solid #fff; box-shadow: 0 0 0 1px #d8c9cf; }
.email-builder-toolbar .brand-color.primary { background: #d63560; }
.email-builder-toolbar .brand-color.secondary { background: #cf9f60; }
.email-builder-toolbar .brand-color.tertiary { background: #9e2942; }
.email-builder-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .82fr); gap: 18px; align-items: start; }
.email-builder { min-width: 0; }
.email-builder-canvas, .email-builder-source { min-height: 280px; padding: 16px; overflow: auto; border: 1px solid #cdbfc5; border-radius: 8px; background: #fff; color: #141516; font: 15px/1.6 Arial, sans-serif; overflow-wrap: anywhere; }
.email-builder-canvas:focus { border-color: #9e2942; box-shadow: 0 0 0 3px #9e29421c; outline: none; }
.email-builder-canvas:empty::before { content: 'Escribe o pega el contenido aquí…'; color: #8a7a81; pointer-events: none; }
.email-builder-canvas img, .email-builder-preview img { max-width: 100%; height: auto; }
.email-builder-canvas table, .email-builder-preview table { max-width: 100%; }
.email-builder-preview { display: block; width: 100%; min-height: 320px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.template-preview-frame { display: block; width: 100%; height: 240px; max-height: none; padding: 0; overflow: hidden; }
.signature-builder-grid { margin-top: 4px; }
.signature-preview { min-height: 250px; }
[data-builder-image-status] { display: block; min-height: 1.2em; margin-top: 4px; }
.template-edit-form, .signature-form { min-width: 0; }
.template-edit-form .field, .signature-form .field { min-width: 0; }

@media (max-width: 900px) {
  .email-builder-grid { grid-template-columns: 1fr; }
  .email-builder-preview { min-height: 260px; }
}

@media (max-width: 760px) {
  .email-builder-toolbar { align-items: stretch; max-height: none; }
  .email-builder-toolbar select { flex: 1 1 120px; max-width: none; }
  .email-builder-toolbar button { min-height: 44px; }
  .email-builder-canvas, .email-builder-source { min-height: 240px; font-size: 16px; }
  .template-preview-frame { height: 210px; }
  .variable-guide .panel-body { padding-inline: 12px; }
}