/*
 * bauakte.css – Digitale Bauakte
 * Design 1:1 aus bauakte_dokumentenverwaltung.html übernommen
 * + Ergänzungen: Progress Bar, Spinner, Drag-over-State
 */

*,*::before,*::after{box-sizing:border-box;}

:root{
  --lime:#aadd00;
  --lime-bright:#c6ff00;
  --lime-muted:#7aaa00;
  --dark:#141410;
  --dark2:#252520;
  --r:20px;
  --rsm:12px;
}

/* ── Nutzt WordPress/Theme CSS-Variablen als Fallback ── */
.ba-page{
  --text: var(--color-text-primary, #111);
  --text-muted: var(--color-text-secondary, #666);
  --bg: var(--color-background-primary, #fff);
  --bg-off: var(--color-background-secondary, #f5f5f5);
  --border: var(--color-border-tertiary, #e5e5e5);
  --border-md: var(--color-border-secondary, #ccc);
}

.ba-page{
  padding:2rem 0;
  max-width:1100px;
  margin:0 auto;
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
  color:var(--text);
  background:transparent;
}

@keyframes fadeUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
@keyframes scaleIn{from{opacity:0;transform:scale(.97);}to{opacity:1;transform:scale(1);}}
@keyframes slideDown{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:translateY(0);}}
@keyframes barGrow{from{width:0;}to{width:100%;}}
@keyframes pulseIcon{0%,100%{transform:scale(1);}50%{transform:scale(1.07);}}
@keyframes spin{to{transform:rotate(360deg);}}

/* ── HEADER ── */
.ba-header{
  display:flex;align-items:flex-end;justify-content:space-between;
  margin-bottom:2rem;animation:fadeUp .6s .1s both;
}
.ba-eyebrow{
  font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--lime-muted);font-weight:600;margin-bottom:.5rem;
  display:flex;align-items:center;gap:10px;
}
.ba-eyebrow::before{content:'';display:inline-block;width:22px;height:2px;background:var(--lime);}
.ba-title{
  font-size:2.1rem;font-weight:500;letter-spacing:-.03em;line-height:1.12;
  color:var(--text);margin:0;
}
.ba-title-accent{position:relative;display:inline-block;}
.ba-title-accent::after{
  content:'';position:absolute;bottom:2px;left:0;right:0;
  height:3px;background:var(--lime);border-radius:2px;
  animation:barGrow .7s .9s ease both;
}
.ba-header-right{display:flex;align-items:center;gap:10px;}

/* ── STATS ── */
.ba-stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;
  margin-bottom:2rem;
}
.ba-stat{
  background:var(--bg-off);border-radius:var(--rsm);
  padding:.9rem 1.1rem;border:.5px solid var(--border);
  animation:fadeUp .55s both;
  transition:transform .3s cubic-bezier(.22,.68,0,1.2),box-shadow .3s;
}
.ba-stat:nth-child(1){animation-delay:.2s}
.ba-stat:nth-child(2){animation-delay:.28s}
.ba-stat:nth-child(3){animation-delay:.36s}
.ba-stat:nth-child(4){animation-delay:.44s}
.ba-stat:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.07);}
.ba-stat-label{font-size:.72rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.09em;margin-bottom:.35rem;}
.ba-stat-value{font-size:1.6rem;font-weight:500;letter-spacing:-.025em;color:var(--text);}
.ba-stat-value--date{font-size:1rem;padding-top:.3rem;}
.ba-stat-sub{font-size:.75rem;color:var(--text-muted);margin-top:.2rem;}
.ba-stat--lime .ba-stat-value{color:var(--lime-muted);}

/* ── UPLOAD ZONE ── */
.ba-upload-zone{
  border:.5px dashed var(--lime);
  border-radius:var(--r);
  padding:2rem 2rem 1.8rem;
  background:linear-gradient(135deg,rgba(170,221,0,.04) 0%,transparent 70%);
  margin-bottom:1.5rem;
  animation:scaleIn .6s .3s both;
  transition:border-color .25s,background .25s;
  cursor:pointer;
}
.ba-upload-zone:hover,
.ba-upload-zone.drag-over{
  border-color:var(--lime-bright);
  background:linear-gradient(135deg,rgba(170,221,0,.08) 0%,transparent 70%);
}
.ba-upload-zone.drag-over{
  border-style:solid;
}
.ba-upload-inner{display:flex;align-items:center;gap:1.5rem;}
.ba-upload-icon{
  width:52px;height:52px;border-radius:16px;background:var(--lime);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  animation:pulseIcon 3s 2s ease-in-out infinite;
}
.ba-upload-icon svg{width:24px;height:24px;}
.ba-upload-text h3{font-size:.95rem;font-weight:500;margin-bottom:.25rem;color:var(--text);}
.ba-upload-text p{font-size:.8rem;color:var(--text-muted);}
.ba-upload-form{margin-top:1.4rem;display:none;}
.ba-upload-form.open{display:block;animation:slideDown .35s ease both;}
.ba-form-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:12px;}
.ba-field{}
.ba-field label{
  display:block;font-size:.75rem;font-weight:500;
  color:var(--text-muted);margin-bottom:.3rem;
  text-transform:uppercase;letter-spacing:.07em;
}
.ba-field input,
.ba-field select,
.ba-field textarea{
  width:100%;padding:.55rem .75rem;
  border:.5px solid var(--border-md);border-radius:var(--rsm);
  background:var(--bg);color:var(--text);
  font-size:.875rem;
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
  transition:border-color .2s;
}
.ba-field input:focus,
.ba-field select:focus,
.ba-field textarea:focus{
  outline:none;border-color:var(--lime);
}
.ba-field textarea{resize:vertical;min-height:60px;}

/* Datei-Drop */
.ba-file-drop{
  border:.5px dashed var(--border-md);border-radius:var(--rsm);
  padding:1.2rem;text-align:center;background:var(--bg-off);
  cursor:pointer;transition:border-color .2s,background .2s;
  font-size:.82rem;color:var(--text-muted);
}
.ba-file-drop:hover,
.ba-file-drop.dragover{
  border-color:var(--lime);background:rgba(170,221,0,.04);
}
.ba-file-drop.has-file{
  border-color:var(--lime);color:var(--text);
  background:rgba(170,221,0,.06);
}

/* Progress Bar */
.ba-progress-bar-outer{
  height:4px;border-radius:2px;background:var(--border);
  overflow:hidden;margin-bottom:.3rem;
}
.ba-progress-bar-inner{
  height:100%;background:var(--lime);border-radius:2px;
  transition:width .2s ease;width:0%;
}
.ba-progress-text{font-size:.75rem;color:var(--text-muted);}

.ba-form-actions{display:flex;align-items:center;gap:10px;margin-top:1rem;}

/* ── BUTTONS ── */
.ba-btn{
  padding:.55rem 1.4rem;border-radius:20px;border:none;cursor:pointer;
  font-size:.82rem;
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
  font-weight:500;
  transition:background .2s,transform .15s,box-shadow .2s;
  letter-spacing:-.01em;
}
.ba-btn--primary{background:var(--lime);color:var(--dark);}
.ba-btn--primary:hover{background:var(--lime-bright);transform:translateY(-1px);box-shadow:0 6px 18px rgba(170,221,0,.3);}
.ba-btn--primary:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none;}
.ba-btn--ghost{
  background:var(--bg-off);color:var(--text-muted);
  border:.5px solid var(--border-md);
}
.ba-btn--ghost:hover{background:var(--bg);color:var(--text);}
.ba-btn--sm{padding:.3rem .9rem;font-size:.76rem;border-radius:14px;}
.ba-btn--danger{
  background:var(--color-background-danger, #fff0f0);
  color:var(--color-text-danger, #c00);
  border:.5px solid var(--color-border-tertiary, #e5e5e5);
}
.ba-btn--danger:hover{opacity:.85;}
.ba-btn--icon{
  width:36px;height:36px;border-radius:50%;padding:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--bg-off);border:.5px solid var(--border-md);
  color:var(--text-muted);
}
.ba-btn--icon:hover{background:var(--bg);color:var(--text);}

/* ── TOOLBAR ── */
.ba-toolbar{
  display:flex;align-items:center;gap:12px;margin-bottom:1.2rem;
  animation:fadeUp .5s .5s both;
  flex-wrap:wrap;
}
.ba-search{flex:1;min-width:180px;position:relative;}
.ba-search input{
  width:100%;padding:.5rem .75rem .5rem 2.2rem;
  border:.5px solid var(--border-md);border-radius:20px;
  background:var(--bg-off);color:var(--text);
  font-size:.85rem;
  font-family: var(--font-sans, sans-serif);
  transition:border-color .2s,background .2s;
}
.ba-search input:focus{outline:none;border-color:var(--lime);background:var(--bg);}
.ba-search-icon{position:absolute;left:.7rem;top:50%;transform:translateY(-50%);color:var(--text-muted);}
.ba-filter-pills{display:flex;gap:6px;flex-wrap:wrap;}
.ba-pill{
  padding:.3rem .85rem;border-radius:16px;font-size:.75rem;font-weight:500;
  border:.5px solid var(--border-md);cursor:pointer;
  background:var(--bg-off);color:var(--text-muted);
  transition:all .2s;letter-spacing:.02em;
  user-select:none;
}
.ba-pill:hover{border-color:var(--lime-muted);color:var(--text);}
.ba-pill.active{background:var(--lime);color:var(--dark);border-color:var(--lime);}

/* ── DOCUMENT LIST ── */
.ba-list{display:flex;flex-direction:column;gap:10px;animation:fadeUp .5s .6s both;}

.ba-doc-row{
  background:var(--bg);border:.5px solid var(--border);
  border-radius:var(--rsm);padding:1rem 1.2rem;
  display:grid;grid-template-columns:auto 1fr auto auto auto;
  align-items:center;gap:1rem;
  transition:transform .3s cubic-bezier(.22,.68,0,1.2),box-shadow .3s,border-color .2s;
  cursor:pointer;
}
.ba-doc-row:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 28px rgba(0,0,0,.07);
  border-color:var(--border-md);
}
.ba-doc-icon{
  width:42px;height:42px;border-radius:11px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.ba-doc-icon--pdf{background:rgba(0,115,170,.1);}
.ba-doc-icon--img{background:rgba(100,165,10,.1);}
.ba-doc-icon--doc{background:var(--bg-off);}
.ba-doc-info{}
.ba-doc-name{font-size:.88rem;font-weight:500;color:var(--text);margin-bottom:.2rem;}
.ba-doc-meta{font-size:.75rem;color:var(--text-muted);display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;}
.ba-doc-notes{display:block;font-size:.75rem;color:var(--text-muted);margin-top:.15rem;font-style:italic;}
.ba-doc-cat{font-size:.75rem;color:var(--text-muted);}
.ba-doc-amount{font-size:.85rem;font-weight:500;color:var(--text);text-align:right;white-space:nowrap;}
.ba-doc-actions{display:flex;align-items:center;gap:6px;flex-shrink:0;}

/* ── BADGES ── */
.ba-badge{
  padding:.2rem .6rem;border-radius:10px;font-size:.7rem;font-weight:500;
  text-transform:uppercase;letter-spacing:.07em;
}
.ba-badge--pdf{background:rgba(0,115,170,.1);color:#0073aa;}
.ba-badge--img{background:rgba(100,165,10,.1);color:#5a7a0a;}
.ba-badge--doc{background:rgba(130,80,200,.1);color:#6840b0;}

.ba-status{
  padding:.18rem .55rem;border-radius:8px;font-size:.7rem;font-weight:500;
}
.ba-status--offen{background:rgba(185,115,10,.1);color:#a06808;}
.ba-status--bezahlt{background:rgba(21,87,36,.1);color:#155724;}
.ba-status--archiviert{background:var(--bg-off);color:var(--text-muted);}

/* ── EMPTY STATE ── */
.ba-empty{
  text-align:center;padding:3rem 2rem;
  border:.5px dashed var(--border-md);border-radius:var(--r);
  background:var(--bg-off);
}
.ba-empty-icon{width:48px;height:48px;margin:0 auto 1rem;opacity:.35;}
.ba-empty p{color:var(--text-muted);font-size:.875rem;}

/* ── LOADING ── */
.ba-loading{
  text-align:center;padding:3rem;
}
.ba-spinner{
  width:28px;height:28px;border:2px solid var(--border-md);
  border-top-color:var(--lime);border-radius:50%;
  animation:spin .7s linear infinite;
  margin:0 auto;
}

/* ── SECTION DIVIDER ── */
.ba-section-label{
  font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--text-muted);font-weight:500;
  display:flex;align-items:center;gap:10px;margin-bottom:.75rem;
}
.ba-section-label::after{content:'';flex:1;height:.5px;background:var(--border);}

/* ── MESSAGES ── */
.ba-message{
  padding:.7rem 1rem;border-radius:var(--rsm);margin-bottom:1rem;
  font-size:.82rem;display:none;
  animation:slideDown .3s ease both;
}
.ba-message.show{display:block;}
.ba-message--success{
  background:var(--color-background-success, #d4edda);
  color:var(--color-text-success, #155724);
  border:.5px solid var(--color-border-tertiary, #e5e5e5);
}
.ba-message--error{
  background:var(--color-background-danger, #f8d7da);
  color:var(--color-text-danger, #721c24);
  border:.5px solid var(--color-border-tertiary, #e5e5e5);
}

/* ── GLOBAL NOTICE ── */
.ba-global-msg{
  padding:.65rem 1rem;border-radius:var(--rsm);
  font-size:.82rem;margin-bottom:1rem;
  animation:slideDown .3s ease;
}
.ba-global-msg--success{background:rgba(170,221,0,.12);color:var(--lime-muted);border:.5px solid var(--lime);}
.ba-global-msg--error{background:var(--color-background-danger,#f8d7da);color:var(--color-text-danger,#721c24);}

/* ── NOT LOGGED IN ── */
.ba-notice{
  padding:1rem;border-radius:var(--rsm);
  background:var(--bg-off);border:.5px solid var(--border-md);
  color:var(--text-muted);font-size:.9rem;
}

/* ── RESPONSIVE ── */
@media(max-width:700px){
  .ba-stats{grid-template-columns:1fr 1fr;}
  .ba-form-grid{grid-template-columns:1fr;}
  .ba-form-grid .ba-field[style*="span 2"]{grid-column:span 1;}
  .ba-doc-row{grid-template-columns:auto 1fr auto;}
  .ba-doc-cat,.ba-doc-amount{display:none;}
  .ba-filter-pills{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px;}
  .ba-title{font-size:1.5rem;}
}
