/*
 * Classic rootadmin Wallet-account permissions.
 *
 * Presentation only.
 * Shared behavior remains in account-permissions.js.
 */

html[data-dashboard-ui="classic"]
#accountPermissionsButton {
  min-height: 36px;

  padding-inline:
    13px;
}


html[data-dashboard-ui="classic"]
.account-permissions-dialog {
  width:
    min(
      1040px,
      calc(100vw - 40px)
    );

  max-width: none;

  max-height:
    min(
      860px,
      calc(100vh - 38px)
    );

  padding: 0;

  overflow: hidden;

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

  border-radius: 16px;

  background:
    var(--surface);

  color:
    var(--text);

  box-shadow:
    0 28px 84px
    rgba(0, 0, 0, 0.52);
}


html[data-dashboard-ui="classic"]
.account-permissions-dialog::backdrop {
  background:
    rgba(0, 0, 0, 0.70);

  backdrop-filter:
    blur(4px);

  -webkit-backdrop-filter:
    blur(4px);
}


html[data-dashboard-ui="classic"]
.account-permissions-header {
  display: flex;

  align-items: flex-start;
  justify-content: space-between;

  gap: 20px;

  padding:
    20px 22px 17px;

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

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


html[data-dashboard-ui="classic"]
.account-permissions-header h2 {
  margin:
    4px 0 5px;

  color:
    var(--text);

  font-size: 1.15rem;

  letter-spacing:
    -0.02em;
}


html[data-dashboard-ui="classic"]
.account-permissions-header p {
  max-width: 670px;

  margin: 0;

  color:
    var(--muted);

  font-size: 0.76rem;
  line-height: 1.45;
}


html[data-dashboard-ui="classic"]
.account-permissions-overline {
  color:
    var(--accent);

  font-size: 0.61rem;
  font-weight: 760;

  letter-spacing:
    0.11em;
}


html[data-dashboard-ui="classic"]
.account-permissions-body {
  max-height:
    calc(100vh - 230px);

  overflow-y: auto;

  padding:
    18px 20px 22px;
}


html[data-dashboard-ui="classic"]
.account-permissions-safety {
  margin-bottom: 15px;

  padding:
    13px 14px;

  border:
    1px solid
    rgba(23, 211, 154, 0.18);

  border-radius: 10px;

  background:
    rgba(23, 211, 154, 0.05);
}


html[data-dashboard-ui="classic"]
.account-permissions-safety strong {
  display: block;

  margin-bottom: 5px;

  color:
    var(--accent);

  font-size: 0.63rem;

  letter-spacing:
    0.09em;
}


html[data-dashboard-ui="classic"]
.account-permissions-safety p {
  margin: 0;

  color:
    var(--muted);

  font-size: 0.74rem;
  line-height: 1.52;
}


html[data-dashboard-ui="classic"]
.account-permissions-loading,

html[data-dashboard-ui="classic"]
.account-permissions-empty {
  padding:
    28px 18px;

  text-align: center;

  color:
    var(--muted);

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

  border-radius: 11px;

  background:
    rgba(7, 16, 13, 0.26);
}


html[data-dashboard-ui="classic"]
.account-permissions-list {
  display: grid;

  gap: 14px;
}


html[data-dashboard-ui="classic"]
.account-policy-card {
  overflow: hidden;

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

  border-radius: 12px;

  background:
    linear-gradient(
      145deg,
      var(--surface-2),
      rgba(10, 21, 18, 0.90)
    );
}


html[data-dashboard-ui="classic"]
.account-policy-card-head {
  display: flex;

  align-items: flex-start;
  justify-content: space-between;

  gap: 15px;

  padding:
    15px 16px 12px;
}


html[data-dashboard-ui="classic"]
.account-policy-identity {
  min-width: 0;

  display: grid;

  gap: 3px;
}


html[data-dashboard-ui="classic"]
.account-policy-identity > span {
  color:
    var(--muted);

  font-size: 0.58rem;
  font-weight: 720;

  letter-spacing:
    0.075em;

  text-transform:
    uppercase;
}


html[data-dashboard-ui="classic"]
.account-policy-identity > strong {
  overflow: hidden;

  color:
    var(--text);

  font-size: 0.96rem;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


html[data-dashboard-ui="classic"]
.account-policy-identity > code {
  color:
    var(--muted);

  font-size: 0.65rem;
}


html[data-dashboard-ui="classic"]
.account-policy-status {
  flex: 0 0 auto;

  padding:
    5px 8px;

  border-radius:
    999px;

  font-size: 0.61rem;
  font-weight: 720;
}


html[data-dashboard-ui="classic"]
.account-policy-status.configured {
  color:
    var(--positive);

  border:
    1px solid
    rgba(32, 212, 155, 0.28);

  background:
    rgba(32, 212, 155, 0.07);
}


html[data-dashboard-ui="classic"]
.account-policy-status.fail-closed {
  color:
    var(--warning);

  border:
    1px solid
    rgba(241, 189, 100, 0.28);

  background:
    rgba(241, 189, 100, 0.07);
}


html[data-dashboard-ui="classic"]
.account-policy-meta {
  display: grid;

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

  gap: 1px;

  margin:
    0 16px 13px;

  overflow: hidden;

  border:
    1px solid
    rgba(109, 154, 139, 0.16);

  border-radius: 9px;

  background:
    rgba(7, 16, 13, 0.42);
}


html[data-dashboard-ui="classic"]
.account-policy-meta > span {
  min-width: 0;

  display: grid;

  gap: 3px;

  padding:
    9px 10px;

  border-right:
    1px solid
    rgba(109, 154, 139, 0.13);
}


html[data-dashboard-ui="classic"]
.account-policy-meta
> span:last-child {
  border-right: 0;
}


html[data-dashboard-ui="classic"]
.account-policy-meta small {
  color:
    var(--muted);

  font-size: 0.55rem;

  letter-spacing:
    0.05em;

  text-transform:
    uppercase;
}


html[data-dashboard-ui="classic"]
.account-policy-meta strong {
  overflow: hidden;

  color:
    var(--text);

  font-size: 0.67rem;
  font-weight: 650;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze {
  display: grid;

  gap: 10px;

  margin:
    0 16px 15px;

  padding:
    13px 14px 14px;

  border:
    1px solid
    rgba(224, 86, 86, 0.22);

  border-radius: 10px;

  background:
    rgba(104, 25, 25, 0.10);
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze.active {
  border-color:
    rgba(224, 86, 86, 0.38);

  background:
    rgba(124, 27, 27, 0.16);
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-head {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 12px;
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-title {
  display: grid;

  gap: 2px;
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-title > span {
  color:
    var(--muted);

  font-size: 0.56rem;
  font-weight: 720;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-title > strong {
  color:
    var(--text);

  font-size: 0.81rem;
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-state {
  padding:
    4px 8px;

  border-radius: 999px;

  font-size: 0.59rem;
  font-weight: 760;
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-state.inactive {
  color:
    var(--muted);

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

  background:
    rgba(95, 110, 104, 0.14);
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-state.active {
  color:
    var(--negative, #f47f74);

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

  background:
    rgba(148, 39, 39, 0.13);
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-copy,

html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-difference {
  margin: 0;

  color:
    var(--text);

  font-size: 0.64rem;
  line-height: 1.48;
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-difference {
  color:
    var(--muted);
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-controls {
  display: grid;

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

  align-items: end;

  gap: 12px;
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-field {
  min-width: 0;

  display: grid;

  gap: 5px;

  color:
    var(--muted);

  font-size: 0.61rem;
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-field textarea {
  width: 100%;
  min-width: 0;
  min-height: 54px;

  padding:
    8px 9px;

  resize: vertical;

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

  border-radius: 8px;

  background:
    var(--bg);

  color:
    var(--text);

  font: inherit;
  font-size: 0.67rem;
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-field
textarea:focus {
  outline: none;

  border-color:
    var(--negative, #f47f74);

  box-shadow:
    0 0 0 2px
    rgba(224, 86, 86, 0.10);
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-actions {
  min-width: 180px;

  display: grid;

  gap: 7px;

  justify-items: end;
}


html[data-dashboard-ui="classic"]
.account-policy-hard-freeze-helper {
  max-width: 230px;

  color:
    var(--muted);

  font-size: 0.60rem;
  line-height: 1.35;

  text-align: right;
}

html[data-dashboard-ui="classic"]
.account-policy-capabilities {
  display: grid;

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

  gap: 8px;

  padding:
    0 16px 15px;
}


html[data-dashboard-ui="classic"]
.account-policy-capability {
  min-width: 0;

  display: flex;

  align-items: flex-start;
  justify-content: space-between;

  gap: 11px;

  padding:
    11px;

  border:
    1px solid
    rgba(109, 154, 139, 0.15);

  border-radius: 10px;

  background:
    rgba(7, 16, 13, 0.35);

  cursor:
    pointer;
}


html[data-dashboard-ui="classic"]
.account-policy-capability-copy {
  min-width: 0;

  display: grid;

  gap: 4px;
}


html[data-dashboard-ui="classic"]
.account-policy-capability-copy strong {
  color:
    var(--text);

  font-size: 0.76rem;
}


html[data-dashboard-ui="classic"]
.account-policy-capability-copy small {
  color:
    var(--muted);

  font-size: 0.62rem;
  line-height: 1.4;
}


html[data-dashboard-ui="classic"]
.account-policy-switch {
  position: relative;

  flex:
    0 0 auto;

  width: 38px;
  height: 22px;

  margin-top: 1px;
}


html[data-dashboard-ui="classic"]
.account-policy-switch input {
  position: absolute;

  width: 1px;
  height: 1px;

  margin: 0;
  padding: 0;

  opacity: 0;
}


html[data-dashboard-ui="classic"]
.account-policy-switch-track {
  position: absolute;

  inset: 0;

  border:
    1px solid
    rgba(143, 165, 157, 0.36);

  border-radius:
    999px;

  background:
    rgba(94, 112, 105, 0.30);

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


html[data-dashboard-ui="classic"]
.account-policy-switch-track::after {
  content: "";

  position: absolute;

  top: 3px;
  left: 3px;

  width: 14px;
  height: 14px;

  border-radius:
    50%;

  background:
    rgba(203, 218, 212, 0.78);

  box-shadow:
    0 2px 7px
    rgba(0, 0, 0, 0.30);

  transition:
    transform 150ms ease,
    background 150ms ease;
}


html[data-dashboard-ui="classic"]
.account-policy-switch
input:checked
+ .account-policy-switch-track {
  border-color:
    rgba(32, 212, 155, 0.46);

  background:
    rgba(32, 212, 155, 0.30);
}


html[data-dashboard-ui="classic"]
.account-policy-switch
input:checked
+ .account-policy-switch-track::after {
  transform:
    translateX(16px);

  background:
    var(--positive);
}


html[data-dashboard-ui="classic"]
.account-policy-switch
input:focus-visible
+ .account-policy-switch-track {
  outline:
    2px solid
    rgba(23, 211, 154, 0.42);

  outline-offset: 3px;
}


html[data-dashboard-ui="classic"]
.account-policy-save-zone {
  display: grid;

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

  align-items: end;

  gap: 14px;

  padding:
    13px 16px;

  border-top:
    1px solid
    rgba(109, 154, 139, 0.14);

  background:
    rgba(7, 16, 13, 0.26);
}


html[data-dashboard-ui="classic"]
.account-policy-save-zone label {
  min-width: 0;

  display: grid;

  gap: 5px;

  color:
    var(--muted);

  font-size: 0.64rem;
}


html[data-dashboard-ui="classic"]
.account-policy-save-zone textarea {
  width: 100%;
  min-height: 62px;

  padding:
    9px 10px;

  resize:
    vertical;

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

  border-radius: 9px;

  background:
    var(--bg);

  color:
    var(--text);

  font: inherit;
  font-size: 0.70rem;

  line-height: 1.4;
}


html[data-dashboard-ui="classic"]
.account-policy-save-zone textarea::placeholder {
  color:
    var(--muted);

  opacity: 0.68;
}


html[data-dashboard-ui="classic"]
.account-policy-save-zone textarea:focus {
  outline: none;

  border-color:
    var(--accent);

  box-shadow:
    0 0 0 2px
    rgba(23, 211, 154, 0.10);
}


html[data-dashboard-ui="classic"]
.account-policy-save-actions {
  min-width: 160px;

  display: grid;

  gap: 7px;

  justify-items: end;
}


html[data-dashboard-ui="classic"]
.account-policy-save-helper {
  max-width: 220px;

  color:
    var(--muted);

  font-size: 0.60rem;
  line-height: 1.35;

  text-align: right;
}


html[data-dashboard-ui="classic"]
.account-policy-history {
  border-top:
    1px solid
    rgba(109, 154, 139, 0.14);
}


html[data-dashboard-ui="classic"]
.account-policy-history > summary {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 12px;

  padding:
    11px 16px;

  color:
    var(--text);

  font-size: 0.68rem;

  cursor: pointer;
  list-style: none;
}


html[data-dashboard-ui="classic"]
.account-policy-history
> summary::-webkit-details-marker {
  display: none;
}


html[data-dashboard-ui="classic"]
.account-policy-history
> summary::before {
  content: "›";

  margin-right: 6px;

  color:
    var(--accent);

  transform:
    rotate(0deg);

  transition:
    transform 150ms ease;
}


html[data-dashboard-ui="classic"]
.account-policy-history[open]
> summary::before {
  transform:
    rotate(90deg);
}


html[data-dashboard-ui="classic"]
.account-policy-history
> summary small {
  margin-left: auto;

  color:
    var(--muted);

  font-size: 0.58rem;
}


html[data-dashboard-ui="classic"]
.account-policy-history-body {
  padding:
    2px 16px 14px;
}


html[data-dashboard-ui="classic"]
.account-policy-history-list {
  display: grid;

  gap: 7px;
}


html[data-dashboard-ui="classic"]
.account-policy-event {
  display: grid;

  gap: 7px;

  padding:
    10px 11px;

  border:
    1px solid
    rgba(109, 154, 139, 0.14);

  border-radius: 9px;

  background:
    rgba(7, 16, 13, 0.38);
}


html[data-dashboard-ui="classic"]
.account-policy-event-head {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 12px;
}


html[data-dashboard-ui="classic"]
.account-policy-event-head strong {
  color:
    var(--text);

  font-size: 0.68rem;

  text-transform:
    capitalize;
}


html[data-dashboard-ui="classic"]
.account-policy-event-head time {
  color:
    var(--muted);

  font-size: 0.58rem;
}


html[data-dashboard-ui="classic"]
.account-policy-event-change {
  display: flex;

  align-items: center;

  gap: 7px;

  color:
    var(--muted);

  font-size: 0.65rem;
}


html[data-dashboard-ui="classic"]
.account-policy-event-change b {
  color:
    var(--accent);
}


html[data-dashboard-ui="classic"]
.account-policy-event-meta {
  display: grid;

  grid-template-columns:
    minmax(120px, 0.35fr)
    minmax(0, 1fr);

  gap: 10px;

  color:
    var(--muted);

  font-size: 0.58rem;
}


html[data-dashboard-ui="classic"]
.account-policy-event-meta > span {
  display: grid;

  gap: 2px;
}


html[data-dashboard-ui="classic"]
.account-policy-event-meta strong {
  overflow-wrap: anywhere;

  color:
    var(--text);

  font-size: 0.62rem;
  font-weight: 620;
}


html[data-dashboard-ui="classic"]
.account-policy-history-loading,

html[data-dashboard-ui="classic"]
.account-policy-history-empty,

html[data-dashboard-ui="classic"]
.account-policy-history-error {
  padding:
    9px 0;

  color:
    var(--muted);

  font-size: 0.65rem;
}


html[data-dashboard-ui="classic"]
.account-policy-history-error {
  color:
    var(--negative);
}


html[data-dashboard-ui="classic"]
.account-permissions-footer {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 14px;

  padding:
    13px 20px;

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

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


html[data-dashboard-ui="classic"]
.account-permissions-footer > span {
  color:
    var(--muted);

  font-size: 0.62rem;
  line-height: 1.4;
}


@media (max-width: 900px) {
  html[data-dashboard-ui="classic"]
  .account-policy-meta {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }

  html[data-dashboard-ui="classic"]
  .account-policy-capabilities {
    grid-template-columns: 1fr;
  }
}


@media (max-width: 820px) {
  html[data-dashboard-ui="classic"]
  .account-permissions-dialog {
    width:
      calc(100vw - 22px);

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

    border-radius: 14px;
  }

  html[data-dashboard-ui="classic"]
  .account-permissions-body {
    max-height:
      calc(100vh - 215px);

    padding: 16px;
  }

  html[data-dashboard-ui="classic"]
  .account-permissions-header {
    padding:
      18px 16px 15px;
  }

  html[data-dashboard-ui="classic"]
  .account-policy-hard-freeze-controls {
    grid-template-columns: 1fr;
  }

  html[data-dashboard-ui="classic"]
  .account-policy-hard-freeze-actions {
    min-width: 0;

    justify-items: stretch;
  }

  html[data-dashboard-ui="classic"]
  .account-policy-hard-freeze-helper {
    max-width: none;

    text-align: left;
  }

  html[data-dashboard-ui="classic"]
  .account-policy-save-zone {
    grid-template-columns: 1fr;
  }

  html[data-dashboard-ui="classic"]
  .account-policy-save-actions {
    justify-items: stretch;
  }

  html[data-dashboard-ui="classic"]
  .account-policy-save-helper {
    max-width: none;

    text-align: left;
  }
}


@media (max-width: 560px) {
  html[data-dashboard-ui="classic"]
  .account-permissions-dialog {
    width:
      calc(100vw - 12px);

    max-height:
      calc(100vh - 12px);
  }

  html[data-dashboard-ui="classic"]
  .account-policy-card-head {
    flex-direction: column;
  }

  html[data-dashboard-ui="classic"]
  .account-policy-meta {
    grid-template-columns: 1fr;
  }

  html[data-dashboard-ui="classic"]
  .account-policy-meta > span {
    border-right: 0;

    border-bottom:
      1px solid
      rgba(109, 154, 139, 0.13);
  }

  html[data-dashboard-ui="classic"]
  .account-policy-meta
  > span:last-child {
    border-bottom: 0;
  }

  html[data-dashboard-ui="classic"]
  .account-policy-event-meta {
    grid-template-columns: 1fr;
  }

  html[data-dashboard-ui="classic"]
  .account-permissions-footer {
    align-items: stretch;

    flex-direction: column;

    padding:
      12px 16px;
  }
}


@media (prefers-reduced-motion: reduce) {
  html[data-dashboard-ui="classic"]
  .account-policy-switch-track,

  html[data-dashboard-ui="classic"]
  .account-policy-switch-track::after,

  html[data-dashboard-ui="classic"]
  .account-policy-history
  > summary::before {
    transition: none;
  }
}