/* The dialog that asks what a category deletion should do with its contents.
 *
 * A component with its own file, per §2.14, because two screens show it now:
 * the Documents pane and the cabinet's Catégories screen. It was written into
 * app_refine.css, which every page happens to load - so this moves a rule to
 * where it belongs rather than fixing anything that was broken, and it means
 * the next screen that needs the dialog needs this one file.
 */
/* ==========================================================================
 * Deleting a category is a decision, not a confirmation
 * --------------------------------------------------------------------------
 * The old flow was a browser confirm() reading "delete this category and the
 * documents it contains?" - it named no quantity, offered no alternative to
 * destruction, and the API behind it silently cascaded through every
 * sub-category. This states what is there, where it would go, and what
 * deleting outright would cost. The safe choice is first and takes focus.
 *
 * Note it animates transform only: a dialog that fades in from opacity 0 is
 * invisible if the animation does not run, which is the failure this codebase
 * just spent a day on.
 * ======================================================================== */
.cat-delete {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}
.cat-delete__scrim {
  position: absolute;
  inset: 0;
  background: rgba(11, 20, 51, 0.42);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
.cat-delete__panel {
  position: relative;
  width: min(460px, 100%);
  padding: 1.5rem;
  border-radius: 16px;
  background: #FFFFFF;
  box-shadow: 0 24px 60px rgba(11, 20, 51, 0.32);
  animation: cat-delete-in 180ms ease-out;
}
@keyframes cat-delete-in {
  from { transform: translateY(6px) scale(0.99); }
  to   { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .cat-delete__panel { animation: none; }
}

.cat-delete__title {
  margin: 0 0 0.5rem;
  font-size: 1.14rem;
  font-weight: 650;
  letter-spacing: -0.015em;
  line-height: 1.25;
  color: #0B1433;
}
.cat-delete__body {
  margin: 0 0 1.1rem;
  color: #3B4860;
  font-size: 0.92rem;
  line-height: 1.5;
}

.cat-delete__choices {
  display: grid;
  gap: 0.55rem;
}
.cat-delete__choice {
  display: grid;
  gap: 0.16rem;
  padding: 0.8rem 0.9rem;
  text-align: left;
  border-radius: 11px;
  border: 1px solid var(--fc-line, #DEDCD6);
  background: #FFFFFF;
  transition: border-color 140ms ease-out, background-color 140ms ease-out,
    transform 100ms ease-out;
}
.cat-delete__choice:hover {
  border-color: var(--fc-accent, #0B1F4D);
  background: rgba(11, 31, 77, 0.05);
}
.cat-delete__choice:active { transform: scale(0.99); }
.cat-delete__choice:focus-visible {
  outline: none;
  border-color: var(--fc-accent, #0B1F4D);
  box-shadow: 0 0 0 3px rgba(11, 31, 77, 0.24);
}
.cat-delete__choice-title {
  font-weight: 600;
  font-size: 0.95rem;
  color: #0B1433;
}
.cat-delete__choice-note {
  font-size: 0.83rem;
  color: #596378;
  line-height: 1.4;
}

/* The destructive option is marked, but not made attractive. */
.cat-delete__choice--danger:hover {
  border-color: #C32324;
  background: rgba(195, 35, 36, 0.05);
}
.cat-delete__choice--danger:focus-visible {
  border-color: #C32324;
  box-shadow: 0 0 0 3px rgba(195, 35, 36, 0.22);
}
.cat-delete__choice--danger .cat-delete__choice-title { color: #9B1F1D; }

.cat-delete__footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 1rem;
}