/* RG COMPANY cabinet button visual fix 2026-08-05.
   Keeps every button readable in light/dark themes and makes mobile account actions compact. */

/* Clean shared interaction without browser rings or accidental recolouring. */
.cabinet-body :where(.btn, .icon-btn, .modal-close, .custom-select-button) {
  -webkit-tap-highlight-color: transparent !important;
}

.cabinet-body :where(.btn, .icon-btn, .modal-close, .custom-select-button):focus,
.cabinet-body :where(.btn, .icon-btn, .modal-close, .custom-select-button):focus-visible {
  outline: 0 !important;
  outline-offset: 0 !important;
}

/* Ordinary secondary buttons. */
html[data-theme="light"] .cabinet-body .admin-layout .btn:not(.primary):not(.danger):not(.logout-button):not(.account-manage-button):not(.danger-outline),
html[data-theme="light"] .cabinet-body .modal .btn:not(.primary):not(.danger):not(.account-manage-button):not(.danger-outline),
html[data-theme="light"] .cabinet-body .admin-layout .icon-btn,
html[data-theme="light"] .cabinet-body .modal-close,
html[data-theme="light"] .cabinet-body .custom-select-button {
  background: #ffffff !important;
  border-color: rgba(17, 24, 39, .18) !important;
  color: #20242c !important;
  box-shadow: none !important;
  filter: none !important;
}

html[data-theme="light"] .cabinet-body .admin-layout .btn:not(.primary):not(.danger):not(.logout-button):not(.account-manage-button):not(.danger-outline):hover:not(:disabled),
html[data-theme="light"] .cabinet-body .admin-layout .btn:not(.primary):not(.danger):not(.logout-button):not(.account-manage-button):not(.danger-outline):focus-visible,
html[data-theme="light"] .cabinet-body .modal .btn:not(.primary):not(.danger):not(.account-manage-button):not(.danger-outline):hover:not(:disabled),
html[data-theme="light"] .cabinet-body .modal .btn:not(.primary):not(.danger):not(.account-manage-button):not(.danger-outline):focus-visible,
html[data-theme="light"] .cabinet-body .admin-layout .icon-btn:hover:not(:disabled),
html[data-theme="light"] .cabinet-body .admin-layout .icon-btn:focus-visible,
html[data-theme="light"] .cabinet-body .modal-close:hover:not(:disabled),
html[data-theme="light"] .cabinet-body .modal-close:focus-visible,
html[data-theme="light"] .cabinet-body .custom-select-button:hover:not(:disabled),
html[data-theme="light"] .cabinet-body .custom-select-button:focus-visible {
  background: #f0f2f5 !important;
  border-color: rgba(17, 24, 39, .28) !important;
  color: #11151b !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

html[data-theme="dark"] .cabinet-body .admin-layout .btn:not(.primary):not(.danger):not(.logout-button):not(.account-manage-button):not(.danger-outline),
html[data-theme="dark"] .cabinet-body .modal .btn:not(.primary):not(.danger):not(.account-manage-button):not(.danger-outline),
html[data-theme="dark"] .cabinet-body .admin-layout .icon-btn,
html[data-theme="dark"] .cabinet-body .modal-close,
html[data-theme="dark"] .cabinet-body .custom-select-button {
  background: #191c21 !important;
  border-color: rgba(255, 255, 255, .16) !important;
  color: #f3f5f7 !important;
  box-shadow: none !important;
  filter: none !important;
}

html[data-theme="dark"] .cabinet-body .admin-layout .btn:not(.primary):not(.danger):not(.logout-button):not(.account-manage-button):not(.danger-outline):hover:not(:disabled),
html[data-theme="dark"] .cabinet-body .admin-layout .btn:not(.primary):not(.danger):not(.logout-button):not(.account-manage-button):not(.danger-outline):focus-visible,
html[data-theme="dark"] .cabinet-body .modal .btn:not(.primary):not(.danger):not(.account-manage-button):not(.danger-outline):hover:not(:disabled),
html[data-theme="dark"] .cabinet-body .modal .btn:not(.primary):not(.danger):not(.account-manage-button):not(.danger-outline):focus-visible,
html[data-theme="dark"] .cabinet-body .admin-layout .icon-btn:hover:not(:disabled),
html[data-theme="dark"] .cabinet-body .admin-layout .icon-btn:focus-visible,
html[data-theme="dark"] .cabinet-body .modal-close:hover:not(:disabled),
html[data-theme="dark"] .cabinet-body .modal-close:focus-visible,
html[data-theme="dark"] .cabinet-body .custom-select-button:hover:not(:disabled),
html[data-theme="dark"] .cabinet-body .custom-select-button:focus-visible {
  background: #252930 !important;
  border-color: rgba(255, 255, 255, .25) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

/* Primary buttons retain strong contrast in both themes. */
html[data-theme="light"] .cabinet-body :where(.admin-layout, .modal) .btn.primary {
  background: #20242c !important;
  border-color: #20242c !important;
  color: #ffffff !important;
}
html[data-theme="light"] .cabinet-body :where(.admin-layout, .modal) .btn.primary:hover:not(:disabled),
html[data-theme="light"] .cabinet-body :where(.admin-layout, .modal) .btn.primary:focus-visible {
  background: #0f1318 !important;
  border-color: #0f1318 !important;
  color: #ffffff !important;
  transform: none !important;
}
html[data-theme="dark"] .cabinet-body :where(.admin-layout, .modal) .btn.primary {
  background: #f3f5f8 !important;
  border-color: #f3f5f8 !important;
  color: #15191f !important;
}
html[data-theme="dark"] .cabinet-body :where(.admin-layout, .modal) .btn.primary:hover:not(:disabled),
html[data-theme="dark"] .cabinet-body :where(.admin-layout, .modal) .btn.primary:focus-visible {
  background: #ffffff !important;
  border-color: #ffffff !important;
  color: #0f1318 !important;
  transform: none !important;
}

/* Destructive actions are always solid red with white text. */
.cabinet-body :where(.admin-layout, .modal) .btn.danger:not(.danger-outline),
.cabinet-body .admin-layout .logout-button {
  background: #e5484d !important;
  border-color: #e5484d !important;
  color: #ffffff !important;
  box-shadow: none !important;
}
.cabinet-body :where(.admin-layout, .modal) .btn.danger:not(.danger-outline):hover:not(:disabled),
.cabinet-body :where(.admin-layout, .modal) .btn.danger:not(.danger-outline):focus-visible,
.cabinet-body .admin-layout .logout-button:hover:not(:disabled),
.cabinet-body .admin-layout .logout-button:focus-visible {
  background: #d83f45 !important;
  border-color: #d83f45 !important;
  color: #ffffff !important;
  transform: none !important;
}

/* Red outline actions keep readable text instead of turning into a pale neutral button. */
html[data-theme] .cabinet-body .admin-layout .btn.danger-outline,
html[data-theme] .cabinet-body .modal .btn.danger-outline {
  background: transparent !important;
  border-color: color-mix(in srgb, #e5484d 48%, var(--cab-line)) !important;
  color: #e5484d !important;
}
html[data-theme] .cabinet-body .admin-layout .btn.danger-outline:hover:not(:disabled),
html[data-theme] .cabinet-body .admin-layout .btn.danger-outline:focus-visible,
html[data-theme] .cabinet-body .modal .btn.danger-outline:hover:not(:disabled),
html[data-theme] .cabinet-body .modal .btn.danger-outline:focus-visible {
  background: color-mix(in srgb, #e5484d 12%, transparent) !important;
  border-color: #e5484d !important;
  color: #e5484d !important;
  transform: none !important;
}

/* The account management action is intentionally inverted and remains readable on hover. */
html[data-theme="light"] .cabinet-body .admin-layout .btn.account-manage-button,
html[data-theme="light"] .cabinet-body .admin-layout .btn.account-manage-button:visited {
  background: #20242c !important;
  border-color: #20242c !important;
  color: #ffffff !important;
  box-shadow: none !important;
}
html[data-theme="light"] .cabinet-body .admin-layout .btn.account-manage-button:hover:not(:disabled),
html[data-theme="light"] .cabinet-body .admin-layout .btn.account-manage-button:focus-visible,
html[data-theme="light"] .cabinet-body .admin-layout .btn.account-manage-button:active:not(:disabled) {
  background: #0f1318 !important;
  border-color: #0f1318 !important;
  color: #ffffff !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}
html[data-theme="dark"] .cabinet-body .admin-layout .btn.account-manage-button,
html[data-theme="dark"] .cabinet-body .admin-layout .btn.account-manage-button:visited {
  background: #f3f5f8 !important;
  border-color: #f3f5f8 !important;
  color: #15191f !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .cabinet-body .admin-layout .btn.account-manage-button:hover:not(:disabled),
html[data-theme="dark"] .cabinet-body .admin-layout .btn.account-manage-button:focus-visible,
html[data-theme="dark"] .cabinet-body .admin-layout .btn.account-manage-button:active:not(:disabled) {
  background: #ffffff !important;
  border-color: #ffffff !important;
  color: #0f1318 !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

.cabinet-body .btn:disabled,
.cabinet-body .icon-btn:disabled {
  opacity: .46 !important;
  cursor: not-allowed !important;
  transform: none !important;
}

/* Mobile Telegram Mini App/account cards: compact actions, never full-card-width bars. */
@media (max-width: 760px) {
  .cabinet-body .accounts-table {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .cabinet-body .accounts-table tr.account-row {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .cabinet-body .accounts-table .account-actions-cell {
    padding-top: 10px !important;
  }

  .cabinet-body .account-row-actions {
    width: 100% !important;
    display: flex !important;
    flex-flow: row wrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    white-space: normal !important;
  }

  .cabinet-body .account-row-actions .btn,
  .cabinet-body .account-row-actions .account-manage-button,
  .cabinet-body .account-row-actions .account-toggle-button {
    flex: 0 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 36px !important;
    padding-inline: 13px !important;
    justify-content: center !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 360px) {
  .cabinet-body .account-row-actions {
    justify-content: flex-start !important;
  }

  .cabinet-body .account-row-actions .btn {
    padding-inline: 11px !important;
    font-size: 10px !important;
  }
}
