/* Invictus PWA adjustments for ONE Wallet — layout only, no logic. */
:root {
  color-scheme: dark;
}

html,
body {
  overscroll-behavior-y: none;
}

body {
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

/* The extension "open in a new tab" affordance has no meaning in the app. */
#open-tab {
  display: none !important;
}

.invictus-return {
  appearance: none;
  background: transparent;
  border: 0;
  color: rgba(238, 232, 220, 0.62);
  font: inherit;
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  padding: 6px 10px 6px 0;
  cursor: pointer;
  text-decoration: none;
  transition: color 0.3s ease;
}

.invictus-return:hover,
.invictus-return:focus-visible {
  color: #c1aa72;
}

@media (display-mode: standalone) {
  .invictus-return {
    color: rgba(238, 232, 220, 0.5);
  }
}

/* Gesture gate for Google sign-in (Safari/iOS PWA pop-up policy). */
.gis-gate {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(5, 5, 10, 0.82);
  backdrop-filter: blur(10px);
}

.gis-gate-card {
  width: min(360px, 100%);
  border: 1px solid rgba(193, 170, 114, 0.38);
  border-radius: 18px;
  background: #0a0a10;
  padding: 22px;
  text-align: left;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
}

.gis-gate-title {
  margin: 0 0 8px;
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: #c1aa72;
}

.gis-gate-copy {
  margin: 0 0 18px;
  font-size: 13px;
  line-height: 1.55;
  color: rgba(238, 232, 220, 0.72);
}

.gis-gate-go,
.gis-gate-cancel {
  display: block;
  width: 100%;
  border-radius: 12px;
  padding: 13px 16px;
  font: inherit;
  font-size: 14px;
  cursor: pointer;
  transition: opacity 0.25s ease, border-color 0.25s ease;
}

.gis-gate-go {
  border: 0;
  background: linear-gradient(180deg, #d8c28c, #b69a5d);
  color: #0a0a10;
  font-weight: 600;
}

.gis-gate-cancel {
  margin-top: 10px;
  border: 1px solid rgba(238, 232, 220, 0.18);
  background: transparent;
  color: rgba(238, 232, 220, 0.62);
}

.gis-gate-go:hover,
.gis-gate-cancel:hover {
  opacity: 0.88;
}

/* Buy SOL with Apple Pay — matches the existing wallet card styling. */
.buy-sol {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.buy-sol-breakdown {
  display: grid;
  gap: 6px;
  padding: 10px 0;
  border-top: 1px solid rgba(193, 170, 114, 0.18);
  border-bottom: 1px solid rgba(193, 170, 114, 0.18);
}

.buy-sol-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 12px;
  color: rgba(238, 232, 220, 0.66);
}

.buy-sol-row strong {
  color: #eee8dc;
  font-weight: 500;
}

/* Wallet labels */
.wallet-name-chip {
  margin-left: auto;
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(222, 208, 174, .82);
  border: 1px solid rgba(201, 169, 97, .32);
  border-radius: 999px;
  padding: .22rem .6rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 48%;
}
.wallet-name-line {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .15rem;
  margin: .6rem 0 .2rem;
}
.wallet-name-line strong {
  font-size: .95rem;
  letter-spacing: .04em;
  color: rgba(237, 229, 210, .95);
}
.wallet-name-line span {
  font-size: .72rem;
  letter-spacing: .14em;
  color: rgba(222, 208, 174, .55);
}
.setting-row.name-row {
  align-items: center;
  gap: .75rem;
}
.setting-row.name-row .name-edit {
  display: flex;
  align-items: center;
  gap: .5rem;
  min-width: 0;
}
.setting-row.name-row input {
  width: 9.5rem;
  max-width: 45vw;
  padding: .4rem .6rem;
  border-radius: 10px;
  border: 1px solid rgba(201, 169, 97, .28);
  background: rgba(10, 10, 14, .7);
  color: rgba(237, 229, 210, .95);
  font: inherit;
  font-size: .85rem;
}
.setting-row.name-row input:focus {
  outline: none;
  border-color: rgba(201, 169, 97, .6);
}

/* Google account connection status (Settings) */
.google-account-card{margin:14px 0;padding:14px;border:1px solid rgba(212,175,55,.18);border-radius:16px;background:rgba(255,255,255,.03)}
.google-account-row{display:flex;align-items:center;gap:12px;margin-top:10px}
.google-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:0 0 auto;border:1px solid rgba(255,255,255,.14)}
.google-avatar.fallback{display:flex;align-items:center;justify-content:center;font-size:13px;letter-spacing:.04em;background:rgba(255,255,255,.08);color:var(--ivory,#f4f1ea)}
.google-account-who{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 auto}
.google-account-who strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.google-account-who .micro{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.google-status{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#4ade80}
.google-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.16)}
@media (max-width:360px){.google-account-row{flex-wrap:wrap}.google-status{width:100%}}

/* Compact Google account control on the existing wallet landing screen. */
.google-landing-control{position:relative;width:100%}
.google-landing-control>.gold{width:100%}
.google-landing-account{position:relative;width:100%}
.google-account-trigger{display:flex;align-items:center;width:100%;min-height:62px;gap:11px;padding:10px 12px;border:1px solid rgba(212,175,55,.28);border-radius:14px;background:rgba(8,8,12,.72);color:rgba(237,229,210,.96);font:inherit;text-align:left;cursor:pointer;transition:border-color .25s ease,background .25s ease,transform .25s ease}
.google-account-trigger:hover,.google-account-trigger:focus-visible{border-color:rgba(212,175,55,.56);background:rgba(14,13,17,.9);outline:none}
.google-account-trigger:active{transform:scale(.99)}
.google-account-trigger .google-avatar{width:38px;height:38px}
.google-account-trigger .google-status{margin-left:auto}
.google-menu-caret{color:rgba(237,229,210,.5);font-size:16px;transition:transform .2s ease}
.google-account-trigger[aria-expanded="true"] .google-menu-caret{transform:rotate(180deg)}
.google-account-menu{position:absolute;z-index:20;top:calc(100% + 8px);right:0;width:min(230px,100%);padding:6px;border:1px solid rgba(212,175,55,.24);border-radius:12px;background:#0a0a10;box-shadow:0 18px 50px rgba(0,0,0,.55)}
.google-account-menu button{display:block;width:100%;padding:11px 12px;border:0;border-radius:8px;background:transparent;color:rgba(237,229,210,.88);font:inherit;font-size:13px;text-align:left;cursor:pointer;transition:background .2s ease,color .2s ease}
.google-account-menu button:hover,.google-account-menu button:focus-visible{background:rgba(212,175,55,.1);color:#f4f1ea;outline:none}
#google-account-message:empty{display:none}
#google-account-message{margin:8px 2px 0;text-align:left}
@media (max-width:360px){.google-account-trigger .google-status{font-size:0;gap:0}.google-account-trigger .google-status .google-dot{display:block}.google-account-menu{width:100%}}

/* ---------------------------------------------------- Invictus Account (P1) */
.invictus-account{width:100%;margin-top:18px;padding-top:16px;border-top:1px solid rgba(212,175,55,.16);display:flex;flex-direction:column;gap:10px}
.invictus-account .section-line{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0}
.invictus-account>button{width:100%}
.account-identity{position:relative;width:100%}
.account-trigger{display:flex;align-items:center;width:100%;min-height:62px;gap:11px;padding:10px 12px;border:1px solid rgba(212,175,55,.28);border-radius:14px;background:rgba(8,8,12,.72);color:rgba(237,229,210,.96);font:inherit;text-align:left;cursor:pointer;transition:border-color .25s ease,background .25s ease,transform .25s ease}
.account-trigger:hover,.account-trigger:focus-visible{border-color:rgba(212,175,55,.56);background:rgba(14,13,17,.9);outline:none}
.account-trigger:active{transform:scale(.99)}
.account-avatar{display:grid;place-items:center;flex:0 0 auto;width:38px;height:38px;border-radius:50%;border:1px solid rgba(212,175,55,.35);background:rgba(212,175,55,.12);color:#e8dfc6;font-size:13px;letter-spacing:.04em}
.account-who{display:flex;flex-direction:column;min-width:0;flex:1 1 auto;gap:2px}
.account-who strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-who .micro{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-menu{position:absolute;z-index:20;top:calc(100% + 8px);right:0;width:min(230px,100%);padding:6px;border:1px solid rgba(212,175,55,.24);border-radius:12px;background:#0a0a10;box-shadow:0 18px 50px rgba(0,0,0,.55)}
.account-menu button{display:block;width:100%;padding:11px 12px;border:0;border-radius:8px;background:transparent;color:rgba(237,229,210,.88);font:inherit;font-size:13px;text-align:left;cursor:pointer;transition:background .2s ease,color .2s ease}
.account-menu button:hover,.account-menu button:focus-visible{background:rgba(212,175,55,.1);color:#f4f1ea;outline:none}
.account-form{display:flex;flex-direction:column;gap:12px;width:100%;animation:account-rise .28s ease both}
.account-field{display:flex;flex-direction:column;gap:6px}
.account-field label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(237,229,210,.62)}
.account-field input{width:100%;padding:13px 12px;border:1px solid rgba(212,175,55,.22);border-radius:12px;background:rgba(6,6,10,.8);color:#f4f1ea;font:inherit;transition:border-color .25s ease,background .25s ease}
.account-field input:focus{border-color:rgba(212,175,55,.55);background:rgba(12,12,18,.92);outline:none}
.account-message{margin:2px}
.account-message.good{color:rgba(212,175,55,.9)}
.account-message.bad{color:#e2a0a0}
@keyframes account-rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.account-form{animation:none}}

/* Invictus Cloud — encrypted backup status in Settings */
.cloud-card{display:flex;flex-direction:column;gap:10px}
.cloud-card .setting-row{margin:0}
.cloud-card .google-status.off{color:rgba(237,229,210,.55)}
.cloud-card .micro.good{color:rgba(212,175,55,.92)}
.cloud-card .micro.bad{color:#e2a0a0}
.cloud-card button{width:100%}
