/* =========================================================
   UBICACIÓN:
   frontend/src/pages/drive/drive.css
   PARTE 1 DE 2
   ========================================================= */

/* =========================================================
   BASE
   ========================================================= */

.drive-page,
.drive-page *,
.drive-modal,
.drive-modal *,
.drive-drop-zone,
.drive-drop-zone * {
  box-sizing: border-box;
}

.drive-page {
  --drive-bg:
    #0b0b0c;

  --drive-surface:
    #111112;

  --drive-surface-strong:
    #151516;

  --drive-surface-soft:
    #1a1a1b;

  --drive-surface-hover:
    #1f1f20;

  --drive-border:
    #383839;

  --drive-border-strong:
    #4e4e4f;

  --drive-border-soft:
    #29292a;

  --drive-text:
    #edf5f8;

  --drive-text-soft:
    #a5b5c0;

  --drive-text-muted:
    #7a7a7b;

  --drive-cyan:
    #e8e8ec;

  --drive-cyan-soft:
    rgba(
      232, 232, 236,
      0.12
    );

  --drive-cyan-border:
    rgba(
      232, 232, 236,
      0.42
    );

  --drive-green:
    #62b87e;

  --drive-green-soft:
    rgba(
      98, 184, 126,
      0.1
    );

  --drive-yellow:
    #d4a646;

  --drive-yellow-soft:
    rgba(
      212, 166, 70,
      0.11
    );

  --drive-red:
    #de5650;

  --drive-red-soft:
    rgba(
      222, 86, 80,
      0.11
    );

  position:
    relative;

  display:
    flex;

  flex-direction:
    column;

  gap:
    14px;

  width:
    100%;

  min-width:
    0;

  min-height:
    100%;

  padding:
    18px;

  overflow:
    hidden;

  color:
    var(
      --drive-text
    );

  font-family:
    "DM Sans",
    Inter,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  background:
    var(
      --drive-bg
    );

  isolation:
    isolate;
}

.drive-page[hidden],
.drive-page [hidden],
.drive-modal[hidden],
.drive-upload-progress[hidden],
.drive-selection-bar[hidden],
.drive-download-progress[hidden],
.drive-loading[hidden],
.drive-empty[hidden],
.drive-content[hidden],
.drive-user-picker[hidden],
.drive-upload-selection[hidden],
.drive-move__loading[hidden] {
  display:
    none !important;
}

.drive-page button,
.drive-page input,
.drive-page select,
.drive-page textarea {
  font:
    inherit;
}

.drive-page button,
.drive-page select,
.drive-page input[type="checkbox"],
.drive-page input[type="radio"] {
  cursor:
    pointer;
}

.drive-page button:disabled,
.drive-page select:disabled,
.drive-page input:disabled {
  cursor:
    not-allowed;

  opacity:
    0.55;
}

.drive-page__ambient {
  position:
    absolute;

  z-index:
    -1;

  pointer-events:
    none;

  border:
    1px solid
    rgba(
      232, 232, 236,
      0.07
    );

  border-radius:
    50%;
}

.drive-page__ambient--primary {
  top:
    -210px;

  right:
    8%;

  width:
    520px;

  height:
    520px;
}

.drive-page__ambient--secondary {
  bottom:
    -260px;

  left:
    -140px;

  width:
    430px;

  height:
    430px;

  border-color:
    rgba(
      212, 166, 70,
      0.06
    );
}

/* =========================================================
   BOTONES
   ========================================================= */

.drive-page .button {
  position:
    relative;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    9px;

  min-height:
    40px;

  padding:
    0 16px;

  overflow:
    hidden;

  color:
    var(
      --drive-text
    );

  font-size:
    13px;

  font-weight:
    750;

  line-height:
    1;

  white-space:
    nowrap;

  border:
    1px solid
    var(
      --drive-border-strong
    );

  border-radius: 0;

  background:
    var(
      --drive-surface-strong
    );

  transition:
    border-color 160ms ease,
    background-color 160ms ease,
    color 160ms ease,
    transform 160ms ease;
}

.drive-page .button:hover:not(:disabled) {
  border-color:
    #676768;

  background:
    var(
      --drive-surface-hover
    );
}

.drive-page .button:active:not(:disabled) {
  transform:
    translateY(
      1px
    );
}

.drive-page .button svg {
  width:
    17px;

  height:
    17px;

  flex:
    0 0 auto;
}

.drive-page .button--primary {
  color:
    #0d0d0e;

  border-color:
    var(
      --drive-cyan
    );

  background:
    var(
      --drive-cyan
    );
}

.drive-page .button--primary:hover:not(:disabled) {
  color:
    #0d0d0e;

  border-color:
    #e8e8ec;

  background:
    #e8e8ec;
}

.drive-page .button--secondary {
  background:
    #141415;
}

.drive-page .button--ghost {
  min-height:
    34px;

  padding:
    0 12px;

  color:
    var(
      --drive-text-soft
    );

  border-color:
    transparent;

  background:
    transparent;
}

.drive-page .button--ghost:hover:not(:disabled) {
  color:
    var(
      --drive-text
    );

  border-color:
    var(
      --drive-border
    );

  background:
    var(
      --drive-surface-hover
    );
}

.drive-page .button--danger {
  color:
    #fff;

  border-color:
    var(
      --drive-red
    );

  background:
    #de5650;
}

.drive-page .button--danger:hover:not(:disabled) {
  border-color:
    #de5650;

  background:
    #de5650;
}

.button__scanline {
  position:
    absolute;

  inset:
    0;

  pointer-events:
    none;

  background:
    linear-gradient(
      110deg,
      transparent 0%,
      transparent 42%,
      rgba(
        255,
        255,
        255,
        0.18
      ) 49%,
      transparent 56%,
      transparent 100%
    );

  transform:
    translateX(
      -120%
    );

  transition:
    transform 460ms ease;
}

.button:hover
.button__scanline {
  transform:
    translateX(
      120%
    );
}

.drive-page .icon-button {
  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    34px;

  min-width:
    34px;

  height:
    34px;

  padding:
    0;

  color:
    var(
      --drive-text-soft
    );

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    #131314;

  transition:
    color 150ms ease,
    border-color 150ms ease,
    background-color 150ms ease;
}

.drive-page .icon-button:hover:not(:disabled) {
  color:
    var(
      --drive-text
    );

  border-color:
    #686869;

  background:
    var(
      --drive-surface-hover
    );
}

.drive-page .icon-button svg {
  width:
    16px;

  height:
    16px;
}

/* =========================================================
   ENCABEZADO COMPACTO
   ========================================================= */

.drive-command {
  position:
    relative;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    20px;

  width:
    100%;

  min-width:
    0;

  padding:
    16px 18px;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    rgba(
      18, 18, 19,
      0.95
    );
}

.drive-command--compact {
  min-height:
    82px;
}

.drive-command__identity {
  display:
    flex;

  align-items:
    center;

  gap:
    13px;

  min-width:
    0;
}

.drive-command__icon {
  position:
    relative;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    42px;

  min-width:
    42px;

  height:
    42px;

  color:
    var(
      --drive-cyan
    );

  border:
    1px solid
    var(
      --drive-cyan-border
    );

  border-radius: 0;

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-command__icon svg {
  width:
    20px;

  height:
    20px;
}

.drive-command__icon span {
  position:
    absolute;

  right:
    -3px;

  bottom:
    -3px;

  width:
    7px;

  height:
    7px;

  border:
    2px solid
    var(
      --drive-surface
    );

  border-radius:
    50%;

  background:
    var(
      --drive-green
    );
}

.drive-command__copy {
  display:
    flex;

  flex-direction:
    column;

  min-width:
    0;
}

.drive-command__eyebrow,
.drive-navigation__eyebrow,
.drive-panel__eyebrow,
.drive-modal__eyebrow,
.drive-section-header span,
.drive-upload-selection__header > div > span {
  color:
    var(
      --drive-cyan
    );

  font-family:
    "JetBrains Mono",
    "Fira Code",
    monospace;

  font-size:
    9px;

  font-weight:
    800;

  letter-spacing:
    0.11em;

  text-transform:
    uppercase;
}

.drive-command__copy h2 {
  margin:
    2px 0 1px;

  overflow:
    hidden;

  color:
    var(
      --drive-text
    );

  font-size:
    20px;

  font-weight:
    820;

  line-height:
    1.15;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-command__copy p {
  margin:
    0;

  overflow:
    hidden;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    12px;

  line-height:
    1.4;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-command__actions {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  gap:
    9px;

  flex:
    0 0 auto;
}

.drive-command__status {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    7px;

  min-height:
    32px;

  padding:
    0 11px;

  color:
    var(
      --drive-green
    );

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    9px;

  font-weight:
    800;

  letter-spacing:
    0.08em;

  text-transform:
    uppercase;

  border:
    1px solid
    rgba(
      98, 184, 126,
      0.3
    );

  border-radius: 0;

  background:
    var(
      --drive-green-soft
    );
}

.drive-command__status > span {
  width:
    5px;

  height:
    5px;

  border-radius:
    50%;

  background:
    var(
      --drive-green
    );

  animation:
    drive-status-pulse 1.8s ease-in-out infinite;
}

/* =========================================================
   RESUMEN COMPACTO
   ========================================================= */

.drive-summary {
  display:
    grid;

  grid-template-columns:
    minmax(
      0,
      1.35fr
    )
    minmax(
      180px,
      0.75fr
    )
    minmax(
      190px,
      0.85fr
    );

  gap:
    10px;
}

.drive-summary-card {
  position:
    relative;

  display:
    flex;

  align-items:
    center;

  gap:
    11px;

  min-width:
    0;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    var(
      --drive-surface
    );
}

.drive-summary-card--compact {
  min-height:
    66px;

  padding:
    10px 13px;
}

.drive-summary-card__index,
.drive-summary-card__line {
  display:
    none;
}

.drive-summary-card__icon {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    36px;

  min-width:
    36px;

  height:
    36px;

  color:
    var(
      --drive-yellow
    );

  border:
    1px solid
    rgba(
      212, 166, 70,
      0.36
    );

  border-radius: 0;

  background:
    var(
      --drive-yellow-soft
    );
}

.drive-summary-card__icon--files {
  color:
    var(
      --drive-cyan
    );

  border-color:
    var(
      --drive-cyan-border
    );

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-summary-card__icon--storage {
  color:
    #91a7ff;

  border-color:
    rgba(
      145,
      167,
      255,
      0.36
    );

  background:
    rgba(
      145,
      167,
      255,
      0.09
    );
}

.drive-summary-card__icon svg {
  width:
    17px;

  height:
    17px;
}

.drive-summary-card__copy {
  display:
    flex;

  flex-direction:
    column;

  min-width:
    0;
}

.drive-summary-card__copy span {
  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;

  font-weight:
    700;
}

.drive-summary-card__copy strong {
  margin-top:
    2px;

  overflow:
    hidden;

  color:
    var(
      --drive-text
    );

  font-size:
    18px;

  font-weight:
    820;

  line-height:
    1.05;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-summary-card__copy small {
  display:
    none;
}

/* =========================================================
   NAVEGACIÓN COMPACTA
   ========================================================= */

.drive-navigation {
  width:
    100%;

  min-width:
    0;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    var(
      --drive-surface
    );
}

.drive-navigation--compact {
  padding:
    9px 11px;
}

.drive-navigation__header {
  display:
    none;
}

.drive-navigation__toolbar {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    15px;

  min-width:
    0;
}

.drive-breadcrumb {
  display:
    flex;

  align-items:
    center;

  gap:
    4px;

  min-width:
    0;

  overflow-x:
    auto;

  scrollbar-width:
    thin;
}

.drive-breadcrumb__item {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    7px;

  min-height:
    34px;

  max-width:
    240px;

  padding:
    0 10px;

  color:
    var(
      --drive-text-soft
    );

  font-size:
    12px;

  font-weight:
    700;

  border:
    1px solid
    transparent;

  border-radius: 0;

  background:
    transparent;

  transition:
    color 150ms ease,
    border-color 150ms ease,
    background-color 150ms ease;
}

.drive-breadcrumb__item:hover,
.drive-breadcrumb__item.is-drop-target {
  color:
    var(
      --drive-text
    );

  border-color:
    var(
      --drive-cyan-border
    );

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-breadcrumb__item svg {
  width:
    15px;

  height:
    15px;

  flex:
    0 0 auto;
}

.drive-breadcrumb__item span {
  overflow:
    hidden;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-breadcrumb__separator {
  width:
    14px;

  min-width:
    14px;

  height:
    14px;

  color:
    var(
      --drive-text-muted
    );
}

.drive-order {
  display:
    flex;

  align-items:
    center;

  gap:
    8px;

  flex:
    0 0 auto;
}

.drive-order > span {
  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;

  font-weight:
    750;

  text-transform:
    uppercase;
}

.drive-order__control {
  position:
    relative;

  display:
    flex;

  align-items:
    center;
}

.drive-order__control > svg {
  position:
    absolute;

  left:
    10px;

  z-index:
    1;

  width:
    14px;

  height:
    14px;

  color:
    var(
      --drive-text-muted
    );

  pointer-events:
    none;
}

.drive-order select {
  min-width:
    175px;

  height:
    36px;

  padding:
    0 32px 0 31px;

  color:
    var(
      --drive-text-soft
    );

  font-size:
    11px;

  font-weight:
    700;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  outline:
    none;

  background:
    var(
      --drive-surface-strong
    );
}

.drive-order select:focus {
  color:
    var(
      --drive-text
    );

  border-color:
    var(
      --drive-cyan-border
    );
}

/* =========================================================
   PROGRESO DE CARGA
   ========================================================= */

.drive-upload-progress {
  position:
    relative;

  width:
    100%;

  padding:
    13px 15px;

  overflow:
    hidden;

  border:
    1px solid
    var(
      --drive-cyan-border
    );

  border-radius: 0;

  background:
    linear-gradient(
      90deg,
      rgba(
        232, 232, 236,
        0.08
      ),
      var(
        --drive-surface
      )
    );
}

.drive-upload-progress__header {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    15px;
}

.drive-upload-progress__identity {
  display:
    flex;

  align-items:
    center;

  gap:
    10px;

  min-width:
    0;
}

.drive-upload-progress__icon {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    34px;

  min-width:
    34px;

  height:
    34px;

  color:
    var(
      --drive-cyan
    );

  border:
    1px solid
    var(
      --drive-cyan-border
    );

  border-radius: 0;

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-upload-progress__icon svg {
  width:
    17px;

  height:
    17px;
}

.drive-upload-progress__identity > div:last-child {
  display:
    flex;

  flex-direction:
    column;

  min-width:
    0;
}

.drive-upload-progress__identity strong {
  color:
    var(
      --drive-text
    );

  font-size:
    12px;

  font-weight:
    800;
}

.drive-upload-progress__identity span {
  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;
}

.drive-upload-progress__status {
  display:
    flex;

  align-items:
    flex-end;

  flex-direction:
    column;

  flex:
    0 0 auto;
}

.drive-upload-progress__status strong {
  color:
    var(
      --drive-cyan
    );

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    17px;

  line-height:
    1;
}

.drive-upload-progress__status span {
  margin-top:
    3px;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    9px;

  font-weight:
    750;

  text-transform:
    uppercase;
}

.drive-upload-progress__track {
  position:
    relative;

  width:
    100%;

  height:
    6px;

  margin-top:
    11px;

  overflow:
    hidden;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    #070708;
}

.drive-upload-progress__bar {
  position:
    absolute;

  inset:
    0 auto 0 0;

  width:
    0;

  border-radius: 0;

  background:
    var(
      --drive-cyan
    );

  transition:
    width 220ms ease;
}

.drive-upload-progress.is-uploading
.drive-upload-progress__bar,
.drive-upload-progress.is-processing
.drive-upload-progress__bar {
  background:
    linear-gradient(
      90deg,
      var(
        --drive-cyan
      ),
      #e8e8ec,
      var(
        --drive-cyan
      )
    );

  background-size:
    200% 100%;

  animation:
    drive-progress-flow 1s linear infinite;
}

.drive-upload-progress.is-completed {
  border-color:
    rgba(
      98, 184, 126,
      0.42
    );

  background:
    linear-gradient(
      90deg,
      var(
        --drive-green-soft
      ),
      var(
        --drive-surface
      )
    );
}

.drive-upload-progress.is-completed
.drive-upload-progress__bar {
  background:
    var(
      --drive-green
    );
}

.drive-upload-progress.has-error {
  border-color:
    rgba(
      222, 86, 80,
      0.46
    );

  background:
    linear-gradient(
      90deg,
      var(
        --drive-red-soft
      ),
      var(
        --drive-surface
      )
    );
}

.drive-upload-progress.has-error
.drive-upload-progress__bar {
  background:
    var(
      --drive-red
    );
}

.drive-upload-progress__footer {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    12px;

  margin-top:
    8px;
}

.drive-upload-progress__footer > span {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    6px;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    9px;
}

.drive-upload-progress__footer svg {
  width:
    13px;

  height:
    13px;
}

.drive-upload-progress__footer strong {
  color:
    var(
      --drive-text-soft
    );

  font-weight:
    700;
}

/* =========================================================
   BARRA DE SELECCIÓN
   ========================================================= */

.drive-selection-bar {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    16px;

  width:
    100%;

  min-height:
    58px;

  padding:
    10px 13px;

  border:
    1px solid
    var(
      --drive-cyan-border
    );

  border-radius: 0;

  background:
    linear-gradient(
      90deg,
      rgba(
        232, 232, 236,
        0.1
      ),
      var(
        --drive-surface
      )
    );
}

.drive-selection-bar__identity {
  display:
    flex;

  align-items:
    center;

  gap:
    10px;

  min-width:
    0;
}

.drive-selection-bar__icon {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    34px;

  min-width:
    34px;

  height:
    34px;

  color:
    var(
      --drive-cyan
    );

  border:
    1px solid
    var(
      --drive-cyan-border
    );

  border-radius: 0;

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-selection-bar__icon svg {
  width:
    17px;

  height:
    17px;
}

.drive-selection-bar__copy {
  display:
    flex;

  flex-direction:
    column;

  min-width:
    0;
}

.drive-selection-bar__copy strong {
  color:
    var(
      --drive-text
    );

  font-size:
    12px;

  font-weight:
    800;
}

.drive-selection-bar__copy span {
  overflow:
    hidden;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-selection-bar__actions {
  display:
    flex;

  align-items:
    center;

  gap:
    8px;

  flex:
    0 0 auto;
}

/* =========================================================
   PROGRESO DE DESCARGA
   ========================================================= */

.drive-download-progress {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    15px;

  min-height:
    52px;

  padding:
    10px 13px;

  border:
    1px solid
    var(
      --drive-border-strong
    );

  border-radius: 0;

  background:
    var(
      --drive-surface
    );
}

.drive-download-progress__identity {
  display:
    flex;

  align-items:
    center;

  gap:
    10px;
}

.drive-download-progress__identity > div {
  display:
    flex;

  flex-direction:
    column;
}

.drive-download-progress__identity strong {
  color:
    var(
      --drive-text
    );

  font-size:
    12px;
}

.drive-download-progress__identity span {
  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;
}

.drive-download-progress > strong {
  color:
    var(
      --drive-cyan
    );

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    9px;

  letter-spacing:
    0.09em;
}

.drive-download-progress.is-completed {
  border-color:
    rgba(
      98, 184, 126,
      0.38
    );
}

.drive-download-progress.is-completed > strong {
  color:
    var(
      --drive-green
    );
}

.drive-download-progress.has-error {
  border-color:
    rgba(
      222, 86, 80,
      0.44
    );
}

.drive-download-progress.has-error > strong {
  color:
    var(
      --drive-red
    );
}

/* =========================================================
   PANEL PRINCIPAL
   ========================================================= */

.drive-panel {
  display:
    flex;

  flex-direction:
    column;

  width:
    100%;

  min-width:
    0;

  overflow:
    hidden;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    var(
      --drive-surface
    );
}

.drive-panel__header {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    16px;

  border-bottom:
    1px solid
    var(
      --drive-border
    );
}

.drive-panel__header--compact {
  min-height:
    58px;

  padding:
    10px 14px;
}

.drive-panel__header h3 {
  margin:
    2px 0 0;

  color:
    var(
      --drive-text
    );

  font-size:
    15px;

  font-weight:
    820;
}

.drive-panel__legend {
  display:
    flex;

  align-items:
    center;

  gap:
    13px;

  color:
    var(
      --drive-text-muted
    );

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    8px;

  font-weight:
    700;

  text-transform:
    uppercase;
}

.drive-panel__legend span {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    5px;
}

.drive-panel__legend svg {
  width:
    12px;

  height:
    12px;
}

.drive-panel__footer {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    14px;

  min-height:
    38px;

  padding:
    8px 14px;

  border-top:
    1px solid
    var(
      --drive-border
    );

  background:
    #0d0d0e;
}

.drive-panel__footer-info {
  display:
    flex;

  align-items:
    center;

  gap:
    7px;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    9px;
}

.drive-panel__footer-info > span {
  width:
    6px;

  height:
    6px;

  border-radius:
    50%;

  background:
    var(
      --drive-cyan
    );
}

.drive-panel__footer-info strong {
  font-weight:
    650;
}

.drive-panel__footer-code {
  color:
    #575758;

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    0.07em;
}

/* =========================================================
   LOADING Y VACÍO
   ========================================================= */

.drive-loading {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    13px;

  min-height:
    260px;

  padding:
    30px;
}

.drive-loading > div {
  display:
    flex;

  flex-direction:
    column;
}

.drive-loading strong {
  color:
    var(
      --drive-text
    );

  font-size:
    13px;
}

.drive-loading span:not(.drive-spinner) {
  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;
}

.drive-spinner {
  display:
    inline-block;

  width:
    25px;

  min-width:
    25px;

  height:
    25px;

  border:
    2px solid
    rgba(
      232, 232, 236,
      0.2
    );

  border-top-color:
    var(
      --drive-cyan
    );

  border-radius:
    50%;

  animation:
    drive-spinner-rotate 700ms linear infinite;
}

.drive-spinner--small {
  width:
    16px;

  min-width:
    16px;

  height:
    16px;

  border-width:
    2px;
}

.drive-empty {
  display:
    flex;

  align-items:
    center;

  flex-direction:
    column;

  justify-content:
    center;

  min-height:
    330px;

  padding:
    42px 20px;

  text-align:
    center;
}

.drive-empty__icon {
  position:
    relative;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    60px;

  height:
    60px;

  color:
    var(
      --drive-yellow
    );

  border:
    1px solid
    rgba(
      212, 166, 70,
      0.34
    );

  border-radius: 0;

  background:
    var(
      --drive-yellow-soft
    );
}

.drive-empty__icon svg {
  width:
    26px;

  height:
    26px;
}

.drive-empty__icon span {
  position:
    absolute;

  right:
    -3px;

  bottom:
    -3px;

  width:
    9px;

  height:
    9px;

  border:
    2px solid
    var(
      --drive-surface
    );

  border-radius:
    50%;

  background:
    var(
      --drive-cyan
    );
}

.drive-empty__code {
  margin-top:
    14px;

  color:
    var(
      --drive-cyan
    );

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    8px;

  font-weight:
    800;

  letter-spacing:
    0.1em;
}

.drive-empty h2 {
  margin:
    7px 0 5px;

  color:
    var(
      --drive-text
    );

  font-size:
    20px;

  font-weight:
    820;
}

.drive-empty p {
  max-width:
    470px;

  margin:
    0;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    12px;

  line-height:
    1.55;
}

.drive-empty__actions {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    9px;

  margin-top:
    18px;
}

/* =========================================================
   TABLA Y CABECERA
   ========================================================= */

.drive-content {
  width:
    100%;

  min-width:
    0;
}

.drive-table-wrap {
  width:
    100%;

  min-width:
    0;

  overflow-x:
    auto;
}

.drive-table-head,
.drive-item {
  display:
    grid;

  grid-template-columns:
    44px
    minmax(
      260px,
      1.8fr
    )
    minmax(
      110px,
      0.7fr
    )
    minmax(
      85px,
      0.55fr
    )
    minmax(
      145px,
      0.8fr
    )
    minmax(
      130px,
      0.75fr
    )
    minmax(
      210px,
      auto
    );

  align-items:
    center;

  min-width:
    1040px;
}

.drive-table-head {
  min-height:
    38px;

  padding:
    0 10px;

  color:
    var(
      --drive-text-muted
    );

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    8px;

  font-weight:
    800;

  letter-spacing:
    0.08em;

  text-transform:
    uppercase;

  border-bottom:
    1px solid
    var(
      --drive-border
    );

  background:
    #0e0e0f;
}

.drive-table-head > span {
  min-width:
    0;

  padding:
    0 8px;
}

.drive-table-head__selection {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  padding:
    0 !important;
}

/* =========================================================
   CHECKBOX
   ========================================================= */

.drive-checkbox {
  position:
    relative;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    28px;

  height:
    28px;
}

.drive-checkbox input {
  position:
    absolute;

  width:
    1px;

  height:
    1px;

  opacity:
    0;

  pointer-events:
    none;
}

.drive-checkbox__control {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    17px;

  height:
    17px;

  color:
    transparent;

  border:
    1px solid
    #565657;

  border-radius: 0;

  background:
    #0e0e0f;

  transition:
    color 140ms ease,
    border-color 140ms ease,
    background-color 140ms ease;
}

.drive-checkbox__control svg {
  width:
    12px;

  height:
    12px;

  stroke-width:
    3;
}

.drive-checkbox:hover
.drive-checkbox__control {
  border-color:
    var(
      --drive-cyan-border
    );
}

.drive-checkbox input:checked +
.drive-checkbox__control,
.drive-checkbox input:indeterminate +
.drive-checkbox__control {
  color:
    #0d0d0e;

  border-color:
    var(
      --drive-cyan
    );

  background:
    var(
      --drive-cyan
    );
}

.drive-checkbox input:indeterminate +
.drive-checkbox__control svg {
  display:
    none;
}

.drive-checkbox input:indeterminate +
.drive-checkbox__control::before {
  width:
    8px;

  height:
    2px;

  content:
    "";

  border-radius: 0;

  background:
    #0d0d0e;
}

/* =========================================================
   FILAS
   ========================================================= */

.drive-list {
  width:
    100%;
}

.drive-item {
  position:
    relative;

  min-height:
    65px;

  padding:
    0 10px;

  border-bottom:
    1px solid
    var(
      --drive-border-soft
    );

  background:
    rgba(
      12, 12, 13,
      0.56
    );

  transition:
    background-color 150ms ease,
    border-color 150ms ease;
}

.drive-item:last-child {
  border-bottom:
    0;
}

.drive-item:hover {
  background:
    #151516;
}

.drive-item.is-selected {
  background:
    rgba(
      232, 232, 236,
      0.075
    );
}

.drive-item.is-selected::before {
  position:
    absolute;

  inset:
    7px auto 7px 0;

  width:
    2px;

  content:
    "";

  background:
    var(
      --drive-cyan
    );
}

.drive-item.is-dragging {
  opacity:
    0.42;
}

.drive-item__selection {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;
}

.drive-item__main {
  display:
    flex;

  align-items:
    center;

  gap:
    10px;

  min-width:
    0;

  width:
    100%;

  min-height:
    64px;

  padding:
    5px 8px;

  color:
    inherit;

  text-align:
    left;

  border:
    0;

  border-radius: 0;

  background:
    transparent;
}

.drive-item__main:hover {
  background:
    rgba(
      255,
      255,
      255,
      0.018
    );
}

.drive-item__main.is-drop-target {
  outline:
    1px solid
    var(
      --drive-cyan-border
    );

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-item__drag-handle {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    15px;

  min-width:
    15px;

  color:
    #5e5e5f;
}

.drive-item__drag-handle svg {
  width:
    14px;

  height:
    14px;
}

.drive-item__icon,
.drive-item__preview {
  position:
    relative;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    38px;

  min-width:
    38px;

  height:
    38px;

  overflow:
    hidden;

  color:
    var(
      --drive-text-soft
    );

  border:
    1px solid
    var(
      --drive-border-strong
    );

  border-radius: 0;

  background:
    var(
      --drive-surface-strong
    );
}

.drive-item__icon svg {
  width:
    18px;

  height:
    18px;
}

.drive-item__icon--carpeta {
  color:
    var(
      --drive-yellow
    );

  border-color:
    rgba(
      212, 166, 70,
      0.42
    );

  background:
    var(
      --drive-yellow-soft
    );
}

.drive-item__icon--pdf {
  color:
    #de5650;

  border-color:
    rgba(
      222, 86, 80,
      0.35
    );

  background:
    rgba(
      222, 86, 80,
      0.08
    );
}

.drive-item__icon--imagen {
  color:
    var(
      --drive-cyan
    );

  border-color:
    var(
      --drive-cyan-border
    );

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-item__icon--video {
  color:
    #d792ff;

  border-color:
    rgba(
      215,
      146,
      255,
      0.36
    );

  background:
    rgba(
      215,
      146,
      255,
      0.08
    );
}

.drive-item__icon--planilla {
  color:
    var(
      --drive-green
    );

  border-color:
    rgba(
      98, 184, 126,
      0.36
    );

  background:
    var(
      --drive-green-soft
    );
}

.drive-item__icon--documento,
.drive-item__icon--texto {
  color:
    #91a7ff;

  border-color:
    rgba(
      145,
      167,
      255,
      0.36
    );

  background:
    rgba(
      145,
      167,
      255,
      0.08
    );
}

.drive-item__icon--comprimido {
  color:
    #e8e8ec;

  border-color:
    rgba(
      232, 232, 236,
      0.36
    );

  background:
    rgba(
      232, 232, 236,
      0.08
    );
}

.drive-item__preview-image {
  width:
    100%;

  height:
    100%;

  object-fit:
    cover;

  opacity:
    0;

  transition:
    opacity 180ms ease;
}

.drive-item__preview.is-loaded
.drive-item__preview-image {
  opacity:
    1;
}

.drive-item__preview-loading {
  position:
    absolute;

  inset:
    0;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  color:
    var(
      --drive-cyan
    );
}

.drive-item__preview-loading svg {
  width:
    17px;

  height:
    17px;
}

.drive-item__preview.is-loaded
.drive-item__preview-loading {
  display:
    none;
}

.drive-item__preview.has-error
.drive-item__preview-loading {
  color:
    var(
      --drive-text-muted
    );
}

.drive-item__name {
  display:
    flex;

  flex-direction:
    column;

  min-width:
    0;
}

.drive-item__name strong {
  overflow:
    hidden;

  color:
    var(
      --drive-text
    );

  font-size:
    12px;

  font-weight:
    750;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-item__name small {
  margin-top:
    2px;

  color:
    var(
      --drive-text-muted
    );

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    0.05em;

  text-transform:
    uppercase;
}

.drive-item__visibility,
.drive-item__size,
.drive-item__date,
.drive-item__user {
  min-width:
    0;

  padding:
    0 8px;

  overflow:
    hidden;

  color:
    var(
      --drive-text-soft
    );

  font-size:
    10px;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-item__actions {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  gap:
    5px;

  min-width:
    0;

  padding:
    0 4px 0 8px;
}

.drive-item__delete {
  color:
    var(
      --drive-red
    ) !important;

  border-color:
    rgba(
      222, 86, 80,
      0.3
    ) !important;
}

.drive-item__delete:hover:not(:disabled) {
  border-color:
    rgba(
      222, 86, 80,
      0.58
    ) !important;

  background:
    var(
      --drive-red-soft
    ) !important;
}

/* =========================================================
   BADGES DE VISIBILIDAD
   ========================================================= */

.drive-visibility-badge {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    5px;

  min-height:
    25px;

  max-width:
    100%;

  padding:
    0 8px;

  overflow:
    hidden;

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    8px;

  font-weight:
    800;

  text-overflow:
    ellipsis;

  text-transform:
    uppercase;

  white-space:
    nowrap;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;
}

.drive-visibility-badge svg {
  width:
    12px;

  height:
    12px;

  flex:
    0 0 auto;
}

.drive-visibility-badge--all {
  color:
    var(
      --drive-green
    );

  border-color:
    rgba(
      98, 184, 126,
      0.31
    );

  background:
    var(
      --drive-green-soft
    );
}

.drive-visibility-badge--private {
  color:
    #d4a646;

  border-color:
    rgba(
      212, 166, 70,
      0.33
    );

  background:
    rgba(
      212, 166, 70,
      0.08
    );
}

.drive-visibility-badge--shared {
  color:
    var(
      --drive-cyan
    );

  border-color:
    var(
      --drive-cyan-border
    );

  background:
    var(
      --drive-cyan-soft
    );
}

/* =========================================================
   DROP ZONE
   ========================================================= */

.drive-drop-zone {
  position:
    fixed;

  inset:
    0;

  z-index:
    9990;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  padding:
    24px;

  visibility:
    hidden;

  opacity:
    0;

  pointer-events:
    none;

  background:
    rgba(
      7, 7, 9,
      0.9
    );

  transition:
    opacity 160ms ease,
    visibility 160ms ease;
}

.drive-drop-zone.is-active {
  visibility:
    visible;

  opacity:
    1;

  pointer-events:
    auto;
}

.drive-drop-zone__grid {
  position:
    absolute;

  inset:
    18px;

  border:
    1px dashed
    var(
      --drive-cyan-border
    );

  border-radius: 0;

  background-image:
    linear-gradient(
      rgba(
        232, 232, 236,
        0.04
      ) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(
        232, 232, 236,
        0.04
      ) 1px,
      transparent 1px
    );

  background-size:
    30px 30px;
}

.drive-drop-zone__content {
  position:
    relative;

  z-index:
    1;

  display:
    flex;

  align-items:
    center;

  flex-direction:
    column;

  max-width:
    480px;

  text-align:
    center;
}

.drive-drop-zone__icon {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    72px;

  height:
    72px;

  color:
    var(
      --drive-cyan
    );

  border:
    1px solid
    var(
      --drive-cyan-border
    );

  border-radius: 0;

  background:
    var(
      --drive-cyan-soft
    );

  animation:
    drive-drop-float 1.7s ease-in-out infinite;
}

.drive-drop-zone__icon svg {
  width:
    31px;

  height:
    31px;
}

.drive-drop-zone__eyebrow {
  margin-top:
    18px;

  color:
    var(
      --drive-cyan
    );

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    9px;

  font-weight:
    800;

  letter-spacing:
    0.12em;
}

.drive-drop-zone h2 {
  margin:
    8px 0 4px;

  color:
    var(
      --drive-text
    );

  font-size:
    27px;
}

.drive-drop-zone p {
  margin:
    0;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    13px;
}

/* =========================================================
   ANIMACIONES
   ========================================================= */

@keyframes drive-spinner-rotate {
  to {
    transform:
      rotate(
        360deg
      );
  }
}

@keyframes drive-progress-flow {
  from {
    background-position:
      200% 0;
  }

  to {
    background-position:
      0 0;
  }
}

@keyframes drive-status-pulse {
  0%,
  100% {
    opacity:
      0.42;
  }

  50% {
    opacity:
      1;
  }
}

@keyframes drive-drop-float {
  0%,
  100% {
    transform:
      translateY(
        0
      );
  }

  50% {
    transform:
      translateY(
        -7px
      );
  }
}/* =========================================================
   CONTINUACIÓN:
   frontend/src/pages/drive/drive.css
   PARTE 2 DE 2
   ========================================================= */

/* =========================================================
   MODALES
   ========================================================= */

body.has-drive-modal {
  overflow:
    hidden;
}

.drive-modal {
  position:
    fixed;

  inset:
    0;

  z-index:
    10000;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  padding:
    24px;
}

.drive-modal__backdrop {
  position:
    absolute;

  inset:
    0;

  width:
    100%;

  height:
    100%;

  padding:
    0;

  border:
    0;

  background:
    rgba(
      5, 5, 6,
      0.84
    );

  backdrop-filter: none;
}

.drive-modal__dialog {
  position:
    relative;

  z-index:
    1;

  display:
    flex;

  flex-direction:
    column;

  width:
    min(
      620px,
      100%
    );

  max-height:
    calc(
      100vh - 48px
    );

  overflow:
    hidden;

  color:
    var(
      --drive-text
    );

  border:
    1px solid
    var(
      --drive-border-strong
    );

  border-radius: 0;

  background:
    var(
      --drive-surface
    );

  box-shadow:
    0 26px 80px
    rgba(
      0,
      0,
      0,
      0.42
    );
}

.drive-modal__dialog--large {
  width:
    min(
      820px,
      100%
    );
}

.drive-modal__dialog--small {
  width:
    min(
      500px,
      100%
    );
}

.drive-modal__corner {
  position:
    absolute;

  z-index:
    2;

  width:
    18px;

  height:
    18px;

  pointer-events:
    none;
}

.drive-modal__corner--top {
  top:
    -1px;

  left:
    -1px;

  border-top:
    2px solid
    var(
      --drive-cyan
    );

  border-left:
    2px solid
    var(
      --drive-cyan
    );

  border-radius: 0;
}

.drive-modal__corner--bottom {
  right:
    -1px;

  bottom:
    -1px;

  border-right:
    2px solid
    var(
      --drive-cyan
    );

  border-bottom:
    2px solid
    var(
      --drive-cyan
    );

  border-radius: 0;
}

.drive-modal--danger
.drive-modal__corner--top {
  border-color:
    var(
      --drive-red
    );
}

.drive-modal--danger
.drive-modal__corner--bottom {
  border-color:
    var(
      --drive-red
    );
}

.drive-modal__header {
  display:
    flex;

  align-items:
    flex-start;

  justify-content:
    space-between;

  gap:
    18px;

  padding:
    18px;

  border-bottom:
    1px solid
    var(
      --drive-border
    );

  background:
    #0f0f10;
}

.drive-modal__heading {
  display:
    flex;

  align-items:
    flex-start;

  gap:
    12px;

  min-width:
    0;
}

.drive-modal__heading-icon {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    38px;

  min-width:
    38px;

  height:
    38px;

  color:
    var(
      --drive-cyan
    );

  border:
    1px solid
    var(
      --drive-cyan-border
    );

  border-radius: 0;

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-modal__heading-icon--danger {
  color:
    var(
      --drive-red
    );

  border-color:
    rgba(
      222, 86, 80,
      0.42
    );

  background:
    var(
      --drive-red-soft
    );
}

.drive-modal__heading-icon svg {
  width:
    18px;

  height:
    18px;
}

.drive-modal__heading > div:last-child {
  min-width:
    0;
}

.drive-modal__heading h2 {
  margin:
    3px 0 3px;

  overflow:
    hidden;

  color:
    var(
      --drive-text
    );

  font-size:
    18px;

  font-weight:
    820;

  line-height:
    1.2;

  text-overflow:
    ellipsis;
}

.drive-modal__heading p {
  margin:
    0;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    11px;

  line-height:
    1.45;
}

.drive-modal__eyebrow--danger {
  color:
    var(
      --drive-red
    );
}

.drive-modal__form,
.drive-modal__body {
  min-height:
    0;

  padding:
    18px;

  overflow-y:
    auto;

  scrollbar-color:
    var(
      --drive-border-strong
    )
    transparent;

  scrollbar-width:
    thin;
}

.drive-modal__form {
  display:
    flex;

  flex-direction:
    column;

  gap:
    17px;
}

.drive-modal__body {
  display:
    flex;

  flex-direction:
    column;

  gap:
    14px;
}

.drive-modal__footer {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  gap:
    9px;

  margin-top:
    2px;

  padding-top:
    15px;

  border-top:
    1px solid
    var(
      --drive-border-soft
    );
}

.drive-modal__footer--external {
  margin:
    0;

  padding:
    14px 18px;

  border-top:
    1px solid
    var(
      --drive-border
    );

  background:
    #0f0f10;
}

.drive-modal.is-busy
.drive-modal__form,
.drive-modal.is-busy
.drive-modal__body {
  pointer-events:
    none;
}

/* =========================================================
   CAMPOS DE FORMULARIO
   ========================================================= */

.form-field {
  display:
    flex;

  flex-direction:
    column;

  gap:
    7px;
}

.form-field > label {
  color:
    var(
      --drive-text-soft
    );

  font-size:
    11px;

  font-weight:
    750;
}

.form-control {
  position:
    relative;

  display:
    flex;

  align-items:
    center;

  min-height:
    42px;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    #0f0f10;

  transition:
    border-color 150ms ease,
    background-color 150ms ease;
}

.form-control:focus-within {
  border-color:
    var(
      --drive-cyan-border
    );

  background:
    #141415;
}

.form-control > svg {
  position:
    absolute;

  left:
    12px;

  width:
    16px;

  height:
    16px;

  color:
    var(
      --drive-text-muted
    );

  pointer-events:
    none;
}

.form-control input {
  width:
    100%;

  min-width:
    0;

  height:
    40px;

  padding:
    0 74px 0 39px;

  color:
    var(
      --drive-text
    );

  font-size:
    12px;

  border:
    0;

  outline:
    none;

  background:
    transparent;
}

.form-control input::placeholder {
  color:
    #6b6b6c;
}

.drive-field-code {
  position:
    absolute;

  right:
    11px;

  color:
    #626263;

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    8px;

  font-weight:
    800;

  letter-spacing:
    0.08em;

  pointer-events:
    none;
}

.drive-form-error {
  min-height:
    18px;

  color:
    var(
      --drive-red
    );

  font-size:
    11px;

  font-weight:
    650;

  line-height:
    1.45;
}

.drive-password-toggle {
  position:
    absolute;

  right:
    7px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    30px;

  height:
    30px;

  padding:
    0;

  color:
    var(
      --drive-text-muted
    );

  border:
    0;

  border-radius: 0;

  background:
    transparent;
}

.drive-password-toggle:hover {
  color:
    var(
      --drive-text
    );

  background:
    var(
      --drive-surface-hover
    );
}

.drive-password-toggle svg {
  width:
    15px;

  height:
    15px;
}

/* =========================================================
   FUENTES DE CARGA
   ========================================================= */

.drive-upload-source-grid {
  display:
    grid;

  grid-template-columns:
    repeat(
      2,
      minmax(
        0,
        1fr
      )
    );

  gap:
    10px;
}

.drive-upload-source {
  display:
    grid;

  grid-template-columns:
    38px
    minmax(
      0,
      1fr
    )
    16px;

  align-items:
    center;

  gap:
    11px;

  min-height:
    74px;

  padding:
    12px;

  color:
    var(
      --drive-text
    );

  text-align:
    left;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    #0f0f10;

  transition:
    border-color 150ms ease,
    background-color 150ms ease,
    transform 150ms ease;
}

.drive-upload-source:hover:not(:disabled) {
  border-color:
    var(
      --drive-cyan-border
    );

  background:
    var(
      --drive-cyan-soft
    );

  transform:
    translateY(
      -1px
    );
}

.drive-upload-source__icon {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    38px;

  height:
    38px;

  color:
    var(
      --drive-cyan
    );

  border:
    1px solid
    var(
      --drive-cyan-border
    );

  border-radius: 0;

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-upload-source__icon svg {
  width:
    18px;

  height:
    18px;
}

.drive-upload-source__copy {
  display:
    flex;

  flex-direction:
    column;

  min-width:
    0;
}

.drive-upload-source__copy strong {
  color:
    var(
      --drive-text
    );

  font-size:
    12px;

  font-weight:
    790;
}

.drive-upload-source__copy small {
  margin-top:
    2px;

  overflow:
    hidden;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-upload-source > svg {
  width:
    15px;

  height:
    15px;

  color:
    var(
      --drive-text-muted
    );
}

/* =========================================================
   SELECCIÓN DE ARCHIVOS A SUBIR
   ========================================================= */

.drive-upload-selection {
  overflow:
    hidden;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    #0f0f10;
}

.drive-upload-selection__header {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    14px;

  min-height:
    58px;

  padding:
    10px 12px;

  border-bottom:
    1px solid
    var(
      --drive-border
    );
}

.drive-upload-selection__header > div {
  display:
    flex;

  flex-direction:
    column;

  min-width:
    0;
}

.drive-upload-selection__header strong {
  margin-top:
    2px;

  color:
    var(
      --drive-text
    );

  font-size:
    12px;

  font-weight:
    790;
}

.drive-upload-selection__header small {
  margin-top:
    2px;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;
}

.drive-upload-selection__list {
  max-height:
    250px;

  overflow-y:
    auto;

  scrollbar-color:
    var(
      --drive-border-strong
    )
    transparent;

  scrollbar-width:
    thin;
}

.drive-upload-file {
  display:
    grid;

  grid-template-columns:
    32px
    minmax(
      0,
      1fr
    )
    auto;

  align-items:
    center;

  gap:
    9px;

  min-height:
    49px;

  padding:
    7px 11px;

  border-bottom:
    1px solid
    var(
      --drive-border-soft
    );
}

.drive-upload-file:last-child {
  border-bottom:
    0;
}

.drive-upload-file__icon {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    30px;

  height:
    30px;

  color:
    var(
      --drive-cyan
    );

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    var(
      --drive-surface-strong
    );
}

.drive-upload-file__icon svg {
  width:
    15px;

  height:
    15px;
}

.drive-upload-file__copy {
  display:
    flex;

  flex-direction:
    column;

  min-width:
    0;
}

.drive-upload-file__copy strong {
  overflow:
    hidden;

  color:
    var(
      --drive-text-soft
    );

  font-size:
    11px;

  font-weight:
    720;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-upload-file__copy small {
  margin-top:
    2px;

  overflow:
    hidden;

  color:
    var(
      --drive-text-muted
    );

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    8px;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-upload-file__size {
  color:
    var(
      --drive-text-muted
    );

  font-size:
    9px;

  white-space:
    nowrap;
}

.drive-upload-selection__remaining {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    7px;

  min-height:
    38px;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    9px;

  border-top:
    1px solid
    var(
      --drive-border-soft
    );

  background:
    #0d0d0e;
}

.drive-upload-selection__remaining svg {
  width:
    13px;

  height:
    13px;
}

/* =========================================================
   SECCIÓN DE VISIBILIDAD
   ========================================================= */

.drive-visibility-section {
  display:
    flex;

  flex-direction:
    column;

  gap:
    11px;
}

.drive-section-header {
  display:
    flex;

  align-items:
    flex-start;

  justify-content:
    space-between;

  gap:
    14px;
}

.drive-section-header h3 {
  margin:
    2px 0 2px;

  color:
    var(
      --drive-text
    );

  font-size:
    14px;

  font-weight:
    800;
}

.drive-section-header p {
  margin:
    0;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;

  line-height:
    1.45;
}

.drive-visibility-options {
  display:
    grid;

  grid-template-columns:
    repeat(
      3,
      minmax(
        0,
        1fr
      )
    );

  gap:
    8px;
}

.drive-visibility-option {
  position:
    relative;

  display:
    grid;

  grid-template-columns:
    32px
    minmax(
      0,
      1fr
    )
    18px;

  align-items:
    center;

  gap:
    8px;

  min-height:
    76px;

  padding:
    10px;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    #0f0f10;

  transition:
    border-color 150ms ease,
    background-color 150ms ease;
}

.drive-visibility-option:hover {
  border-color:
    var(
      --drive-border-strong
    );

  background:
    #141415;
}

.drive-visibility-option:has(input:checked) {
  border-color:
    var(
      --drive-cyan-border
    );

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-visibility-option > input {
  position:
    absolute;

  width:
    1px;

  height:
    1px;

  opacity:
    0;
}

.drive-visibility-option__indicator {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    32px;

  height:
    32px;

  color:
    var(
      --drive-text-muted
    );

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    var(
      --drive-surface-strong
    );
}

.drive-visibility-option:has(input:checked)
.drive-visibility-option__indicator {
  color:
    var(
      --drive-cyan
    );

  border-color:
    var(
      --drive-cyan-border
    );

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-visibility-option__indicator svg {
  width:
    15px;

  height:
    15px;
}

.drive-visibility-option__copy {
  display:
    flex;

  flex-direction:
    column;

  min-width:
    0;
}

.drive-visibility-option__copy strong {
  color:
    var(
      --drive-text-soft
    );

  font-size:
    11px;

  font-weight:
    760;
}

.drive-visibility-option__copy small {
  margin-top:
    2px;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    9px;

  line-height:
    1.35;
}

.drive-visibility-option__check {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    17px;

  height:
    17px;

  color:
    transparent;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius:
    50%;

  background:
    #0d0d0e;
}

.drive-visibility-option:has(input:checked)
.drive-visibility-option__check {
  color:
    #0d0d0e;

  border-color:
    var(
      --drive-cyan
    );

  background:
    var(
      --drive-cyan
    );
}

.drive-visibility-option__check svg {
  width:
    11px;

  height:
    11px;

  stroke-width:
    3;
}

/* =========================================================
   SELECTOR DE USUARIOS
   ========================================================= */

.drive-user-picker {
  overflow:
    hidden;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    #0f0f10;
}

.drive-user-picker__search {
  position:
    relative;

  display:
    flex;

  align-items:
    center;

  height:
    42px;

  border-bottom:
    1px solid
    var(
      --drive-border
    );
}

.drive-user-picker__search > svg {
  position:
    absolute;

  left:
    12px;

  width:
    15px;

  height:
    15px;

  color:
    var(
      --drive-text-muted
    );

  pointer-events:
    none;
}

.drive-user-picker__search input {
  width:
    100%;

  height:
    40px;

  padding:
    0 12px 0 37px;

  color:
    var(
      --drive-text
    );

  font-size:
    11px;

  border:
    0;

  outline:
    none;

  background:
    transparent;
}

.drive-user-picker__search input::placeholder {
  color:
    #6b6b6c;
}

.drive-user-picker__loading {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    9px;

  min-height:
    110px;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;
}

.drive-user-picker__list {
  max-height:
    220px;

  overflow-y:
    auto;

  scrollbar-color:
    var(
      --drive-border-strong
    )
    transparent;

  scrollbar-width:
    thin;
}

.drive-user-option {
  position:
    relative;

  display:
    grid;

  grid-template-columns:
    33px
    minmax(
      0,
      1fr
    )
    18px;

  align-items:
    center;

  gap:
    9px;

  min-height:
    51px;

  padding:
    7px 11px;

  border-bottom:
    1px solid
    var(
      --drive-border-soft
    );

  background:
    transparent;

  transition:
    background-color 140ms ease;
}

.drive-user-option:last-child {
  border-bottom:
    0;
}

.drive-user-option:hover {
  background:
    var(
      --drive-surface-hover
    );
}

.drive-user-option:has(input:checked) {
  background:
    rgba(
      232, 232, 236,
      0.06
    );
}

.drive-user-option > input {
  position:
    absolute;

  width:
    1px;

  height:
    1px;

  opacity:
    0;
}

.drive-user-option__avatar {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    32px;

  height:
    32px;

  color:
    var(
      --drive-cyan
    );

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    9px;

  font-weight:
    800;

  border:
    1px solid
    var(
      --drive-cyan-border
    );

  border-radius: 0;

  background:
    var(
      --drive-cyan-soft
    );
}

.drive-user-option__copy {
  display:
    flex;

  flex-direction:
    column;

  min-width:
    0;
}

.drive-user-option__copy strong {
  overflow:
    hidden;

  color:
    var(
      --drive-text-soft
    );

  font-size:
    11px;

  font-weight:
    730;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-user-option__copy small {
  margin-top:
    2px;

  overflow:
    hidden;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    9px;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-user-option__check {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    17px;

  height:
    17px;

  color:
    transparent;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    #0d0d0e;
}

.drive-user-option:has(input:checked)
.drive-user-option__check {
  color:
    #0d0d0e;

  border-color:
    var(
      --drive-cyan
    );

  background:
    var(
      --drive-cyan
    );
}

.drive-user-option__check svg {
  width:
    11px;

  height:
    11px;

  stroke-width:
    3;
}

.drive-user-picker__footer {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  min-height:
    35px;

  padding:
    7px 11px;

  color:
    var(
      --drive-text-muted
    );

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    8px;

  font-weight:
    700;

  border-top:
    1px solid
    var(
      --drive-border
    );

  background:
    #0d0d0e;
}

.drive-user-picker__empty {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  flex-direction:
    column;

  gap:
    7px;

  min-height:
    120px;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;
}

.drive-user-picker__empty svg {
  width:
    21px;

  height:
    21px;
}

/* =========================================================
   MODAL MOVER
   ========================================================= */

.drive-move__search {
  position:
    relative;

  display:
    flex;

  align-items:
    center;

  min-height:
    42px;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    #0f0f10;
}

.drive-move__search:focus-within {
  border-color:
    var(
      --drive-cyan-border
    );
}

.drive-move__search > svg {
  position:
    absolute;

  left:
    12px;

  width:
    15px;

  height:
    15px;

  color:
    var(
      --drive-text-muted
    );

  pointer-events:
    none;
}

.drive-move__search input {
  width:
    100%;

  height:
    40px;

  padding:
    0 68px 0 37px;

  color:
    var(
      --drive-text
    );

  font-size:
    11px;

  border:
    0;

  outline:
    none;

  background:
    transparent;
}

.drive-move__search > span {
  position:
    absolute;

  right:
    11px;

  color:
    #626263;

  font-family:
    "JetBrains Mono",
    monospace;

  font-size:
    8px;

  font-weight:
    800;

  letter-spacing:
    0.08em;
}

.drive-move__loading {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    9px;

  min-height:
    180px;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;
}

.drive-move__tree {
  max-height:
    360px;

  overflow-y:
    auto;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius: 0;

  background:
    #0f0f10;

  scrollbar-color:
    var(
      --drive-border-strong
    )
    transparent;

  scrollbar-width:
    thin;
}

.drive-move-folder {
  position:
    relative;

  display:
    grid;

  grid-template-columns:
    2px
    32px
    minmax(
      0,
      1fr
    )
    18px;

  align-items:
    center;

  gap:
    9px;

  width:
    100%;

  min-height:
    50px;

  padding:
    7px 11px
    7px
    calc(
      11px +
      var(
        --folder-level,
        0
      ) *
      18px
    );

  color:
    var(
      --drive-text
    );

  text-align:
    left;

  border:
    0;

  border-bottom:
    1px solid
    var(
      --drive-border-soft
    );

  background:
    transparent;

  transition:
    background-color 140ms ease;
}

.drive-move-folder:last-child {
  border-bottom:
    0;
}

.drive-move-folder:hover {
  background:
    var(
      --drive-surface-hover
    );
}

.drive-move-folder.is-selected {
  background:
    rgba(
      232, 232, 236,
      0.08
    );
}

.drive-move-folder__line {
  width:
    2px;

  height:
    26px;

  border-radius: 0;

  background:
    transparent;
}

.drive-move-folder.is-selected
.drive-move-folder__line {
  background:
    var(
      --drive-cyan
    );
}

.drive-move-folder__icon {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    31px;

  height:
    31px;

  color:
    var(
      --drive-yellow
    );

  border:
    1px solid
    rgba(
      212, 166, 70,
      0.32
    );

  border-radius: 0;

  background:
    var(
      --drive-yellow-soft
    );
}

.drive-move-folder__icon svg {
  width:
    15px;

  height:
    15px;
}

.drive-move-folder__copy {
  display:
    flex;

  flex-direction:
    column;

  min-width:
    0;
}

.drive-move-folder__copy strong {
  overflow:
    hidden;

  color:
    var(
      --drive-text-soft
    );

  font-size:
    11px;

  font-weight:
    730;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.drive-move-folder__copy small {
  margin-top:
    2px;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    8px;
}

.drive-move-folder__check {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    17px;

  height:
    17px;

  color:
    transparent;

  border:
    1px solid
    var(
      --drive-border
    );

  border-radius:
    50%;

  background:
    #0d0d0e;
}

.drive-move-folder.is-selected
.drive-move-folder__check {
  color:
    #0d0d0e;

  border-color:
    var(
      --drive-cyan
    );

  background:
    var(
      --drive-cyan
    );
}

.drive-move-folder__check svg {
  width:
    11px;

  height:
    11px;

  stroke-width:
    3;
}

.drive-move__empty {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  flex-direction:
    column;

  gap:
    7px;

  min-height:
    120px;

  color:
    var(
      --drive-text-muted
    );

  font-size:
    10px;
}

.drive-move__empty svg {
  width:
    21px;

  height:
    21px;
}

/* =========================================================
   AVISO DE BORRADO
   ========================================================= */

.drive-danger-notice {
  display:
    flex;

  align-items:
    flex-start;

  gap:
    10px;

  padding:
    11px;

  color:
    var(
      --drive-red
    );

  border:
    1px solid
    rgba(
      222, 86, 80,
      0.34
    );

  border-radius: 0;

  background:
    var(
      --drive-red-soft
    );
}

.drive-danger-notice > svg {
  width:
    17px;

  min-width:
    17px;

  height:
    17px;

  margin-top:
    1px;
}

.drive-danger-notice > div {
  display:
    flex;

  flex-direction:
    column;
}

.drive-danger-notice strong {
  font-size:
    11px;

  font-weight:
    780;
}

.drive-danger-notice span {
  margin-top:
    2px;

  color:
    #c68791;

  font-size:
    9px;

  line-height:
    1.45;
}

/* =========================================================
   SCROLLBARS
   ========================================================= */

.drive-table-wrap::-webkit-scrollbar,
.drive-breadcrumb::-webkit-scrollbar,
.drive-upload-selection__list::-webkit-scrollbar,
.drive-user-picker__list::-webkit-scrollbar,
.drive-move__tree::-webkit-scrollbar,
.drive-modal__form::-webkit-scrollbar,
.drive-modal__body::-webkit-scrollbar {
  width:
    8px;

  height:
    8px;
}

.drive-table-wrap::-webkit-scrollbar-track,
.drive-breadcrumb::-webkit-scrollbar-track,
.drive-upload-selection__list::-webkit-scrollbar-track,
.drive-user-picker__list::-webkit-scrollbar-track,
.drive-move__tree::-webkit-scrollbar-track,
.drive-modal__form::-webkit-scrollbar-track,
.drive-modal__body::-webkit-scrollbar-track {
  background:
    transparent;
}

.drive-table-wrap::-webkit-scrollbar-thumb,
.drive-breadcrumb::-webkit-scrollbar-thumb,
.drive-upload-selection__list::-webkit-scrollbar-thumb,
.drive-user-picker__list::-webkit-scrollbar-thumb,
.drive-move__tree::-webkit-scrollbar-thumb,
.drive-modal__form::-webkit-scrollbar-thumb,
.drive-modal__body::-webkit-scrollbar-thumb {
  border:
    2px solid
    transparent;

  border-radius: 0;

  background:
    var(
      --drive-border-strong
    );

  background-clip:
    padding-box;
}

/* =========================================================
   FOCUS
   ========================================================= */

.drive-page button:focus-visible,
.drive-page select:focus-visible,
.drive-page input:focus-visible,
.drive-modal button:focus-visible,
.drive-modal input:focus-visible {
  outline:
    2px solid
    rgba(
      232, 232, 236,
      0.52
    );

  outline-offset:
    2px;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (
  max-width:
  1240px
) {
  .drive-summary {
    grid-template-columns:
      minmax(
        0,
        1.2fr
      )
      minmax(
        150px,
        0.7fr
      )
      minmax(
        170px,
        0.8fr
      );
  }

  .drive-command__status {
    display:
      none;
  }
}

@media (
  max-width:
  960px
) {
  .drive-page {
    padding:
      14px;

    gap:
      12px;
  }

  .drive-command {
    align-items:
      flex-start;

    flex-direction:
      column;
  }

  .drive-command__actions {
    width:
      100%;

    justify-content:
      flex-start;
  }

  .drive-summary {
    grid-template-columns:
      repeat(
        3,
        minmax(
          0,
          1fr
        )
      );
  }

  .drive-navigation__toolbar {
    align-items:
      stretch;

    flex-direction:
      column;
  }

  .drive-order {
    width:
      100%;

    justify-content:
      space-between;
  }

  .drive-order__control {
    flex:
      1;
  }

  .drive-order select {
    width:
      100%;

    min-width:
      0;
  }

  .drive-selection-bar {
    align-items:
      stretch;

    flex-direction:
      column;
  }

  .drive-selection-bar__actions {
    justify-content:
      flex-end;
  }

  .drive-visibility-options {
    grid-template-columns:
      1fr;
  }

  .drive-upload-source-grid {
    grid-template-columns:
      1fr;
  }
}

@media (
  max-width:
  720px
) {
  .drive-page {
    padding:
      10px;
  }

  .drive-command {
    padding:
      13px;
  }

  .drive-command__identity {
    align-items:
      flex-start;
  }

  .drive-command__copy p {
    white-space:
      normal;
  }

  .drive-command__actions {
    display:
      grid;

    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

  .drive-command__actions
  .button {
    width:
      100%;
  }

  .drive-summary {
    grid-template-columns:
      1fr;
  }

  .drive-summary-card--compact {
    min-height:
      58px;
  }

  .drive-panel__legend,
  .drive-panel__footer-code {
    display:
      none;
  }

  .drive-panel__footer {
    justify-content:
      center;
  }

  .drive-selection-bar__actions {
    display:
      grid;

    grid-template-columns:
      1fr;

    width:
      100%;
  }

  .drive-selection-bar__actions
  .button {
    width:
      100%;
  }

  .drive-upload-progress__footer {
    align-items:
      flex-start;

    flex-direction:
      column;
  }

  .drive-download-progress {
    align-items:
      flex-start;

    flex-direction:
      column;
  }

  .drive-modal {
    align-items:
      flex-end;

    padding:
      10px;
  }

  .drive-modal__dialog,
  .drive-modal__dialog--large,
  .drive-modal__dialog--small {
    width:
      100%;

    max-height:
      calc(
        100vh - 20px
      );

    border-radius: 0;
  }

  .drive-modal__header {
    padding:
      14px;
  }

  .drive-modal__form,
  .drive-modal__body {
    padding:
      14px;
  }

  .drive-modal__footer--external {
    padding:
      12px 14px;
  }

  .drive-modal__footer {
    display:
      grid;

    grid-template-columns:
      1fr;

    width:
      100%;
  }

  .drive-modal__footer
  .button {
    width:
      100%;
  }

  .drive-visibility-option {
    min-height:
      68px;
  }

  .drive-upload-source {
    min-height:
      68px;
  }
}

@media (
  max-width:
  480px
) {
  .drive-command__actions {
    grid-template-columns:
      1fr;
  }

  .drive-command__icon {
    width:
      38px;

    min-width:
      38px;

    height:
      38px;
  }

  .drive-command__copy h2 {
    font-size:
      18px;
  }

  .drive-command__eyebrow {
    font-size:
      8px;
  }

  .drive-summary-card__copy strong {
    font-size:
      16px;
  }

  .drive-panel__header--compact {
    padding:
      10px 12px;
  }

  .drive-empty {
    min-height:
      280px;

    padding:
      34px 14px;
  }

  .drive-empty__actions {
    flex-direction:
      column;

    width:
      100%;
  }

  .drive-empty__actions
  .button {
    width:
      100%;
  }

  .drive-upload-progress__header {
    align-items:
      flex-start;
  }

  .drive-upload-progress__status {
    min-width:
      54px;
  }

  .drive-upload-progress__identity span {
    white-space:
      normal;
  }

  .drive-selection-bar__copy span {
    white-space:
      normal;
  }

  .drive-upload-source {
    grid-template-columns:
      34px
      minmax(
        0,
        1fr
      )
      14px;
  }

  .drive-upload-file {
    grid-template-columns:
      30px
      minmax(
        0,
        1fr
      );
  }

  .drive-upload-file__size {
    display:
      none;
  }

  .drive-modal__heading-icon {
    width:
      34px;

    min-width:
      34px;

    height:
      34px;
  }

  .drive-modal__heading h2 {
    font-size:
      16px;
  }
}

/* =========================================================
   REDUCIR MOVIMIENTO
   ========================================================= */

@media (
  prefers-reduced-motion:
  reduce
) {
  .drive-page *,
  .drive-modal *,
  .drive-drop-zone * {
    scroll-behavior:
      auto !important;

    animation-duration:
      0.01ms !important;

    animation-iteration-count:
      1 !important;

    transition-duration:
      0.01ms !important;
  }
}