/* ══════════════════════════════════════════
   EMAIL SEQUENCES — Tunnel Club
   ══════════════════════════════════════════ */
.es-overlay { position:fixed;inset:0;background:rgba(0,0,0,0.7);backdrop-filter:blur(8px);z-index:9999;display:flex;align-items:center;justify-content:center;animation:esFadeIn .2s ease; }
@keyframes esFadeIn { from{opacity:0} to{opacity:1} }
.es-panel { background:#0f0f1a;border:1px solid rgba(255,255,255,.08);border-radius:20px;width:90vw;max-width:800px;max-height:85vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,.5); }
.es-header { display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid rgba(255,255,255,.06); }
.es-header-left { display:flex;flex-direction:column;gap:2px; }
.es-title { font-size:18px;font-weight:700;color:#f0f0f5;margin:0; }
.es-subtitle { font-size:12px;color:#888; }
.es-header-right { display:flex;align-items:center;gap:10px; }
.es-close { background:none;border:none;color:#888;font-size:24px;cursor:pointer;padding:4px 8px;border-radius:8px; }
.es-close:hover { background:rgba(255,255,255,.06);color:#fff; }
.es-body { flex:1;overflow-y:auto;padding:20px 24px; }
.es-loading { text-align:center;padding:40px;color:#888; }

/* Buttons */
.es-btn { padding:8px 16px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:#ccc;font-size:13px;font-weight:600;cursor:pointer;transition: transform .2s ease-out, background .2s ease-out, border-color .2s ease-out, color .2s ease-out, opacity .2s ease-out; }
.es-btn:hover { background:rgba(255,255,255,.08);color:#fff; }
.es-btn-primary { background:linear-gradient(135deg,#6366f1,#8b5cf6);border:none;color:#fff; }
.es-btn-primary:hover { filter:brightness(1.1);transform:translateY(-1px); }
.es-btn-sm { padding:5px 12px;font-size:12px; }

/* Stats bar */
.es-stats-bar { display:flex;gap:16px;margin-bottom:20px;padding:12px 16px;background:rgba(255,255,255,.03);border-radius:12px;border:1px solid rgba(255,255,255,.06); }
.es-stat { display:flex;flex-direction:column;align-items:center;flex:1; }
.es-stat-val { font-size:20px;font-weight:800;color:#a5b4fc; }
.es-stat-lbl { font-size:11px;color:#666;text-transform:uppercase;letter-spacing:.5px; }

/* Sequence cards */
.es-list { display:flex;flex-direction:column;gap:8px; }
.es-card { display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:12px;cursor:pointer;transition: transform .2s ease-out, background .2s ease-out, border-color .2s ease-out, color .2s ease-out, opacity .2s ease-out; }
.es-card:hover { border-color:rgba(99,102,241,.4);background:rgba(99,102,241,.05); }
.es-card-left { display:flex;align-items:center;gap:12px; }
.es-card-icon { width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700; }
.es-card-icon.es-active { background:rgba(34,197,94,.15);color:#22c55e; }
.es-card-icon.es-inactive { background:rgba(239,68,68,.1);color:#ef4444; }
.es-card-name { font-size:14px;font-weight:700;color:#f0f0f5; }
.es-card-meta { font-size:12px;color:#888;margin-top:2px; }
.es-card-actions { display:flex;gap:6px; }
.es-card-btn { background:none;border:none;cursor:pointer;padding:6px;border-radius:8px;font-size:14px;transition: transform .15s ease-out, background .15s ease-out, border-color .15s ease-out, color .15s ease-out, opacity .15s ease-out; }
.es-card-btn:hover { background:rgba(255,255,255,.08); }
.es-card-btn-danger:hover { background:rgba(239,68,68,.15); }

/* Empty state */
.es-empty { text-align:center;padding:60px 20px;color:#888; }
.es-empty h3 { color:#f0f0f5;margin-bottom:8px; }

/* Form */
.es-form { max-width:500px;margin:0 auto; }
.es-form-title { color:#f0f0f5;margin-bottom:20px; }
.es-field { margin-bottom:16px; }
.es-field label { display:block;font-size:12px;font-weight:600;color:#888;text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px; }
.es-input { width:100%;padding:10px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:#f0f0f5;font-size:14px;outline:none;transition:border .2s;box-sizing:border-box; }
.es-input:focus { border-color:rgba(99,102,241,.5); }
.es-form-actions { display:flex;gap:10px;justify-content:flex-end;margin-top:24px; }

/* Steps editor */
.es-steps-header { display:flex;align-items:center;gap:12px;margin-bottom:20px; }
.es-steps-header h3 { flex:1;color:#f0f0f5;margin:0; }
.es-steps-list { display:flex;flex-direction:column;gap:12px; }
.es-empty-steps { text-align:center;padding:32px;color:#666;font-style:italic; }
.es-step { background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:14px;overflow:hidden; }
.es-step-header { display:flex;align-items:center;gap:10px;padding:12px 16px;background:rgba(255,255,255,.02);border-bottom:1px solid rgba(255,255,255,.04); }
.es-step-num { width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800; }
.es-step-delay { font-size:12px;color:#a5b4fc;font-weight:600;flex:1; }
.es-step-del { background:none;border:none;color:#666;font-size:18px;cursor:pointer;padding:4px 8px;border-radius:6px; }
.es-step-del:hover { background:rgba(239,68,68,.15);color:#ef4444; }
.es-step-body { padding:16px; }
.es-step-body textarea { font-family:inherit;resize:vertical; }

/* ══════════════════════════════════════════
   EMAIL STUDIO V2 — Layout, Grid, Cards
   ══════════════════════════════════════════ */

/* Container */
.es { width:100%;min-height:80vh; }
.es-container { max-width:1100px;margin:0 auto;padding:24px 20px; }

/* Header */
.es-container .es-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:28px;padding:0;border:none; }
.es-container .es-header h1 { font-size:28px;font-weight:800;margin:0;color:var(--text, #f0f0f5); }
.es-header-sub { font-size:13px;color:var(--text-secondary, #888);margin-top:2px; }
.es-btn-secondary { background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:var(--text-secondary, #ccc); }
.es-btn-secondary:hover { background:rgba(255,255,255,.1);color:var(--text, #fff); }

/* Projects Grid */
.es-projects-grid { display:grid;grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));gap:16px; }

/* New Project Card */
.es-new-project { display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:180px;border:2px dashed rgba(255,255,255,.12);border-radius:16px;cursor:pointer;background:transparent;transition:border-color .2s, background .2s; }
.es-new-project:hover { border-color:var(--accent, #6366f1);background:rgba(99,102,241,.05); }
.es-new-project-icon { font-size:36px;color:var(--text-secondary, #888);margin-bottom:8px;line-height:1; }
.es-new-project { font-size:14px;color:var(--text-secondary, #888);font-weight:500; }

/* Project Card */
.es-project-card { display:flex;flex-direction:column;min-height:180px;padding:18px 20px !important;border-radius:16px !important;background:var(--bg-card, rgba(255,255,255,.04)) !important;border:1px solid rgba(255,255,255,.08) !important;cursor:pointer;transition:transform .2s, border-color .2s, box-shadow .2s; }
.es-project-card:hover { transform:translateY(-2px);border-color:var(--accent, #6366f1) !important;box-shadow:0 8px 32px rgba(0,0,0,.2); }

/* Card Header */
.es-card-header { display:flex;align-items:flex-start;gap:10px;margin-bottom:auto; }
.es-card-title { font-size:16px;font-weight:700;color:var(--text, #f0f0f5);line-height:1.3;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical; }
.es-card-desc { font-size:12px;color:var(--text-secondary, #888);line-height:1.4;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical; }

/* Badge */
.es-badge { display:inline-block;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;flex-shrink:0; }
.es-badge-brouillon { background:rgba(255,255,255,.08);color:var(--text-secondary, #888); }
.es-badge-analyse { background:rgba(99,102,241,.15);color:#818cf8; }
.es-badge-planned { background:rgba(251,191,36,.15);color:#fbbf24; }
.es-badge-generated { background:rgba(34,197,94,.15);color:#22c55e; }
.es-badge-active { background:rgba(34,197,94,.2);color:#4ade80; }
.es-badge-paused { background:rgba(239,68,68,.15);color:#f87171; }

/* Card Stats */
.es-card-stats { display:flex;gap:16px;margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.06); }
.es-card-stats .es-stat { flex:1;text-align:center; }
.es-card-stats .es-stat-val { font-size:18px;font-weight:800;color:var(--accent, #a5b4fc); }
.es-card-stats .es-stat-label,.es-stat-lbl { font-size:10px;color:var(--text-secondary, #888);text-transform:uppercase;letter-spacing:.5px; }

/* Hero — Landing */
.es-hero { padding:40px 0 32px; }
.es-hero-content { max-width:600px; }
.es-hero-content h2 { font-size:32px;font-weight:800;line-height:1.2;color:var(--text, #f0f0f5);margin:0 0 12px; }
.es-hero-content em { font-style:italic;color:var(--accent, #818cf8); }
.es-hero-desc { font-size:15px;color:var(--text-secondary, #aaa);line-height:1.6;margin-bottom:24px; }
.es-hero-features { display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px; }
.es-hero-feature { display:flex;align-items:center;gap:8px;padding:8px 14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:10px;font-size:13px;color:var(--text-secondary, #ccc); }
.es-hero-feature-icon { font-size:16px; }

/* Loading overlay */
#es-loading-overlay { position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);z-index:10000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px; }
.es-loading { display:flex;flex-direction:column;align-items:center;gap:12px; }
.es-loading-spinner { width:40px;height:40px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--accent, #818cf8);border-radius:50%;animation:esSpin 1s linear infinite; }
@keyframes esSpin { to { transform:rotate(360deg); } }
.es-loading-text { font-size:16px;font-weight:600;color:var(--text, #f0f0f5); }
.es-loading-sub { font-size:13px;color:var(--text-secondary, #888); }

/* Modal overlay */
.es-modal-overlay { position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);z-index:10000;display:flex;align-items:center;justify-content:center; }
.es-modal { background:var(--bg-card, #1a1a2e);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:28px;max-width:460px;width:90%;box-shadow:0 24px 80px rgba(0,0,0,.5); }
.es-modal h3 { margin:0 0 16px;font-size:18px;color:var(--text, #f0f0f5); }

/* Responsive */
@media (max-width: 640px) {
  .es-projects-grid { grid-template-columns: 1fr; }
  .es-hero-content h2 { font-size:24px; }
}