/* Shared read and review-before-send translation for every Rose Garden chat. */
.rg-chat-translation-tools{flex:0 0 auto;margin:10px 0;padding:9px 12px;border:1px solid #dce6df;border-radius:12px;background:#f4f8f3;color:#283d35;font-size:12px;line-height:1.5}
.rg-chat-translation-tools>summary{cursor:pointer;font-weight:750}
.rg-chat-language-controls{display:flex;align-items:end;flex-wrap:wrap;gap:10px;margin:10px 0}
.rg-chat-language-controls label{display:grid;gap:3px;font-size:11px}
.rg-chat-language-controls select{max-width:180px;min-height:34px;padding:5px 8px;border:1px solid #cdd8d1;border-radius:8px;background:#fff;color:#283d35}
.rg-chat-language-controls button,.rg-chat-message-tools button{min-height:30px;padding:5px 10px;border:1px solid #cdd8d1;border-radius:8px;background:#fff;color:#315c50;font-size:11px;cursor:pointer}
.rg-chat-translation-tools>small{display:block;font-size:10px;color:#626f67}
.rg-chat-translation-status{margin:5px 0 0;font-size:10px}
.rg-chat-translation-status:empty,.rg-chat-draft-status:empty{display:none}
.rg-chat-translation-status.is-error,.rg-chat-draft-status.is-error,.rg-chat-message-translation.is-error{color:#934738}
.rg-chat-draft-tools{display:grid!important;flex:0 0 auto;grid-column:1/-1;align-items:stretch!important;min-width:0;max-width:100%;margin:7px 0;padding:10px 12px;border:1px solid #dce6df;border-radius:12px;background:#f4f8f3;color:#283d35}
.rg-chat-draft-controls{display:flex;flex-wrap:wrap;align-items:end;gap:8px;min-width:0}
.rg-chat-draft-controls>label{display:grid;flex:1 1 130px;gap:4px;min-width:0;margin:0!important;font-size:11px!important;font-weight:650}
.rg-chat-draft-controls select{width:100%;min-width:0;max-width:100%;min-height:37px;margin:0;padding:7px 8px;border:1px solid #cdd8d1;border-radius:8px;background:#fff;color:#283d35;font:inherit;font-size:12px}
.rg-chat-draft-controls button,.rg-chat-draft-actions button{flex:0 1 auto;min-height:37px;max-width:100%;padding:8px 12px;border:1px solid #315c50;border-radius:9px;background:#315c50;color:#fff;font:inherit;font-size:12px;font-weight:700;line-height:1.3;white-space:normal;cursor:pointer}
.rg-chat-draft-controls button:disabled{opacity:.65;cursor:wait}
.rg-chat-draft-status{margin:7px 0 0!important;color:#526a5c;font-size:11px!important;line-height:1.5;overflow-wrap:anywhere}
.rg-chat-draft-preview{display:grid;flex:0 0 auto;grid-column:1/-1;gap:7px;min-width:0;max-width:100%;padding:12px;margin:6px 0;border:1px solid #e9cbd4;border-left:3px solid #b95f76;border-radius:10px;background:#fff1f5;color:#283d35;font-size:12px;overflow-wrap:anywhere}
.rg-chat-draft-preview>strong{font-size:12px;font-weight:750}
.rg-chat-draft-preview>small{font-size:11px;color:#6c5760}
.rg-chat-draft-preview>label{display:grid;gap:5px;min-width:0;margin:0!important;font-size:11px!important;font-weight:650}
.rg-chat-draft-preview .rg-chat-translated-draft{box-sizing:border-box;display:block;width:100%;min-width:0;max-width:100%;min-height:84px;margin:0;padding:10px 11px;border:1px solid #d7bac4;border-radius:8px;background:#fff;color:#283d35;font:inherit;font-size:13px;line-height:1.5;white-space:pre-wrap;resize:vertical}
.rg-chat-draft-preview .rg-chat-translated-draft:disabled{opacity:.6;background:#faf4f6}
.rg-chat-draft-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.rg-chat-draft-actions .rg-chat-use-translation{display:flex;flex:1 1 200px;align-items:flex-start;gap:7px;min-width:0;margin:0;font-size:11px;font-weight:650;line-height:1.5;cursor:pointer}
.rg-chat-use-translation input[type=checkbox]{flex:0 0 16px;appearance:auto;width:16px;min-width:16px;height:16px;min-height:16px;margin:1px 0 0;padding:0;accent-color:#315c50}
.rg-chat-draft-actions button{border-color:#d7bac4;background:#fff;color:#315c50;font-size:11px}
.rg-chat-draft-preview[hidden],.rg-chat-message-translation[hidden]{display:none!important}
.rg-chat-draft-tools[hidden],.rg-chat-translation-tools[hidden]{display:none!important}
.rg-chat-translation-toggle{display:inline-flex;align-items:center;justify-content:center;justify-self:end;flex:0 0 38px;width:38px;height:38px;min-height:38px;padding:0;margin:4px 0;border:1px solid #dce6df;border-radius:50%;background:#fff;color:#315c50;font-size:16px;font-weight:700;cursor:pointer}
.rg-chat-translation-toggle[aria-expanded=true],.chat-language-toggle[aria-expanded=true]{background:#315c50;color:#fff;border-color:#315c50}
.rg-chat-translation-toggle:focus-visible,.rg-chat-compact button:focus-visible{outline:2px solid #b95f76;outline-offset:3px}
.rg-chat-compact:not(.rg-chat-translation-open) .rg-chat-message-tools,
.rg-chat-compact:not(.rg-chat-translation-open) .chat-message-tools,
.rg-chat-compact:not(.rg-chat-translation-open) .chat-message-translation{display:none!important}
.rg-chat-compact #chatLanguageTools{display:none!important}
.rg-chat-draft-tools>.rg-chat-translation-tools{margin:7px 0 0;padding:7px 0 0;border:0;border-top:1px solid #dce6df;border-radius:0;background:transparent;font-size:11px}
.rg-chat-draft-tools>.rg-chat-translation-tools>strong,.rg-chat-draft-tools>.rg-chat-translation-tools>small{display:none}
.rg-chat-draft-tools .rg-chat-language-controls{margin:0;gap:8px}
.rg-chat-draft-tools .rg-chat-language-controls>label{flex:1 1 130px}
.rg-chat-draft-tools .rg-chat-language-controls select{width:100%;max-width:none}
.rg-chat-message-tools button,.rg-chat-compact .chat-message-tools button{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:6px;border-radius:50%;font-size:13px}
.rg-chat-compact .chat-message-tools svg,.rg-chat-voice-controls svg{width:17px;height:17px}
.rg-chat-voice-controls{display:flex;justify-content:flex-end;gap:6px;margin-top:5px}
.rg-chat-voice-controls button{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:6px;border:1px solid #dce6df;border-radius:50%;background:#fff;color:#315c50;cursor:pointer}
#chatInput{box-sizing:border-box;flex:1 1 auto;width:100%;min-width:0;min-height:43px;max-height:100px;padding:11px 14px;border:1px solid #d8dfe3;border-radius:26px;background:#f5f7f8;color:#293a45;font:inherit;font-size:13px;line-height:1.5;resize:none;overflow:auto}
#chatPanel>#chatLanguageStatus{flex:0 0 auto;margin:3px 12px;font-size:11px;line-height:1.4}
#chatPanel>#chatLanguageStatus:empty{display:none}
#chatPanel .chat-form:has(>.rg-chat-translation-toggle){grid-template-columns:38px minmax(0,1fr) 46px}
.rg-chat-message-translation{border-top:1px dashed #c5d4c9;margin:8px 0 0!important;padding-top:8px!important;white-space:pre-wrap;overflow-wrap:anywhere;color:#315c50;font-size:inherit}
.rg-chat-message-tools{display:flex;gap:6px;margin-top:7px}
#chatPanel>.rg-chat-translation-tools{align-self:center;width:min(calc(100% - 20px),1100px);margin:5px 10px;padding:7px 9px;font-size:10px}
#chatPanel>.rg-chat-translation-tools[open]{max-height:180px;overflow:auto}
#chatPanel .rg-chat-language-controls{margin:7px 0;gap:7px}
#chatPanel .rg-chat-language-controls select{min-height:30px;font-size:10px}
#chatPanel .rg-chat-message-translation{font-size:inherit}
#chatPanel>.rg-chat-draft-tools,#chatPanel>.rg-chat-draft-preview{box-sizing:border-box;align-self:center;width:min(calc(100% - 20px),1100px);margin:4px 10px;padding:8px 10px}
#chatPanel>.rg-chat-draft-preview{max-height:260px;overflow:auto}
.rg-chat-translation-tools[open]>summary{margin-bottom:4px}
@media(max-width:560px){
  .rg-chat-translation-tools{padding:8px;font-size:11px}
  .rg-chat-language-controls{gap:7px}
  .rg-chat-language-controls label{flex:1 1 115px}
  .rg-chat-language-controls select{width:100%;max-width:none}
  .rg-chat-language-controls button{font-size:10px}
  .rg-chat-draft-tools{padding:8px}
  .rg-chat-draft-controls{gap:7px}
  .rg-chat-draft-controls>label{flex:1 1 100px;font-size:10px!important}
  .rg-chat-draft-controls select{min-height:34px;font-size:11px}
  .rg-chat-draft-controls button{flex:1 1 100%;min-height:35px;padding:7px 9px;font-size:11px}
  .rg-chat-draft-preview{padding:9px;font-size:11px}
  .rg-chat-draft-preview .rg-chat-translated-draft{min-height:72px;font-size:12px}
  .rg-chat-draft-actions .rg-chat-use-translation{flex-basis:100%;font-size:10px}
  .rg-chat-draft-status{font-size:10px!important}
  #chatPanel>.rg-chat-draft-preview{max-height:215px}
}
/* Keep the original composer and Send visible while reviewing on short screens. */
#chatPanel:has(>.rg-chat-draft-preview:not([hidden]))>.chat-intro,
#chatPanel:has(>.rg-chat-draft-preview:not([hidden]))>.chat-footnote{display:none}
#chatPanel>.rg-chat-draft-tools{flex:0 1 auto;min-height:0;max-height:min(175px,27dvh);overflow:auto;overscroll-behavior:contain}
#chatPanel>.rg-chat-draft-preview{flex:0 1 auto;min-height:0;max-height:min(240px,33dvh);overscroll-behavior:contain}
#chatPanel:has(>.rg-chat-draft-preview:not([hidden]))>.chat-messages{min-height:min(120px,18dvh)}
#chatPanel:has(>.rg-chat-draft-preview:not([hidden]))>.chat-quick{flex:0 1 auto;min-height:0;max-height:min(140px,22dvh);overflow:auto}
#chatPanel>.chat-form{flex:0 0 auto}
@media(max-height:520px){
  #chatPanel>.rg-chat-draft-preview{max-height:26dvh;padding:7px 9px;gap:5px}
  #chatPanel>.rg-chat-draft-tools{max-height:26dvh;padding:7px 9px}
  #chatPanel:has(>.rg-chat-draft-preview:not([hidden]))>.chat-messages{min-height:min(80px,16dvh)}
}
