/* Admin shared styles — linked from base.html on variant="admin" pages only.
   1) Softens the solid button fills (cocoa / danger) so they sit less
      intensely against the cream background.
   2) Keeps modal action buttons a matching size and on one row on mobile. */

/* --- softer solid button fills (admin scope) --- */
.btn--dark { background: rgba(59,39,34,.62); }
.btn--dark:hover, .btn--dark:focus-visible { background: rgba(59,39,34,.74); }

.btn--danger-solid { background: rgba(160,52,42,.72); border-color: rgba(160,52,42,.72); }
.btn--danger-solid:hover, .btn--danger-solid:focus-visible { background: rgba(160,52,42,.84); border-color: rgba(160,52,42,.84); }

.btn--danger { background: #fff; border-color: rgba(160,52,42,.6); color: rgba(160,52,42,.9); }
.btn--danger:hover, .btn--danger:focus-visible { background: rgba(160,52,42,.08); border-color: rgba(160,52,42,.75); color: rgba(160,52,42,1); }

/* --- uniform modal action buttons --- */
.rm-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; margin-top: 16px; }
.rm-actions .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 16px;
  border-radius: 100px;
  font-family: var(--body);
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .05em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}
.rm-actions .btn--ghost { background: rgba(255,255,255,.85); border-color: rgba(59,39,34,.28); color: rgba(59,39,34,.85); }
.rm-actions .btn--ghost:hover, .rm-actions .btn--ghost:focus-visible { background: #fff; border-color: rgba(59,39,34,.42); color: rgba(59,39,34,1); }

/* --- mobile: same size, same shape, one row --- */
@media (max-width: 760px) {
  .row-modal .rm-actions { flex-wrap: nowrap; gap: 8px; }
  .row-modal .rm-actions .btn {
    min-width: 0;
    flex: 1 1 0;
    max-width: 100%;
    padding: 0 8px;
    font-size: .7rem;
  }
  .rm-actions { flex-wrap: nowrap; gap: 8px; }
  .rm-actions .btn {
    min-width: 0;
    flex: 1 1 0;
    max-width: 100%;
    padding: 0 8px;
    font-size: .7rem;
  }
  .admin-top .btn { min-width: 0; }
  .admin-top .btn--ghost, .admin-top .btn--dark { padding: 8px 12px; font-size: .74rem; }
}
@media (max-width: 480px) {
  .rm-actions .btn { font-size: .66rem; padding: 0 5px; letter-spacing: .03em; }
}
