/* ── Drop-зона ─────────────────────────────────────────────── */

.file-drop-zone {
    border: 2px dashed #ced4da;
    border-radius: 8px;
    background: #fafafa;
    min-height: 100px;
    transition: border-color .15s, background .15s;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.file-drop-zone:hover,
.file-drop-zone--over {
    border-color: #0d6efd;
    background: #f0f5ff;
}
.file-drop-zone--over {
    border-style: solid;
}

/* Idle */
.file-drop-idle {
    display: flex;
    align-items: stretch;
    justify-content: center;
    min-height: 100px;
}
.file-drop-idle-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 22px 16px;
    cursor: pointer;
    width: 100%;
    margin: 0;
    text-align: center;
}
.file-drop-icon {
    font-size: 2rem;
    color: #6c757d;
    line-height: 1;
}
.file-drop-label {
    font-size: .9rem;
    color: #495057;
    font-weight: 500;
}
.file-drop-hint {
    font-size: .78rem;
    color: #888;
}

/* Loading */
.file-drop-loading {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 22px 16px;
    gap: 8px;
    min-height: 100px;
}
.file-drop-zone[data-state="idle"]    .file-drop-idle    { display: flex; }
.file-drop-zone[data-state="idle"]    .file-drop-loading { display: none !important; }
.file-drop-zone[data-state="loading"] .file-drop-idle    { display: none; }
.file-drop-zone[data-state="loading"] .file-drop-loading { display: flex !important; }

/* Circular ring */
.file-drop-ring {
    width: 60px;
    height: 60px;
    transform: rotate(-90deg);
    display: block;
}
.file-drop-ring-bg   { stroke: #dee2e6; }
.file-drop-ring-fill { stroke: #0d6efd; transition: stroke-dashoffset .12s linear; }

.file-drop-pct {
    font-size: 1rem;
    font-weight: 700;
    color: #0d6efd;
    margin-top: -4px;
}
.file-drop-status {
    font-size: .78rem;
    color: #888;
}

/* Result / preview */
.file-drop-result {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.file-drop-preview-img {
    max-width: 200px;
    max-height: 120px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    display: block;
}
.file-drop-result-info {
    font-size: .85rem;
}
.file-drop-filename {
    word-break: break-all;
}

/* Error border */
.file-drop-zone.is-invalid {
    border-color: #dc3545;
}


/* ── Inline-форма (form-inline) ────────────────────────────── */

.form-inline .form-file {
    width: auto;
}

/* Зона дропа: высота = form-control */
.form-inline .form-file .file-drop-zone {
    min-height: unset;
    height: calc(1.5em + .75rem + 2px);
    border-radius: 4px;
}

/* Обёртка idle — тоже по высоте */
.form-inline .form-file .file-drop-idle {
    min-height: unset;
    height: 100%;
}

/* Внутренности в строку, без отступов */
.form-inline .form-file .file-drop-idle-inner {
    flex-direction: row;
    gap: 6px;
    padding: 0 .6rem;
    white-space: nowrap;
}

/* Иконка чуть меньше */
.form-inline .form-file .file-drop-icon {
    font-size: .95rem;
}

/* Скрыть оригинальный текст, показать короткий через ::after */
.form-inline .form-file .file-drop-label {
    font-size: 0;
    white-space: nowrap;
}
.form-inline .form-file .file-drop-label::after {
    content: 'Выберите файл';
    font-size: .875rem;
    font-weight: 500;
    color: #495057;
}

/* Скрыть подсказку о максимальном размере */
.form-inline .form-file .file-drop-hint {
    display: none;
}

/* Состояние загрузки — компактное */
.form-inline .form-file .file-drop-loading {
    flex-direction: row;
    padding: 0 .6rem;
    gap: 6px;
    min-height: unset;
    height: 100%;
}
.form-inline .form-file .file-drop-ring {
    width: 18px;
    height: 18px;
}
.form-inline .form-file .file-drop-pct {
    font-size: .75rem;
    margin-top: 0;
}
.form-inline .form-file .file-drop-status {
    font-size: .75rem;
}