/* Add-on to the deployed site stylesheet, scoped to the key card and reset dialog. */
.c-key .sec-head { margin-bottom: .85rem; }
.c-key .c-key__heading { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.c-key .tile-icon { width: 36px; height: 36px; border-radius: 10px; }
.c-key .c-key__heading h2 { font-size: 1.05rem; }
.c-key .c-key__copy { display: flex; align-items: center; justify-content: space-between; gap: .8rem; width: 100%; min-width: 0; min-height: 58px; padding: .8rem .9rem; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--raised); color: var(--text); text-align: left; cursor: pointer; transition: border-color .18s ease, background .18s ease; }
.c-key .c-key__copy:hover:not(:disabled) { border-color: var(--brand); background: var(--brand-soft); }
.c-key .c-key__copy:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
.c-key .c-key__copy:disabled { cursor: default; color: var(--muted); }
.c-key .c-key__copy[aria-busy="true"] { cursor: progress; }
.c-key .c-key__value { min-width: 0; font-family: ui-monospace, "Cascadia Code", Consolas, monospace; font-size: .83rem; line-height: 1.6; letter-spacing: .025em; overflow-wrap: anywhere; word-break: break-word; white-space: normal; user-select: text; }
.c-key .c-key__action { display: flex; flex: 0 0 auto; flex-direction: column; align-items: center; gap: .2rem; color: var(--brand-hi); font-size: .68rem; line-height: 1.2; }
.c-key .c-key__copy:disabled:not([aria-busy="true"]) .c-key__action { visibility: hidden; }
.c-key .c-key__check-icon { display: none; }
.c-key .c-key__copy.is-copied { border-color: var(--ok); background: rgba(95, 215, 154, .08); }
.c-key .c-key__copy.is-copied .c-key__action { color: var(--ok); }
.c-key .c-key__copy.is-copied .c-key__copy-icon { display: none; }
.c-key .c-key__copy.is-copied .c-key__check-icon { display: block; }
.c-key .c-key__feedback { min-height: 1.25em; margin: .4rem 0 .7rem; color: var(--muted); font-size: .76rem; line-height: 1.4; }
.c-key .c-key__feedback.is-success { color: var(--ok); }
.c-key .c-key__reset { display: flex; flex-direction: column; gap: .15rem; width: 100%; min-width: 0; margin-bottom: .9rem; font-size: .83rem; overflow-wrap: anywhere; }
.c-key .c-key__reset-label { color: var(--muted); font-size: .75rem; }
.c-key .c-key__reset-age { color: var(--faint); font-size: .75rem; }
.c-key .c-key__reset-age:empty { display: none; }
.c-key .c-key__request { margin-top: auto; width: 100%; min-width: 0; }
.c-key .c-key__request .button { min-height: 38px; width: 100%; font-size: .8rem; }
.c-key .c-key__request .button:disabled { cursor: default; opacity: .5; }
.c-key .c-key__hint, .c-key .c-key__request-status { font-size: .75rem; line-height: 1.5; margin: .55rem 0 0; color: var(--muted); }
.c-key .c-key__request-status { color: var(--brand-hi); margin: 0 0 .65rem; }
.c-key .c-key__request-status.is-approved { color: var(--ok); }
.c-key .c-key__request-status.is-denied { color: #f4a0aa; }
.c-key .c-key__ticket { display: inline-flex; align-items: center; gap: .3rem; margin: -.15rem 0 .8rem; color: var(--brand-hi); font-size: .76rem; text-underline-offset: 3px; }
.c-key .c-key__ticket:hover { color: var(--text); }
.c-key .c-key__ticket:focus-visible { outline: 2px solid var(--brand); outline-offset: 4px; border-radius: 3px; }
.c-key .c-key__cooldown { margin: 0 0 .85rem; padding: .7rem .8rem; border: 1px solid rgba(244, 160, 170, .18); border-radius: 9px; background: rgba(244, 160, 170, .045); }
.c-key .c-key__cooldown-heading { display: flex; justify-content: space-between; align-items: center; gap: .6rem; color: #f4a0aa; font-size: .76rem; line-height: 1.5; }
.c-key .c-key__cooldown-timer { flex-shrink: 0; font-family: ui-monospace, "Cascadia Code", Consolas, monospace; font-variant-numeric: tabular-nums; letter-spacing: .04em; }
.c-key .c-key__cooldown-until { display: block; margin-top: .35rem; color: var(--muted); font-size: .72rem; line-height: 1.6; overflow-wrap: anywhere; }
.c-key [hidden] { display: none !important; }
.c-reset-dialog { color: var(--text); background: var(--surface, #17151d); border: 1px solid var(--line-strong, #403749); border-radius: 16px; padding: 1.65rem; width: min(480px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; box-shadow: 0 24px 90px #0009; }
.c-reset-dialog::backdrop { background: #0a080dc9; backdrop-filter: blur(5px); }
.c-reset-dialog h2 { margin: 0 0 .7rem; font-size: 1.3rem; line-height: 1.25; }
.c-reset-dialog__heading p, .c-reset-dialog__eligibility { font-size: .8rem; line-height: 1.6; color: var(--muted); }
.c-reset-dialog__eligibility { margin: 1rem 0; padding: .7rem .8rem; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--raised); }
.c-reset-dialog label { display: flex; justify-content: space-between; gap: .7rem; margin-bottom: .5rem; font-size: .85rem; }
.c-reset-dialog__required { color: var(--muted); font-size: .7rem; }
.c-reset-dialog textarea { width: 100%; min-height: 120px; resize: vertical; border: 1px solid var(--line-strong); border-radius: 9px; background: var(--raised); color: var(--text); padding: .75rem .85rem; font: inherit; font-size: .85rem; line-height: 1.6; }
.c-reset-dialog textarea:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.c-reset-dialog textarea::placeholder { color: var(--faint); }
.c-reset-dialog__help { display: flex; justify-content: space-between; gap: .7rem; font-size: .7rem; color: var(--muted); margin-top: .4rem; }
.c-reset-dialog__actions { display: flex; justify-content: flex-end; gap: .6rem; border-top: 1px solid var(--line-strong); padding-top: 1rem; margin-top: 1rem; }
.c-reset-dialog__actions .button:disabled { cursor: default; opacity: .55; }
.c-reset-dialog .error { margin-top: .7rem; font-size: .8rem; }
@media (max-width: 420px) { .c-reset-dialog { padding: 1.2rem; } .c-reset-dialog__actions .button { flex: 1; } }
@media (prefers-reduced-motion: no-preference) {
  .c-key .c-key__copy.is-copied .c-key__check-icon { animation: customer-key-check-pop .22s ease-out; }
  @keyframes customer-key-check-pop { from { transform: scale(.7); opacity: .5; } to { transform: scale(1); opacity: 1; } }
}
@media (prefers-reduced-motion: reduce) {
  .c-key .c-key__copy, .c-key .c-key__check-icon { animation: none !important; transition: none !important; }
}
