@layer t2.module {
/* Path: T2Editor/js/utils/upload-container.css */
/* Default look for the shared upload container (js/utils/upload-container.js).
   Plugins may add their own variantClass on top of this for extra tweaks, but no
   plugin needs to redeclare the dropzone/border/drag-over rules anymore. */

.t2-upload-container {
    position: relative;
    margin-bottom: var(--t2-s5);



    text-align: center;
    cursor: pointer;
    transition: border-color .2s, background-color .2s;
}

/* .t2-upload-container:hover 가 이 그룹에 잘못 섞여 있었다. 그 결과 드롭존에
   마우스를 올리면 컨테이너 자신의 font-size 가 48px, margin-bottom 이 12px 로
   튀었다. 아이콘 치수를 컨테이너에 적용한 것이므로 그룹에서 분리한다.
   hover 상태는 아래쪽 규칙 하나가 단독으로 소유한다. */
.t2-upload-container .material-icons {
    margin-bottom: var(--t2-s3);
    font-size: 48px;
    color: var(--t2-ink-faint);
}

.t2-upload-container__text {
    font-size: 14px;
    font-weight: 600;
    color: var(--t2-product-ink);
}

.t2-upload-container__hint {
    margin-top: var(--t2-s1);
}

.t2-upload-container__input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.t2-upload-container--busy {
    cursor: not-allowed;
    opacity: .6;
}

.t2-upload-container--busy .t2-upload-container__input {
    cursor: not-allowed;
    pointer-events: none;
}

html[data-t2editor-theme="dark"] .t2-upload-container:hover,
html[data-t2editor-theme="dark"] .t2-upload-container.drag-over {

    background-color: rgba(53, 111, 192, .11);
}

html[data-t2editor-theme="dark"] .t2-upload-container .material-icons { color: var(--t2-line-strong); }
html[data-t2editor-theme="dark"] .t2-upload-container__text { color: var(--t2-inset); }
html[data-t2editor-theme="dark"] .t2-upload-container__hint { color: var(--t2-line-strong); }

/* ========================================================================
   T2Editor Law-Aligned Design System — 2026-08 / upload module
   ======================================================================== */
.t2-upload-container {
  min-height: 148px;
  transition: border-color .14s ease, background-color .14s ease;
}
.t2-upload-container:hover,
.t2-upload-container:focus-within,
.t2-upload-container.drag-over { color:var(--t2-ink,var(--t2-ink)); background:rgba(53,111,192,.06); border-color:var(--t2-editor,var(--t2-product)); }
.t2-upload-container:focus-within { box-shadow: none; }
html[data-t2editor-theme="dark"] .t2-upload-container { color:var(--t2-ink-soft); background:var(--t2-paper-soft); border-color:var(--t2-line-strong); }
html[data-t2editor-theme="dark"] .t2-upload-container:hover,
html[data-t2editor-theme="dark"] .t2-upload-container:focus-within,
html[data-t2editor-theme="dark"] .t2-upload-container.drag-over { color:var(--t2-ink); background:rgba(127,168,255,.12); border-color:var(--t2-editor); }
html[data-t2editor-theme="dark"] .t2-upload-progress .t2-progress-bar { background:var(--t2-line); }
html[data-t2editor-theme="dark"] .t2-upload-progress .t2-progress-fill { background:var(--t2-ink); }

/* T2Editor /law 706 — upload native-control and root overflow containment */
.t2-upload-container {
  max-width: 100%;
  overflow-x: hidden;
}
.t2-upload-container :where(button, input, textarea, select):focus-visible {
  outline: 1px solid var(--t2-editor, var(--t2-product));
  outline-offset: 2px;
  box-shadow: none;
}

}