/* The email surface reuses the calendar editor; calendar styles stay unchanged. */
.email-composer { display:flex; flex-direction:column; min-width:0; background:#fff; color:var(--ink); border:1px solid var(--line-soft,#ccc); font-size:11px; }
.email-composer [hidden] { display:none !important; }
.email-composer-header { display:flex; flex:0 0 auto; align-items:center; justify-content:space-between; gap:8px; min-height:36px; padding:5px 10px; border-bottom:1px solid var(--line-soft,#ccc); background:#fafafa; }
.email-composer-header h3 { margin:0; font-size:12px; font-weight:500; }
.email-composer-tools { display:flex; gap:5px; align-items:center; }
.email-composer .email-composer-tools button.cp-icon-button { position:static; display:inline-flex; align-items:center; justify-content:center; flex:0 0 24px; width:24px; min-width:24px; height:24px; min-height:24px; margin:0; padding:3px; border:1px solid #aaa; border-radius:5px; background:#fff; color:var(--ink); font:17px/1 "DM Sans",sans-serif; box-sizing:border-box; cursor:pointer; }
.email-composer .email-composer-tools button:hover { background:var(--blue,#d1e9ff); }
.email-composer .email-composer-tools button:focus-visible { outline:1px solid var(--ink,#111); outline-offset:2px; }
.email-composer-tools .icon { flex:none; width:16px; height:16px; }
.email-composer .cp-email-local-notice { display:none; }
.email-composer .cp-dialog-content { padding:0 12px; min-width:0; }
.email-composer .cp-inline-fields { border:0; margin:0; padding:0; min-width:0; }
.email-composer .cp-email-addresses { display:block; padding:0; margin:0; border:0; }
.email-recipient-row { display:grid; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:8px; min-height:32px; padding:4px 0; border-bottom:1px solid var(--line-soft,#ccc); }
.email-recipient-row > label { padding-top:0; font-weight:500; }
.email-recipient-control { display:flex; flex-wrap:wrap; align-items:center; gap:4px; min-width:0; }
.email-recipient-control .cp-tags { display:contents; }
.email-recipient-control .cp-tag { padding:2px 4px; max-width:100%; }
.email-recipient-control .email-chip-edit { text-align:left; min-width:0; overflow-wrap:anywhere; font:inherit; }
.email-recipient-control [data-email-address-entry] { flex:1 1 110px; min-width:85px; width:auto; padding:4px; border:0; font:inherit; background:#fff; }
.email-recipient-control select { max-width:100%; min-width:0; padding:3px; font:inherit; border:1px solid #ccc; border-radius:5px; background:#fff; }
.email-copy-actions { display:flex; gap:7px; padding-top:0; }
.email-from-control { display:flex; align-items:center; flex-wrap:wrap; gap:5px; min-width:0; grid-column:2 / -1; }
.email-from-control input,.email-from-control select { min-width:0; flex:1 1 150px; padding:4px; border:1px solid var(--line-soft,#ccc); border-radius:5px; background:#fff; color:var(--ink); font:inherit; }
.email-from-control small { color:var(--muted); font-size:9px; }
.email-recipient-warning { font-size:9px; margin:4px 0; color:#875128; }
.email-recipient-warning:empty { display:none; }
.email-subject-row { min-height:32px; border-bottom:1px solid var(--line-soft,#ccc); padding:3px 0; }
.email-subject-row .cp-editor-field { display:grid; grid-template-columns:38px minmax(0,1fr); align-items:center; gap:8px; margin:0; }
.email-subject-row input { border:0; border-radius:0; padding:5px 4px; min-width:0; background:#fff; font:inherit; }
.email-composer .cp-email-body-field { display:flex; flex-direction:column; margin:0; padding:0; min-height:140px; }
.email-composer .communication-rich-text { display:flex; flex-direction:column; flex:1; min-width:0; min-height:140px; border:0; border-radius:0; background:#fff; font:inherit; }
.email-composer .service-rich-text__canvas { flex:1; min-width:0; min-height:140px; padding:0; background:#fff; }
.email-composer .service-rich-text__document { min-height:140px; max-height:none; padding:10px 3px; background:#fff; border:0; border-radius:0; font:11px/1.5 "DM Sans",sans-serif; overflow-wrap:anywhere; }
.email-composer .service-rich-text__inspector { display:flex; flex:0 0 auto; flex-direction:row; flex-wrap:wrap; align-items:center; gap:4px; width:auto; padding:5px 0; border:0; border-top:1px solid var(--line-soft,#ccc); background:#fff; }
.email-composer .service-rich-text__alignment-lists { display:flex; flex-wrap:wrap; gap:4px; }
.email-composer .service-rich-text__inspector button { min-width:24px; min-height:25px; height:25px; padding:3px 5px; border-radius:4px; }
.email-composer .service-rich-text__insert { position:static; display:inline-flex; }
.email-composer .service-rich-text__inspector .service-rich-text__segments { gap:0; }
/* Retain the calendar commands, at the portal/calendar form-control scale. */
.email-composer .service-rich-text__inspector .service-rich-text__segments button { width:28px; min-width:28px; min-height:25px; height:25px; padding:3px; }
.email-composer .service-rich-text__inspector button img,
.email-composer .service-rich-text__inspector .service-rich-text__alignment { width:13px; height:13px; }
.email-composer .cp-email-follow-up input { width:13px; height:13px; }
.email-composer .cp-email-follow-up-date input { padding:4px 6px; }
/* One bounded shell: envelope/body can scroll, header and actions remain available. */
.cp-inline-editor > .email-composer { max-height:min(560px,65dvh); }
.email-composer .cp-inline-fields { display:flex; flex:1; flex-direction:column; min-height:0; }
.email-composer .cp-dialog-content { display:flex; flex:1; flex-direction:column; min-height:0; overflow:auto; }
.email-composer .cp-dialog-content > :not(.cp-email-body-field) { flex-shrink:0; }
.email-composer .cp-email-body-field { flex:1; }
.email-composer .email-composer-footer { flex-shrink:0; }
.email-composer-controls { flex:0 0 auto; min-width:0; padding:0 12px; background:#fff; border-top:1px solid var(--line-soft,#ccc); }
.email-composer-controls .service-rich-text__inspector button { font:inherit; border:1px solid var(--line-soft,#ccc); background:#fafafa; color:var(--ink); }
.email-composer-controls [data-rich-action][aria-pressed=true] { background:var(--blue,#d1e9ff); }
.email-composer-controls .service-rich-text__inspector { border-top:0; }

.communication-email-extra-formatting { display:grid; gap:8px; margin-bottom:10px; }
.communication-email-extra-formatting .service-rich-text__color-controls { display:grid; gap:8px; }
/* The moved calendar controls live outside .service-rich-text. Keep their email
   presentation bounded here, including when hosted by a native profile dialog. */
.communication-email-typography.service-rich-text__popup { font:10px/1.35 "DM Sans",sans-serif; box-sizing:border-box; }
.communication-email-typography .communication-email-extra-formatting { grid-template-columns:minmax(0,1fr); width:100%; gap:6px; margin-bottom:8px; min-width:0; }
.communication-email-typography .service-rich-text__select,
.communication-email-typography .service-rich-text__pragtical-select { display:block; width:100%; min-width:0; }
.communication-email-typography .service-rich-text__weight-size { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); width:100%; min-width:0; gap:6px; }
.communication-email-typography .service-rich-text__weight-size > .service-rich-text__select,
.communication-email-typography .service-rich-text__size { width:100%; min-width:0; }
.communication-email-typography.service-rich-text__popup .import-data-select__toggle { height:28px; min-height:28px; min-width:0; padding:4px 7px; border-radius:5px; font:10px/1.35 "DM Sans",sans-serif; box-shadow:none; }
.communication-email-typography .import-data-select__toggle > span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.communication-email-typography .service-rich-text__select .contact-create-multiselect__caret { width:7.2px; height:4.8px; margin-left:6px; }
.communication-email-typography .service-rich-text__select .import-data-select__menu { width:100%; min-width:0; max-height:150px; box-sizing:border-box; font-size:10px; }
.communication-email-typography .service-rich-text__select .import-data-select__menu [role=option] { min-height:26px; padding:4px 6px; font:10px/1.35 "DM Sans",sans-serif; overflow-wrap:anywhere; }
.communication-email-typography .service-rich-text__color-controls { width:100%; margin:0; padding:8px 0 0; gap:8px; }
.communication-email-typography .service-rich-text__paint { margin:0; min-width:0; }
.communication-email-typography .service-rich-text__paint-heading { margin:0 0 4px; min-height:18px; font:10px/1.35 "DM Sans",sans-serif; }
.communication-email-typography.service-rich-text__popup .service-rich-text__paint-heading button { height:18px; min-height:18px; padding:0 4px; border:0; background:transparent; font-size:14px; }
.communication-email-typography .service-rich-text__paint-indicator { width:13px; min-height:16px; }
.communication-email-typography .service-rich-text__paint-indicator img { width:13px; height:13px; }
.communication-email-typography .service-rich-text__paint-row { display:grid; grid-template-columns:25px minmax(0,1fr) 48px 25px; width:100%; height:28px; min-width:0; }
.communication-email-typography .service-rich-text__swatch { width:25px; height:28px; padding:0; justify-content:center; border-radius:5px 0 0 5px; box-sizing:border-box; }
.communication-email-typography.service-rich-text__popup .service-rich-text__swatch-button { width:15px; min-width:15px; height:15px; min-height:15px; padding:0; border:0; border-radius:2px; background:var(--sce-swatch,#000); box-shadow:none; }
.communication-email-typography .service-rich-text__swatch.is-empty::after { width:15px; }
.communication-email-typography.service-rich-text__popup .service-rich-text__hex { width:100%; min-width:0; height:28px; min-height:28px; padding:3px 4px; border-radius:0; border-inline:0; font:10px/1.35 ui-monospace,monospace; }
.communication-email-typography .service-rich-text__opacity { width:48px; min-width:0; height:28px; padding-right:3px; border-radius:0 5px 5px 0; box-sizing:border-box; font-size:10px; }
.communication-email-typography.service-rich-text__popup .service-rich-text__opacity input { width:32px; min-width:0; height:26px; min-height:26px; padding:2px 0 2px 3px; border:0; border-radius:0; font:inherit; background:transparent; }
.communication-email-typography.service-rich-text__popup .service-rich-text__paint-row > button { width:25px; min-width:25px; height:28px; min-height:28px; margin:0; padding:5px; border:0; background:transparent; }
.communication-email-typography .service-rich-text__paint-row > button img { width:15px; height:15px; }
/* Reuse the calendar color plane and events without loading its full screen CSS. */
.communication-email-typography .service-rich-text__color-popover { position:static; width:100%; box-sizing:border-box; padding:7px; margin-top:5px; border:1px solid #ccc; border-radius:5px; background:#fff; }
.communication-email-typography .sce-color-plane { position:relative; height:100px; overflow:hidden; border-radius:4px; background:linear-gradient(#fff0,#000),linear-gradient(90deg,#fff,hsl(var(--sce-color-hue,0) 100% 50%)); cursor:crosshair; }
.communication-email-typography .sce-color-plane__handle { position:absolute; left:calc(var(--sce-color-saturation,0) * 1%); top:calc((100 - var(--sce-color-value,100)) * 1%); width:10px; height:10px; border:2px solid #fff; border-radius:50%; box-shadow:0 0 0 1px #111; transform:translate(-50%,-50%); pointer-events:none; }
.communication-email-typography .sce-color-hue-row { display:flex; gap:6px; align-items:center; margin:8px 0; }
.communication-email-typography .sce-color-eyedropper { font-size:15px; }
.communication-email-typography.service-rich-text__popup .sce-color-hue-row input[type=range] { width:100%; min-width:0; height:10px; min-height:0; margin:0; padding:0; appearance:none; border:0; border-radius:5px; background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00); }
.communication-email-typography .sce-color-hue-row input::-webkit-slider-thumb { width:12px; height:12px; appearance:none; border:2px solid #fff; border-radius:50%; background:transparent; box-shadow:0 0 0 1px #111; }
.communication-email-typography .sce-color-hue-row input::-moz-range-thumb { width:9px; height:9px; border:2px solid #fff; border-radius:50%; background:transparent; box-shadow:0 0 0 1px #111; }
.communication-email-typography .sce-color-opacity { display:none; }
.communication-email-typography .sce-color-values { display:grid; grid-template-columns:28px minmax(0,1fr) 34px; align-items:center; }
.communication-email-typography .sce-color-values > span,
.communication-email-typography .sce-color-values output { display:grid; place-items:center; align-self:stretch; border:1px solid #ccc; border-radius:4px 0 0 4px; font-size:9px; }
.communication-email-typography .sce-color-values output { border-radius:0 4px 4px 0; background:#f3f3f3; }
.communication-email-typography.service-rich-text__popup .sce-color-popover-hex { width:100%; min-width:0; height:25px; min-height:25px; padding:3px; border-inline:0; border-radius:0; font:10px/1.35 ui-monospace,monospace; }
.email-composer .cp-email-attachments { margin:0; padding:5px 0; border:0; }
.email-composer .cp-email-attachments > label,.email-composer .cp-email-attachments > .cp-muted { display:none; }
.email-composer [data-email-preview] { max-height:150px; overflow:auto; }
.email-composer .cp-email-association-summary { display:flex; align-items:center; flex-wrap:wrap; gap:5px; padding:5px 0; margin:0; font-size:9px; border-top:1px solid #ddd; }
.email-composer .cp-email-association-summary .icon { width:13px; height:13px; }
.email-composer .cp-email-follow-up { display:flex; align-items:center; gap:6px; padding:5px 0; margin:0; font-size:10px; }
.email-composer .cp-email-follow-up-date { margin:6px 0; }
.email-composer .email-composer-footer { display:flex; flex-wrap:wrap; align-items:center; gap:7px; min-height:36px; padding:6px 10px; border-top:1px solid var(--line-soft,#ccc); background:#fafafa; }
.email-draft-state { color:var(--muted); font-size:9px; margin-left:auto; }
.email-composer .cp-dialog-error { margin:0 12px; color:#a03131; font-size:10px; }
.email-composer .cp-dialog-error:empty,.email-composer [data-inline-status]:empty { display:none; }
.email-composer.is-minimized > :not(.email-composer-header) { display:none; }
.email-composer.is-minimized .email-composer-header { border-bottom:0; }
.email-send-review { margin:8px 12px; padding:8px; border:1px solid #b1b3af; background:var(--pale-lime,#f3ffd0); font-size:11px; }
.email-send-review button { margin-right:8px; }
.communication-email-popup { inset:0; margin:auto; width:min(820px,calc(100vw - 28px)); height:min(800px,calc(100dvh - 28px)); max-width:none; max-height:none; padding:0; border:1px solid #aaa; border-radius:6px; background:#fff; color:var(--ink); }
.communication-email-popup::backdrop { background:#0004; }
.communication-email-popup > .cp-inline-editor,.communication-email-popup .email-composer { max-height:none; height:100%; display:flex; flex-direction:column; min-height:0; }
.communication-email-popup .email-composer .cp-inline-fields { display:flex; flex:1; flex-direction:column; min-height:0; }
.communication-email-popup .email-composer .cp-dialog-content { display:flex; flex:1; flex-direction:column; overflow:auto; min-height:0; padding:0 16px; }
.communication-email-popup .cp-email-body-field { flex:1; min-height:200px; }
.communication-email-popup .communication-rich-text { min-height:200px; }
.communication-email-popup .service-rich-text__canvas { min-height:170px; }
.communication-email-popup .service-rich-text__document { min-height:170px; }
.cp-email-dialog:has(.email-composer) > .cp-drawer > .contact-create-drawer__header { display:none; }
.cp-email-dialog.email-native-expanded .cp-drawer { width:min(820px,100vw); }
.email-value-directory { width:min(450px,calc(100vw - 24px)); height:min(440px,calc(100dvh - 24px)); margin:auto; inset:0; background:#fff; border:1px solid #aaa; border-radius:5px; padding:0; }
.email-value-directory .advanced-filter-directory__body { display:flex; flex-direction:column; min-height:0; height:calc(100% - 45px); }
.email-value-directory .advanced-filter-directory__scroll-frame { flex:1; overflow:auto; }
.email-value-directory .advanced-filter-directory__options { overflow:visible; }
.email-value-directory .sce-value-detail { display:block; color:var(--muted); font-size:10px; }
.email-value-directory .advanced-filter-directory__controls { display:flex; gap:6px; flex-wrap:wrap; }
.email-value-directory .sce-values-context { margin:8px 12px; font-size:10px; }
.cp-inline-editor .email-composer .cp-dialog-content { padding:0 12px; overflow:auto; }
.cp-inline-editor .email-composer .service-rich-text__document { max-height:none; }
@media(max-width:600px) {
  .email-recipient-row { grid-template-columns:28px minmax(0,1fr) auto; gap:5px; }
  .email-subject-row .cp-editor-field { grid-template-columns:35px minmax(0,1fr); }
  .email-composer-header,.email-composer .email-composer-footer { padding:5px 8px; }
  .email-composer .service-rich-text__document { font-size:11px; }
  .email-composer .service-rich-text__inspector button { min-width:23px; padding:3px 5px; }
  .communication-email-popup { width:calc(100vw - 12px); height:calc(100dvh - 12px); }
}
.communication-composer-heading { display: flex; flex-wrap:wrap; align-items: center; gap: 8px; justify-content: space-between; margin-bottom: 6px; font-size: 10px; }
.cv-compose-control { display:flex; align-items:center; gap:6px; min-width:0; }
.cv-compose-mode.import-data-select { width:170px; max-width:100%; min-width:0; }
.cv-compose-mode .import-data-select__toggle { height:27px; min-height:27px; padding:3px 8px; font:10px/1.4 "DM Sans",sans-serif; border-radius:5px; }
.cv-compose-mode .contact-create-multiselect__caret { width:7.2px; height:4.8px; }
.cv-compose-mode .import-data-select__menu { width:100%; min-width:0; max-height:120px; overflow:auto; box-sizing:border-box; }
.cv-compose-mode .import-data-select__menu [role=option] { min-height:27px; padding:5px 7px; font:10px/1.4 "DM Sans",sans-serif; }
.cv-compose-mode .import-data-select__menu [role=option] > span { white-space:normal; overflow-wrap:anywhere; }
.communication-composer-controls { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 10px; }
.communication-composer-controls button { padding: 3px 7px; border: 1px solid #aaa; border-radius: 5px; background: #fff; font: inherit; }
.communication-note { display: grid; gap: 8px; padding: 8px; border: 1px solid #ccc; background: #dedede; }
.communication-note textarea { width: 100%; max-height: 200px; min-height: 70px; resize: vertical; border: 1px solid #aaa; border-radius: 5px; padding: 8px; font: inherit; }
.cv-composer.is-expanded textarea { min-height: 80px; max-height: 35dvh; }
.cv-composer { max-height: 65dvh; overflow-y: auto; }
.communication-note [role=alert], .communication-draft-error { color: #a03131; font-size: 11px; }
.communication-estimate { display: block; font-size: 9px; color: #626662; margin-block: 4px; }

.cp-email-dialog.communication-expanded .cp-drawer { width: min(720px, 100vw); }
.cp-email-dialog.communication-expanded .service-rich-text__document,
.cv-composer.is-expanded .service-rich-text__document { min-height: 220px; max-height: 35dvh; }

.cv-composer-row > [data-communication-rich] { flex: 1; min-width: 0; }
@media (max-width: 700px) {
  .cv-composer-row:has([data-communication-rich]) { flex-wrap: wrap; }
  .cv-composer-row > [data-communication-rich] { flex-basis: calc(100% - 45px); }
  .communication-rich-text .service-rich-text__inspector { gap: 3px; }
}

/* Connection settings reuse the profile's cards, tags, fields and drawer scroll. */
.cp-communication-connections { display: grid; gap: 12px; min-width: 0; }
.communication-settings-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.communication-settings-heading h3 { margin: 0; }
.communication-settings-heading button { flex-shrink: 0; }
.communication-provider-body { padding: 10px; min-width: 0; }
.communication-provider-identity { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.communication-provider-identity > strong { font-size: 13px; }
.communication-provider-body > .cp-muted { margin-block: 7px; }
.communication-provider .cp-record-details { margin-block: 10px; }
.communication-provider .cp-record-details > div { grid-template-columns: minmax(85px, 30%) minmax(0, 1fr); }
.communication-provider .cp-editor-field select { min-width: 0; max-width: 100%; }
.communication-account { display: grid; gap: 5px; border-bottom: 1px solid var(--line-soft); padding-block: 8px; margin-bottom: 10px; overflow-wrap: anywhere; }
.communication-account small { color: var(--muted); }
.communication-connection-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.communication-setup { margin-top: 12px; border-top: 1px solid var(--line-soft); padding-top: 9px; }
.communication-setup summary { cursor: pointer; font-size: 11px; }
.communication-setup summary:focus-visible { outline: 2px solid #287dc0; outline-offset: 3px; }
.communication-setup > .communication-setup-summary { display: flex; align-items: center; gap: 6px; list-style: none; }
.communication-setup-summary::-webkit-details-marker { display: none; }
.communication-setup-summary::marker { content: ""; }
.communication-setup-summary .communication-setup-chevron { flex: 0 0 7px; width: 7px; height: 5px; margin: 0; }
.communication-setup[open] > .communication-setup-summary .communication-setup-chevron { transform: rotate(180deg); }
.communication-setup-badge { display: inline-flex; align-items: center; gap: 2px; max-width: 100%; padding: 3px 6px; border: 0; border-radius: 5px; background: #e7e7e5; font-size: 10px; line-height: 1.3; vertical-align: middle; }
.communication-setup-badge[data-state="unavailable"] { background: rgb(255 165 92 / 25%); }
.communication-setup-badge[data-state="ready"] { background: #e5f3d7; }
.cp-communication-connections .communication-setup-info.cp-link { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 12px; width: 12px; min-width: 12px; height: 12px; min-height: 12px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; line-height: 1; text-decoration: none; }
.communication-setup-info .icon { display: block; width: 12px; height: 12px; margin: 0; }
.communication-setup-info:focus-visible { outline: 1px solid var(--ink); outline-offset: 2px; }
.communication-setup-dialog { overflow-y: auto; overscroll-behavior: contain; }
.communication-setup-dialog .data-types-action-dialog__actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.communication-provider-body button:disabled { cursor: not-allowed; opacity: .6; }
@media (max-width: 500px) {
  .communication-settings-heading { align-items: flex-start; flex-wrap: wrap; }
  .communication-provider .cp-record-details > div { grid-template-columns: 90px minmax(0, 1fr); }
}
