:root{
      --primary:#2563eb;
      --primary-dark:#1d4ed8;
      --bg:#f4f7fb;
      --panel:#ffffff;
      --text:#0f172a;
      --muted:#64748b;
      --border:#dbe3ef;
      --danger:#ef4444;
      --success:#16a34a;
      --shadow:0 20px 50px rgba(15,23,42,.12);
      --radius:18px;
    }

    *{ box-sizing:border-box; }

    body{
      margin:0;
      font-family:Arial, Helvetica, sans-serif;
      background:linear-gradient(135deg,#eff6ff 0%,#f8fafc 45%,#eef2ff 100%);
      color:var(--text);
      min-height:100vh;
    }

    header{
  padding:0px 28px 10px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:16px;
  border-bottom:1px solid rgba(219,227,239,.9);
  background:rgba(255,255,255,.8);
  backdrop-filter:blur(14px);
  position:sticky;
  top:0;
  z-index:20;
}

    .brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  text-align:center;
}

    .brand h1{
      margin:0;
      font-size:22px;
      letter-spacing:-.03em;
    }

    .brand span{
      color:var(--muted);
      font-size:13px;
    }
	
	.logo-link{
  display:inline-flex;
  align-items:center;
  width:fit-content;
  text-decoration:none;
}

.site-logo{
  display:block;
  height:150px;
  width:auto;
  max-width:380px;
  object-fit:contain;
}

.header-export-group{
  position:absolute;
  right:28px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  gap:8px;
  width:180px;
}

.header-export-group .btn{
  width:100%;
  min-width:0;
  max-width:none;
  white-space:nowrap;
}

.header-export-group .btn:hover{
  transform:translateY(-1px);
}

.visually-hidden{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0, 0, 0, 0);
  white-space:nowrap;
  border:0;
}

    .app{
      display:grid;
      grid-template-columns:330px 1fr 320px;
      gap:18px;
      padding:18px;
      align-items:start;
    }

    .panel{
      background:rgba(255,255,255,.92);
      border:1px solid var(--border);
      border-radius:var(--radius);
      box-shadow:var(--shadow);
      padding:18px;
      position:sticky;
      top:178px;
      max-height:calc(100vh - 196px);
      overflow:auto;
      align-self:start;
    }

    .panel h2{
      margin:0 0 12px;
      font-size:16px;
      letter-spacing:-.02em;
    }

    .panel p{
      margin:0 0 14px;
      font-size:13px;
      color:var(--muted);
      line-height:1.45;
    }

    .field{ margin-bottom:14px; }

    label{
      display:block;
      font-size:12px;
      font-weight:700;
      color:#334155;
      margin-bottom:7px;
    }

    input, select, textarea{
      width:100%;
      border:1px solid var(--border);
      border-radius:12px;
      padding:10px 11px;
      font-size:14px;
      outline:none;
      background:#fff;
    }

    textarea{
  min-height:48px;
  resize:vertical;
}

#fieldText{
  overflow:hidden;
  resize:none;
  min-height:48px;
}

#fieldText{
  overflow:hidden;
  resize:none;
  min-height:48px;
}
	input[type="range"]{
  padding:0;
  border:none;
  background:transparent;
  box-shadow:none;
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
}

input[type="range"]:focus{
  box-shadow:none;
}

input[type="range"]::-webkit-slider-runnable-track{
  height:6px;
  background:#dbe3ef;
  border-radius:999px;
}

input[type="range"]::-webkit-slider-thumb{
  appearance:none;
  -webkit-appearance:none;
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--primary);
  margin-top:-6px;
  cursor:pointer;
}

input[type="range"]::-moz-range-track{
  height:6px;
  background:#dbe3ef;
  border-radius:999px;
}

input[type="range"]::-moz-range-thumb{
  width:18px;
  height:18px;
  border:none;
  border-radius:50%;
  background:var(--primary);
  cursor:pointer;
}

#zoomRange{
  width:100%;
  height:28px;
}

.zoom-tools{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:8px;
  margin-bottom:10px;
}

.zoom-tool-btn{
  height:44px;
  border:1px solid var(--border);
  border-radius:14px;
  background:#fff;
  color:#0f172a;
  font-size:26px;
  font-weight:900;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  letter-spacing:-.08em;
  transition:.15s ease;
}

.zoom-tool-btn:hover{
  border-color:var(--primary);
  background:#eff6ff;
  color:var(--primary);
}

.zoom-tool-btn.active{
  border-color:var(--primary);
  background:var(--primary);
  color:#fff;
  box-shadow:0 10px 22px rgba(37,99,235,.22);
}

    .row{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:10px;
    }
	
	.text-settings-row{
  display:grid;
  grid-template-columns:minmax(80px, 1fr) 104px 30px 30px;
  gap:4px;
  align-items:end;
}

.text-settings-row .field{
  margin-bottom:14px;
  min-width:0;
}

.text-settings-row label{
  font-size:10px;
  margin-bottom:4px;
  white-space:nowrap;
}

.text-settings-row select,
.text-settings-row input{
  padding:6px 5px;
  font-size:11px;
  border-radius:9px;
  min-height:32px;
}

.text-settings-row select{
  text-overflow:ellipsis;
}

.text-settings-row input[type="number"]{
  text-align:center;
  padding-left:3px;
  padding-right:3px;
}

.text-settings-row input[type="color"]{
  height:32px;
  padding:2px;
}

.text-settings-row .style-toggle{
  width:34px;
  height:34px;
  border-radius:9px;
  font-size:13px;
  box-shadow:none;
}

.text-settings-row .style-toolbar{
  gap:0;
}
#fontFamily,
#fontSize{
  min-height:34px;
  height:34px;
  padding-top:8px;
  padding-bottom:8px;
}


.font-size-control{
  display:grid;
  grid-template-columns:32px 34px 32px;
  gap:3px;
  align-items:center;
}

.font-size-control #fontSize{
  width:34px;
  height:34px;
  min-height:34px;
  padding:0 2px;
  font-size:12px;
  font-weight:700;
  text-align:center;
}
/* Retire les petites flèches natives du champ Taille */
#fontSize::-webkit-outer-spin-button,
#fontSize::-webkit-inner-spin-button{
  -webkit-appearance:none;
  margin:0;
}

#fontSize{
  -moz-appearance:textfield;
  appearance:textfield;
}

.font-size-btn{
  width:32px;
  height:32px;
  border:1px solid var(--border);
  border-radius:7px;
  background:#fff;
  color:#0f172a;
  font-size:16px;
  font-weight:800;
  line-height:1;
  cursor:pointer;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.font-size-btn:hover{
  border-color:var(--primary);
  background:#eff6ff;
  color:var(--primary);
}



.text-settings-row .field{
  margin-bottom:14px;
}

.text-settings-row label{
  font-size:11px;
  margin-bottom:5px;
}

.color-picker-field{
  min-width:0;
}

.color-picker-button{
  position:relative;
  width:34px;
  height:34px;
  min-height:34px;
  border:1px solid var(--border);
  border-radius:9px;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:none;
  overflow:hidden;
  margin:0;
  padding:0;
}

.color-picker-field .color-picker-button{
  margin-bottom:0;
}

.color-picker-button:hover{
  border-color:var(--primary);
  background:#eff6ff;
}

.color-dot{
  width:18px;
  height:18px;
  border-radius:50%;
  background:#000000;
  border:1px solid rgba(15,23,42,.2);
  display:block;
}

.color-picker-button input[type="color"]{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  padding:0;
  border:0;
  opacity:0;
  cursor:pointer;
}

.effects-toggle-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:14px;
}

.effect-toggle{
  border:1px solid var(--border);
  border-radius:12px;
  padding:10px 8px;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  background:#fff;
  color:#0f172a;
  transition:.15s ease;
  width:100%;
  height:40px;
}

.effect-toggle:hover{
  border-color:var(--primary);
  background:#eff6ff;
}

.effect-toggle.active{
  border-color:var(--primary);
  background:var(--primary);
  color:#fff;
  box-shadow:0 10px 22px rgba(37,99,235,.22);
}

.effect-control,
.blur-control{
  display:flex;
  flex-direction:column;
  gap:5px;
  align-items:stretch;
}

.effect-control-label{
  display:block;
  margin:0 0 5px;
  font-size:11px;
  font-weight:700;
  color:#334155;
  white-space:nowrap;
}

.blur-percent-select{
  height:40px;
  padding:0 6px;
  border-radius:12px;
  font-size:12px;
  font-weight:700;
  text-align:center;
}

    .btn{
      border:none;
      border-radius:12px;
      padding:11px 13px;
      font-weight:700;
      cursor:pointer;
      transition:.18s ease;
      background:#e2e8f0;
      color:#0f172a;
      width:100%;
    }

    .btn:hover{ transform:translateY(-1px); }

    .btn-primary{
      background:var(--primary);
      color:#fff;
    }

    .btn-primary:hover{ background:var(--primary-dark); }

    .btn-danger{
  background:#dc2626;
  color:#ffffff;
}

.btn-danger:hover{
  background:#b91c1c;
  color:#ffffff;
}
    .btn-success{
      background:#dcfce7;
      color:#166534;
    }

    .toolbar{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:10px;
      margin-top:10px;
    }

    .workspace{
      min-height:calc(100vh - 120px);
      overflow:auto;
      padding:18px;
    }
	
	.workspace.pan-enabled{
  cursor:grab;
}

.workspace.panning{
  cursor:grabbing;
  user-select:none;
}

.workspace.panning *,
body.panning *{
  user-select:none;
}

body.panning{
  cursor:grabbing;
}

    .page-shell{
      margin:auto;
      width:max-content;
      min-width:300px;
      background:#fff;
      border-radius:14px;
      padding:16px;
      border:1px solid var(--border);
      box-shadow:0 30px 70px rgba(15,23,42,.18);
      display:flex;
      justify-content:center;
      align-items:flex-start;
    }
	
	#invoiceStage{
  position:relative;
  background:#fff;
  overflow:visible;
  transform-origin:top center;
  min-width:300px;
  min-height:220px;
}

.invoice-page{
  position:relative;
  background:#fff;
  overflow:hidden;
  margin:0 0 18px;
  box-shadow:0 12px 28px rgba(15,23,42,.10);
}

.invoice-page:last-child{
  margin-bottom:0;
}

.invoice-page-canvas,
.invoice-page-image{
  display:block;
  position:absolute;
  inset:0;
  z-index:1;
  user-select:none;
  -webkit-user-drag:none;
}

.invoice-page-image{
  width:100%;
  height:100%;
  object-fit:contain;
}

.empty-import-overlay{
  position:absolute;
  inset:0;
  z-index:6;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top:0px; /* ajuste la valeur selon la taille réelle du logo */
  background:linear-gradient(135deg,#ffffff 0%,#f8fafc 100%);
}

.empty-import-btn{
  width:auto;
  min-width:220px;
  max-width:260px;
}

#invoiceStage.has-file{
  min-width:0;
  min-height:0;
}

#invoiceStage.has-file .empty-import-overlay{
  display:none;
}


    .edit-field{
  position:absolute;
  z-index:4;
  min-width:1px;
  min-height:1px;
  border:1.5px dashed rgba(37,99,235,.85);
  background:rgba(255,255,255,.92);
  padding:0;
  cursor:move;
  overflow:visible;
  outline:none;
  line-height:1.05;
  text-align:left;
}

    .edit-field .field-text-content{
      position:absolute;
      inset:0;
      z-index:1;
      display:block;
      width:100%;
      height:100%;
      min-width:0;
      min-height:0;
      padding:0 2px;
      margin:0;
      border:0;
      outline:none;
      overflow:hidden;
      white-space:pre-wrap;
      word-break:break-word;
      overflow-wrap:anywhere;
      line-height:inherit;
      font:inherit;
      color:inherit;
      text-align:inherit;
      background:transparent;
      cursor:text;
      user-select:text;
    }

    .edit-field.selected{
  border:1.5px solid rgba(37,99,235,.85);
  outline:none;
  box-shadow:none;
  background:rgba(255,255,255,.96);
}

    .mask-field{
  position:absolute;
  z-index:3;
  background:#fff;
  border:1px dashed rgba(239,68,68,.75);
  cursor:move;
  min-width:1px;
  min-height:1px;
  overflow:visible;
}

    .mask-field.selected{
  border:1px solid rgba(239,68,68,.75);
  outline:none;
  box-shadow:none;
}

    .resize-handle{
      position:absolute;
      width:12px;
      height:12px;
      border-radius:50%;
      background:var(--primary);
      z-index:10;
      pointer-events:auto;
    }

    .resize-tl{ left:-7px; top:-7px; cursor:nwse-resize; }
    .resize-tr{ right:-7px; top:-7px; cursor:nesw-resize; }
    .resize-bl{ left:-7px; bottom:-7px; cursor:nesw-resize; }
    .resize-br{ right:-7px; bottom:-7px; cursor:nwse-resize; }
	
.move-handle{
  position:absolute;
  left:50%;
  top:-18px;
  transform:translateX(-50%);
  width:30px;
  height:15px;
  border-radius:999px;
  background:var(--primary);
  z-index:20;
  cursor:move;

  display:none; /* masqué par défaut */

  align-items:center;
  justify-content:center;
  opacity:.95;
  box-shadow:0 4px 10px rgba(15,23,42,.18);
}

/* Affichage uniquement sur l'élément sélectionné */
.edit-field.selected .move-handle,
.mask-field.selected .move-handle{
  display:flex;
}

.resize-handle{
  display:none;
}

.edit-field.selected .resize-handle,
.mask-field.selected .resize-handle{
  display:block;
}

.move-handle::before{
  content:"";
  width:14px;
  height:2px;
  background:#fff;
  border-radius:999px;
  box-shadow:0 4px 0 #fff;
}

.mask-field .move-handle{
  background:var(--danger);
}

    .mask-field .resize-handle{
      background:var(--danger);
    }

    .style-toolbar{
      display:flex;
      gap:6px;
      align-items:center;
    }

    .style-toggle{
      width:42px;
      height:38px;
      border:1px solid var(--border);
      border-radius:10px;
      background:#fff;
      color:#0f172a;
      font-size:16px;
      line-height:1;
      cursor:pointer;
      box-shadow:0 8px 18px rgba(15,23,42,.08);
      transition:.15s ease;
    }

    .style-toggle:hover{
      border-color:var(--primary);
      background:#eff6ff;
    }

    .style-toggle.active{
      border-color:var(--primary);
      background:var(--primary);
      color:#fff;
      box-shadow:0 10px 22px rgba(37,99,235,.25);
    }

    #boldBtn{ font-weight:800; }
    #italicBtn{ font-style:italic; }

    .status{
      margin-top:12px;
      padding:10px 12px;
      border-radius:12px;
      font-size:13px;
      display:none;
    }

    .status.ok{
      display:block;
      color:#166534;
      background:#dcfce7;
    }

    .status.err{
      display:block;
      color:#991b1b;
      background:#fee2e2;
    }

    .status.info{
      display:block;
      color:#1e40af;
      background:#dbeafe;
    }
	
	.import-status{
  margin-top:0;
  margin-bottom:10px;
}

	.analysis-status{
  margin-top:10px;
}

    .small-note{
      font-size:12px;
      color:var(--muted);
      line-height:1.45;
      margin-top:10px;
    }
	
	.field-settings{
  border:0;
  padding:0;
  margin:0;
}

.field-settings:disabled{
  opacity:.55;
}

.field-settings:disabled input,
.field-settings:disabled select,
.field-settings:disabled textarea,
.field-settings:disabled button{
  cursor:not-allowed;
  background:#f8fafc;
}

.field-settings-hint{
  margin-bottom:14px;
  padding:10px 12px;
  border-radius:12px;
  background:#f8fafc;
  border:1px dashed var(--border);
}

    .hidden{ display:none !important; }

    .mini-list{
      display:flex;
      flex-direction:column;
      gap:8px;
      margin-top:10px;
      height:auto;
      max-height:none;
      overflow:visible;
    }

    .mini-list.has-results{
      height:65vh;
      overflow-y:auto;
      overflow-x:hidden;
    }

    .mini-item{
      border:1px solid var(--border);
      border-radius:12px;
      padding:9px;
      font-size:13px;
      cursor:pointer;
      background:#fff;
    }

    .mini-item.active{
      border-color:var(--primary);
      background:#eff6ff;
    }
	
	.site-footer{
  margin-top:24px;
  padding:18px 20px;
  background:#e5e7eb;
  color:#475569;
  text-align:center;
  font-size:13px;
  border-top:1px solid #cbd5e1;
}

.site-footer a{
  color:#2563eb;
  font-weight:700;
  text-decoration:none;
}

.site-footer a:hover{
  text-decoration:underline;
}
	
	@media(max-width:1100px){
  .app{ grid-template-columns:1fr; }

  .panel{
    position:relative;
    top:auto;
    max-height:none;
    overflow:visible;
  }

  header{
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:20px 18px;
  }

  .header-export-group{
    position:static;
    transform:none;
    width:100%;
    max-width:240px;
  }

  .header-export-group .btn{
    width:100%;
  }

  .header-export-group .btn:hover{
    transform:translateY(-1px);
  }

  .site-logo{
    height:76px;
    max-width:300px;
  }
}


    @media print{
      header,.panel,.site-footer{ display:none !important; }
      body{ background:#fff; }
      .app{ display:block; padding:0; }
      .workspace{ padding:0; overflow:visible; }
      .page-shell{ box-shadow:none; border:none; padding:0; }
      .edit-field{ border:none !important; box-shadow:none !important; }
      .mask-field{ border:none !important; }
      .resize-handle{ display:none !important; }
	  .move-handle{ display:none !important; }
    }
  


/* === Modernisation visuelle bleue === */
header{
  background:linear-gradient(135deg,rgba(255,255,255,.92) 0%,rgba(239,246,255,.95) 100%);
}

.panel{
  background:
    linear-gradient(180deg,rgba(255,255,255,.98) 0%,rgba(248,250,252,.95) 100%);
}

.panel::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  border-radius:18px 18px 0 0;
  background:linear-gradient(90deg,#60a5fa,#2563eb,#1d4ed8);
}

.btn-primary{
  background:linear-gradient(135deg,#60a5fa 0%,#2563eb 55%,#1d4ed8 100%);
}

.btn-primary:hover{
  background:linear-gradient(135deg,#3b82f6 0%,#1d4ed8 100%);
}

.zoom-tool-btn{
  background:linear-gradient(180deg,#ffffff 0%,#eff6ff 100%);
}

.page-shell{
  background:linear-gradient(135deg,#ffffff 0%,#f8fbff 100%);
}

.invoice-page{
  box-shadow:
    0 12px 28px rgba(15,23,42,.10),
    0 0 0 1px rgba(96,165,250,.12);
}

.edit-field.selected{
  box-shadow:0 0 0 2px rgba(96,165,250,.15);
}

.move-handle{
  background:linear-gradient(135deg,#60a5fa,#2563eb);
}

.status.ok{
  background:linear-gradient(135deg,#dcfce7,#bbf7d0);
}

.status.info{
  background:linear-gradient(135deg,#dbeafe,#bfdbfe);
}

.empty-import-overlay{
  background:
    radial-gradient(circle at top right,rgba(96,165,250,.18),transparent 35%),
    linear-gradient(135deg,#ffffff 0%,#eff6ff 100%);
}


/* =========================================================
   VERSION PREMIUM BLEUE - FAKTURE
   Ajouts purement visuels : dégradés, glassmorphism, ombres.
   Aucune règle fonctionnelle n'est supprimée.
   ========================================================= */

:root{
  --primary:#2563eb;
  --primary-dark:#1e40af;
  --primary-soft:#60a5fa;
  --primary-glow:rgba(96,165,250,.34);
  --panel-glass:rgba(255,255,255,.78);
  --panel-glass-strong:rgba(255,255,255,.92);
  --border-blue:rgba(147,197,253,.42);
  --shadow:0 24px 70px rgba(30,64,175,.18);
}

body{
  background:
    radial-gradient(circle at 10% 8%,rgba(96,165,250,.34),transparent 26%),
    radial-gradient(circle at 92% 18%,rgba(37,99,235,.20),transparent 30%),
    radial-gradient(circle at 50% 100%,rgba(191,219,254,.60),transparent 38%),
    linear-gradient(135deg,#eef6ff 0%,#f8fbff 42%,#eaf2ff 100%);
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(120deg,rgba(255,255,255,.36),transparent 26%,rgba(255,255,255,.22) 48%,transparent 70%);
  z-index:-1;
}

header{
  border-bottom:1px solid rgba(147,197,253,.42);
  background:
    linear-gradient(135deg,rgba(255,255,255,.86) 0%,rgba(239,246,255,.82) 48%,rgba(219,234,254,.76) 100%);
  box-shadow:0 12px 36px rgba(30,64,175,.10);
  backdrop-filter:blur(22px) saturate(155%);
  -webkit-backdrop-filter:blur(22px) saturate(155%);
}

.brand span{
  color:#475569;
  font-weight:600;
}

.panel{
  position:sticky;
  background:
    linear-gradient(180deg,rgba(255,255,255,.92) 0%,rgba(248,250,252,.78) 100%);
  border:1px solid rgba(147,197,253,.48);
  box-shadow:
    0 22px 65px rgba(30,64,175,.16),
    inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter:blur(20px) saturate(145%);
  -webkit-backdrop-filter:blur(20px) saturate(145%);
  overflow:auto;
}

.panel::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:5px;
  border-radius:18px 18px 0 0;
  background:linear-gradient(90deg,#93c5fd 0%,#60a5fa 28%,#2563eb 68%,#1e40af 100%);
  box-shadow:0 0 18px rgba(96,165,250,.42);
}

.panel h2{
  color:#0f2f63;
}

.panel p,
.small-note{
  color:#52637a;
}

input,
select,
textarea,
.color-picker-button,
.effect-toggle,
.font-size-btn,
.style-toggle,
.zoom-tool-btn,
.mini-item{
  border-color:rgba(147,197,253,.42);
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.92));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}

input:focus,
select:focus,
textarea:focus{
  border-color:#60a5fa;
  box-shadow:
    0 0 0 4px rgba(96,165,250,.16),
    inset 0 1px 0 rgba(255,255,255,.95);
}

.btn{
  box-shadow:
    0 10px 26px rgba(15,23,42,.08),
    inset 0 1px 0 rgba(255,255,255,.28);
}

.btn:hover{
  transform:translateY(-2px);
  box-shadow:
    0 16px 34px rgba(30,64,175,.16),
    inset 0 1px 0 rgba(255,255,255,.32);
}

.btn-primary{
  color:#fff;
  background:
    linear-gradient(135deg,#7dd3fc 0%,#3b82f6 36%,#2563eb 68%,#1e3a8a 100%);
  box-shadow:
    0 14px 34px rgba(37,99,235,.28),
    inset 0 1px 0 rgba(255,255,255,.35);
}

.btn-primary:hover{
  background:
    linear-gradient(135deg,#60a5fa 0%,#2563eb 45%,#1e40af 100%);
}

.btn-secondary,
.btn:not(.btn-primary):not(.btn-danger):not(.btn-success){
  background:linear-gradient(135deg,#f8fbff 0%,#eaf3ff 100%);
  color:#17406f;
  border:1px solid rgba(147,197,253,.42);
}

.btn-danger{
  background:linear-gradient(135deg,#ef4444 0%,#dc2626 55%,#991b1b 100%);
  color:#fff;
  box-shadow:0 14px 30px rgba(220,38,38,.22);
}

.btn-danger:hover{
  background:linear-gradient(135deg,#dc2626 0%,#b91c1c 100%);
}

.zoom-tool-btn,
.effect-toggle,
.font-size-btn,
.style-toggle{
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

.zoom-tool-btn:hover,
.effect-toggle:hover,
.font-size-btn:hover,
.style-toggle:hover,
.color-picker-button:hover{
  border-color:#60a5fa;
  background:linear-gradient(135deg,#ffffff 0%,#dbeafe 100%);
  box-shadow:0 12px 26px rgba(37,99,235,.16);
}

.zoom-tool-btn.active,
.effect-toggle.active,
.style-toggle.active{
  background:linear-gradient(135deg,#60a5fa 0%,#2563eb 70%,#1e40af 100%);
  color:#fff;
  box-shadow:0 14px 30px rgba(37,99,235,.26);
}

input[type="range"]::-webkit-slider-runnable-track{
  background:linear-gradient(90deg,#bfdbfe,#60a5fa,#2563eb);
  box-shadow:inset 0 1px 2px rgba(30,64,175,.14);
}

input[type="range"]::-webkit-slider-thumb{
  background:linear-gradient(135deg,#ffffff,#60a5fa);
  border:2px solid #2563eb;
  box-shadow:0 6px 16px rgba(37,99,235,.28);
}

input[type="range"]::-moz-range-track{
  background:linear-gradient(90deg,#bfdbfe,#60a5fa,#2563eb);
}

input[type="range"]::-moz-range-thumb{
  background:linear-gradient(135deg,#ffffff,#60a5fa);
  border:2px solid #2563eb;
  box-shadow:0 6px 16px rgba(37,99,235,.28);
}

.workspace{
  background:
    radial-gradient(circle at center top,rgba(96,165,250,.14),transparent 34%);
  border-radius:22px;
}

.page-shell{
  border:1px solid rgba(147,197,253,.42);
  background:
    linear-gradient(135deg,rgba(255,255,255,.92) 0%,rgba(239,246,255,.74) 100%);
  box-shadow:
    0 34px 90px rgba(30,64,175,.22),
    inset 0 1px 0 rgba(255,255,255,.95);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
}

#invoiceStage{
  filter:drop-shadow(0 18px 36px rgba(30,64,175,.12));
}

.invoice-page{
  box-shadow:
    0 18px 42px rgba(15,23,42,.12),
    0 0 0 1px rgba(147,197,253,.18);
}

.empty-import-overlay{
  background:
    radial-gradient(circle at 72% 26%,rgba(96,165,250,.30),transparent 32%),
    radial-gradient(circle at 25% 78%,rgba(37,99,235,.16),transparent 34%),
    linear-gradient(135deg,#ffffff 0%,#eff6ff 52%,#dbeafe 100%);
}

.empty-import-btn{
  box-shadow:
    0 22px 46px rgba(37,99,235,.26),
    inset 0 1px 0 rgba(255,255,255,.36);
}

.edit-field{
  border-color:rgba(37,99,235,.78);
  background:rgba(255,255,255,.92);
}

.edit-field.selected{
  border-color:#2563eb;
  box-shadow:
    0 0 0 3px rgba(96,165,250,.20),
    0 10px 22px rgba(37,99,235,.12);
  background:rgba(255,255,255,.98);
}

.mask-field.selected{
  box-shadow:
    0 0 0 3px rgba(239,68,68,.12),
    0 10px 22px rgba(239,68,68,.10);
}

.resize-handle{
  background:linear-gradient(135deg,#7dd3fc,#2563eb);
  box-shadow:0 6px 15px rgba(37,99,235,.28);
}

.move-handle{
  background:linear-gradient(135deg,#7dd3fc 0%,#2563eb 72%,#1e40af 100%);
  box-shadow:0 8px 20px rgba(37,99,235,.30);
}

.mask-field .move-handle,
.mask-field .resize-handle{
  background:linear-gradient(135deg,#fb7185 0%,#dc2626 70%,#991b1b 100%);
}

.field-settings-hint{
  background:linear-gradient(135deg,rgba(239,246,255,.86),rgba(219,234,254,.62));
  border-color:rgba(147,197,253,.55);
}

.mini-list::-webkit-scrollbar,
.panel::-webkit-scrollbar,
.workspace::-webkit-scrollbar{
  width:10px;
  height:10px;
}

.mini-list::-webkit-scrollbar-track,
.panel::-webkit-scrollbar-track,
.workspace::-webkit-scrollbar-track{
  background:rgba(219,234,254,.44);
  border-radius:999px;
}

.mini-list::-webkit-scrollbar-thumb,
.panel::-webkit-scrollbar-thumb,
.workspace::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#93c5fd,#2563eb);
  border-radius:999px;
  border:2px solid rgba(255,255,255,.72);
}

.mini-item:hover,
.mini-item.active{
  border-color:#60a5fa;
  background:linear-gradient(135deg,#ffffff 0%,#dbeafe 100%);
  box-shadow:0 12px 24px rgba(37,99,235,.14);
}

.status.ok{
  color:#14532d;
  background:linear-gradient(135deg,#dcfce7 0%,#bbf7d0 100%);
  border:1px solid rgba(34,197,94,.20);
}

.status.err{
  color:#7f1d1d;
  background:linear-gradient(135deg,#fee2e2 0%,#fecaca 100%);
  border:1px solid rgba(239,68,68,.20);
}

.status.info{
  color:#1e3a8a;
  background:linear-gradient(135deg,#dbeafe 0%,#bfdbfe 100%);
  border:1px solid rgba(96,165,250,.30);
}

.site-footer{
  background:linear-gradient(135deg,#eaf3ff 0%,#dbeafe 100%);
  border-top:1px solid rgba(147,197,253,.42);
}

.site-footer a{
  color:#1d4ed8;
}

@media print{
  body{ background:#fff !important; }
  body::before{ display:none !important; }
}


/* Logo central visible uniquement avant l'import d'une facture */
.center-import-logo{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  width:min(78vw, 720px);
  max-width:82%;
  height:auto;
  object-fit:contain;
  opacity:.96;
  pointer-events:none;
  user-select:none;
  z-index:1;
  filter:drop-shadow(0 28px 46px rgba(30,64,175,.20));
}

.empty-import-overlay .empty-import-btn{
  position:relative;
  z-index:2;
  margin-top:260px;
}

#invoiceStage.has-file .center-import-logo{
  display:none !important;
}

@media(max-width:1100px){
  .center-import-logo{
    width:min(86vw, 520px);
  }

  .empty-import-overlay .empty-import-btn{
    margin-top:190px;
  }
}

@media print{
  .center-import-logo,
  .empty-import-overlay{
    display:none !important;
  }
}

/* =========================================================
   VERSION SOMBRE - FAKTURE
   Ajouts purement visuels. Aucune règle fonctionnelle n'est modifiée.
   ========================================================= */

:root{
  --primary:#60a5fa;
  --primary-dark:#3b82f6;
  --primary-soft:#93c5fd;
  --primary-glow:rgba(96,165,250,.34);
  --bg:#020617;
  --panel:#0f172a;
  --text:#e5e7eb;
  --muted:#94a3b8;
  --border:#24324a;
  --danger:#ef4444;
  --success:#22c55e;
  --shadow:0 24px 70px rgba(0,0,0,.42);
  --panel-glass:rgba(15,23,42,.78);
  --panel-glass-strong:rgba(15,23,42,.92);
  --border-blue:rgba(96,165,250,.28);
}

body{
  background:
    radial-gradient(circle at 8% 8%,rgba(37,99,235,.26),transparent 28%),
    radial-gradient(circle at 92% 18%,rgba(14,165,233,.18),transparent 30%),
    radial-gradient(circle at 50% 100%,rgba(30,64,175,.22),transparent 42%),
    linear-gradient(135deg,#020617 0%,#0f172a 48%,#111827 100%);
  color:var(--text);
}

body::before{
  background:
    linear-gradient(120deg,rgba(255,255,255,.05),transparent 28%,rgba(96,165,250,.06) 50%,transparent 72%);
}

header{
  border-bottom:1px solid rgba(96,165,250,.22);
  background:
    linear-gradient(135deg,rgba(2,6,23,.92) 0%,rgba(15,23,42,.90) 52%,rgba(30,41,59,.86) 100%);
  box-shadow:0 14px 38px rgba(0,0,0,.34);
}

.brand span{
  color:#b6c3d4;
}

.panel{
  background:
    linear-gradient(180deg,rgba(15,23,42,.94) 0%,rgba(2,6,23,.82) 100%);
  border:1px solid rgba(96,165,250,.24);
  box-shadow:
    0 24px 70px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.06);
}

.panel::before{
  background:linear-gradient(90deg,#38bdf8 0%,#60a5fa 35%,#2563eb 72%,#1d4ed8 100%);
  box-shadow:0 0 20px rgba(96,165,250,.28);
}

.panel h2,
.panel h3{
  color:#f8fafc;
}

.panel p,
.small-note{
  color:#94a3b8;
}

label,
.effect-control-label{
  color:#cbd5e1;
}

input,
select,
textarea,
.color-picker-button,
.effect-toggle,
.font-size-btn,
.style-toggle,
.zoom-tool-btn,
.mini-item{
  border-color:rgba(96,165,250,.24);
  background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(30,41,59,.92));
  color:#e5e7eb;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}

input::placeholder,
textarea::placeholder{
  color:#64748b;
}

input:focus,
select:focus,
textarea:focus{
  border-color:#60a5fa;
  box-shadow:
    0 0 0 4px rgba(96,165,250,.14),
    inset 0 1px 0 rgba(255,255,255,.06);
}

.field-settings:disabled input,
.field-settings:disabled select,
.field-settings:disabled textarea,
.field-settings:disabled button{
  background:#111827;
  color:#64748b;
}

.btn{
  background:#1e293b;
  color:#e5e7eb;
  box-shadow:
    0 12px 28px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.btn:hover{
  box-shadow:
    0 18px 38px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.10);
}

.btn-primary{
  color:#ffffff;
  background:
    linear-gradient(135deg,#38bdf8 0%,#3b82f6 38%,#2563eb 70%,#1e40af 100%);
  box-shadow:
    0 16px 36px rgba(37,99,235,.30),
    inset 0 1px 0 rgba(255,255,255,.22);
}

.btn-primary:hover{
  background:
    linear-gradient(135deg,#0ea5e9 0%,#2563eb 52%,#1e40af 100%);
}

.btn-secondary,
.btn:not(.btn-primary):not(.btn-danger):not(.btn-success){
  background:linear-gradient(135deg,#1e293b 0%,#0f172a 100%);
  color:#dbeafe;
  border:1px solid rgba(96,165,250,.24);
}

.btn-danger{
  background:linear-gradient(135deg,#ef4444 0%,#dc2626 55%,#991b1b 100%);
  color:#ffffff;
  box-shadow:0 16px 34px rgba(220,38,38,.24);
}

.btn-success{
  background:linear-gradient(135deg,#14532d 0%,#166534 100%);
  color:#dcfce7;
}

.zoom-tool-btn:hover,
.effect-toggle:hover,
.font-size-btn:hover,
.style-toggle:hover,
.color-picker-button:hover{
  border-color:#60a5fa;
  background:linear-gradient(135deg,#1e293b 0%,#0f3b62 100%);
  color:#ffffff;
  box-shadow:0 14px 28px rgba(37,99,235,.18);
}

.zoom-tool-btn.active,
.effect-toggle.active,
.style-toggle.active{
  background:linear-gradient(135deg,#38bdf8 0%,#2563eb 70%,#1e40af 100%);
  color:#ffffff;
  box-shadow:0 16px 34px rgba(37,99,235,.28);
}

input[type="range"]::-webkit-slider-runnable-track{
  background:linear-gradient(90deg,#1e293b,#2563eb,#60a5fa);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.30);
}

input[type="range"]::-webkit-slider-thumb{
  background:linear-gradient(135deg,#e0f2fe,#60a5fa);
  border:2px solid #93c5fd;
  box-shadow:0 7px 18px rgba(96,165,250,.24);
}

input[type="range"]::-moz-range-track{
  background:linear-gradient(90deg,#1e293b,#2563eb,#60a5fa);
}

input[type="range"]::-moz-range-thumb{
  background:linear-gradient(135deg,#e0f2fe,#60a5fa);
  border:2px solid #93c5fd;
  box-shadow:0 7px 18px rgba(96,165,250,.24);
}

.workspace{
  background:
    radial-gradient(circle at center top,rgba(96,165,250,.10),transparent 36%);
}

.page-shell{
  border:1px solid rgba(96,165,250,.22);
  background:
    linear-gradient(135deg,rgba(15,23,42,.96) 0%,rgba(2,6,23,.86) 100%);
  box-shadow:
    0 36px 96px rgba(0,0,0,.50),
    inset 0 1px 0 rgba(255,255,255,.06);
}

#invoiceStage{
  filter:drop-shadow(0 18px 36px rgba(0,0,0,.34));
}

.invoice-page{
  background:#ffffff;
  box-shadow:
    0 18px 46px rgba(0,0,0,.38),
    0 0 0 1px rgba(96,165,250,.14);
}

.empty-import-overlay{
  background:
    radial-gradient(circle at 72% 26%,rgba(96,165,250,.22),transparent 32%),
    radial-gradient(circle at 25% 78%,rgba(37,99,235,.14),transparent 34%),
    linear-gradient(135deg,#020617 0%,#0f172a 52%,#1e293b 100%);
}

.center-import-logo{
  filter:drop-shadow(0 30px 54px rgba(96,165,250,.18));
}

.edit-field{
  border-color:rgba(96,165,250,.86);
  background:rgba(255,255,255,.92);
}

.edit-field.selected{
  border-color:#60a5fa;
  box-shadow:
    0 0 0 3px rgba(96,165,250,.22),
    0 10px 24px rgba(37,99,235,.18);
  background:rgba(255,255,255,.98);
}

.mask-field.selected{
  box-shadow:
    0 0 0 3px rgba(239,68,68,.16),
    0 10px 24px rgba(239,68,68,.13);
}

.resize-handle{
  background:linear-gradient(135deg,#7dd3fc,#2563eb);
  box-shadow:0 7px 16px rgba(37,99,235,.30);
}

.move-handle{
  background:linear-gradient(135deg,#7dd3fc 0%,#2563eb 72%,#1e40af 100%);
  box-shadow:0 9px 22px rgba(37,99,235,.34);
}

.mask-field .move-handle,
.mask-field .resize-handle{
  background:linear-gradient(135deg,#fb7185 0%,#dc2626 70%,#991b1b 100%);
}

.field-settings-hint{
  background:linear-gradient(135deg,rgba(15,23,42,.88),rgba(30,41,59,.72));
  border-color:rgba(96,165,250,.28);
}

.mini-list::-webkit-scrollbar,
.panel::-webkit-scrollbar,
.workspace::-webkit-scrollbar{
  width:10px;
  height:10px;
}

.mini-list::-webkit-scrollbar-track,
.panel::-webkit-scrollbar-track,
.workspace::-webkit-scrollbar-track{
  background:rgba(15,23,42,.88);
  border-radius:999px;
}

.mini-list::-webkit-scrollbar-thumb,
.panel::-webkit-scrollbar-thumb,
.workspace::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#60a5fa,#2563eb);
  border-radius:999px;
  border:2px solid rgba(15,23,42,.88);
}

.mini-item:hover,
.mini-item.active{
  border-color:#60a5fa;
  background:linear-gradient(135deg,#1e293b 0%,#0f3b62 100%);
  box-shadow:0 14px 28px rgba(37,99,235,.16);
}

.status.ok{
  color:#bbf7d0;
  background:linear-gradient(135deg,#052e16 0%,#14532d 100%);
  border:1px solid rgba(34,197,94,.22);
}

.status.err{
  color:#fecaca;
  background:linear-gradient(135deg,#450a0a 0%,#7f1d1d 100%);
  border:1px solid rgba(239,68,68,.22);
}

.status.info{
  color:#bfdbfe;
  background:linear-gradient(135deg,#172554 0%,#1e3a8a 100%);
  border:1px solid rgba(96,165,250,.28);
}

.site-footer{
  background:linear-gradient(135deg,#020617 0%,#0f172a 100%);
  color:#94a3b8;
  border-top:1px solid rgba(96,165,250,.22);
}

.site-footer a{
  color:#93c5fd;
}

@media print{
  body{ background:#ffffff !important; color:#0f172a !important; }
  body::before{ display:none !important; }
}


/* =========================================================
   BASCULE MODE CLAIR / SOMBRE
   Le mode sombre reste le mode par défaut.
   ========================================================= */
.theme-toggle-btn{
  min-height:40px;
}

body.theme-light{
  --primary:#2563eb;
  --primary-dark:#1e40af;
  --primary-soft:#60a5fa;
  --primary-glow:rgba(96,165,250,.34);
  --bg:#f4f7fb;
  --panel:#ffffff;
  --text:#0f172a;
  --muted:#64748b;
  --border:#dbe3ef;
  --danger:#ef4444;
  --success:#16a34a;
  --shadow:0 24px 70px rgba(30,64,175,.18);
  --panel-glass:rgba(255,255,255,.78);
  --panel-glass-strong:rgba(255,255,255,.92);
  --border-blue:rgba(147,197,253,.42);
  background:
    radial-gradient(circle at 10% 8%,rgba(96,165,250,.34),transparent 26%),
    radial-gradient(circle at 92% 18%,rgba(37,99,235,.20),transparent 30%),
    radial-gradient(circle at 50% 100%,rgba(191,219,254,.60),transparent 38%),
    linear-gradient(135deg,#eef6ff 0%,#f8fbff 42%,#eaf2ff 100%);
  color:var(--text);
}

body.theme-light::before{
  background:
    linear-gradient(120deg,rgba(255,255,255,.36),transparent 26%,rgba(255,255,255,.22) 48%,transparent 70%);
}

body.theme-light header{
  border-bottom:1px solid rgba(147,197,253,.42);
  background:
    linear-gradient(135deg,rgba(255,255,255,.86) 0%,rgba(239,246,255,.82) 48%,rgba(219,234,254,.76) 100%);
  box-shadow:0 12px 36px rgba(30,64,175,.10);
}

body.theme-light .brand span{
  color:#475569;
}

body.theme-light .panel{
  background:
    linear-gradient(180deg,rgba(255,255,255,.92) 0%,rgba(248,250,252,.78) 100%);
  border:1px solid rgba(147,197,253,.48);
  box-shadow:
    0 22px 65px rgba(30,64,175,.16),
    inset 0 1px 0 rgba(255,255,255,.9);
}

body.theme-light .panel::before{
  background:linear-gradient(90deg,#93c5fd 0%,#60a5fa 28%,#2563eb 68%,#1e40af 100%);
  box-shadow:0 0 18px rgba(96,165,250,.42);
}

body.theme-light .panel h2,
body.theme-light .panel h3{
  color:#0f2f63;
}

body.theme-light .panel p,
body.theme-light .small-note{
  color:#52637a;
}

body.theme-light label,
body.theme-light .effect-control-label{
  color:#334155;
}

body.theme-light input,
body.theme-light select,
body.theme-light textarea,
body.theme-light .color-picker-button,
body.theme-light .effect-toggle,
body.theme-light .font-size-btn,
body.theme-light .style-toggle,
body.theme-light .zoom-tool-btn,
body.theme-light .mini-item{
  border-color:rgba(147,197,253,.42);
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.92));
  color:#0f172a;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}

body.theme-light input::placeholder,
body.theme-light textarea::placeholder{
  color:#94a3b8;
}

body.theme-light input:focus,
body.theme-light select:focus,
body.theme-light textarea:focus{
  border-color:#60a5fa;
  box-shadow:
    0 0 0 4px rgba(96,165,250,.16),
    inset 0 1px 0 rgba(255,255,255,.95);
}

body.theme-light .field-settings:disabled input,
body.theme-light .field-settings:disabled select,
body.theme-light .field-settings:disabled textarea,
body.theme-light .field-settings:disabled button{
  background:#f8fafc;
  color:#64748b;
}

body.theme-light .btn{
  background:#e2e8f0;
  color:#0f172a;
  box-shadow:
    0 10px 26px rgba(15,23,42,.08),
    inset 0 1px 0 rgba(255,255,255,.28);
}

body.theme-light .btn-primary{
  color:#ffffff;
  background:
    linear-gradient(135deg,#7dd3fc 0%,#3b82f6 36%,#2563eb 68%,#1e3a8a 100%);
  box-shadow:
    0 14px 34px rgba(37,99,235,.28),
    inset 0 1px 0 rgba(255,255,255,.35);
}

body.theme-light .btn-primary:hover{
  background:
    linear-gradient(135deg,#60a5fa 0%,#2563eb 45%,#1e40af 100%);
}

body.theme-light .btn-secondary,
body.theme-light .btn:not(.btn-primary):not(.btn-danger):not(.btn-success){
  background:linear-gradient(135deg,#f8fbff 0%,#eaf3ff 100%);
  color:#17406f;
  border:1px solid rgba(147,197,253,.42);
}

body.theme-light .btn-danger{
  background:linear-gradient(135deg,#ef4444 0%,#dc2626 55%,#991b1b 100%);
  color:#ffffff;
}

body.theme-light .zoom-tool-btn:hover,
body.theme-light .effect-toggle:hover,
body.theme-light .font-size-btn:hover,
body.theme-light .style-toggle:hover,
body.theme-light .color-picker-button:hover{
  border-color:#60a5fa;
  background:linear-gradient(135deg,#ffffff 0%,#dbeafe 100%);
  color:#2563eb;
  box-shadow:0 12px 26px rgba(37,99,235,.16);
}

body.theme-light .zoom-tool-btn.active,
body.theme-light .effect-toggle.active,
body.theme-light .style-toggle.active{
  background:linear-gradient(135deg,#60a5fa 0%,#2563eb 70%,#1e40af 100%);
  color:#ffffff;
}

body.theme-light input[type="range"]::-webkit-slider-runnable-track{
  background:linear-gradient(90deg,#bfdbfe,#60a5fa,#2563eb);
}

body.theme-light input[type="range"]::-webkit-slider-thumb{
  background:linear-gradient(135deg,#ffffff,#60a5fa);
  border:2px solid #2563eb;
}

body.theme-light input[type="range"]::-moz-range-track{
  background:linear-gradient(90deg,#bfdbfe,#60a5fa,#2563eb);
}

body.theme-light input[type="range"]::-moz-range-thumb{
  background:linear-gradient(135deg,#ffffff,#60a5fa);
  border:2px solid #2563eb;
}

body.theme-light .workspace{
  background:
    radial-gradient(circle at center top,rgba(96,165,250,.14),transparent 34%);
}

body.theme-light .page-shell{
  border:1px solid rgba(147,197,253,.42);
  background:
    linear-gradient(135deg,rgba(255,255,255,.92) 0%,rgba(239,246,255,.74) 100%);
  box-shadow:
    0 34px 90px rgba(30,64,175,.22),
    inset 0 1px 0 rgba(255,255,255,.95);
}

body.theme-light #invoiceStage{
  filter:drop-shadow(0 18px 36px rgba(30,64,175,.12));
}

body.theme-light .invoice-page{
  background:#ffffff;
  box-shadow:
    0 18px 42px rgba(15,23,42,.12),
    0 0 0 1px rgba(147,197,253,.18);
}

body.theme-light .empty-import-overlay{
  background:
    radial-gradient(circle at 72% 26%,rgba(96,165,250,.30),transparent 32%),
    radial-gradient(circle at 25% 78%,rgba(37,99,235,.16),transparent 34%),
    linear-gradient(135deg,#ffffff 0%,#eff6ff 52%,#dbeafe 100%);
}

body.theme-light .center-import-logo{
  filter:drop-shadow(0 28px 46px rgba(30,64,175,.20));
}

body.theme-light .edit-field.selected{
  border-color:#2563eb;
  box-shadow:
    0 0 0 3px rgba(96,165,250,.20),
    0 10px 22px rgba(37,99,235,.12);
  background:rgba(255,255,255,.98);
}

body.theme-light .field-settings-hint{
  background:linear-gradient(135deg,rgba(239,246,255,.86),rgba(219,234,254,.62));
  border-color:rgba(147,197,253,.55);
}

body.theme-light .mini-list::-webkit-scrollbar-track,
body.theme-light .panel::-webkit-scrollbar-track,
body.theme-light .workspace::-webkit-scrollbar-track{
  background:rgba(219,234,254,.44);
}

body.theme-light .mini-list::-webkit-scrollbar-thumb,
body.theme-light .panel::-webkit-scrollbar-thumb,
body.theme-light .workspace::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#93c5fd,#2563eb);
  border:2px solid rgba(255,255,255,.72);
}

body.theme-light .mini-item:hover,
body.theme-light .mini-item.active{
  border-color:#60a5fa;
  background:linear-gradient(135deg,#ffffff 0%,#dbeafe 100%);
  box-shadow:0 12px 24px rgba(37,99,235,.14);
}

body.theme-light .status.ok{
  color:#14532d;
  background:linear-gradient(135deg,#dcfce7 0%,#bbf7d0 100%);
  border:1px solid rgba(34,197,94,.20);
}

body.theme-light .status.err{
  color:#7f1d1d;
  background:linear-gradient(135deg,#fee2e2 0%,#fecaca 100%);
  border:1px solid rgba(239,68,68,.20);
}

body.theme-light .status.info{
  color:#1e3a8a;
  background:linear-gradient(135deg,#dbeafe 0%,#bfdbfe 100%);
  border:1px solid rgba(96,165,250,.30);
}

body.theme-light .site-footer{
  background:linear-gradient(135deg,#eaf3ff 0%,#dbeafe 100%);
  color:#475569;
  border-top:1px solid rgba(147,197,253,.42);
}

body.theme-light .site-footer a{
  color:#1d4ed8;
}