/* Email Studio: usa la identidad aprobada del panel, sin introducir otra marca. */
#tab-gifts {
    --email-ink: var(--admin-text, #1e293b);
    --email-muted: var(--admin-text-muted, #64748b);
    --email-primary: var(--admin-primary, #2563eb);
    --email-navy: #1e1e46;
    --email-bone: #e8e5e2;
}

.email-health-bar {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: .85rem;
    align-items: center;
    margin-bottom: 1rem;
    padding: .9rem 1rem;
    border: 1px solid rgba(30, 30, 70, .12);
    border-radius: 14px;
    background: rgba(255, 255, 255, .7);
    box-shadow: 0 14px 40px rgba(30, 30, 70, .08);
    -webkit-backdrop-filter: blur(18px) saturate(125%);
    backdrop-filter: blur(18px) saturate(125%);
}

.email-health-bar p,
.email-health-bar strong { margin: 0; }
.email-health-bar p { color: var(--email-muted); font-size: .78rem; }
.email-health-bar > button {
    border: 0;
    background: transparent;
    color: var(--email-primary);
    cursor: pointer;
    font-size: .76rem;
    font-weight: 800;
}

.email-health-indicator {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 50%;
    background: rgba(245, 158, 11, .12);
}
.email-health-indicator span {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #f59e0b;
    box-shadow: 0 0 0 5px rgba(245, 158, 11, .12);
}
.email-health-indicator[data-state="ok"] { background: rgba(22, 163, 74, .12); }
.email-health-indicator[data-state="ok"] span { background: #16a34a; box-shadow: 0 0 0 5px rgba(22, 163, 74, .12); }
.email-health-indicator[data-state="error"] { background: rgba(220, 38, 38, .12); }
.email-health-indicator[data-state="error"] span { background: #dc2626; box-shadow: 0 0 0 5px rgba(220, 38, 38, .12); }

.email-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .85rem;
    margin-bottom: 1rem;
}
.email-metrics-grid article {
    display: grid;
    gap: .12rem;
    min-width: 0;
    padding: 1rem;
    border: 1px solid rgba(255, 255, 255, .68);
    border-radius: 16px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .78), rgba(247, 245, 243, .62));
    box-shadow: 0 14px 40px rgba(30, 30, 70, .08), inset 0 1px 0 rgba(255,255,255,.9);
    -webkit-backdrop-filter: blur(18px) saturate(125%);
    backdrop-filter: blur(18px) saturate(125%);
}
.email-metrics-grid span { color: var(--email-muted); font-size: .72rem; font-weight: 700; }
.email-metrics-grid strong { color: var(--email-navy); font-size: clamp(1.55rem, 2.6vw, 2.25rem); line-height: 1.05; }
.email-metrics-grid small { color: var(--email-muted); font-size: .68rem; }

.email-studio-tabs {
    display: inline-flex;
    gap: .25rem;
    margin: .15rem 0 1rem;
    padding: .28rem;
    border: 1px solid rgba(30, 30, 70, .1);
    border-radius: 13px;
    background: rgba(255,255,255,.56);
}
.email-studio-tabs button,
.email-template-picker button,
.email-token-bar button,
.email-device-toggle button {
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--email-muted);
    cursor: pointer;
    font-weight: 800;
}
.email-studio-tabs button { padding: .6rem .9rem; font-size: .78rem; }
.email-studio-tabs button.active,
.email-template-picker button.active,
.email-device-toggle button.active {
    background: #fff;
    color: var(--email-navy);
    box-shadow: 0 5px 16px rgba(30,30,70,.1);
}

.email-studio-view { display: none; }
.email-studio-view.active { display: block; animation: fadeIn .2s ease; }

.email-studio-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.42fr) minmax(330px, .78fr);
    gap: 1rem;
    align-items: start;
}
.email-compose-column { display: grid; gap: 1rem; min-width: 0; }
.email-studio-shell .admin-card { background: rgba(255,255,255,.72); }
.email-campaign-basics { display: grid; gap: .85rem; }
.email-campaign-basics label,
.email-plain-text-label { display: grid; gap: .35rem; color: var(--email-ink); font-size: .78rem; font-weight: 700; }
.email-campaign-basics input,
.email-campaign-basics select,
.email-plain-text-label textarea {
    border: 1px solid rgba(30, 30, 70, .14);
    background: rgba(255,255,255,.74);
}
.email-save-state {
    padding: .32rem .55rem;
    border-radius: 999px;
    background: rgba(100,116,139,.1);
    color: var(--email-muted);
    font-size: .66rem;
    font-weight: 700;
}
.email-save-state[data-state="saving"] { color: #a16207; background: rgba(245,158,11,.12); }
.email-save-state[data-state="saved"] { color: #166534; background: rgba(22,163,74,.1); }

.email-subject-meter {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .7rem;
    align-items: center;
    margin-top: -.5rem;
    color: var(--email-muted);
    font-size: .65rem;
}
.email-subject-meter i {
    display: block;
    height: 4px;
    overflow: hidden;
    border-radius: 99px;
    background: linear-gradient(90deg, #16a34a var(--meter, 0%), rgba(100,116,139,.14) 0);
}
.email-subject-meter[data-tone="warn"] i { background: linear-gradient(90deg, #d97706 var(--meter, 100%), rgba(100,116,139,.14) 0); }

.email-advanced-settings {
    padding: .65rem .75rem;
    border: 1px solid rgba(30,30,70,.1);
    border-radius: 10px;
}
.email-advanced-settings summary { cursor: pointer; color: var(--email-muted); font-size: .72rem; font-weight: 800; }
.email-advanced-settings .form-grid { margin-top: .75rem; }
.email-selected-recipients {
    display: grid;
    gap: .55rem;
    padding: .7rem;
    border: 1px solid rgba(30,30,70,.1);
    border-radius: 10px;
    background: rgba(255,255,255,.48);
}
.email-selected-recipients[hidden] { display: none; }
.email-selected-recipients strong,
.email-selected-recipients span { font-size: .68rem; }
.email-recipient-checklist {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .35rem;
    max-height: 190px;
    overflow: auto;
}
.email-recipient-checklist label {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .45rem;
    align-items: center;
    padding: .42rem;
    border-radius: 8px;
    background: rgba(255,255,255,.62);
    font-size: .64rem;
}
.email-recipient-checklist input { width: auto; }

.email-composer-card { display: grid; gap: .75rem; min-width: 0; }
.email-template-picker { display: flex; flex-wrap: wrap; gap: .35rem; }
.email-template-picker button { padding: .5rem .7rem; font-size: .7rem; background: rgba(30,30,70,.05); }
.email-token-bar {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    align-items: center;
    color: var(--email-muted);
    font-size: .68rem;
}
.email-token-bar button {
    padding: .32rem .5rem;
    border: 1px solid rgba(30,30,70,.11);
    background: rgba(255,255,255,.58);
    font-size: .65rem;
}
.email-token-bar button:hover { color: var(--email-primary); border-color: var(--email-primary); }

.email-rich-editor { min-height: 390px !important; background: rgba(255,255,255,.86) !important; }
.email-rich-editor .ql-editor { min-height: 390px; padding: 28px; font-family: Arial, Helvetica, sans-serif !important; line-height: 1.65; }
.email-rich-editor .ql-editor h1,
.email-rich-editor .ql-editor h2,
.email-rich-editor .ql-editor h3 { color: #1e1e46; font-family: Arial, Helvetica, sans-serif !important; }
.email-plain-text-label { margin-top: .35rem; }
.email-plain-text-label textarea { min-height: 110px; }
.email-attachment-toolbar { grid-template-columns: auto minmax(180px, 1fr) minmax(170px, .7fr) auto; }

.email-preview-column { position: sticky; top: 1rem; min-width: 0; }
.email-preview-card { display: grid; gap: .75rem; padding: 1rem !important; overflow: hidden; }
.email-preview-head { display: flex; justify-content: space-between; gap: .7rem; align-items: center; }
.email-preview-head p,
.email-preview-head h2 { margin: 0; }
.email-device-toggle { display: flex; gap: .2rem; padding: .2rem; border-radius: 10px; background: rgba(30,30,70,.05); }
.email-device-toggle button { width: 34px; height: 30px; }
.email-inbox-preview {
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr);
    gap: .15rem .55rem;
    padding: .7rem;
    border: 1px solid rgba(30,30,70,.1);
    border-radius: 10px;
    background: rgba(255,255,255,.82);
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: .72rem;
}
.email-inbox-preview span { grid-row: 1 / 3; font-weight: 700; }
.email-inbox-preview strong,
.email-inbox-preview p { min-width: 0; overflow: hidden; margin: 0; text-overflow: ellipsis; white-space: nowrap; }
.email-inbox-preview p { color: #64748b; }
.email-preview-frame-wrap {
    width: 100%;
    min-height: 520px;
    overflow: hidden;
    border: 1px solid rgba(30,30,70,.12);
    border-radius: 12px;
    background: #e8e5e2;
    transition: max-width .2s ease;
}
.email-preview-frame-wrap[data-device="mobile"] { max-width: 375px; margin-inline: auto; }
.email-preview-frame { display: block; width: 100%; height: 520px; border: 0; background: #fff; }

.email-quality-checks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .35rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
.email-quality-checks li {
    padding: .45rem .5rem .45rem 1.45rem;
    border-radius: 8px;
    background: rgba(100,116,139,.08);
    color: var(--email-muted);
    font-size: .62rem;
    font-weight: 700;
    position: relative;
}
.email-quality-checks li::before { content: "○"; position: absolute; left: .52rem; }
.email-quality-checks li.ok { color: #166534; background: rgba(22,163,74,.09); }
.email-quality-checks li.ok::before { content: "✓"; }

.email-composer-actions {
    position: sticky;
    z-index: 4;
    bottom: .75rem;
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    padding: .7rem;
    border: 1px solid rgba(255,255,255,.7);
    border-radius: 14px;
    background: rgba(247,245,243,.78);
    box-shadow: 0 14px 40px rgba(30,30,70,.12);
    -webkit-backdrop-filter: blur(18px) saturate(128%);
    backdrop-filter: blur(18px) saturate(128%);
}
#email-campaign-status { grid-column: 1 / -1; margin: 0; }

.resend-template-modal {
    position: fixed;
    z-index: 15000;
    inset: 0;
    display: grid;
    place-items: center;
    padding: clamp(.6rem, 2vw, 1.25rem);
    background: rgba(15,23,42,.66);
    backdrop-filter: blur(14px) saturate(120%);
}
.resend-template-modal[hidden] { display: none !important; }
.resend-template-form {
    display: grid;
    gap: .85rem;
    width: min(1280px, 100%);
    max-height: calc(100dvh - 2rem);
    padding: clamp(.85rem, 1.5vw, 1.25rem);
    overflow: auto;
    border: 1px solid rgba(255,255,255,.72);
    border-radius: 24px;
    background: #f7f8fb;
    box-shadow: 0 34px 110px rgba(15,23,42,.4);
}
.resend-template-editor-head {
    position: sticky;
    z-index: 6;
    top: -.85rem;
    display: flex;
    justify-content: space-between;
    gap: .8rem;
    align-items: center;
    margin: -.85rem -.85rem 0;
    padding: .85rem 1rem;
    border-bottom: 1px solid rgba(30,30,70,.1);
    background: rgba(255,255,255,.93);
    backdrop-filter: blur(18px);
}
.resend-template-editor-head p,
.resend-template-editor-head h3 { margin: 0; }
.resend-template-head-actions { display: flex; gap: .45rem; align-items: center; }
.resend-template-close {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid rgba(30,30,70,.12);
    border-radius: 11px;
    background: #fff;
    color: var(--email-navy);
    cursor: pointer;
    font-size: 1.25rem;
}
.resend-template-personalization {
    padding: .7rem .8rem;
    border: 1px solid rgba(30,30,70,.1);
    border-radius: 12px;
    background: #fff;
}
.resend-template-personalization summary { cursor: pointer; color: var(--email-navy); font-size: .74rem; font-weight: 800; }
.resend-template-personalization textarea { width: 100%; margin-top: .55rem; }
.resend-visual-builder {
    overflow: hidden;
    border: 1px solid rgba(30,30,70,.12);
    border-radius: 14px;
    background: #eef2f8;
}
.resend-block-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    align-items: center;
    padding: .65rem;
    border-bottom: 1px solid rgba(30,30,70,.1);
    background: #fff;
}
.resend-block-toolbar span {
    color: var(--email-muted);
    font-size: .67rem;
    font-weight: 800;
}
.resend-block-toolbar button {
    min-height: 38px;
    padding: .4rem .7rem;
    border: 1px solid rgba(30,30,70,.12);
    border-radius: 10px;
    background: linear-gradient(145deg,#fff,#f5f7fc);
    color: var(--email-navy);
    cursor: pointer;
    font-size: .64rem;
    font-weight: 800;
}
.resend-block-toolbar button:hover {
    border-color: var(--email-primary);
    color: var(--email-primary);
}
.resend-visual-layout {
    display: grid;
    grid-template-columns: minmax(420px, 1fr) minmax(340px, .9fr);
    gap: 1rem;
    padding: 1rem;
}
.resend-visual-layout > div { min-width: 0; }
.resend-template-visual-editor {
    min-height: 520px;
    overflow: auto;
    outline: none;
    border: 2px solid transparent;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 12px 35px rgba(30,30,70,.09);
}
.resend-template-visual-editor:focus { border-color: rgba(49,94,232,.48); }
.resend-visual-layout .ql-toolbar.ql-snow {
    position: sticky;
    z-index: 3;
    top: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .2rem;
    border: 1px solid rgba(30,30,70,.12);
    border-radius: 13px 13px 0 0;
    background: rgba(255,255,255,.96);
}
.resend-visual-layout .ql-container.ql-snow {
    min-height: 500px;
    border-color: rgba(30,30,70,.12);
    border-radius: 0 0 13px 13px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(30,30,70,.09);
    font-size: 16px;
}
.resend-visual-layout .ql-editor {
    min-height: 500px;
    padding: 34px;
    line-height: 1.65;
}
#resend-template-preview {
    display: block;
    width: 100%;
    height: 590px;
    border: 1px solid rgba(30,30,70,.12);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(30,30,70,.09);
}
.resend-template-code {
    padding: .7rem;
    border: 1px solid rgba(30,30,70,.1);
    border-radius: 10px;
    background: rgba(255,255,255,.55);
}
.resend-template-code summary {
    cursor: pointer;
    color: var(--email-muted);
    font-size: .72rem;
    font-weight: 800;
}
.resend-template-code textarea {
    width: 100%;
    margin: .65rem 0;
    font-family: "Space Mono", monospace;
    font-size: .7rem;
}
.resend-templates-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: .75rem;
    margin-top: 1rem;
}
.resend-template-card {
    display: grid;
    gap: .75rem;
    padding: 1rem;
    border: 1px solid rgba(30,30,70,.1);
    border-radius: 16px;
    background: linear-gradient(145deg,#fff,#f8faff);
    box-shadow: 0 12px 32px rgba(30,30,70,.07);
}
.resend-template-card h3,
.resend-template-card p { margin: 0; }
.resend-template-card p:not(.eyebrow) { color: var(--email-muted); font-size: .7rem; }
.resend-template-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; }
.resend-template-actions button,
.resend-template-actions a {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(30,30,70,.12);
    border-radius: 10px;
    background: #fff;
    color: var(--email-navy);
    cursor: pointer;
    font-size: .65rem;
    font-weight: 800;
    text-decoration: none;
}
.resend-template-actions [data-edit-resend-template] {
    grid-column: 1 / -1;
    border-color: var(--email-primary);
    background: var(--email-primary);
    color: #fff;
}

.email-contacts-layout {
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(360px, 1.08fr);
    gap: 1rem;
    align-items: start;
}
.email-csv-guide,
.email-csv-import { display: grid; gap: 1rem; }
.email-csv-guide h2,
.email-csv-guide p,
.email-csv-import h2,
.email-csv-import p { margin: 0; }
.email-csv-steps {
    display: grid;
    gap: .65rem;
    margin: 0;
    padding-left: 1.25rem;
    color: var(--email-ink);
    font-size: .78rem;
    line-height: 1.55;
}
.email-csv-steps code,
.email-csv-example code {
    font-family: "Space Mono", ui-monospace, monospace;
}
.email-csv-example {
    overflow: auto;
    padding: .9rem;
    border: 1px solid rgba(49,94,232,.18);
    border-radius: 12px;
    background: #f5f7ff;
    color: #1e1e46;
    font-size: .7rem;
    line-height: 1.8;
    white-space: nowrap;
}
.email-csv-consent-note {
    padding: .75rem .85rem;
    border-left: 3px solid #d97706;
    border-radius: 0 10px 10px 0;
    background: rgba(245,158,11,.08);
    color: #78350f;
    font-size: .7rem;
    line-height: 1.5;
}
.email-csv-dropzone {
    display: grid;
    gap: .35rem;
    place-items: center;
    padding: 1.4rem;
    border: 1.5px dashed rgba(49,94,232,.38);
    border-radius: 14px;
    background: rgba(238,242,255,.66);
    color: var(--email-primary);
    cursor: pointer;
    text-align: center;
}
.email-csv-dropzone:hover { border-color: var(--email-primary); background: #f5f7ff; }
.email-csv-dropzone span { font-size: .82rem; font-weight: 800; }
.email-csv-dropzone small { color: var(--email-muted); font-size: .68rem; }
.email-csv-dropzone input { width: 100%; margin-top: .45rem; font-size: .72rem; }
.email-csv-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .55rem;
}
.email-csv-summary[hidden],
.email-csv-preview[hidden] { display: none; }
.email-csv-summary article {
    display: grid;
    gap: .1rem;
    padding: .7rem;
    border-radius: 11px;
    background: rgba(30,30,70,.05);
}
.email-csv-summary strong { color: var(--email-navy); font-size: 1.1rem; }
.email-csv-summary span { color: var(--email-muted); font-size: .62rem; font-weight: 700; }
.email-csv-summary article[data-tone="error"] { background: rgba(220,38,38,.08); }
.email-csv-summary article[data-tone="error"] strong { color: #b91c1c; }
.email-csv-preview {
    max-height: 260px;
    overflow: auto;
    border: 1px solid rgba(30,30,70,.1);
    border-radius: 11px;
}
.email-csv-preview table { width: 100%; border-collapse: collapse; font-size: .68rem; }
.email-csv-preview th,
.email-csv-preview td {
    padding: .55rem .65rem;
    border-bottom: 1px solid rgba(30,30,70,.08);
    text-align: left;
}
.email-csv-preview th {
    position: sticky;
    top: 0;
    background: #f7f8fb;
    color: var(--email-navy);
}
.email-csv-preview td { color: var(--email-muted); }

.email-campaigns-list { display: grid; gap: .65rem; margin-top: 1rem; }
.email-campaign-row {
    display: grid;
    grid-template-columns: minmax(200px, 1.3fr) repeat(4, minmax(72px, .35fr)) auto;
    gap: .7rem;
    align-items: center;
    padding: .85rem;
    border: 1px solid rgba(30,30,70,.1);
    border-radius: 12px;
    background: rgba(255,255,255,.55);
}
.email-campaign-row h3,
.email-campaign-row p { margin: 0; }
.email-campaign-row h3 { font-size: .86rem; }
.email-campaign-row p,
.email-campaign-stat span { color: var(--email-muted); font-size: .65rem; }
.email-campaign-stat { display: grid; gap: .08rem; }
.email-campaign-stat strong { font-size: .84rem; }
.email-campaign-actions { display: flex; gap: .3rem; }
.email-campaign-actions button {
    min-height: 34px;
    border: 1px solid rgba(30,30,70,.12);
    border-radius: 8px;
    background: rgba(255,255,255,.7);
    color: var(--email-navy);
    cursor: pointer;
    font-size: .65rem;
    font-weight: 800;
}
.email-status-badge {
    display: inline-flex;
    width: fit-content;
    margin-top: .25rem;
    padding: .22rem .42rem;
    border-radius: 999px;
    background: rgba(37,99,235,.09);
    color: #1d4ed8;
    font-size: .6rem;
    font-weight: 800;
}
.email-status-badge[data-status="sent"] { color: #166534; background: rgba(22,163,74,.09); }
.email-status-badge[data-status="partial"],
.email-status-badge[data-status="failed"] { color: #991b1b; background: rgba(220,38,38,.09); }
.email-status-badge[data-status="scheduled"] { color: #92400e; background: rgba(245,158,11,.11); }

.email-gifts-divider { margin: 2rem 0 1rem; padding-top: 1.5rem; border-top: 1px solid rgba(30,30,70,.12); }
.email-gifts-divider p,
.email-gifts-divider h2 { margin: 0; }

@media (max-width: 1180px) {
    .email-studio-shell { grid-template-columns: minmax(0, 1fr); }
    .email-preview-column { position: static; }
    .email-preview-card { grid-template-columns: minmax(0, .7fr) minmax(340px, 1fr); align-items: start; }
    .email-preview-head,
    .email-inbox-preview,
    .email-quality-checks { grid-column: 1; }
    .email-preview-frame-wrap { grid-column: 2; grid-row: 1 / 5; }
    .resend-visual-layout { grid-template-columns: 1fr; }
    #resend-template-preview { height: 480px; }
    .email-contacts-layout { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
    .email-metrics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .email-preview-card { display: grid; grid-template-columns: 1fr; }
    .email-preview-frame-wrap { grid-column: 1; grid-row: auto; }
    .email-campaign-row { grid-template-columns: 1fr 1fr 1fr; }
    .email-campaign-row > div:first-child,
    .email-campaign-actions { grid-column: 1 / -1; }
    .email-attachment-toolbar { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
    .email-health-bar { grid-template-columns: auto 1fr; }
    .email-health-bar > button { grid-column: 2; justify-self: start; padding: 0; }
    .email-studio-tabs { display: grid; grid-template-columns: repeat(2, 1fr); width: 100%; }
    .email-metrics-grid { gap: .55rem; }
    .email-metrics-grid article { padding: .75rem; }
    .email-composer-actions { display: grid; grid-template-columns: 1fr 1fr; bottom: calc(.5rem + env(safe-area-inset-bottom)); }
    .email-composer-actions .btn { width: 100%; padding-inline: .5rem; font-size: .68rem; }
    .email-quality-checks { grid-template-columns: 1fr; }
    .email-campaign-row { grid-template-columns: 1fr 1fr; }
    .email-campaign-row > div:first-child,
    .email-campaign-actions { grid-column: 1 / -1; }
}