/* --------------------------------------------------------------
   styles_wallet.css – styling for wallet.html
   -------------------------------------------------------------- */

/* --------------------------------------------------------------
   1️⃣  Colour palette – CSS custom properties (shared with other pages)
   -------------------------------------------------------------- */
:root {
    /* Light‑mode defaults */
    --bg-color:       #ffffff;
    --text-color:     #111111;
    --accent-color:   #bfc147;
    --link-color:     #c147a3;
    --code-bg:        #f5f5f5;
    --btn-bg:         #e0e0e0;
    --btn-fg:         #111111;
}
[data-theme="dark"] {
    --bg-color:       #000000;
    --text-color:     #e0e0e0;
    --accent-color:   #bfc147;
    --link-color:     #c147a3;
    --code-bg:        #1a1a1a;
    --btn-bg:         #333333;
    --btn-fg:         #e0e0e0;
}

/* --------------------------------------------------------------
   2️⃣  Global resets & base styling
   -------------------------------------------------------------- */
html { box-sizing: border-box; font-size: 100%; }
*, *::before, *::after { box-sizing: inherit; margin:0; padding:0; }

body {
    background: var(--bg-color);
    color:      var(--text-color);
    font-family: system-ui, -apple-system, BlinkMacSystemFont,
                 "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    line-height: 1.6;
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem 6%;
}

/* --------------------------------------------------------------
   3️⃣  Layout components (same as other pages)
   -------------------------------------------------------------- */
.site-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
}
.site-title {
    font-size: 2.2rem;
    color: var(--accent-color);
}
.theme-toggle {
    background:none;
    border:2px solid var(--link-color);
    border-radius:.4rem;
    color:var(--link-color);
    cursor:pointer;
    font-size:1rem;
    padding:.3rem .6rem;
    transition:background-color .2s ease,color .2s ease;
}
.theme-toggle:hover,
.theme-toggle:focus {
    background:var(--link-color);
    color:var(--bg-color);
}

/* Content */
.content { font-size:1rem; }
.wallet-section p { margin-bottom:1.2rem; }

/* Links */
a { color:var(--link-color); text-decoration:none; }
a:hover, a:focus { text-decoration:underline; }

/* QR code wrapper */
.qr-wrapper {
    text-align:center;
    margin: 1.5rem 0;
}
.qr-wrapper img {
    max-width:100%;
    height:auto;
    border:2px solid var(--accent-color);
    border-radius:0.5rem;
}

/* Bitcoin address block */
.btc-address {
    font-family:"Courier New",Courier,monospace;
    background:var(--code-bg);
    padding:.15rem .35rem;
    border-radius:.3rem;
    word-break:break-all;
}

/* Copy button */
.copy-btn {
    margin-left:.5rem;
    background:var(--btn-bg);
    color:var(--btn-fg);
    border:none;
    border-radius:.3rem;
    padding:.2rem .5rem;
    cursor:pointer;
    font-size:.9rem;
}
.copy-btn:hover { opacity:0.85; }

/* --------------------------------------------------------------
   4️⃣  Responsive tweaks
   -------------------------------------------------------------- */
@media (max-width:480px){
    .site-title{font-size:1.8rem;}
    .theme-toggle{font-size:.9rem;padding:.2rem .5rem;}
}

/* --------------------------------------------------------------
   5️⃣  Preserve original comment block (do NOT delete)
   -------------------------------------------------------------- */
/* https://sss08.pages.dev */