/* --- FONT & COLOR DEFINITIONS --- */
@font-face {
    font-family: 'RiverAvenue';
    src: url('../assets/ucp3/fonts/riverave.ttf') format('truetype');
}

@font-face {
    font-family: 'Dayrom';
    src: url('../assets/ucp3/fonts/DAYROM__.ttf') format('truetype');
}

:root {
    --ucp-top-bg: #2d2d2d;
    --ucp-parchment: #e9dcc9;
    --ucp-text: #2c2217;
    --ucp-gold: #c8a868;
    --ucp-footer-bg: #1e1e1e;
    --ucp-footer-text: #a0a0a0;
    --ucp-button-text: #e0d6c6;
    --ucp-link-color: #8a5a2a;
    --ucp-main-grey: #a0a0a0;
    --ucp-text-muted: #5c4d3d;
}

/* --- CORE LAYOUT --- */
html {
    box-sizing: border-box;
}
*, *:before, *:after {
    box-sizing: inherit;
}

body {
    font-family: 'Dayrom', sans-serif;
    background-color: #000;
    background-image: url('../assets/backgrounds/bg_richard.webp');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    color: var(--ucp-text);
    margin: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.top-bar {
    background-color: var(--ucp-top-bg);
    background-image: url('../assets/backgrounds/awesomebackdrop_wide.webp');
    background-size: cover;
    background-position: center bottom;
    padding: 1rem 1.5rem 0 1.5rem;
    flex-shrink: 0;
    position: relative;
    z-index: 20; /* Ensure header is on top */
}

.content-wrapper {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: linear-gradient(115deg, rgba(0,0,0,0.95) 15%, rgba(0,0,0,0) 60%);
    min-height: 0;
}

.footer-bar {
    background-color: var(--ucp-footer-bg);
    color: var(--ucp-footer-text);
    padding: 0.35rem 1rem;
    text-align: right;
    font-size: 0.8rem;
    border-top: 2px solid #333;
    flex-shrink: 0;
}

/* --- GLOBAL FONT STYLES --- */
.ucp-header-font {
    font-family: 'RiverAvenue', cursive;
    color: var(--ucp-text); /* Default to dark text */
}

/* --- CUSTOM SEARCH INPUT --- */
.ucp-search-input {
    background-color: rgba(12, 12, 12, 0.8);
    color: rgb(155, 155, 155);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 5px 10px;
    height: 35px;
    border-radius: 2px;
    transition: all 0.2s ease-in-out;
}

.ucp-search-input:focus {
    outline: none;
    border-color: var(--ucp-gold);
    background-color: rgba(0, 0, 0, 0.8);
    color: rgb(248, 255, 188);
}