/* Gestión Pernil • Inbox v2 — messaging-first responsive layer.
   Deliberately scoped to #inbox to preserve all operational views. */
#inbox .inbox-layout{grid-template-columns:310px minmax(320px,1fr) 320px;background:#fff}
#inbox .thread-panel{border-right:1px solid #e5eae7}
#inbox .threads-top{padding:20px 18px 10px;min-height:68px}
#inbox .threads-top h2{font-size:23px;letter-spacing:-.055em;font-weight:800;line-height:1.2;margin:0 0 3px;color:#1e342d}
#inbox .inbox-search-icon{height:43px;width:43px;min-width:43px;border:0;border-radius:50%;background:#f0f5f1;color:#285e4a;font-size:27px;cursor:pointer}
#inbox .searchbar{margin:3px 12px 9px;border-radius:13px;min-height:43px;background:#f0f3f1}
#inbox .searchbar input{font-size:14px;padding:10px 0}
#inbox .thread-filters{gap:6px;padding:2px 12px 11px;flex-shrink:0}
#inbox .thread-filters button{font-size:12px;font-weight:650;border:1px solid #e4ebe6;color:#536c5d;background:#fff;padding:9px 12px;min-height:39px}
#inbox .thread-filters button.selected{border-color:#b8d9c5;background:#e4f4ea;color:#09563f}
#inbox .thread-list{border-top:1px solid #edf0ee;background:#fff;overscroll-behavior:contain}
#inbox .live-thread{position:relative;display:flex;gap:11px;align-items:center;min-height:77px;padding:12px 14px;border:0;border-bottom:1px solid #f1f3f1;text-align:left;width:100%;cursor:pointer;background:#fff}
#inbox .live-thread:hover{background:#f7f9f7}
#inbox .live-thread.selected{background:#e8f5ec;box-shadow:inset 3px 0 #15835d}
#inbox .live-thread:focus-visible,#inbox button:focus-visible{outline:2px solid #1c8061;outline-offset:-2px}
#inbox .live-thread .live-avatar{height:45px;width:45px;font-size:17px;background:#e2ede6;color:#206b52}
#inbox .thread-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
#inbox .thread-primary{display:flex;align-items:baseline;gap:9px;justify-content:space-between;min-width:0}
#inbox .thread-primary strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;line-height:1.25;color:#20392f;font-weight:700}
#inbox .live-thread.has-unread .thread-primary strong{font-weight:850}
#inbox .thread-time{font-size:10px;color:#789086;flex-shrink:0}
#inbox .thread-secondary{font-size:12px;line-height:1.35;color:#687f74;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
#inbox .thread-flags{display:flex;gap:6px;align-items:center;min-height:14px}
#inbox .thread-channel{color:#239b65;font-size:13px;line-height:1}
#inbox .thread-tag{font-size:10px;color:#6e8174;line-height:1.25;border-radius:5px}
#inbox .live-thread .cnt{flex-shrink:0;background:#12815b;color:#fff;font-size:10px;min-width:20px;min-height:20px;display:grid;place-items:center;padding:3px 5px;border-radius:50%;margin:0}
#inbox .inbox-empty{padding:34px 22px;text-align:center;color:#557367;font-size:13px;line-height:1.6}
#inbox .inbox-empty strong{display:block;color:#203c2f;margin-bottom:5px;font-size:14px}
#inbox .chat-panel{background:#f6f8f6}
#inbox .chat-header{height:62px;min-height:62px;padding:0 18px;background:#fff;border-bottom:1px solid #e8edea;gap:10px}
#inbox .chat-header .live-avatar{width:41px;height:41px;font-size:17px}
#inbox #chat-profile-trigger{text-align:left;border:0;outline-offset:2px;background:transparent;padding:5px 2px;cursor:pointer;font-family:inherit;min-width:0}
#inbox #chat-profile-trigger h2{font-size:16px;line-height:1.28;margin:0 0 3px;font-weight:770}
#inbox #chat-profile-trigger>div{font-size:11px;color:#779185;display:block}
#inbox .chat-header #show-contact{font-size:25px;color:#577166;border-radius:50%;height:42px;width:42px}
#inbox .chat-scroll{padding:18px 26px;background:#f5f7f5;background-image:none;overscroll-behavior:contain}
#inbox .chat-messages{display:flex;flex-direction:column;gap:5px;min-height:100%}
#inbox .chat-day-divider{align-self:center;text-align:center;margin:13px auto 11px}
#inbox .chat-day-divider span{font-size:11px;color:#587566;font-weight:650;background:#e7eee9;border-radius:7px;padding:6px 11px;text-transform:capitalize}
#inbox .chat-messages .live-bubble{font-family:inherit;position:relative;display:flex;flex-direction:column;align-self:flex-start;margin:0;max-width:min(76%,510px);min-width:85px;padding:10px 12px 7px;background:#fff;color:#25372f;white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;line-height:1.48;font-size:14px;border:1px solid #e7ebe8;border-radius:15px 15px 15px 4px;box-shadow:0 1px 2px #223a2a0c}
#inbox .chat-messages .live-bubble.out{align-self:flex-end;margin:0;background:#d8f1e0;border:1px solid #cee7d5;border-radius:15px 15px 4px 15px}
#inbox .chat-messages .live-bubble.chat-bubble-compact{margin-top:-2px;border-radius:9px 14px 14px 4px}
#inbox .chat-messages .live-bubble.out.chat-bubble-compact{border-radius:14px 9px 4px 14px}
#inbox .chat-messages .live-bubble small{display:block;align-self:flex-end;margin:4px 0 0 12px;color:#6f8777;font-size:10px;line-height:1.2}
#inbox .bubble-media-label{font-weight:600;color:#416353;font-size:13px}
#inbox .chat-bottom{position:relative;padding:9px 16px 9px;background:#fff;border-top:1px solid #e4ebe5;display:flex;align-items:flex-end;gap:9px;flex-wrap:wrap}
#inbox .chat-secondary-actions{flex:0 0 auto;position:relative;order:0;align-self:flex-end}
#inbox .chat-action-plus{height:46px;width:46px;border-radius:50%;border:1px solid #dce9e0;background:#eff6f1;color:#167452;font-size:27px;font-weight:350;cursor:pointer}
#inbox .chat-actions-menu{position:absolute;left:0;bottom:calc(100% + 11px);z-index:14;min-width:200px;max-width:min(280px,80vw);padding:6px;border:1px solid #dce8df;border-radius:14px;background:#fff;box-shadow:0 8px 25px #223a2b20;display:flex;flex-direction:column;gap:2px}
#inbox .chat-actions-menu .quick-action{border:0;border-radius:8px;background:#fff;color:#244a38;text-align:left;font-size:13px;font-weight:650;padding:12px 13px;min-height:42px;white-space:normal}
#inbox .chat-actions-menu .quick-action:hover{background:#eaf5ed}
#inbox .chat-actions-menu.hidden{display:none}
#inbox .compose-row{order:1;flex:1;min-width:0;gap:8px;align-items:flex-end}
#inbox .compose-row textarea{font-family:inherit;resize:none;flex:1;font-size:14px;line-height:1.45;border-radius:21px;background:#f7f9f7;border:1px solid #e0e9e2;padding:12px 15px;min-height:46px;height:auto;max-height:130px}
#inbox .send-button{width:46px;height:46px;min-width:46px;min-height:46px;border-radius:50%;background:#0c8060;font-size:20px}
#inbox .send-button[disabled]{opacity:.6}
#inbox .composer-foot{order:3;width:100%;min-height:0;margin:0 0 0 55px;color:#8a9d90;font-size:10px;line-height:1.15}
#inbox #chat-template-row{order:2;width:100%;margin:0;padding:3px 0;background:#fff;display:none}
#inbox #chat-template-row.is-open{display:flex}
#inbox .chat-context-backdrop{display:none}
#inbox .contact-panel{background:#fff}
#inbox .contact-top{padding:18px 16px 9px}
#inbox .contact-top h3{font-size:16px}
#inbox .live-contact{padding:8px 16px 30px;font-size:13px;line-height:1.55;color:#304e3e}
#inbox .live-contact>strong{font-size:17px}
#inbox .live-contact>p{margin:9px 0;font-size:12px;color:#547164;overflow-wrap:anywhere}
#inbox .contact-editor{border:1px solid #dfe9e1;border-radius:11px;padding:0 11px;margin:15px 0}
#inbox .contact-editor>summary{cursor:pointer;font-weight:750;min-height:45px;display:flex;align-items:center;color:#1a6046;font-size:13px}
#inbox .contact-notes{margin:14px 0;padding:13px;border-radius:12px;background:#f7faf7}
#inbox .contact-notes h4{font-size:13px;margin:0 0 4px}
#inbox .contact-notes-help{font-size:11px;color:#7b897e;line-height:1.5}
#inbox .live-contact textarea{width:100%;border:1px solid #dce5dd;border-radius:9px;font:inherit;padding:10px}
#inbox .live-contact button:not(.icon-button){font-size:12px;min-height:40px;padding:8px 11px;background:#eaf5ee;border:1px solid #bfdbca;color:#116245;border-radius:9px;font-weight:720;cursor:pointer}
@media(max-width:1120px) and (min-width:761px){
 #inbox .inbox-layout{grid-template-columns:300px minmax(0,1fr)}
 #inbox .inbox-layout.show-inspector{grid-template-columns:275px minmax(0,1fr) 295px}
}
@media(max-width:760px){
 #inbox .inbox-layout{display:block;position:relative;width:100%;height:100%;min-height:0}
 #inbox .threads-top{min-height:63px;padding:13px 16px 7px}
 #inbox .threads-top h2{font-size:23px}
 #inbox .live-thread{min-height:74px;padding:10px 13px}
 #inbox .live-thread .live-avatar{height:44px;width:44px}
 #inbox .thread-primary strong{font-size:15px}
 #inbox .thread-secondary{font-size:13px}
 #inbox .thread-list{min-height:0}
 #inbox .chat-panel{display:none;position:absolute;inset:0;width:100%;height:100%;z-index:5;min-width:0}
 #inbox .inbox-layout.mobile-chat .chat-panel{display:flex}
 #inbox .inbox-layout.mobile-chat .thread-panel{display:none}
 .chat-is-open .main-header,.chat-is-open .rail{display:none!important}
 .chat-is-open .workspace{height:100dvh!important;min-height:0}
 .chat-is-open .main{height:100dvh!important;min-height:0!important;flex:1!important}
 .chat-is-open #inbox.section.active{height:100%;min-height:0}
 .chat-is-open #inbox .inbox-layout{height:100%}
 #inbox .chat-header{height:58px;min-height:58px;padding:0 10px}
 #inbox .chat-header #back-chat{height:44px;min-width:40px;display:grid;place-items:center;font-size:34px}
 #inbox .chat-header .live-avatar{width:38px;height:38px}
 #inbox #chat-profile-trigger h2{font-size:15px}
 #inbox .chat-scroll{padding:12px 10px;flex:1;min-height:0}
 #inbox .chat-messages{gap:5px}
 #inbox .chat-messages .live-bubble{font-size:14px;line-height:1.43;max-width:85%;padding:9px 11px 6px}
 #inbox .chat-messages .live-bubble small{font-size:10px}
 #inbox .chat-day-divider{margin:8px auto 9px}
 #inbox .chat-bottom{padding:7px 9px calc(6px + env(safe-area-inset-bottom));gap:7px}
 #inbox .chat-action-plus{width:43px;height:43px}
 #inbox .compose-row textarea{font-size:16px;min-height:44px;padding:10px 13px}
 #inbox .send-button{width:44px;height:44px;min-width:44px;min-height:44px}
 #inbox .composer-foot{display:none}
 #inbox #chat-template-row{padding:5px 0;gap:7px}
 #inbox #chat-template-row.is-open{display:flex}
 #inbox .chat-context-backdrop:not(.hidden){display:block;position:fixed;inset:0;background:#18282075;border:0;z-index:58;width:100%;height:100%}
 #inbox .contact-panel{position:fixed;top:12dvh;right:0;bottom:0;left:0;width:100%;height:auto;overflow:auto;z-index:60;background:#fff;border-radius:19px 19px 0 0;box-shadow:0 -8px 30px #112d1f30;display:none}
 #inbox .inbox-layout.show-inspector .contact-panel{display:flex}
 #inbox .contact-top{position:sticky;top:0;z-index:1;background:#fff;padding:15px 20px;border-bottom:1px solid #e3eee6}
 #inbox .live-contact{padding:15px 20px 40px}
}
@media(max-width:370px){
 #inbox .live-thread{padding:9px 10px}
 #inbox .thread-filters button{padding:9px 10px;font-size:11px}
 #inbox .chat-messages .live-bubble{max-width:89%}
}

#inbox #chat-profile-trigger .chat-name{display:block;font-size:16px;font-weight:770;line-height:1.28;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:3px;color:#263d32}
#inbox #chat-profile-trigger #chat-subtitle{display:block;font-size:11px}
.chat-preview-label{font-size:10px;display:inline-block;color:#966516;background:#fff2d8;border:1px solid #edd6ad;border-radius:5px;padding:3px 6px;font-weight:800}
.preview-readonly #inbox .send-button[disabled]{opacity:.55;cursor:not-allowed}
@media(max-width:760px){#inbox #chat-profile-trigger .chat-name{font-size:15px}.chat-preview-label{font-size:10px}}

#inbox #chat-money-toggle{font-size:19px;color:#517d68;width:40px;min-width:40px}
@media(max-width:760px){
 .inbox-is-active:not(.chat-is-open) .main-header{display:none!important}
 .inbox-is-active:not(.chat-is-open) .main{height:calc(100dvh - 62px - env(safe-area-inset-bottom))!important}
 #inbox #chat-money-toggle{min-width:34px;width:34px;height:44px}
}

#inbox .thread-channel{display:inline-grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#1cab6e;color:#fff;font-size:12px;font-weight:800;line-height:1}
/* WCAG AA readable metadata, including over the outgoing pale-green bubbles. */
#inbox #chat-money-toggle{color:#315640}
#inbox .chat-day-divider span{color:#365b48}
#inbox .chat-messages .live-bubble small{color:#456352}
#inbox .chat-messages .live-bubble.out small{color:#405e4c}
#inbox .thread-time{color:#486354}
#inbox .thread-secondary{color:#4f6a5b}
#inbox .thread-tag{color:#4d6255}

#inbox .older-messages-row{align-self:center;margin:6px auto 12px}
#inbox .older-messages-row button{border:1px solid #d1e4d7;border-radius:20px;background:#e8f3eb;color:#1b694b;min-height:40px;padding:8px 17px;font-size:12px;font-weight:750;cursor:pointer}
#inbox .older-messages-row button:disabled{opacity:.55}

.preview-readonly #inbox .chat-actions-menu button:disabled,.preview-readonly #inbox .live-contact button:disabled{opacity:.48;cursor:not-allowed}
