/* Pulido visual del correo corporativo. Se mantiene dentro del módulo de correo. */
.email-page {
    --email-ink: #26364b;
    --email-muted: #738095;
    --email-line: #e4e9ef;
    --email-accent: #426f60;
    --email-accent-soft: #edf5f1;
    height: calc(100vh - 100px);
    min-height: 650px;
    padding-bottom: 18px;
    color: var(--email-ink);
}

.email-head {
    align-items: center;
    margin-bottom: 14px;
}

.email-head h2 {
    letter-spacing: -.025em;
}

.email-head > div:last-child > .btn {
    min-height: 38px;
    padding: 8px 13px;
    border-radius: 8px;
    font-weight: 650;
}

.email-layout {
    grid-template-columns: minmax(185px, 215px) minmax(300px, 370px) minmax(0, 1fr);
    height: calc(100% - 82px);
    min-height: 560px;
    border-color: #dfe6e2;
    border-radius: 14px;
    box-shadow: 0 12px 34px rgba(36, 55, 47, .08);
}

.email-sidebar {
    padding: 14px 12px;
    background: #f7f9f8;
}

.email-sidebar select,
.email-toolbar label:first-child,
.email-classify .form-control {
    border-color: #dce4df;
    border-radius: 8px;
}

#email-folders {
    gap: 5px;
}

#email-folders button {
    min-height: 42px;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 13px;
    transition: color .15s ease, background .15s ease;
}

#email-folders button:hover,
#email-folders button.active {
    color: #315c4e;
    background: #e7f0eb;
}

.email-inbox {
    min-height: 0;
    background: #fff;
}

.email-toolbar {
    min-height: 60px;
    gap: 8px 12px;
    padding: 11px 12px;
    background: #fcfdfc;
}

.email-toolbar label:first-child {
    min-height: 38px;
    padding: 6px 10px;
}

.email-toolbar label:first-child:focus-within {
    border-color: #87a99a;
    box-shadow: 0 0 0 3px rgba(66, 111, 96, .11);
}

.email-toolbar label:first-child input {
    width: 100%;
    min-width: 0;
    color: var(--email-ink);
}

.email-toolbar label:not(:first-child) {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
}

.email-list {
    min-height: 0;
    flex: 1;
    scrollbar-color: #cbd6d0 transparent;
    scrollbar-width: thin;
}

.email-item {
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    min-height: 88px;
    padding: 13px 12px;
    border-bottom-color: #edf0ee;
    transition: background .14s ease, box-shadow .14s ease;
}

.email-item:hover {
    background: #f7faf8;
}

.email-item.unread {
    background: #f4f8ff;
}

.email-item.selected {
    background: #edf5f1;
    box-shadow: inset 3px 0 #426f60;
}

.email-avatar {
    width: 36px;
    height: 36px;
    color: #fff;
    background: #668b7b;
    font-size: 13px;
}

.email-item-content {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.email-item-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
}

.email-item-heading strong {
    min-width: 0;
    color: #38485c;
    font-size: 12px;
    font-weight: 700;
}

.email-item-heading time {
    flex: 0 0 auto;
    color: #8993a0;
    font-size: 10px;
    white-space: nowrap;
}

.email-item b {
    margin-top: 0;
    color: #34435a;
    font-size: 12px;
    font-weight: 650;
}

.email-item-foot {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.email-item-foot small {
    min-width: 0;
    flex: 1;
    margin: 0;
    color: #818c9a;
    font-size: 10px;
}

.email-item-foot em {
    position: static;
    flex: 0 0 auto;
    padding: 3px 7px;
    border-radius: 999px;
    color: #85571e;
    background: #fff4dd;
    font-size: 9px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.3;
    white-space: nowrap;
}

.email-item-foot > i {
    flex: 0 0 auto;
    color: #839183;
    font-size: 14px;
}

.email-detail {
    scrollbar-color: #cbd6d0 transparent;
    scrollbar-width: thin;
}

.email-detail-head {
    padding: 20px 24px 16px;
    background: linear-gradient(180deg, #fff 0%, #fbfcfb 100%);
}

.email-detail-head > span {
    color: var(--email-accent);
    letter-spacing: .055em;
}

.email-detail-head h3 {
    margin: 7px 0 8px;
    color: #25364b;
    font-size: clamp(18px, 1.45vw, 22px);
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.email-detail-actions {
    gap: 7px;
    padding: 11px 24px;
    border-bottom: 1px solid #edf0ee;
}

.email-detail-actions .btn {
    min-height: 33px;
    border-color: #dce4df;
    border-radius: 7px;
    color: #46566a;
    font-size: 11px;
    font-weight: 650;
    background: #fff;
}

.email-detail-actions .btn:hover {
    color: #315c4e;
    border-color: #bdd0c5;
    background: #f4f8f5;
}

.email-detail-actions .btn-outline-primary {
    color: #315f50;
    border-color: #9ab7a8;
}

.email-body {
    padding: 22px 24px;
    color: #3a4859;
    font-size: 14px;
    line-height: 1.72;
    overflow-wrap: anywhere;
}

.email-ai {
    margin: 12px 24px 8px;
    padding: 14px 16px;
    border-color: #c9ddd2;
    border-radius: 10px;
    color: #315b4d;
    background: #f1f7f3;
}

.email-ai-heading,.email-ai-reply>div { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.email-ai-heading>div>span,.email-assistant-kicker { display:block;color:#168052;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase; }
.email-ai-heading>div>strong,.email-ai-reply strong { display:block;color:#29463a;font-size:14px; }
.email-ai-priority { border-radius:20px;padding:5px 10px;background:#e6eee9;color:#405c4c;font-size:11px;font-weight:700; }
.email-ai-priority.priority-high { background:#fff0e8;color:#a33c1e; }
.email-ai-priority.priority-medium { background:#fff7df;color:#82620d; }
.email-ai-overview,.email-ai-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0; }
.email-ai-overview>div,.email-ai-item { min-width:0;padding:10px 12px;border:1px solid #dfe9e3;border-radius:8px;background:#fff; }
.email-ai-overview small,.email-ai-overview strong { display:block; }
.email-ai-overview small,.email-ai-item strong { color:#718174;font-size:11px; }
.email-ai-overview strong { margin-top:4px;color:#33483b;font-size:12px;font-weight:600;overflow-wrap:anywhere; }
.email-ai-item ul { margin:6px 0 0;padding-left:18px;color:#526255;font-size:12px;line-height:1.5; }
.email-ai-item li+li { margin-top:4px; }
.email-ai-alert { padding:9px 11px;border-radius:7px;background:#fff4e8;color:#87551b;font-size:12px; }
.email-ai-reply { margin-top:10px;padding:12px 14px;border:1px solid #dbe6ef;border-radius:8px;background:#fff; }
.email-ai-reply small { display:block;margin-top:3px;color:#748194;font-size:11px; }
.email-ai-reply p { margin:9px 0;white-space:pre-wrap;color:#425364;font-size:12px;line-height:1.55; }
.email-ai>small { display:block;margin-top:9px;color:#718174; }
.email-assistant { margin:12px 24px;padding:14px;border:1px solid #d6e4db;border-radius:12px;background:linear-gradient(145deg,#f7fbf8,#fff); }
.email-assistant-heading { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.email-assistant-heading strong,.email-assistant-heading small { display:block; }
.email-assistant-heading strong { margin:2px 0;color:#263e32;font-size:15px; }
.email-assistant-heading small { color:#728176;font-size:11px; }
.email-assistant-heading>i { color:#168052;font-size:24px; }
.email-assistant-prompts { display:flex;flex-wrap:wrap;gap:6px;margin:11px 0; }
.email-assistant-prompts .btn { border:1px solid #d9e3dc;border-radius:18px;background:#fff;color:#365746;font-size:11px; }
.email-assistant-thread { display:grid;gap:8px;max-height:270px;overflow:auto;padding:2px 2px 8px; }
.email-assistant-turn { max-width:90%;padding:9px 12px;border:1px solid #e4e9e5;border-radius:10px;background:#fff; }
.email-assistant-turn.from-user { justify-self:end;border-color:#c6e0ce;background:#eaf6ee; }
.email-assistant-turn strong { display:block;margin-bottom:3px;color:#54715f;font-size:10px; }
.email-assistant-turn p { margin:0;color:#394b40;font-size:12px;line-height:1.55;overflow-wrap:anywhere; }
.email-assistant-empty { display:flex;align-items:center;gap:9px;padding:10px 12px;border-radius:9px;background:#fff;color:#738176;font-size:12px; }
.email-assistant-empty i { color:#188455;font-size:18px; }
.email-assistant-form { display:flex;align-items:flex-end;gap:8px; }
.email-assistant-form textarea { flex:1;min-width:0;resize:vertical;border:1px solid #d5dfd8;border-radius:9px;padding:9px 11px;font-size:12px; }
.email-assistant-form button { flex:none; }
.email-assistant-status { display:block;margin-top:7px;color:#718176;font-size:10px; }

.email-attachments,
.email-classify {
    border: 1px solid var(--email-line);
    border-radius: 11px;
    background: #fbfcfb;
}

.email-attachments {
    margin: 8px 24px 16px;
    padding: 15px 16px;
}

.email-classify {
    gap: 10px;
    margin: 14px 24px 24px;
    padding: 16px;
}

.email-classify .form-control {
    min-width: 0;
}

.email-classify > button {
    min-height: 37px;
    border-radius: 7px;
}

.email-empty {
    min-height: 260px;
    gap: 8px;
    padding: 24px;
}

.email-empty i {
    color: #9caf9f;
}

.email-accounts-list article {
    padding: 12px 13px;
    border-color: #e2e8e3;
    border-radius: 10px;
    background: #fff;
}

.email-callout {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 16px;
    padding: 12px 14px;
    border: 1px solid #dce8e0;
    border-radius: 9px;
    color: #52675c;
    background: #f4f8f5;
    font-size: 13px;
    line-height: 1.6;
}

.email-callout > i {
    flex: 0 0 auto;
    margin-top: 2px;
    color: #557d6a;
    font-size: 18px;
}

.email-compose-toolbar {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 6px;
    padding: 5px;
    border: 1px solid #dfe5e0;
    border-radius: 8px 8px 0 0;
    background: #f7f9f7;
}

.email-compose-toolbar button {
    min-width: 32px;
    height: 30px;
    padding: 3px 8px;
    border: 0;
    border-radius: 5px;
    color: #42554a;
    background: transparent;
}

.email-compose-toolbar button:hover,
.email-compose-toolbar button:focus-visible {
    outline: 0;
    background: #e7eee9;
}

.email-compose-toolbar > span {
    width: 1px;
    height: 20px;
    margin: 0 4px;
    background: #d7dfd9;
}

.email-compose-editor {
    min-height: 190px;
    max-height: 45vh;
    overflow: auto;
    border-radius: 0 0 8px 8px;
    white-space: pre-wrap;
}

.email-compose-editor:empty::before {
    content: attr(data-placeholder);
    color: #98a29b;
    pointer-events: none;
}

.email-action-modal-content {
    overflow: hidden;
    border: 1px solid #dfe7e1;
    border-radius: 14px;
    box-shadow: 0 18px 54px rgba(28, 45, 36, .2);
}

.email-action-modal-content .modal-header {
    align-items: center;
    padding: 18px 22px;
    border-bottom-color: #e8eee9;
    background: #f7faf8;
}

.email-action-modal-content .modal-header h4 {
    margin: 2px 0 0;
    color: #2b4035;
    font-size: 20px;
    font-weight: 700;
}

.email-modal-kicker {
    color: #658173;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.email-action-context {
    margin: 0 0 16px;
    padding: 10px 12px;
    border-radius: 8px;
    color: #596b60;
    background: #f2f7f3;
    font-size: 13px;
}

.email-action-modal-content label {
    margin-bottom: 6px;
    color: #46594d;
    font-size: 12px;
    font-weight: 700;
}

.email-action-modal-content .form-control {
    border-color: #d9e2dc;
    border-radius: 8px;
}

.email-action-modal-content .form-control:focus {
    border-color: #84a493;
    box-shadow: 0 0 0 3px rgba(66, 111, 96, .12);
}

.email-action-modal-content .form-group small {
    display: block;
    margin-top: 5px;
    color: #7c887f;
    font-size: 11px;
}

.email-action-message {
    min-height: 150px;
    resize: vertical;
}

.email-action-modal-content .modal-footer {
    border-top-color: #e8eee9;
    background: #fbfcfb;
}

.email-standard-settings > .email-callout {
    margin-top: 4px;
}

.email-toast-container {
    position: fixed;
    z-index: 1085;
    top: 82px;
    right: 22px;
    display: grid;
    width: min(390px, calc(100vw - 32px));
    gap: 9px;
    pointer-events: none;
}

.email-toast {
    display: flex !important;
    align-items: center;
    gap: 11px;
    width: 100%;
    max-width: none;
    padding: 13px 14px;
    border: 1px solid #dce8e0;
    border-radius: 10px;
    color: #34483d;
    background: #fff;
    box-shadow: 0 10px 28px rgba(30, 48, 39, .16);
    opacity: 0;
    pointer-events: auto;
    transform: translateY(-7px);
    transition: opacity .18s ease, transform .18s ease;
}

.email-toast.show {
    opacity: 1;
    transform: translateY(0);
}

.email-toast > i {
    flex: 0 0 auto;
    color: #43805e;
    font-size: 20px;
}

.email-toast-warning > i {
    color: #b77b21;
}

.email-toast-error {
    border-color: #efd4d1;
}

.email-toast-error > i {
    color: #b34f4b;
}

.email-toast-copy {
    min-width: 0;
    flex: 1;
    font-size: 13px;
    line-height: 1.45;
}

.email-toast-close {
    flex: 0 0 auto;
    padding: 0 2px;
    border: 0;
    color: #7e8983;
    background: transparent;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

@media (max-width: 1200px) {
    .email-layout {
        grid-template-columns: 175px minmax(280px, 330px) minmax(0, 1fr);
    }
}

@media (max-width: 850px) {
    .email-page {
        min-height: 0;
    }

    .email-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .email-inbox {
        max-height: 500px;
    }

    .email-item {
        min-height: 82px;
    }

    .email-detail-head,
    .email-detail-actions,
    .email-body {
        padding-right: 17px;
        padding-left: 17px;
    }

    .email-ai,
    .email-attachments,
    .email-classify {
        margin-right: 17px;
        margin-left: 17px;
    }

    .email-toast-container {
        top: 72px;
        right: 12px;
    }
}

@media (max-width: 600px) {
    .email-page {
        padding-right: 10px;
        padding-left: 10px;
    }

    .email-head > div:last-child {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .email-head > div:last-child > .btn:first-child {
        grid-column: 1 / -1;
    }

    .email-item {
        padding-right: 9px;
        padding-left: 9px;
    }

    .email-item-heading time {
        font-size: 9px;
    }

    .email-classify {
        grid-template-columns: minmax(0, 1fr);
        margin-right: 12px;
        margin-left: 12px;
    }

    .email-classify h5,
    .email-classify > small {
        grid-column: 1;
    }

    .email-ai-overview,.email-ai-grid { grid-template-columns:1fr; }
    .email-assistant { margin-right:12px;margin-left:12px; }
    .email-assistant-form { align-items:stretch;flex-direction:column; }
}
