/* =========================================================================================================================== */
/*                                            🧩 MARKETS – BTC – GOLD                                                          */
/*                                            📍 static/css/pages/markets/btc_gold.css                                         */
/* =========================================================================================================================== */



/* Headline */
.headline-markets-btc-gold {
    font-family: "Courier New", monospace;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.16em;

    font-size: 2.5rem;
    text-align: center;
    margin-bottom: 1.25rem;

    background: linear-gradient(
        90deg,
        #f2c94c 0%,
        #f2c94c 60%,
        #fff4c2 100%
    );

    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;

    text-shadow:
        0 1px 0 rgba(255,255,255,0.25),
        0 0 8px rgba(242,201,76,0.45);
}


/* Controls – Typography */
.markets-label-gold,
.markets-select-gold,
.markets-date-input-gold {
    font-family: "Courier New", monospace;
    font-size: 1.05rem;
    letter-spacing: 0.08em;
    color: #f6e6b4;
}


/* Controls – Inputs */
.markets-select-gold,
.markets-date-input-gold {
    background: rgba(15,15,15,0.85);

    border: 0.0625rem solid rgba(242,201,76,0.35);
    border-radius: 0.45rem;
    padding: 0.35rem 0.55rem;

    outline: none;
    transition: all 0.15s ease;
}


/* Controls – Hover */
.markets-select-gold:hover,
.markets-date-input-gold:hover {
    border-color: rgba(242,201,76,0.65);
}


/* Controls – Focus */
.markets-select-gold:focus,
.markets-date-input-gold:focus {
    border-color: #f2c94c;

    box-shadow:
        0 0 0.375rem rgba(242,201,76,0.35);
}


/* Controls – Date Picker */
.markets-date-input-gold::-webkit-calendar-picker-indicator {
    filter: invert(1)
            sepia(1)
            saturate(4)
            hue-rotate(10deg)
            brightness(1.15);
    opacity: 0.85;
}


/* Controls – Hidden */
.markets-control-hidden {
    display: none;
}


/* Layout – Container */
#MARKETS_BTC_VS_GOLD_CONTAINER {
    margin-bottom: 3rem;
}


/* Info Box */
.info-box-markets-btc-gold {
    box-shadow:
        0 0 0 1px rgba(242,201,76,1),
        0 0 12px rgba(242,201,76,0.85);
}