:root{--navy:#12384b;--blue:#1c6682;--teal:#2d7b78;--ink:#17242c;--muted:#687b85;--bg:#f3f7f8;--card:#fff;--line:#dce6ea;--soft:#edf5f6;--danger:#9d2f2f;--ok:#1f6b50;--shadow:0 12px 30px rgba(20,55,70,.08)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,Segoe UI,Arial,sans-serif}.hidden{display:none!important}button,input,select,textarea{font:inherit}button{cursor:pointer}.topbar{background:linear-gradient(110deg,var(--navy),#18516a);color:#fff;padding:22px 32px;display:flex;align-items:center;justify-content:space-between;gap:24px}.topbar h1{font-size:38px;line-height:1;margin:4px 0 6px}.topbar p{margin:0;color:#d9e8ee}.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:800;color:#91d6d1}.top-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}.version{background:#fff;color:var(--navy);border-radius:999px;padding:8px 12px;font-weight:800}.identity{font-size:13px;color:#dfeef3}.page{max-width:1300px;margin:0 auto;padding:24px}.section-head,.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.section-head{margin-bottom:18px}.section-head h2,.card h3{margin:0}.section-head p,.card-head p{margin:6px 0 0;color:var(--muted)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:16px 0}.stat{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:var(--shadow)}.stat strong{display:block;font-size:30px}.stat span{color:var(--muted);font-size:13px}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow);margin-bottom:18px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}.primary,.soft,.ghost{border:0;border-radius:10px;padding:11px 16px;font-weight:800}.primary{background:var(--blue);color:#fff}.soft{background:var(--soft);color:var(--navy)}.ghost{background:transparent;color:inherit;border:1px solid rgba(255,255,255,.28)}.page .ghost,.dialog .ghost{border-color:var(--line);color:var(--ink)}.text-link{color:var(--blue);font-weight:800;text-decoration:none}.inline-form{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:16px}.inline-form input[type=file]{border:1px dashed #b8c9d0;border-radius:10px;padding:9px}.table-wrap{overflow:auto;margin-top:14px}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);white-space:nowrap}th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}.badge{display:inline-block;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:800;background:var(--soft);color:var(--navy)}.badge.active{background:#e4f6ee;color:var(--ok)}.badge.suspended,.badge.closed,.badge.past_due{background:#fdeaea;color:var(--danger)}.campaign-list,.contacts-list{display:flex;flex-direction:column;gap:10px;margin-top:14px}.campaign-item,.contact-item{border:1px solid var(--line);border-radius:14px;padding:14px}.campaign-item{display:grid;grid-template-columns:1fr auto;gap:12px}.campaign-item h4,.contact-item strong{margin:0}.campaign-item p,.contact-item small{margin:5px 0;color:var(--muted)}.client-banner,.info-banner,.flash{border-radius:13px;padding:13px 16px;margin-bottom:16px}.client-banner{background:#e9f3f6;border:1px solid #c4dce5}.info-banner{background:#eef5ff;border:1px solid #c8ddf4;color:#204f73}.flash{background:#e8f6ef;border:1px solid #b9dfcb;color:#1c644a}.flash.error{background:#fdeeee;border-color:#f2c3c3;color:#8e2e2e}.login-shell{min-height:100vh;display:grid;place-items:center;padding:22px;background:radial-gradient(circle at top,#e7f3f5,#f5f8f9 55%)}.login-card{width:min(430px,100%);background:#fff;border:1px solid var(--line);border-radius:22px;padding:34px;box-shadow:var(--shadow)}.login-card h1{margin:10px 0 4px;font-size:36px}.login-card p{margin:0 0 24px;color:var(--muted)}.brand-mark{width:52px;height:52px;border-radius:15px;background:linear-gradient(135deg,var(--navy),var(--teal));color:#fff;display:grid;place-items:center;font-weight:900}.stack{display:flex;flex-direction:column;gap:14px}label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700;color:#324852}input,select,textarea{width:100%;border:1px solid #cbd9de;border-radius:9px;padding:10px 11px;background:#fff;color:var(--ink)}textarea{resize:vertical}.error-text{color:var(--danger);font-size:13px}.dialog{border:0;border-radius:18px;padding:0;box-shadow:0 22px 70px rgba(10,35,45,.24);width:min(780px,94vw);max-height:92vh}.dialog::backdrop{background:rgba(8,28,38,.48)}.dialog.wide{width:min(900px,94vw)}.dialog.xwide{width:min(1220px,96vw)}.dialog-head{display:flex;justify-content:space-between;gap:18px;padding:18px 22px;border-bottom:1px solid var(--line)}.dialog-head h3{margin:0}.dialog-head p{margin:4px 0 0;color:var(--muted)}.close-btn{border:0;background:transparent;font-size:28px;color:var(--muted)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:20px 22px}.form-grid.compact{padding:0}.full{grid-column:1/-1}.actions{display:flex;justify-content:flex-end;gap:10px}.result-box{margin:0 22px 22px;padding:14px;border-radius:12px;background:#fff8dc;border:1px solid #eadca2;white-space:pre-wrap}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:0}.editor-grid>form{padding:20px 22px;max-height:78vh;overflow:auto;border-right:1px solid var(--line)}.preview-side{padding:20px 22px;display:flex;flex-direction:column;gap:12px}.preview-controls,.test-send,.image-line{display:flex;gap:8px;align-items:center}.preview-controls select{max-width:170px}.preview-subject{font-weight:800;min-height:20px}.preview-side iframe{width:100%;height:520px;border:1px solid var(--line);border-radius:12px;background:#fff}.test-send input{flex:1}.contact-item{display:flex;justify-content:space-between;gap:12px}.contact-meta{text-align:right;color:var(--muted);font-size:12px}.muted{color:var(--muted)}
@media(max-width:900px){.stats-grid{grid-template-columns:1fr 1fr}.two-col,.editor-grid{grid-template-columns:1fr}.editor-grid>form{border-right:0;border-bottom:1px solid var(--line)}.topbar{padding:18px}.topbar h1{font-size:30px}.page{padding:14px}.form-grid{grid-template-columns:1fr}.full{grid-column:auto}}
@media(max-width:560px){.stats-grid{grid-template-columns:1fr 1fr;gap:9px}.stat{padding:14px}.stat strong{font-size:24px}.section-head,.card-head{flex-direction:column}.top-actions{justify-content:flex-start}.topbar{align-items:flex-start;flex-direction:column}.preview-controls,.test-send,.image-line{flex-direction:column;align-items:stretch}.preview-controls select{max-width:none}}


/* ===== TERRIMAIL V0.6.3 - STYLE AFFICHE / MOCKUP ===== */
:root {
  --theme-primary: #0b6075;
  --theme-secondary: #2aa99a;
  --theme-button: #087c99;
  --theme-banner: #0b6f86;
  --theme-background: #f4fafc;
  --theme-primary-text: #ffffff;
  --theme-secondary-text: #ffffff;
  --theme-button-text: #ffffff;
  --theme-banner-text: #ffffff;

  --tm-ink: #0b2f56;
  --tm-muted: #60768c;
  --tm-border: #d9e8ef;
  --tm-card: rgba(255,255,255,.96);
  --tm-soft: #eef8fb;
  --tm-shadow: 0 12px 34px rgba(16,74,98,.09);
  --tm-radius: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--tm-ink);
  background:
    radial-gradient(circle at 85% 4%, rgba(91,208,199,.16), transparent 26rem),
    linear-gradient(180deg, #f8fcfd 0%, #f2f9fb 100%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.hidden { display: none !important; }

/* =========================================================
   APP SHELL
========================================================= */
#appView:not(.hidden) {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  grid-template-rows: auto 1fr;
}

.app-sidebar {
  grid-column: 1;
  grid-row: 1 / span 2;
  min-height: 100vh;
  position: sticky;
  top: 0;
  align-self: start;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-right: 1px solid rgba(9,92,115,.11);
  background: rgba(255,255,255,.96);
  box-shadow: 8px 0 36px rgba(13,67,91,.05);
  z-index: 20;
}

.sidebar-brand {
  position: relative;
  min-height: 170px;
  padding: 30px 28px 24px;
  color: white;
  overflow: hidden;
  background:
    radial-gradient(circle at 110% 80%, rgba(75,223,208,.45), transparent 38%),
    linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 88%, #062f49), var(--theme-primary));
}
.sidebar-brand::after {
  content: "";
  position: absolute;
  left: -18%; right: -18%; bottom: -52px;
  height: 85px;
  border-radius: 50%;
  background: rgba(255,255,255,.10);
}
.sidebar-brand-name {
  position: relative;
  z-index: 1;
  font-size: 33px;
  line-height: 1;
  font-weight: 850;
  letter-spacing: -.04em;
}
.sidebar-brand-line { width: 44px; height: 3px; border-radius: 99px; background: #9df1e6; margin: 10px 0 13px; }
.sidebar-tagline { position: relative; z-index: 1; max-width: 160px; line-height: 1.4; font-size: 14px; opacity: .92; }

.sidebar-nav { padding: 22px 14px; display: grid; gap: 7px; }
.sidebar-link {
  display: none;
  align-items: center;
  gap: 13px;
  min-height: 48px;
  padding: 0 15px;
  border-radius: 13px;
  text-decoration: none;
  color: #214f73;
  font-weight: 700;
  transition: .16s ease;
}
body.theme-client .sidebar-link.nav-client { display: flex; }
body:not(.theme-client) .sidebar-link.nav-admin { display: flex; }
.sidebar-link:hover,
.sidebar-link.active {
  background: color-mix(in srgb, var(--theme-primary) 10%, white);
  color: var(--theme-primary);
  transform: translateX(2px);
}
.nav-icon {
  width: 28px;
  text-align: center;
  color: var(--theme-primary);
  font-size: 19px;
  font-weight: 900;
  letter-spacing: -4px;
}
.sidebar-art {
  position: relative;
  min-height: 205px;
  margin-top: auto;
  overflow: hidden;
  background: linear-gradient(180deg, transparent, rgba(200,240,242,.48));
}
.hill { position: absolute; border-radius: 50% 50% 0 0; bottom: -80px; }
.hill-a { width: 320px; height: 170px; left: -120px; background: #c6eef1; transform: rotate(7deg); }
.hill-b { width: 280px; height: 135px; right: -105px; background: #9fdde4; transform: rotate(-7deg); }
.tree { position: absolute; bottom: 46px; width: 16px; height: 58px; border-radius: 50% 50% 44% 44%; background: #3ea9a8; }
.tree::after { content:""; position:absolute; width:3px; height:26px; left:6px; bottom:-18px; background:#257a82; border-radius:3px; }
.tree-a { left: 44px; transform: scale(1.25); }
.tree-b { left: 106px; bottom: 25px; }
.tree-c { right: 38px; bottom: 38px; transform: scale(.85); }
.sidebar-footer { padding: 0 24px 24px; color: #53728a; }
.sidebar-footer small, .sidebar-footer strong { display: block; }
.sidebar-footer small { font-size: 11px; }
.sidebar-footer strong { margin-top: 2px; color: var(--theme-primary); font-size: 13px; }

.topbar {
  grid-column: 2;
  grid-row: 1;
  position: sticky;
  top: 0;
  z-index: 15;
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 11px 28px;
  background: rgba(255,255,255,.88) !important;
  color: var(--tm-ink) !important;
  border-bottom: 1px solid rgba(13,88,114,.10) !important;
  backdrop-filter: blur(16px);
}
.topbar-context { display: flex; align-items: center; gap: 10px; min-width: 0; }
.workspace-home {
  display: grid; place-items: center; width: 38px; height: 38px;
  border: 1px solid var(--tm-border); border-radius: 11px; color: var(--theme-primary); background: white;
}
.topbar-context strong { display: block; color: var(--tm-ink); font-size: 14px; }
.topbar-context p { margin: 2px 0 0; color: var(--tm-muted) !important; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 440px; }
.top-actions { display: flex; align-items: center; justify-content: flex-end; gap: 9px; flex-wrap: wrap; }
.version, .identity {
  border: 1px solid var(--tm-border);
  background: rgba(255,255,255,.9);
  color: #345c78 !important;
  border-radius: 999px;
  padding: 8px 11px;
  font-size: 12px;
  font-weight: 750;
}

.page {
  grid-column: 2;
  grid-row: 2;
  width: 100%;
  max-width: 1540px;
  margin: 0 auto;
  padding: 22px 28px 50px;
}

/* =========================================================
   CLIENT DASHBOARD
========================================================= */
#clientView:not(.hidden) { display: flex; flex-direction: column; gap: 17px; }
#clientBanner { order: 0; }
.dashboard-hero { order: 1; }
#smtpBanner { order: 2; }
#clientStats { order: 3; }
#importPanel { order: 4; }
.dashboard-main-grid { order: 5; }
#clientUsersCard { order: 6; }
#mailIdentityCard { order: 7; }
#appearanceCard { order: 8; }

.client-banner {
  min-height: 46px;
  display: flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  max-width: 100%;
  padding: 7px 13px !important;
  border-radius: 14px !important;
  background: white !important;
  color: var(--tm-ink) !important;
  border: 1px solid var(--tm-border) !important;
  box-shadow: 0 6px 20px rgba(17,79,100,.05);
}
.client-banner strong { color: var(--theme-primary); }
.client-banner .badge { vertical-align: middle; }
.client-banner-logo { width: 34px; height: 34px; border-radius: 9px; object-fit: contain; background: #fff; padding: 3px; }

.dashboard-hero {
  position: relative;
  min-height: 150px;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 22px;
  padding: 24px 34px;
  color: var(--theme-banner-text);
  border-radius: 20px;
  background:
    radial-gradient(circle at 78% 125%, rgba(80,226,211,.35), transparent 35%),
    linear-gradient(110deg, color-mix(in srgb, var(--theme-banner) 88%, #073a57), color-mix(in srgb, var(--theme-secondary) 50%, var(--theme-banner)));
  box-shadow: 0 16px 34px rgba(7,72,100,.13);
}
.dashboard-hero::before,
.dashboard-hero::after { content:""; position:absolute; border-radius:50%; background:rgba(255,255,255,.07); }
.dashboard-hero::before { width:260px; height:260px; left:-80px; bottom:-190px; }
.dashboard-hero::after { width:350px; height:180px; right:120px; bottom:-135px; }
.dashboard-hero-copy { position: relative; z-index: 2; }
.hero-kicker { font-size: 10px; font-weight: 850; letter-spacing: .18em; opacity: .72; }
.dashboard-hero h2 { margin: 5px 0 6px; color: inherit !important; font-size: clamp(30px,4vw,48px); letter-spacing: -.04em; }
.dashboard-hero p { margin: 0; color: inherit; opacity: .94; font-size: clamp(15px,1.4vw,20px); }
.hero-flight { position: relative; z-index: 2; min-width: 210px; height: 92px; }
.hero-dots { position: absolute; left: 0; bottom: 18px; color: rgba(255,255,255,.7); letter-spacing: 7px; transform: rotate(-12deg); }
.hero-plane { position: absolute; right: 15px; top: 0; color: white; font-size: 70px; transform: rotate(-15deg); text-shadow: 0 10px 25px rgba(0,0,0,.12); }

.stats-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 14px !important;
}
.stat {
  min-height: 118px;
  display: flex !important;
  align-items: center;
  gap: 15px;
  padding: 20px !important;
  border-radius: 18px !important;
  background: var(--tm-card) !important;
  border: 1px solid var(--tm-border) !important;
  box-shadow: var(--tm-shadow);
}
.stat-icon {
  flex: 0 0 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  font-weight: 900;
  font-size: 23px;
  letter-spacing: -5px;
}
.stat-copy { min-width: 0; }
.stat-copy span { display: block; color: var(--tm-muted); font-size: 13px; font-weight: 650; }
.stat-copy strong { display: block; margin-top: 3px; color: var(--tm-ink) !important; font-size: 31px; line-height: 1; letter-spacing: -.03em; }
.stat-contacts .stat-icon { color:#1287d7; background:#e4f5ff; }
.stat-campaigns .stat-icon { color:#0c9a72; background:#e6f8f0; }
.stat-sent .stat-icon { color:#7357e7; background:#f0ebff; letter-spacing:0; }
.stat-errors .stat-icon { color:#f09316; background:#fff2dc; letter-spacing:0; }

.card {
  background: var(--tm-card) !important;
  border: 1px solid var(--tm-border) !important;
  border-radius: var(--tm-radius) !important;
  box-shadow: var(--tm-shadow);
  padding: 20px !important;
}
.card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; }
.card h3, .section-head h2 { margin:0; color:var(--tm-ink) !important; letter-spacing:-.02em; }
.card h3 { font-size: 20px; }
.card p, .section-head p { color: var(--tm-muted); }
.card-head p { margin: 4px 0 0; font-size: 13px; line-height:1.45; }
.dashboard-import {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--theme-secondary) 10%, white), transparent 18rem),
    var(--tm-card) !important;
}
.dashboard-import::after {
  content: "CSV";
  position:absolute;
  right:26px;
  bottom:22px;
  display:grid;
  place-items:center;
  width:64px;
  height:64px;
  border-radius:18px;
  color:white;
  background:linear-gradient(145deg,#40b889,#158b73);
  transform:rotate(-6deg);
  font-weight:900;
  box-shadow:0 12px 26px rgba(24,130,103,.18);
  opacity:.92;
}
#importForm { padding-right: 92px; }

.dashboard-main-grid, .two-col { display:grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap:17px !important; }
.campaign-list, .contacts-list { display:grid; gap:10px; }
.campaign-item, .contact-item {
  border: 1px solid #e4eef2 !important;
  border-radius: 14px !important;
  background: #fbfeff !important;
  padding: 13px !important;
}
.campaign-item { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.campaign-item h4 { margin:7px 0 3px; color:var(--tm-ink); }
.campaign-item p { margin:0 0 5px; color:var(--tm-muted); font-size:13px; }
.contact-item { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.contact-item strong, .contact-item small { display:block; }
.contact-item small { margin-top:2px; color:var(--tm-muted); }
.contact-meta { text-align:right; color:#5f7586; font-size:12px; }

/* =========================================================
   SUPER ADMIN
========================================================= */
#superAdminView:not(.hidden) { display:grid; gap:17px; }
.section-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding: 26px 30px;
  color:white;
  border-radius:20px;
  background: linear-gradient(115deg,#0b5674,#109a9a);
  box-shadow: var(--tm-shadow);
}
.section-head h2, .section-head p { color:white !important; }
.section-head p { margin:5px 0 0; opacity:.9; }

/* =========================================================
   FORMS / BUTTONS / TABLES
========================================================= */
.primary, .soft, .ghost, .close-btn {
  min-height: 40px;
  border-radius: 11px !important;
  padding: 9px 14px;
  font-weight: 760;
  cursor: pointer;
  transition: .15s ease;
}
.primary { border:1px solid var(--theme-button) !important; background:var(--theme-button) !important; color:var(--theme-button-text) !important; box-shadow:0 7px 18px color-mix(in srgb,var(--theme-button) 18%,transparent); }
.soft { border:1px solid color-mix(in srgb,var(--theme-primary) 22%,white) !important; background:color-mix(in srgb,var(--theme-primary) 8%,white) !important; color:var(--theme-primary) !important; }
.ghost { border:1px solid var(--tm-border) !important; background:white !important; color:#47677e !important; }
.primary:hover, .soft:hover, .ghost:hover { transform:translateY(-1px); filter:brightness(.99); }

input, select, textarea {
  width:100%;
  border:1px solid #d5e4eb !important;
  border-radius:11px !important;
  background:white !important;
  color:var(--tm-ink);
  padding:10px 12px !important;
  outline:none;
}
input:focus, select:focus, textarea:focus { border-color:var(--theme-primary) !important; box-shadow:0 0 0 3px color-mix(in srgb,var(--theme-primary) 15%,transparent) !important; }
label { color:#3f5f76; font-weight:650; font-size:13px; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
.form-grid.compact { grid-template-columns:repeat(2,minmax(0,1fr)); }
.full { grid-column:1 / -1; }
.inline-form { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.stack { display:grid; gap:13px; }
.actions { display:flex; justify-content:flex-end; gap:9px; align-items:center; }
.muted { color:var(--tm-muted) !important; }
.text-link { color:var(--theme-primary); font-weight:750; text-decoration:none; }

.table-wrap { overflow:auto; border:1px solid #e4eef2; border-radius:14px; }
table { width:100%; border-collapse:separate; border-spacing:0; background:white; }
th { padding:12px 13px; text-align:left; background:#f0f8fb; color:#577087; font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
td { padding:12px 13px; border-top:1px solid #edf3f5; color:#355b76; font-size:13px; }
.badge { display:inline-flex; align-items:center; gap:5px; border-radius:999px; padding:5px 9px; background:#e8f7f1; color:#16835f; font-size:11px; font-weight:800; }

.info-banner, .flash {
  border-radius:13px !important;
  border:1px solid #d5e8ef !important;
  padding:12px 14px !important;
  background:#eef9fc !important;
  color:#2b617d !important;
}
.flash.error, .error-text { color:#b53b3b !important; }

/* =========================================================
   APPEARANCE EDITOR
========================================================= */
.appearance-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr); gap:24px; align-items:start; }
.theme-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.color-field { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:58px; padding:10px 12px; border:1px solid #dbe5e8; border-radius:12px; background:#fff; }
.color-field span { font-weight:650; }
.color-field input[type="color"] { width:52px; height:38px; padding:2px !important; border-radius:9px; cursor:pointer; }
.theme-actions { grid-column:1 / -1; justify-content:flex-start !important; flex-wrap:wrap; }
.theme-logo-box { margin-top:18px; padding-top:16px; border-top:1px solid #e5ecef; }
.theme-logo-preview-wrap { margin:10px 0 12px; }
.theme-logo-preview { display:block; max-width:220px; max-height:100px; object-fit:contain; background:#fff; border:1px solid #dbe5e8; border-radius:12px; padding:8px; }
.theme-preview { overflow:hidden; border-radius:18px; border:1px solid #dbe5e8; background:var(--theme-background); box-shadow:var(--tm-shadow); min-height:300px; }
.theme-preview-top { padding:22px; background:var(--theme-primary); color:var(--theme-primary-text); border-bottom:5px solid var(--theme-secondary); }
.theme-preview-top span { display:block; font-size:11px; letter-spacing:.12em; opacity:.9; }
.theme-preview-top strong { display:block; margin-top:3px; font-size:25px; }
.theme-preview-body { padding:18px; }
.theme-preview-banner { padding:12px 14px; border-radius:12px; background:var(--theme-banner); color:var(--theme-banner-text); font-weight:700; }
.theme-preview-cards { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:14px 0; }
.theme-preview-cards > div { padding:14px; border-radius:12px; background:#fff; border:1px solid #e1e8eb; }
.theme-preview-cards strong, .theme-preview-cards span { display:block; }
.theme-preview-cards strong { color:var(--theme-primary); font-size:22px; }
.theme-preview-cards span { margin-top:2px; color:#64727b; font-size:12px; }
.theme-preview-button { border:0; border-radius:10px; padding:10px 14px; background:var(--theme-button); color:var(--theme-button-text); font-weight:700; }

/* =========================================================
   DIALOGS / LOGIN
========================================================= */
dialog.dialog {
  width:min(780px,calc(100vw - 28px));
  max-height:calc(100vh - 28px);
  border:1px solid var(--tm-border) !important;
  border-radius:20px !important;
  padding:20px !important;
  box-shadow:0 30px 80px rgba(10,50,70,.28);
}
dialog.xwide { width:min(1320px,calc(100vw - 28px)); }
dialog::backdrop { background:rgba(8,36,54,.38); backdrop-filter:blur(3px); }
.dialog-head { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; margin-bottom:16px; }
.dialog-head h3 { margin:0; color:var(--tm-ink); }
.dialog-head p { margin:4px 0 0; color:var(--tm-muted); }
.close-btn { width:40px; padding:0; border:1px solid var(--tm-border); background:#f5fafb; color:#4d697d; font-size:22px; }
.editor-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(350px,.9fr); gap:20px; }
.preview-side { position:sticky; top:0; align-self:start; }

.login-shell { min-height:100vh; display:grid; place-items:center; padding:24px; background:linear-gradient(135deg,#073f60,#0c8d91); }
.login-card { width:min(430px,100%); border-radius:24px !important; padding:34px !important; background:rgba(255,255,255,.97) !important; box-shadow:0 30px 70px rgba(1,33,49,.26); }
.login-card h1 { margin:12px 0 4px; color:var(--tm-ink); font-size:38px; }
.login-card p { color:var(--tm-muted); }
.brand-mark { display:grid; place-items:center; width:58px; height:58px; border-radius:17px; color:white; background:linear-gradient(145deg,#0c6075,#19a59c); font-weight:900; }

/* =========================================================
   CLIENT CUSTOM THEME COMPATIBILITY
========================================================= */
body.theme-client { background:var(--theme-background) !important; }
body.theme-client .app-sidebar { border-right-color:color-mix(in srgb,var(--theme-primary) 13%,white); }
body.theme-client .sidebar-brand { background:radial-gradient(circle at 110% 80%,color-mix(in srgb,var(--theme-secondary) 48%,transparent),transparent 38%),linear-gradient(145deg,color-mix(in srgb,var(--theme-primary) 82%,#062f49),var(--theme-primary)); }
body.theme-client .primary { background:var(--theme-button) !important; border-color:var(--theme-button) !important; color:var(--theme-button-text) !important; }
body.theme-client .soft { color:var(--theme-primary) !important; }
body.theme-client .text-link, body.theme-client a:not(.primary) { color:inherit; }
body.theme-client .sidebar-link:hover, body.theme-client .sidebar-link.active { color:var(--theme-primary); }
body.theme-client .client-banner { background:white !important; color:var(--tm-ink) !important; border-color:color-mix(in srgb,var(--theme-primary) 18%,white) !important; }
body.theme-client input:focus, body.theme-client select:focus, body.theme-client textarea:focus { border-color:var(--theme-primary) !important; }

/* =========================================================
   RESPONSIVE
========================================================= */
@media (max-width: 1080px) {
  #appView:not(.hidden) { grid-template-columns: 205px minmax(0,1fr); }
  .stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-main-grid, .two-col { grid-template-columns:1fr; }
  .topbar-context p { max-width:260px; }
}

@media (max-width: 820px) {
  #appView:not(.hidden) { display:block; }
  .app-sidebar { position:relative; min-height:auto; width:100%; border-right:0; border-bottom:1px solid var(--tm-border); }
  .sidebar-brand { min-height:auto; padding:18px 20px; }
  .sidebar-brand-name { font-size:27px; }
  .sidebar-tagline, .sidebar-art, .sidebar-footer { display:none; }
  .sidebar-nav { display:flex; overflow:auto; gap:7px; padding:10px 12px; }
  .sidebar-link { flex:0 0 auto; min-height:40px; padding:0 12px; }
  .topbar { position:relative; padding:10px 14px; min-height:64px; }
  .topbar-context p, .version, .identity { display:none; }
  .top-actions { gap:6px; }
  .top-actions button { min-height:36px; padding:7px 9px; font-size:12px; }
  .page { padding:15px 12px 34px; }
  .dashboard-hero { min-height:130px; padding:22px; }
  .hero-flight { display:none; }
  .stats-grid { grid-template-columns:1fr 1fr; }
  .stat { min-height:100px; padding:15px !important; }
  .stat-icon { flex-basis:45px; height:45px; }
  .stat-copy strong { font-size:26px; }
  .appearance-grid, .theme-form, .editor-grid, .form-grid, .form-grid.compact { grid-template-columns:1fr; }
  .theme-actions { grid-column:1; }
  .campaign-item, .contact-item { align-items:flex-start; flex-direction:column; }
  .contact-meta { text-align:left; }
  #importForm { padding-right:0; }
  .dashboard-import::after { display:none; }
}

@media (max-width: 520px) {
  .stats-grid { grid-template-columns:1fr; }
  .dashboard-hero h2 { font-size:32px; }
  .card { padding:16px !important; }
  .card-head { flex-direction:column; }
  .inline-form { align-items:stretch; }
  .inline-form > * { width:100%; }
}

/* =========================================================
   V0.6.3 — FINITIONS VISUELLES TYPE MAQUETTE
   Tout est ici afin d'éviter un theme.css oublié/non chargé.
========================================================= */
body.theme-client {
  --tm-page-width: 1520px;
  background: #f6fbfd !important;
}
body.theme-client #appView:not(.hidden) {
  grid-template-columns: 250px minmax(0,1fr) !important;
}
body.theme-client .app-sidebar {
  background: #fbfdfe !important;
}
body.theme-client .sidebar-brand {
  min-height: 176px;
  background:
    radial-gradient(circle at 104% 74%, rgba(75,223,208,.38), transparent 36%),
    linear-gradient(150deg, #075f77 0%, #0b7890 58%, #119b9a 100%) !important;
}
body.theme-client .sidebar-brand-name { font-size: 36px; }
body.theme-client .sidebar-tagline { font-size: 14px; max-width: 150px; }
body.theme-client .sidebar-link {
  min-height: 50px;
  margin: 0 2px;
  border-radius: 13px;
}
body.theme-client .sidebar-link.active {
  background: #e7f6fa !important;
  box-shadow: inset 3px 0 0 var(--theme-primary);
}
body.theme-client .topbar {
  min-height: 70px !important;
  padding: 10px 26px !important;
  box-shadow: 0 5px 18px rgba(20,72,92,.04);
}
body.theme-client .page {
  max-width: var(--tm-page-width) !important;
  padding: 14px 22px 42px !important;
}
body.theme-client #clientView:not(.hidden) { gap: 14px; }
body.theme-client .client-banner {
  order: -1;
  margin: 0 !important;
  min-height: 42px;
  box-shadow: none;
}
body.theme-client .dashboard-hero {
  min-height: 132px;
  margin-top: 0;
  padding: 22px 30px;
  border-radius: 18px;
  background:
    radial-gradient(circle at 72% 116%, rgba(50,220,205,.30), transparent 34%),
    radial-gradient(circle at 8% 130%, rgba(152,239,222,.28), transparent 26%),
    linear-gradient(105deg, #08657e 0%, #0c7f92 56%, #1ba99c 100%) !important;
}
body.theme-client .dashboard-hero h2 { font-size: 42px; margin-top: 0; }
body.theme-client .dashboard-hero p { font-size: 17px; }
body.theme-client .hero-kicker { display: none; }
body.theme-client .hero-flight { min-width: 260px; }
body.theme-client .hero-plane { font-size: 72px; right: 18px; top: -6px; }
body.theme-client .stats-grid { margin: 0 !important; }
body.theme-client .stat {
  min-height: 110px;
  padding: 18px 20px !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 24px rgba(20,70,90,.055) !important;
}
body.theme-client .stat-icon {
  width: 50px;
  height: 50px;
  flex-basis: 50px;
  border-radius: 14px;
}
body.theme-client .stat-copy strong { font-size: 31px; }
body.theme-client .card {
  border-radius: 17px !important;
  box-shadow: 0 8px 26px rgba(20,70,90,.055) !important;
}
body.theme-client #importPanel {
  order: 4 !important;
  border: 1px solid #d6e9ef !important;
}
body.theme-client .dashboard-main-grid { order: 5 !important; }
body.theme-client #clientUsersCard { order: 6 !important; }
body.theme-client #mailIdentityCard { order: 7 !important; }
body.theme-client #appearanceCard { order: 8 !important; }
body.theme-client .dashboard-import .inline-form {
  min-height: 86px;
  padding: 14px;
  border: 1px dashed #b7dbe4;
  border-radius: 14px;
  background: #fbfeff;
}
body.theme-client .dashboard-import input[type=file] {
  flex: 1 1 480px;
  background: white;
}
body.theme-client .primary {
  background: linear-gradient(135deg, var(--theme-button), color-mix(in srgb, var(--theme-button) 80%, #0aa7b0)) !important;
  border-radius: 11px !important;
  box-shadow: 0 7px 16px color-mix(in srgb, var(--theme-button) 18%, transparent);
}
body.theme-client .soft {
  border-radius: 11px !important;
}
body.theme-client .campaign-item,
body.theme-client .contact-item {
  background: #fff;
  border-color: #e0edf1;
}

@media (max-width: 1100px) {
  body.theme-client #appView:not(.hidden) { grid-template-columns: 210px minmax(0,1fr) !important; }
  body.theme-client .dashboard-hero { min-height: 120px; }
  body.theme-client .hero-flight { min-width: 160px; }
}


/* =========================================================
   TERRIMAIL V0.6.4 — STYLE MAQUETTE ROBUSTE
   Desktop conservé même avec zoom/échelle Windows.
========================================================= */
:root{
  --tm-sidebar:238px;
  --tm-navy:#083c5a;
  --tm-blue:#096d86;
  --tm-teal:#11a69a;
  --tm-page:#f5fbfd;
  --tm-card:#ffffff;
  --tm-border:#d9e9ef;
  --tm-text:#0b3153;
  --tm-muted:#647f94;
}
html,body{min-height:100%;}
body{background:var(--tm-page)!important;color:var(--tm-text);}
#appView.app-shell:not(.hidden){
  min-height:100vh!important;
  display:grid!important;
  grid-template-columns:var(--tm-sidebar) minmax(0,1fr)!important;
  grid-template-rows:68px minmax(0,1fr)!important;
  align-items:start!important;
}
.app-sidebar{
  display:flex!important;
  grid-column:1!important;
  grid-row:1 / span 2!important;
  width:var(--tm-sidebar)!important;
  min-height:100vh!important;
  position:sticky!important;
  top:0!important;
  align-self:start!important;
  background:#fbfdfe!important;
  border-right:1px solid #d8e9ef!important;
  box-shadow:8px 0 28px rgba(13,67,91,.045)!important;
}
.topbar{
  grid-column:2!important;
  grid-row:1!important;
  min-width:0!important;
  min-height:68px!important;
  padding:9px 22px!important;
}
.page{
  grid-column:2!important;
  grid-row:2!important;
  min-width:0!important;
  max-width:none!important;
  padding:14px 22px 42px!important;
}
.sidebar-brand{min-height:174px!important;padding:28px 24px!important;}
.sidebar-brand-name{font-size:34px!important;}
.sidebar-nav{padding:18px 12px!important;gap:5px!important;}
.sidebar-link{display:none!important;min-height:48px!important;padding:0 14px!important;}
body.theme-client .sidebar-link.nav-client{display:flex!important;}
body:not(.theme-client) .sidebar-link.nav-admin{display:flex!important;}
.sidebar-link.active{background:#e6f5f9!important;box-shadow:none!important;}
.nav-icon{letter-spacing:0!important;font-size:18px!important;}
.sidebar-art{min-height:230px!important;}
.sidebar-footer{padding:0 20px 22px!important;}

body.theme-client #clientView:not(.hidden){display:flex!important;flex-direction:column!important;gap:14px!important;}
body.theme-client #clientBanner{display:none!important;}
.dashboard-hero{
  order:1!important;
  min-height:126px!important;
  padding:20px 28px!important;
  border-radius:16px!important;
  box-shadow:none!important;
  background:
    radial-gradient(circle at 88% 112%,rgba(85,230,220,.31),transparent 32%),
    radial-gradient(circle at 5% 100%,rgba(147,238,224,.22),transparent 26%),
    linear-gradient(108deg,#075f7d 0%,#097f92 58%,#16a99c 100%)!important;
}
.dashboard-hero h2{font-size:42px!important;letter-spacing:-.04em!important;margin:0 0 5px!important;}
.dashboard-hero p{font-size:17px!important;}
.hero-message{position:relative;z-index:2;display:flex;align-items:center;gap:18px;color:#fff;}
.hero-message>span{max-width:180px;font-size:15px;line-height:1.25;font-style:italic;opacity:.95;transform:rotate(-4deg);}
.hero-flight{min-width:180px!important;height:82px!important;}
.hero-plane{font-size:66px!important;top:0!important;right:5px!important;}
.hero-dots{bottom:8px!important;}

.stats-grid{order:3!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;}
.stat{min-height:104px!important;padding:16px 18px!important;border-radius:15px!important;box-shadow:0 7px 22px rgba(20,70,90,.055)!important;}
.stat-icon{width:48px!important;height:48px!important;flex:0 0 48px!important;border-radius:13px!important;font-size:20px!important;letter-spacing:0!important;}
.stat-copy strong{font-size:30px!important;}

.dashboard-mid-grid{order:4;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:14px;align-items:stretch;}
.dashboard-mid-grid>.card{margin:0!important;min-height:292px;}
.dashboard-campaigns .campaign-list{display:grid;gap:9px;}
.dashboard-campaigns .campaign-item{min-height:96px;background:#fff!important;border:0!important;border-top:1px solid #e6eff2!important;border-radius:0!important;padding:12px 0!important;}
.dashboard-campaigns .campaign-item:first-child{border-top:0!important;padding-top:4px!important;}
.dashboard-campaigns .campaign-item img,
.dashboard-campaigns .campaign-item>div>div:first-child{width:108px!important;height:76px!important;border-radius:13px!important;}
.dashboard-campaigns .campaign-item h4{font-size:16px!important;margin:4px 0!important;}
.dashboard-campaigns .edit-campaign{font-size:12px!important;white-space:nowrap;}

.dashboard-import{overflow:hidden!important;}
.dashboard-import::after{right:28px!important;bottom:24px!important;width:68px!important;height:68px!important;}
.import-dropzone{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:150px;margin-right:86px;padding:16px;border:1.5px dashed #b8dce6;border-radius:14px;background:#fbfeff;text-align:center;}
.import-drop-icon{font-size:30px;line-height:1;color:var(--theme-primary);font-weight:900;}
.import-dropzone>span{font-size:12px;color:var(--tm-muted);}
.import-file-button{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:180px;min-height:38px;padding:8px 14px;border-radius:10px;background:#0c6f8b;color:#fff;font-weight:800;cursor:pointer;}
.import-file-button input{position:absolute;inset:0;opacity:0;cursor:pointer;}
.import-dropzone .primary{min-width:180px;}
.import-hint{position:relative;z-index:2;margin:10px 86px 0 0!important;font-size:12px!important;color:var(--tm-muted)!important;}

.dashboard-contacts{order:5!important;margin:0!important;padding:18px!important;}
.contacts-table{overflow:auto;border:1px solid #e4eef2;border-radius:12px;background:#fff;}
.contact-table-head,.contact-table-row{display:grid;grid-template-columns:1.2fr 1.2fr 2fr 1.2fr .8fr;gap:12px;align-items:center;min-width:820px;padding:10px 14px;}
.contact-table-head{background:#eef7fa;color:#52718a;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.025em;}
.contact-table-row{border-top:1px solid #edf2f4;font-size:13px;color:#34566f;}
.contact-table-row:hover{background:#fbfeff;}
.contact-org{font-weight:800;color:#173e5f;}
.contact-email{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.priority-pill{display:inline-block;padding:4px 8px;border-radius:999px;background:#e6f7ef;color:#17715a;font-size:11px;}
.contact-table-foot{padding:10px 14px;text-align:right;color:#6d8798;font-size:12px;border-top:1px solid #edf2f4;}
.empty-state{padding:22px;}

.dashboard-settings-grid{order:6;display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.dashboard-settings-grid>.card{margin:0!important;}
#appearanceCard{order:7!important;}

.card{border-radius:16px!important;border-color:#dceaf0!important;box-shadow:0 7px 22px rgba(20,70,90,.045)!important;}
.card-head{margin-bottom:12px!important;}
.card h3{font-size:19px!important;}
.primary,.soft,.ghost{font-size:13px!important;}
.top-actions .soft,.top-actions .ghost{min-height:38px!important;padding:8px 12px!important;}
.top-actions .identity{max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* On garde le vrai layout desktop sur PC même si le zoom Windows réduit le viewport CSS. */
@media (max-width: 980px) and (pointer:fine){
  :root{--tm-sidebar:210px;}
  #appView.app-shell:not(.hidden){display:grid!important;grid-template-columns:var(--tm-sidebar) minmax(760px,1fr)!important;}
  .app-sidebar{display:flex!important;width:var(--tm-sidebar)!important;position:sticky!important;}
  .topbar{grid-column:2!important;}
  .page{grid-column:2!important;}
  .dashboard-hero{min-width:760px;}
  .dashboard-mid-grid{grid-template-columns:1fr 1fr;}
}

/* Mobile tactile : véritable version responsive. */
@media (max-width: 760px) and (pointer:coarse){
  #appView.app-shell:not(.hidden){display:block!important;min-width:0!important;}
  .app-sidebar{position:relative!important;width:100%!important;min-height:auto!important;}
  .sidebar-brand,.sidebar-art,.sidebar-footer{display:none!important;}
  .sidebar-nav{display:flex!important;overflow:auto!important;padding:10px!important;}
  .sidebar-link{min-width:max-content!important;display:none!important;}
  body.theme-client .sidebar-link.nav-client{display:flex!important;}
  .topbar{position:sticky!important;top:0!important;}
  .page{padding:12px!important;}
  .dashboard-mid-grid,.dashboard-settings-grid{grid-template-columns:1fr!important;}
  .stats-grid{grid-template-columns:1fr 1fr!important;}
  .hero-message{display:none!important;}
}


/* =========================================================
   TERRIMAIL V0.6.5 - IMPORT CSV/XLS/XLSX FIABLE
========================================================= */
.import-dropzone{margin-right:86px!important;}
.import-native-input{
  display:block!important;
  width:min(100%,560px)!important;
  min-height:46px!important;
  padding:5px!important;
  border:1px solid #c6dce5!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#143b55!important;
  font:inherit!important;
  cursor:pointer!important;
}
.import-native-input::file-selector-button{
  min-height:34px;
  margin-right:12px;
  padding:7px 14px;
  border:0;
  border-radius:8px;
  background:#0c6f8b;
  color:#fff;
  font-weight:800;
  cursor:pointer;
}
.import-file-name{
  min-height:20px;
  color:#607d8b;
  font-size:12px;
}
#importSubmitBtn:disabled{opacity:.65;cursor:wait;}
@media (max-width:900px){
  .import-dropzone,.import-hint{margin-right:0!important;}
}


/* =========================================================
   TERRIMAIL V0.6.7 - IMPORT MODERNE ET PLUS LISIBLE
========================================================= */
.dashboard-import{
  overflow:hidden!important;
  background:
    radial-gradient(circle at 108% -10%,rgba(45,194,173,.11),transparent 280px),
    linear-gradient(180deg,#ffffff 0%,#fbfeff 100%)!important;
}
.dashboard-import::after{display:none!important;}
.import-card-head{align-items:center!important;margin-bottom:16px!important;}
.import-kicker{
  display:block;
  margin-bottom:4px;
  color:#118b86;
  font-size:10px;
  font-weight:900;
  letter-spacing:.13em;
}
.import-example-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:8px 12px;
  border:1px solid #cfe2e9;
  border-radius:10px;
  background:#f6fbfd;
  color:#0a6682;
  font-size:12px;
  font-weight:800;
  text-decoration:none;
  white-space:nowrap;
}
.import-example-link:hover{background:#edf8fb;}
.import-layout{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(185px,.65fr);
  gap:14px;
  align-items:stretch;
}
.import-dropzone{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:220px;
  margin:0!important;
  padding:22px!important;
  border:2px dashed #badce6!important;
  border-radius:16px!important;
  background:
    radial-gradient(circle at 50% 0%,rgba(16,153,151,.06),transparent 180px),
    #fbfeff!important;
  text-align:center;
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease;
}
.import-dropzone:hover,
.import-dropzone.is-dragging{
  border-color:#159a95!important;
  background:#f4fcfc!important;
  box-shadow:0 0 0 4px rgba(21,154,149,.07);
}
.import-dropzone.is-dragging{transform:translateY(-1px);}
.import-dropzone.has-file{border-style:solid!important;border-color:#b9dfd6!important;background:#f8fdfb!important;}
.import-native-input{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
  opacity:0!important;
  pointer-events:none!important;
}
.import-upload-icon{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border-radius:16px;
  background:linear-gradient(145deg,#e1f7f5,#e7f4ff);
  color:#087995;
  font-size:29px;
  font-weight:900;
  box-shadow:inset 0 0 0 1px rgba(9,112,139,.05);
}
.import-dropzone>strong{font-size:16px;color:#113b59;}
.import-dropzone>span{font-size:12px;color:#6f8797;}
.import-file-button{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:180px;
  min-height:40px;
  margin-top:4px;
  padding:9px 17px;
  border-radius:11px;
  background:linear-gradient(135deg,#096784,#0d8793);
  color:#fff;
  font-size:13px;
  font-weight:850;
  cursor:pointer;
  box-shadow:0 7px 18px rgba(6,99,126,.16);
  transition:transform .15s ease,box-shadow .15s ease;
}
.import-file-button:hover{transform:translateY(-1px);box-shadow:0 9px 22px rgba(6,99,126,.2);}
.import-selected-file{
  display:flex;
  align-items:center;
  gap:10px;
  width:min(100%,440px);
  margin-top:5px;
  padding:9px 11px;
  border:1px solid #cbe6de;
  border-radius:11px;
  background:#effaf6;
  text-align:left;
}
.import-selected-file.hidden{display:none!important;}
.import-selected-file-icon{
  display:grid;
  place-items:center;
  flex:0 0 30px;
  height:30px;
  border-radius:9px;
  background:#1ca67c;
  color:#fff;
  font-weight:900;
}
.import-selected-file>div{min-width:0;}
.import-selected-file strong{
  display:block;
  max-width:360px;
  overflow:hidden;
  color:#124b45;
  font-size:12px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.import-selected-file small{display:block;margin-top:1px;color:#6d8b84;font-size:10px;}
.import-submit{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-width:210px!important;
  margin-top:3px;
}
.import-submit b{font-size:17px;line-height:1;}
.import-guide{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:220px;
  padding:17px;
  border:1px solid #dfedf1;
  border-radius:16px;
  background:linear-gradient(160deg,#f7fcfd 0%,#eef9f7 100%);
  text-align:center;
}
.import-guide>strong{margin-top:8px;color:#173f5b;font-size:13px;}
.import-guide>p{margin:8px 0 0!important;color:#6d8797!important;font-size:11px!important;line-height:1.35;}
.import-sheet-visual{position:relative;width:92px;height:86px;}
.import-sheet{
  position:absolute;
  left:14px;
  top:4px;
  width:62px;
  height:76px;
  padding:14px 10px 8px;
  border-radius:9px;
  background:#fff;
  box-shadow:0 9px 25px rgba(28,105,118,.13);
  transform:rotate(3deg);
}
.import-sheet::before{
  content:"";
  position:absolute;
  right:0;
  top:0;
  width:18px;
  height:18px;
  border-radius:0 9px 0 7px;
  background:#dff3f1;
}
.import-sheet span{display:block;height:5px;margin:5px 0;border-radius:99px;background:#dfebef;}
.import-sheet b{
  position:absolute;
  right:-13px;
  bottom:9px;
  padding:5px 7px;
  border-radius:6px;
  background:#27a87b;
  color:#fff;
  font-size:9px;
  transform:rotate(-4deg);
}
.import-format-pills{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;margin-top:8px;}
.import-format-pills span{
  padding:4px 7px;
  border-radius:999px;
  background:#e4f6f1;
  color:#14735d;
  font-size:9px;
  font-weight:850;
}
.import-columns{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:12px;
}
.import-columns::before{
  content:"Colonnes reconnues";
  display:flex;
  align-items:center;
  margin-right:3px;
  color:#5f7d8d;
  font-size:10px;
  font-weight:800;
}
.import-columns span{
  padding:5px 8px;
  border-radius:8px;
  background:#f0f7fa;
  color:#496c80;
  font-size:10px;
  font-weight:700;
}
#importSubmitBtn:disabled{opacity:.6;cursor:wait;transform:none!important;}

@media (max-width:1100px){
  .import-layout{grid-template-columns:1fr;}
  .import-guide{min-height:auto;flex-direction:row;gap:14px;text-align:left;justify-content:flex-start;}
  .import-sheet-visual{flex:0 0 72px;width:72px;height:62px;}
  .import-sheet{transform:scale(.78) rotate(3deg);transform-origin:top left;}
  .import-guide>strong{margin:0;}
  .import-guide>p{margin:0!important;}
  .import-format-pills{margin:0 0 0 auto;}
}
@media (max-width:760px){
  .import-card-head{align-items:flex-start!important;}
  .import-example-link{width:100%;}
  .import-guide{display:none;}
  .import-dropzone{min-height:210px;padding:18px!important;}
  .import-columns::before{width:100%;}
}

/* =========================================================
   TERRIMAIL — LOGO OFFICIEL
   Intégration écran de connexion + barre latérale
========================================================= */
.login-brand{
  display:flex;
  justify-content:center;
  margin:0 0 18px;
}
.login-brand-logo{
  display:block;
  width:min(100%,340px);
  height:auto;
  object-fit:contain;
}
.login-card>p{
  margin:0 0 24px!important;
  text-align:center;
}
.sidebar-brand{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:24px 18px!important;
}
.sidebar-logo-card{
  position:relative;
  z-index:2;
  width:100%;
  padding:10px 8px;
  border:1px solid rgba(255,255,255,.32);
  border-radius:16px;
  background:rgba(255,255,255,.96);
  box-shadow:0 12px 28px rgba(4,44,65,.16);
}
.sidebar-brand-logo{
  display:block;
  width:100%;
  height:auto;
  max-height:82px;
  object-fit:contain;
}
@media (max-width:760px) and (pointer:coarse){
  .login-card{padding:26px!important;}
  .login-brand-logo{width:min(100%,300px);}
}