@import url("./crm-automation-action-fields.css");
/* One action, two lines. Details live in the editor beneath the card. */
.auto-rule{display:grid;grid-template-columns:27px minmax(0,1fr) 25px;align-items:center;column-gap:9px;padding:10px;border-radius:8px;min-height:70px}
.auto-rule.is-editing{border-color:var(--border-hover);box-shadow:0 2px 8px #00000008}
.auto-rule .auto-action-symbol,.auto-picker-symbol{display:grid;place-items:center;color:var(--action-color);width:27px;height:30px}
.auto-rule .auto-action-symbol svg,.auto-picker-symbol svg{width:21px;height:21px;stroke-width:1.7}
.auto-rule .auto-rule-main{display:flex;align-items:stretch;justify-content:center;gap:5px;min-width:0;padding:0;background:none;border:0;text-align:left;opacity:1}
.auto-rule .auto-rule-main .auto-rule-event{display:block;max-width:none;font-size:12px;line-height:1.4;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.auto-rule .auto-rule-description{display:block;font-size:12px;line-height:1.45;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.auto-rule .auto-rule-description strong{font-size:12px;line-height:inherit;font-weight:500}
.auto-rule .auto-rule-description>span{color:var(--muted)}
.auto-rule .auto-rule-tools{display:flex;flex-direction:column;align-items:center;gap:5px}
.auto-rule .auto-rule-switch{transform:scale(.82);transform-origin:center}
.auto-rule .auto-delete-action{width:22px;height:22px;padding:3px;border:0;background:transparent;color:var(--muted);opacity:0;transition:opacity 100ms,color 100ms}
.auto-rule .auto-delete-action svg{width:13px;height:13px}
.auto-rule:is(:hover,:focus-within) .auto-delete-action{opacity:1}
.auto-rule .auto-delete-action:hover{background:transparent;color:var(--error)}
.auto-rule [data-paused-label]{display:none}
.auto-rule.is-paused .auto-action-symbol,.auto-rule.is-paused .auto-rule-main{opacity:.55}
.auto-picker-popover .auto-action-picker button>.auto-picker-symbol{flex:0 0 27px;font-size:inherit}
.auto-picker-popover .auto-action-picker button{gap:10px;padding:9px 8px}
.auto-action-editor.crm-anchored-panel{padding:16px;border-radius:9px;animation:none;font-size:14px;line-height:1.5;scrollbar-width:thin}
.auto-action-editor form{margin:0;min-width:0}
.ae-loading{min-height:130px}
.ae-triggers,.ae-actions{padding-top:18px;margin-top:18px;border-top:1px solid var(--line)}
.ae-actions{display:grid;gap:12px}
.ae-action{display:grid;gap:11px;min-width:0}
.ae-action h3{font-size:12px;font-weight:500;margin:0}
.ae-field{display:flex;flex-direction:column;gap:5px;min-width:0;color:var(--ink)}
.ae-field>span:first-child{font-size:13px;color:var(--muted)}
.auto-action-editor .ae-field input,.auto-action-editor .ae-field textarea,.auto-action-editor .ae-field select{box-sizing:border-box;min-width:0;width:100%;margin:0;padding:7px 9px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink);font:inherit;box-shadow:none}
.auto-action-editor .ae-field :is(input,select){height:36px}
.auto-action-editor .ae-field textarea{resize:vertical;min-height:65px}
.auto-action-editor .ae-field :is(input,textarea,select):focus{border-color:var(--border-hover);outline:none;box-shadow:none}
.ae-select{position:relative;display:block;min-width:0}
.auto-action-editor .ae-select select{appearance:none;padding-right:29px}
.ae-select>svg{pointer-events:none;position:absolute;right:10px;top:50%;width:13px;height:13px;transform:translateY(-50%);color:var(--muted)}
.ae-fields-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ae-preserved{font-size:12px;line-height:1.5;color:var(--muted);margin:0}
.ae-complete{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px}
.ae-complete svg{width:16px;height:16px;color:#d45b5b}
.ae-footer{display:flex;align-items:center;gap:7px;position:sticky;bottom:-16px;padding:13px 0 0;margin-top:14px;background:var(--surface);border-top:1px solid var(--line);z-index:2}
.ae-footer .btn{font-size:12px;min-height:31px;padding:6px 13px;border-radius:7px}
.auto-action-editor .form-feedback:empty{display:none}
.auto-action-editor .form-feedback{font-size:12px;margin-top:9px}
.at-triggers{display:grid;gap:12px}
.at-trigger{min-width:0;padding-bottom:12px;border-bottom:1px solid var(--line)}
.at-trigger:last-child{padding-bottom:0;border:0}
.at-trigger-heading{display:flex;align-items:center;gap:6px;min-height:40px}
.at-row-label{flex-shrink:0;font-size:13px;font-weight:400;color:var(--muted)}
.at-type{min-width:0;flex:1}
.at-type.at-type-icon{flex:0 0 24px;align-self:center}
.auto-action-editor summary{list-style:none;cursor:pointer}
.auto-action-editor summary::-webkit-details-marker{display:none}
.at-type>summary{display:flex;align-items:center;gap:8px;color:var(--ink);font-weight:400;padding:8px 10px;font-size:14px;line-height:1.5;min-height:40px;box-sizing:border-box;border:1px solid var(--line);border-radius:7px;background:var(--surface)}
.at-type-value{flex:1;min-width:0}
.at-type:not(.at-type-icon)>summary:hover,.at-trigger-control:hover,.at-delay-control:hover{border-color:var(--border-hover)}
.at-trigger-control{display:flex;align-items:center;gap:8px;flex:1;min-width:0;min-height:40px;padding:5px 7px 5px 10px;border:1px solid var(--line);border-radius:7px;background:var(--surface);box-sizing:border-box}
.at-trigger-control>[data-trigger-selected]{flex:1}
.at-trigger-control>.at-row-label{align-self:flex-start;line-height:28px}
.at-type>summary>svg{width:14px;height:14px;color:var(--muted);flex-shrink:0}
.at-type-icon>summary{justify-content:center;min-height:28px;padding:0;border:0;background:transparent}
body[data-workspace=true] .auto-action-editor .at-remove{display:grid;place-items:center;width:24px;height:32px;min-width:24px;align-self:center;padding:5px;border:0;border-radius:0;background:transparent;box-shadow:none;color:var(--muted)}
.at-remove svg{width:13px;height:13px}
body[data-workspace=true] .auto-action-editor .at-remove:is(:hover,:active){background:transparent;border:0;box-shadow:none;color:var(--error)}
body[data-workspace=true] .auto-action-editor .at-remove::before,body[data-workspace=true] .auto-action-editor .at-remove::after{display:none}
.at-remove:disabled{opacity:0;pointer-events:none}
.at-options,.at-field-options,.at-tag-options{box-sizing:border-box;inset:auto;margin:0;padding:7px;border:1px solid var(--line);border-radius:9px;background:var(--popup);color:var(--ink);font-size:14px;line-height:1.5;overflow:auto;overscroll-behavior:contain;box-shadow:0 8px 28px #0000001c}
.at-options::backdrop,.at-field-options::backdrop,.at-tag-options::backdrop{background:transparent}
.at-options h4,.at-field-options h4{margin:0;padding:9px 9px 5px;font-size:11px;letter-spacing:.035em;text-transform:uppercase;font-weight:500;color:var(--muted)}
.at-options>button,.at-field-options button{display:block;width:100%;padding:9px;min-height:38px;border:0;color:var(--ink);font:inherit;text-align:left;border-radius:6px;background:transparent;cursor:pointer}
.at-options>button:hover,.at-field-options button:hover{background:var(--popup-hover)}
.at-options h4:not(:first-child){margin-top:7px;border-top:1px solid var(--line)}
.at-choice-row{display:flex;align-items:center;gap:4px;padding:8px 5px 8px 9px;border-radius:6px;cursor:pointer}
.at-choice-row:hover{background:var(--popup-hover)}
.at-choice-row>.at-sentence{flex:1}
.at-options .at-choice-confirm{display:grid;place-items:center;flex:0 0 26px;width:26px;height:30px;padding:4px;border:0;background:transparent;color:var(--muted);cursor:pointer}
.at-choice-confirm svg{width:16px;height:16px}
.at-options .at-choice-confirm:hover{color:var(--ink)}
.at-select{position:relative;display:inline-flex;align-items:center;min-width:0;max-width:100%}
.auto-action-editor .at-select select{appearance:none;field-sizing:content;min-width:0;max-width:100%;margin:0;padding:2px 17px 2px 0;height:29px;background:transparent;border:0;border-radius:0;box-shadow:none;font:inherit;font-weight:500;color:var(--ink);cursor:pointer;text-decoration:underline;text-decoration-color:var(--border-hover);text-underline-offset:4px;text-decoration-thickness:1px}
.at-select>svg{position:absolute;right:1px;top:50%;transform:translateY(-50%);pointer-events:none;width:11px;height:11px;color:var(--muted)}
.at-delay{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 30px 0 0;font-size:14px}
.at-delay-control{display:flex;align-items:center;gap:8px;flex:1 1 100%;min-width:0;min-height:40px;padding:4px 10px;border:1px solid var(--line);border-radius:7px;background:var(--surface);box-sizing:border-box;cursor:pointer}
.at-delay-control .at-select{flex:1}
.auto-action-editor .at-delay-control select{width:100%;text-decoration:none;font-weight:400}
.at-delay-control:focus-within,.at-trigger-control:focus-within{border-color:var(--border-hover)}
.at-trigger [data-schedule-host]{margin-right:30px}
.at-trigger .as-editor{display:grid;gap:8px;margin-top:8px}
.at-trigger .as-row{border:1px solid var(--line);border-radius:7px;min-height:40px;background:var(--surface)}
.at-trigger .as-row:hover{border-color:var(--border-hover)}
.at-interval{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--muted)}
.auto-action-editor .at-interval input{width:35px;height:31px;border:1px solid var(--line);border-radius:6px;padding:4px;background:var(--surface);font:inherit;text-align:center;color:var(--ink);box-shadow:none}
.at-sentence{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 5px;min-width:0;margin:0;font-size:14px;line-height:1.8;color:var(--ink)}

.at-field-menu{display:inline-block;min-width:0;max-width:100%}
.at-field-menu>summary{display:inline-flex;align-items:center;color:var(--ink);font-weight:500;text-decoration:underline;text-decoration-color:var(--border-hover);text-underline-offset:4px;overflow-wrap:anywhere}
.at-field-options details>summary{display:flex;align-items:center;justify-content:space-between;padding:9px;color:var(--muted)}
.at-field-options details>summary svg{width:13px;height:13px}
.at-tag-menu{display:inline-block;min-width:0;max-width:100%;color:var(--ink)}
.at-tag-menu>summary{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px;min-height:28px;max-width:100%}
.at-tag-chip,.at-tag-placeholder{padding:0 7px;border:1px solid var(--line);background:var(--soft);border-radius:5px;font-size:12px;line-height:23px;overflow-wrap:anywhere}
.at-tag-placeholder{background:transparent;color:var(--muted)}
.at-tag-options>label{display:flex;align-items:center;gap:8px;min-height:32px;padding:5px;cursor:pointer;border-radius:5px}
.at-tag-options>label:hover{background:var(--popup-hover)}
.auto-action-editor .at-tag-options input[type=checkbox]{appearance:auto;width:15px;height:15px;min-height:0;margin:0;padding:0;accent-color:var(--ink);box-shadow:none}
.at-tag-create{display:flex;align-items:center;gap:5px;border-top:1px solid var(--line);margin-top:5px;padding:7px 2px 2px}
.auto-action-editor .at-tag-create input{flex:1;min-width:0;width:100%;padding:5px;border:0;background:transparent;font:inherit;color:var(--ink);box-shadow:none}
.at-tag-create button{width:27px;height:27px}
.at-tag-create button svg{width:15px;height:15px}
.at-add{margin-top:10px}
.at-add>summary{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);padding:8px 10px;margin-right:30px;border:1px dashed var(--line);border-radius:7px;min-height:37px;box-sizing:border-box}
.at-add>summary:hover{color:var(--ink);border-color:var(--border-hover)}
.at-add>summary>svg{width:14px;height:14px}
.at-error{margin:8px 0 0;color:var(--error);font-size:12px}
.at-error[hidden]{display:none}
.at-empty{font-size:13px;color:var(--muted)}
.auto-action-editor :is(button,summary,select):focus-visible{outline:1px solid var(--ink);outline-offset:2px}
@media(hover:none){.auto-rule .auto-delete-action{opacity:1}}
@media(max-width:500px){.auto-action-editor.crm-anchored-panel{padding:13px}.ae-footer{bottom:-13px}.ae-fields-row{gap:8px}.at-row-label{font-size:12px}.at-type>summary,.at-sentence,.at-delay{font-size:13px}.at-trigger-control{flex-wrap:wrap}.at-trigger-control>[data-trigger-selected]{flex-basis:calc(100% - 80px)}.at-options{font-size:13px}.at-choice-row{padding-inline:5px}}
@media(prefers-reduced-motion:reduce){.auto-rule .auto-delete-action{transition:none}}
.at-type .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
