/* Customer operations layer: billing, support and instance workflows. */
.client-shell .cp-page { display: grid; gap: 18px; }
.client-shell .cp-page > * { min-width: 0; }
.client-shell .cp-page .cp-hero {
    position: relative; overflow: hidden; min-height: 168px; margin: 0;
    padding: 28px; border: 1px solid #214c59; border-radius: 8px;
    background-color: #102f3d; background-image: url('/images/cloud-workspace-v2.png');
    background-repeat: no-repeat; background-position: right center; background-size: min(48%, 620px) auto;
    color: #f6fbfc; box-shadow: 0 20px 44px rgba(16,47,61,.13);
}
.client-shell .cp-page .cp-hero::after { content:""; position:absolute; inset:0; background:rgba(16,47,61,.32); pointer-events:none; }
.client-shell .cp-page .cp-hero > :not(.cw-cloud-art) { position: relative; z-index: 1; }
.client-shell .cp-page .cp-hero .cp-title { color:#fff; font-size:clamp(28px,4vw,42px); line-height:1.08; }
.client-shell .cp-page .cp-hero .cp-subtitle { color:#cbe0e5; max-width:700px; }
.client-shell .cp-page .cp-hero .cp-eyebrow { color:#91ead3; }
.client-shell .cp-page .cp-hero .cp-btn-ghost { color:#f6fbfc; border-color:#53727c; background:rgba(16,47,61,.72); }
.client-shell .cp-page .cp-card,.client-shell .cp-page .cp-stat { border-color:#d8e4e7; box-shadow:0 12px 30px rgba(16,47,61,.06); }
.client-shell .cp-page .cp-card { overflow:hidden; }
.client-shell .cp-page .cp-card-head { background:#fbfdfd; border-bottom-color:#dce7e9; }
.client-shell .cp-page .form-control,.client-shell .cp-page .form-select { min-height:44px; border-color:#cbdade; border-radius:7px; }
.client-shell .cp-page textarea.form-control { min-height:120px; }
.client-shell .cp-page :is(.form-control,.form-select):focus { border-color:#078675; box-shadow:0 0 0 3px rgba(7,134,117,.13); }
.client-shell .cp-page .cp-table tbody tr { transition:background-color .18s ease,transform .18s ease; }
.client-shell .cp-page .cp-table tbody tr:hover { background:#f3faf8; }

/* Wallet */
.wallet-workspace .ww-layout { align-items:start; }
.wallet-workspace .ww-funding { border-top:4px solid #078675; }
.wallet-workspace .ww-step { border-color:#d8e6e7; background:#fbfdfd; }
.wallet-workspace .ww-step-title > span { background:#102f3d; color:#fff; }
.wallet-workspace .ww-amount-field { border-color:#b8d5d2; background:#f2fbf8; }
.wallet-workspace .ww-amount-field > span { background:#078675; color:#fff; }
.wallet-workspace .ww-presets button { border-color:#c9dadd; background:#fff; color:#183945; transition:transform .18s ease,border-color .18s ease,background .18s ease; }
.wallet-workspace .ww-presets button:hover,.wallet-workspace .ww-presets button[aria-pressed="true"] { border-color:#078675; background:#eaf8f4; transform:translateY(-2px); }
.wallet-workspace .ww-method { min-height:76px; border:1px solid #d5e2e5; background:#fff; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.wallet-workspace .ww-method:hover { transform:translateY(-2px); box-shadow:0 12px 24px rgba(16,47,61,.08); }
.wallet-workspace .ww-method:has(input:checked) { border-color:#078675; background:#eefaf7; box-shadow:0 0 0 2px rgba(7,134,117,.12); }
.wallet-workspace .ww-method-icon { background:#edf4ff; color:#2563eb; }
.wallet-workspace .ww-method:nth-child(3n+2) .ww-method-icon { background:#e8f8f3; color:#078675; }
.wallet-workspace .ww-method:nth-child(3n) .ww-method-icon { background:#fff5e5; color:#a86500; }
.wallet-workspace .ww-balance { position:relative; overflow:hidden; background:#078675; color:#fff; border:0; box-shadow:0 18px 36px rgba(7,134,117,.22); }
.wallet-workspace .ww-balance::after { content:""; position:absolute; width:150px; height:150px; right:-48px; bottom:-70px; border:24px solid rgba(255,255,255,.12); border-radius:50%; }
.wallet-workspace .ww-balance :is(.ww-balance-label,.ww-balance-value,.ww-balance-owner,.ww-balance-owner small,.ww-balance a) { color:#fff; }
.wallet-workspace .ww-balance-owner { display:flex; flex-direction:column; gap:3px; }
.wallet-workspace .ww-balance-owner small { opacity:.78; font-size:11px; letter-spacing:0; }
.wallet-workspace .ww-transaction { border-left:3px solid #2563eb; }
.wallet-workspace .ww-transaction:has(.ww-mint) { border-left-color:#078675; }

/* Support */
.support-workspace .cp-grid .cp-stat { position:relative; overflow:hidden; border-top:4px solid #2563eb; }
.support-workspace .cp-grid > :nth-child(2) .cp-stat { border-top-color:#d94670; }
.support-workspace .cp-grid > :nth-child(3) .cp-stat { border-top-color:#078675; }
.support-workspace .cp-grid > :nth-child(4) .cp-stat { border-top-color:#d58a0a; }
.support-workspace .cp-filter { border-radius:6px; }
.support-workspace .cp-filter.active { background:#102f3d; color:#fff; border-color:#102f3d; }
.support-create .cp-choice { border:1px solid #d5e2e5; border-radius:7px; transition:transform .18s ease,border-color .18s ease,background .18s ease; }
.support-create .btn-check:checked + .cp-choice { border-color:#078675; background:#effaf7; box-shadow:0 0 0 2px rgba(7,134,117,.1); transform:translateY(-2px); }
.support-thread .cp-thread { display:grid; gap:16px; }
.support-thread {grid-template-columns:minmax(0,1fr)}
.support-thread .cp-message {display:grid;grid-template-columns:36px minmax(0,1fr);gap:10px;align-items:start;min-width:0}
.support-thread .cp-message-bubble {min-width:0;padding:14px;border-radius:8px;border:1px solid var(--panel-line,#d9e5e7);background:var(--panel-surface,#fff);box-shadow:none}
.support-thread .cp-message-support .cp-message-bubble {border-left:3px solid #078675;background:#f3fbf8}
.support-thread .cp-avatar {display:grid;place-items:center;width:36px;height:36px;overflow:hidden;border-radius:6px;background:#2563eb;color:#fff;font-size:15px}
.support-thread .cp-avatar img {width:100%;height:100%;object-fit:cover}
.support-thread .cp-message-support .cp-avatar {background:#087b68}
.support-thread .cp-message-meta {display:flex;align-items:center;flex-wrap:wrap;gap:5px 12px;margin-bottom:8px;font-size:11px;color:var(--panel-muted,#52687a)}
.support-thread .cp-message-meta strong {font-size:13px;font-weight:650;overflow-wrap:anywhere}
.support-thread .cp-message-body {font-size:13px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--panel-text,#20313d)}
[data-theme=dark] .support-thread .cp-message-support .cp-message-bubble {background:#1b3530;border-left-color:#70d6b4}
@media(max-width:480px){.support-thread .cp-message{grid-template-columns:30px minmax(0,1fr);gap:8px}.support-thread .cp-avatar{width:30px;height:30px;font-size:13px}.support-thread .cp-message-bubble{padding:11px}}

/* Instance identity and command dock */
.cloud-instance .ci-identity-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:-6px 0 18px; }
.cloud-instance .ci-identity-strip article { display:flex; align-items:center; gap:12px; min-width:0; padding:14px; border:1px solid #d6e3e6; border-radius:8px; background:#fff; box-shadow:0 10px 24px rgba(16,47,61,.06); }
.cloud-instance .ci-identity-strip article > div { min-width:0; }
.cloud-instance .ci-identity-strip small { display:block; color:#6b7f87; font-size:11px; font-weight:700; text-transform:uppercase; }
.cloud-instance .ci-identity-strip strong { display:block; overflow:hidden; color:#173541; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.cloud-instance .ci-identity-icon { display:grid; place-items:center; width:46px; height:46px; flex:0 0 46px; border-radius:8px; background:#edf4ff; color:#2563eb; font-size:23px; }
.cloud-instance .ci-identity-icon.is-app { background:#f3edff; color:#7147d9; }
.cloud-instance .ci-identity-icon.is-location { background:#eef9f5; color:#078675; }
.cloud-instance .ci-identity-icon.is-reference { background:#fff5e5; color:#a86500; }
.cloud-instance .ci-identity-icon img { width:34px; height:25px; object-fit:cover; }
.cloud-instance .ci-controls { border-left:4px solid #078675; }
.cloud-instance .ci-actions { align-items:center; }
.cloud-instance .ci-actions form { margin:0; }
.cloud-instance .ci-power-button { display:inline-grid; place-items:center; width:46px; height:46px; padding:0; border:1px solid transparent; border-radius:8px; text-decoration:none; font-size:17px; transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease; }
.cloud-instance .ci-power-button:hover:not(:disabled) { transform:translateY(-3px); box-shadow:0 10px 22px rgba(16,47,61,.14); }
.cloud-instance .ci-power-button:focus-visible { outline:3px solid rgba(37,99,235,.25); outline-offset:2px; }
.cloud-instance .ci-power-button.is-start { background:#078675; color:#fff; }
.cloud-instance .ci-power-button.is-stop { background:#fff0f3; border-color:#f1b9c7; color:#c3244f; }
.cloud-instance .ci-power-button.is-restart { background:#fff5e5; border-color:#eed29c; color:#9b6300; }
.cloud-instance .ci-power-button.is-console { background:#edf4ff; border-color:#bfd1fa; color:#2563eb; }
.cloud-instance .ci-power-button:disabled { opacity:.45; cursor:not-allowed; }
.cloud-instance .ci-metric,.cloud-instance .ci-performance-main,.cloud-instance .ci-allocation,.cloud-instance .ci-section { transition:transform .2s ease,box-shadow .2s ease; }
.cloud-instance .ci-metric:hover,.cloud-instance .ci-section:hover { transform:translateY(-2px); box-shadow:0 16px 34px rgba(16,47,61,.09); }

@media (prefers-reduced-motion:no-preference) {
    .client-shell[data-motion="on"] .cp-page > * { animation:operations-rise .45s ease both; }
    .client-shell[data-motion="on"] .cp-page > *:nth-child(2) { animation-delay:.04s; }
    .client-shell[data-motion="on"] .cp-page > *:nth-child(3) { animation-delay:.08s; }
    .client-shell[data-motion="on"] .ci-state.is-running::before { animation:operations-pulse 1.8s ease-in-out infinite; }
}
@keyframes operations-rise { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@keyframes operations-pulse { 50% { box-shadow:0 0 0 6px rgba(7,134,117,0); } }

@media (max-width:1050px) { .cloud-instance .ci-identity-strip { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:767px) {
    .client-shell .cp-page .cp-hero { min-height:auto; padding:22px 18px; background-position:130% center; background-size:78% auto; }
    .client-shell .cp-page .cp-hero .cp-title { font-size:30px; }
    .cloud-instance .ci-identity-strip { grid-template-columns:1fr; }
    .cloud-instance .ci-actions,.cloud-instance .ci-actions form { width:auto !important; }
    .cloud-instance .ci-actions .ci-power-button { width:48px !important; }
    .wallet-workspace .ww-transaction { grid-template-columns:auto minmax(0,1fr); }
    .wallet-workspace .ww-transaction > :is(.cp-badge,.ww-transaction-value) { grid-column:2; justify-self:start; }
}
@media (prefers-reduced-motion:reduce) { .client-shell .cp-page * { animation:none !important; transition:none !important; } }
