/* Modern file picker (file_drop() in app/bootstrap.php, assets/js/file-drop.js). Panel and public site. */
.fdrop { --fd-accent: var(--m-teal, #1a8696); --fd-ink: var(--m-navy, #0f172a); --fd-muted: var(--m-muted, #64748b);
  display: grid; gap: 6px; min-width: 0; }
.fdrop-cap { display: block !important; color: var(--fd-ink); font-size: 13.5px; font-weight: 600; }
.fdrop-box { position: relative; display: flex; align-items: center; border: 2px dashed #c3d6e6; border-radius: 16px;
  background: linear-gradient(180deg, #fbfdff, #f2f7fb); transition: border-color .2s, background .2s, box-shadow .2s, transform .2s; }
.fdrop-zone { position: relative; display: flex !important; flex: 1; align-items: center; gap: 14px; min-width: 0; margin: 0 !important;
  padding: 16px 18px; color: var(--fd-ink); font-weight: 400; cursor: pointer; }
.fdrop-input { position: absolute !important; inset: 0; z-index: 1; width: 100% !important; height: 100% !important; min-height: 0 !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important; opacity: 0; cursor: pointer; font-size: 0; }
.fdrop-input::file-selector-button { cursor: pointer; }
.fdrop-ic { position: relative; display: grid; place-items: center; flex: 0 0 auto; width: 48px; height: 48px; overflow: hidden;
  border-radius: 13px; background: #fff; color: var(--fd-accent); box-shadow: 0 6px 16px -8px rgba(13,42,71,.4), inset 0 0 0 1px #e3edf6; }
.fdrop-ic .ic { width: 22px; height: 22px; }
.fdrop-ic-file, .fdrop.has-file .fdrop-ic-up { display: none; }
.fdrop.has-file .fdrop-ic-file { display: grid; }
.fdrop-thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fdrop-text { display: grid; gap: 2px; flex: 1; min-width: 0; }
.fdrop-text strong { color: var(--fd-ink); font-size: 14.5px; font-weight: 700; line-height: 1.35; overflow-wrap: anywhere; }
.fdrop.has-file .fdrop-text strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fdrop-text small { color: var(--fd-muted); font-size: 12.5px; font-weight: 400; line-height: 1.4; }
.fdrop-text small:empty { display: none; }
.fdrop-btn { flex: 0 0 auto; padding: 9px 16px; border: 1px solid #12355b; border-radius: 999px; background: linear-gradient(180deg, #1f4f7e, #12355b);
  color: #fff; font-size: 13.5px; font-weight: 700; line-height: 1.2; box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 6px 14px -10px rgba(13,42,71,.8); transition: transform .15s; }
.fdrop-clear { position: relative; z-index: 2; display: grid; place-items: center; flex: 0 0 auto; width: 36px; height: 36px; margin-right: 12px; padding: 0;
  border: 1px solid #e3e9f1; border-radius: 50%; background: #fff; color: #64748b; cursor: pointer; transition: background .15s, color .15s; }
.fdrop-clear[hidden] { display: none; }
.fdrop-clear .ic { width: 16px; height: 16px; }
.fdrop-clear:hover { border-color: #f3c4c4; background: #fff1f1; color: #c81e1e; }
.fdrop-err { margin: 0; color: #c81e1e; font-size: 13px; font-weight: 600; }
.fdrop-err[hidden] { display: none; }

.fdrop-box:hover, .fdrop.is-drag .fdrop-box { border-color: var(--fd-accent); background: #eef8fa; }
.fdrop-box:hover .fdrop-btn { transform: translateY(-1px); }
.fdrop.is-drag .fdrop-box { border-style: solid; box-shadow: 0 0 0 5px rgba(26,134,150,.12); transform: scale(1.01); }
.fdrop-box:focus-within { border-color: var(--fd-accent); box-shadow: 0 0 0 4px rgba(26,134,150,.2); }
.fdrop.has-file .fdrop-box { border-style: solid; border-color: #8fd0b1; background: linear-gradient(180deg, #f6fcf9, #ecf8f2); }
.fdrop.has-file .fdrop-ic { color: #15803d; }
.fdrop.has-file .fdrop-btn { border-color: #d5dfeb; background: linear-gradient(180deg, #fff, #f3f6fa); color: var(--fd-ink); box-shadow: inset 0 1px 0 #fff, 0 4px 10px -8px rgba(13,42,71,.5); }
.fdrop.is-invalid .fdrop-box { border-color: #e9a3a3; background: #fff6f6; }
.fdrop.is-invalid .fdrop-ic { color: #c81e1e; }

@media (max-width: 560px) {
  .fdrop-zone { flex-wrap: wrap; gap: 12px; padding: 14px; }
  .fdrop-text { flex-basis: calc(100% - 62px); }
  .fdrop-btn { width: 100%; text-align: center; }
  .fdrop.has-file .fdrop-zone { padding-right: 4px; }
  .fdrop-clear { align-self: flex-start; margin: 14px 12px 0 0; }
}
@media (prefers-reduced-motion: reduce) { .fdrop-box, .fdrop-btn { transition: none; } .fdrop.is-drag .fdrop-box { transform: none; } }
/* Public forms style every «label span» in gray; the picker keeps its own colors. */
.m-form .fdrop-zone > span { font-size: inherit; }
.m-form .fdrop .fdrop-btn { color: #fff; font-size: 13.5px; font-weight: 700; }
.m-form .fdrop.has-file .fdrop-btn { color: var(--fd-ink); }
.m-form .fdrop .fdrop-ic { color: var(--fd-accent); }
.m-form .fdrop.has-file .fdrop-ic { color: #15803d; }
.m-form .fdrop.is-invalid .fdrop-ic { color: #c81e1e; }
.m-form .fdrop .fdrop-text { color: var(--fd-ink); font-weight: 400; }