/* E.C.A. Studio — AUDIO-A2 — Administration des ambiances sonores */

#eca-admin-ambiances{
  --eca-aa-copper:#c96a42;
  --eca-aa-copper-dark:#a94f2d;
  --eca-aa-ink:#29241f;
  --eca-aa-muted:#766f66;
  --eca-aa-line:#e7ddcf;
  --eca-aa-panel:#fffdf9;
  --eca-aa-soft:#f6efe3;
  --eca-aa-green:#45775d;
  --eca-aa-red:#a6493f;
  --eca-aa-amber:#9a6a19;
  z-index:2147483000;
  background:rgba(243,235,219,.97);
}

#eca-admin-ambiances .eca-aa-head{
  min-height:68px;
  align-items:center;
  gap:12px;
}

#eca-admin-ambiances .eca-aa-head h2{
  margin:2px 0 0;
}

.eca-aa-kicker{
  display:block;
  color:var(--eca-aa-copper);
  font-size:10px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}

#eca-admin-ambiances .eca-aa-body{
  width:min(980px,100%);
  margin:0 auto;
  padding:18px 18px 92px;
  overflow-y:auto;
  overscroll-behavior:contain;
}

.eca-aa-message{
  position:sticky;
  top:68px;
  z-index:4;
  width:min(944px,calc(100% - 36px));
  margin:8px auto 0;
  padding:12px 14px;
  border:1px solid #d9cdbb;
  border-radius:12px;
  background:#fffdf8;
  color:var(--eca-aa-ink);
  box-shadow:0 8px 24px rgba(61,50,38,.10);
  font-size:13px;
  line-height:1.45;
}

.eca-aa-message.ok{
  border-color:#b7d5c3;
  background:#f1faf4;
  color:#315f48;
}

.eca-aa-message.err{
  border-color:#e5b9b4;
  background:#fff3f1;
  color:#8d3f36;
}

.eca-aa-loading,
.eca-aa-empty{
  padding:36px 20px;
  border:1px dashed var(--eca-aa-line);
  border-radius:16px;
  background:rgba(255,255,255,.65);
  color:var(--eca-aa-muted);
  text-align:center;
}

.eca-aa-empty.error{color:var(--eca-aa-red);}

.eca-aa-summary{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-bottom:14px;
}

.eca-aa-summary>div{
  min-height:82px;
  padding:14px;
  border:1px solid var(--eca-aa-line);
  border-radius:16px;
  background:rgba(255,253,249,.92);
  box-shadow:0 7px 22px rgba(66,53,41,.05);
}

.eca-aa-summary strong{
  display:block;
  color:var(--eca-aa-copper-dark);
  font-size:24px;
  line-height:1;
}

.eca-aa-summary span{
  display:block;
  margin-top:8px;
  color:var(--eca-aa-muted);
  font-size:11px;
  line-height:1.3;
}

.eca-aa-bulk,
.eca-aa-panel{
  border:1px solid var(--eca-aa-line);
  border-radius:18px;
  background:var(--eca-aa-panel);
  box-shadow:0 10px 28px rgba(66,53,41,.06);
}

.eca-aa-bulk{
  padding:16px;
  margin-bottom:14px;
}

.eca-aa-section-head{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
  margin-bottom:12px;
}

.eca-aa-section-head h3,
.eca-aa-panel h4{
  margin:0;
  color:var(--eca-aa-ink);
  font-size:15px;
}

.eca-aa-section-head p,
.eca-aa-panel p{
  margin:5px 0 0;
  color:var(--eca-aa-muted);
  font-size:12px;
  line-height:1.45;
}

.eca-aa-bulk input[type=file],
.eca-aa-upload-one input[type=file]{
  width:100%;
  padding:10px;
  border:1px solid var(--eca-aa-line);
  border-radius:12px;
  background:#fff;
  color:var(--eca-aa-ink);
}

.eca-aa-bulk-preview{
  margin-top:10px;
  padding:11px 12px;
  border:1px dashed #d9cbbb;
  border-radius:12px;
  background:#fbf7f0;
  color:var(--eca-aa-muted);
  font-size:12px;
  line-height:1.45;
}

.eca-aa-bulk-preview ul{
  max-height:180px;
  overflow:auto;
  margin:8px 0 0;
  padding-left:20px;
}

.eca-aa-match{margin:5px 0;}
.eca-aa-match.ok{color:var(--eca-aa-green);}
.eca-aa-match.warn{color:var(--eca-aa-amber);}
.eca-aa-match.neutral{color:var(--eca-aa-muted);}

.eca-aa-actions,
.eca-aa-editor-actions{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:flex-end;
}

.eca-aa-actions{margin-top:12px;}

.eca-aa-btn{
  min-height:42px;
  padding:10px 16px;
  border:1px solid transparent;
  border-radius:12px;
  cursor:pointer;
  font:inherit;
  font-size:12px;
  font-weight:800;
  transition:transform .16s ease,opacity .16s ease,box-shadow .16s ease;
}

.eca-aa-btn:hover{transform:translateY(-1px);}
.eca-aa-btn:disabled{cursor:not-allowed;opacity:.5;transform:none;}
.eca-aa-btn.primary{background:var(--eca-aa-copper);color:#fff;box-shadow:0 7px 16px rgba(201,106,66,.20);}
.eca-aa-btn.primary:hover{background:var(--eca-aa-copper-dark);}
.eca-aa-btn.ghost{border-color:var(--eca-aa-line);background:#fff;color:var(--eca-aa-ink);}
.eca-aa-btn.full{width:100%;margin-top:10px;}

.eca-aa-progress{
  position:relative;
  height:32px;
  margin-top:12px;
  overflow:hidden;
  border:1px solid var(--eca-aa-line);
  border-radius:999px;
  background:#f3ede4;
}

.eca-aa-progress>div{
  position:absolute;
  inset:0 auto 0 0;
  width:0;
  background:linear-gradient(90deg,#d98a65,var(--eca-aa-copper));
  transition:width .2s ease;
}

.eca-aa-progress span{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:center;
  height:100%;
  color:#3f342d;
  font-size:11px;
  font-weight:800;
}

.eca-aa-toolbar{
  display:flex;
  align-items:center;
  gap:12px;
  margin:14px 0 10px;
}

.eca-aa-toolbar input{
  flex:1;
  min-width:0;
  padding:12px 14px;
  border:1px solid var(--eca-aa-line);
  border-radius:12px;
  background:#fff;
  color:var(--eca-aa-ink);
}

.eca-aa-toolbar span{color:var(--eca-aa-muted);font-size:11px;white-space:nowrap;}

.eca-aa-list{display:grid;gap:8px;}

.eca-aa-card{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto 20px;
  gap:10px;
  align-items:center;
  width:100%;
  padding:11px 12px;
  border:1px solid var(--eca-aa-line);
  border-radius:15px;
  background:rgba(255,255,255,.96);
  color:var(--eca-aa-ink);
  text-align:left;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(66,53,41,.04);
}

.eca-aa-card:hover{border-color:#d4b49f;box-shadow:0 10px 22px rgba(66,53,41,.08);}

.eca-aa-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:12px;
  background:var(--eca-aa-soft);
  font-size:20px;
}

.eca-aa-icon.large{width:50px;height:50px;font-size:25px;}

.eca-aa-card-main{min-width:0;}
.eca-aa-card-main strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;}
.eca-aa-card-main small{display:block;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--eca-aa-muted);font-size:10px;}
.eca-aa-card-status{display:flex;gap:5px;align-items:center;justify-content:flex-end;flex-wrap:wrap;}
.eca-aa-chevron{color:var(--eca-aa-copper);font-size:22px;}

.eca-aa-badge{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:3px 8px;
  border-radius:999px;
  font-size:9px;
  font-weight:800;
  white-space:nowrap;
}

.eca-aa-badge.neutral{background:#eee9e1;color:#6d665e;}
.eca-aa-badge.missing{background:#fbe5e2;color:#98483f;}
.eca-aa-badge.review{background:#fff0cf;color:#84601d;}
.eca-aa-badge.replace{background:#f7dcd8;color:#9a443b;}
.eca-aa-badge.valid{background:#dff1e5;color:#356448;}
.eca-aa-badge.onboarding{background:#e6e1f5;color:#5d4b87;}
.eca-aa-badge.active{background:#e5f2e9;color:#3e6d50;}

.eca-aa-editor-actions{margin-bottom:12px;}
.eca-aa-editor-actions.bottom{margin:14px 0 0;}
.eca-aa-editor-title{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.eca-aa-editor-title h3{margin:0;color:var(--eca-aa-ink);font-size:20px;}
.eca-aa-editor-title p{margin:3px 0 0;color:var(--eca-aa-muted);font-size:11px;}

.eca-aa-editor-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:14px;
}

.eca-aa-panel{padding:16px;}
.eca-aa-panel h4{margin-bottom:12px;}
.eca-aa-panel h5{margin:0 0 5px;font-size:13px;color:var(--eca-aa-ink);}
.eca-aa-panel>label,
.eca-aa-two label{
  display:block;
  margin-top:11px;
  color:#584f47;
  font-size:11px;
  font-weight:700;
}

.eca-aa-panel input:not([type=checkbox]):not([type=range]):not([type=file]),
.eca-aa-panel select,
.eca-aa-panel textarea{
  width:100%;
  margin-top:5px;
  padding:10px 11px;
  border:1px solid var(--eca-aa-line);
  border-radius:11px;
  background:#fff;
  color:var(--eca-aa-ink);
  font:inherit;
  font-size:12px;
}

.eca-aa-panel textarea{resize:vertical;}
.eca-aa-two{display:grid;grid-template-columns:1fr 1fr;gap:10px;}

.eca-aa-switches{display:grid;gap:8px;margin-top:14px;}
.eca-aa-switch{display:flex!important;align-items:flex-start;gap:9px;margin:0!important;padding:10px;border:1px solid var(--eca-aa-line);border-radius:11px;background:#fbf8f2;cursor:pointer;}
.eca-aa-switch input{margin-top:1px;accent-color:var(--eca-aa-copper);}
.eca-aa-switch span{font-size:11px;line-height:1.35;}

.eca-aa-current-file dl{display:grid;gap:7px;margin:0 0 10px;}
.eca-aa-current-file dl>div{display:grid;grid-template-columns:78px minmax(0,1fr);gap:8px;padding:7px 9px;border-radius:9px;background:#f8f3eb;}
.eca-aa-current-file dt{color:var(--eca-aa-muted);font-size:10px;}
.eca-aa-current-file dd{min-width:0;margin:0;overflow-wrap:anywhere;color:var(--eca-aa-ink);font-size:10px;font-weight:700;}
.eca-aa-current-file audio,
#eca-aa-local-audio{width:100%;margin-top:8px;}
.eca-aa-empty-audio,
.eca-aa-special{padding:16px;border:1px dashed #d6c9b8;border-radius:12px;background:#fbf7ef;color:var(--eca-aa-muted);font-size:12px;line-height:1.45;}
.eca-aa-special{color:#5e5a54;}

.eca-aa-upload-one{margin-top:14px;padding-top:14px;border-top:1px solid var(--eca-aa-line);}
#eca-aa-local-preview{margin-top:10px;padding:10px;border:1px solid var(--eca-aa-line);border-radius:11px;background:#faf7f1;}
#eca-aa-local-preview span{display:block;margin-top:6px;color:var(--eca-aa-muted);font-size:10px;}

.eca-aa-volume{margin-top:16px;padding-top:14px;border-top:1px solid var(--eca-aa-line);}
.eca-aa-volume label{display:flex;justify-content:space-between;gap:10px;color:#584f47;font-size:11px;font-weight:800;}
.eca-aa-volume input{width:100%;margin-top:10px;accent-color:var(--eca-aa-copper);}

@media (max-width:760px){
  #eca-admin-ambiances .eca-aa-body{padding:12px 10px 88px;}
  .eca-aa-message{width:calc(100% - 20px);top:64px;}
  .eca-aa-summary{grid-template-columns:1fr 1fr;}
  .eca-aa-summary>div{min-height:70px;padding:12px;}
  .eca-aa-section-head{display:block;}
  .eca-aa-section-head .eca-aa-badge{margin-top:8px;}
  .eca-aa-actions{display:grid;grid-template-columns:1fr 1fr;}
  .eca-aa-btn{width:100%;}
  .eca-aa-card{grid-template-columns:38px minmax(0,1fr) 18px;}
  .eca-aa-card-status{grid-column:2/4;justify-content:flex-start;}
  .eca-aa-editor-grid{grid-template-columns:1fr;}
  .eca-aa-two{grid-template-columns:1fr;}
  .eca-aa-editor-actions{position:sticky;top:0;z-index:3;padding:7px 0;background:rgba(243,235,219,.96);}
  .eca-aa-editor-actions.bottom{position:static;}
}

@media (max-width:430px){
  .eca-aa-summary{gap:7px;}
  .eca-aa-summary strong{font-size:20px;}
  .eca-aa-bulk,.eca-aa-panel{padding:13px;border-radius:15px;}
  .eca-aa-toolbar{align-items:stretch;flex-direction:column;gap:6px;}
  .eca-aa-toolbar span{text-align:right;}
  .eca-aa-actions,.eca-aa-editor-actions{grid-template-columns:1fr 1fr;display:grid;}
  .eca-aa-editor-title h3{font-size:17px;}
}

.eca-aa-pending{
  margin-top:14px;
  padding:13px;
  border:1px solid #d9c8ec;
  border-radius:13px;
  background:#f7f1fd;
}

.eca-aa-pending h5{color:#5e487f;}
.eca-aa-pending audio{width:100%;margin-top:9px;}
.eca-aa-pending small{display:block;margin-top:6px;color:#76658b;overflow-wrap:anywhere;}
.eca-aa-pending .eca-aa-actions{justify-content:flex-start;flex-wrap:wrap;}
.eca-aa-badge.pending{background:#eee5f9;color:#674d87;}
