/* ==========================================================
   1. GLOBAL TEXTURE (The Foundation)
   ========================================================== */
:root {
    --site-texture: url('/images/dark_sandstone_tile.jpg');
    --bg-overlay: rgba(0, 0, 0, 0.4); 
}

/* ==========================================================
   2. NIGHT MODE - SITE WIDE (Transparent Layers)
   ========================================================== */
@media (prefers-color-scheme: dark) {
  /* Texture goes on the very bottom layer */
  html {
      background: linear-gradient(var(--bg-overlay), var(--bg-overlay)), var(--site-texture) !important;
      background-repeat: repeat !important;
      background-attachment: fixed !important;
      background-color: #1a1a1a !important;
    }

   /* Make body and sections see-through to show the texture */
    body, .uk-section-default, .uk-page, main {
        background: transparent !important;
        background-color: transparent !important;
        color: #e5e5e5 !important;
    }

    h1, h2, h3, h4, h5, h6, .uk-heading-medium { color: #ffffff !important; }
    a { color: #66b3ff !important; }

    .uk-navbar-container:not(.uk-navbar-transparent) { background: #222 !important; }
    .uk-navbar-nav > li > a { color: #fff !important; }
}

/* ==========================================================
   3. THE VAULT (Solid Dark Override - REVISED)
   ========================================================== */
@media (prefers-color-scheme: dark) {
    html body .uk-modal-dialog, 
    html body .uk-modal-body,
    html body .uk-modal-footer,
    html body #secret-vault .uk-modal-dialog {
        background: #0f0f0f !important;
        background-color: #0f0f0f !important;
        border: 2px solid #3498db !important;
        color: #ffffff !important;
    }

    /* THE TEXT ENTRY BOX FIX */
    html body .uk-modal-dialog input,
    html body .uk-modal-dialog .uk-input,
    html body .uk-modal-dialog .uk-search-input {
        background-color: #1a1a1a !important;
        background: #1a1a1a !important;
        color: #3498db !important;
        border: 1px solid #333 !important;
    }

    /* THE CANCEL & DEFAULT BUTTONS FIX */
    html body .uk-modal-footer .uk-button-default,
    html body .uk-modal-dialog .uk-button-default,
    html body .uk-modal-close-default {
        background-color: #222 !important;
        background: #222 !important;
        color: #ffffff !important;
        border: 1px solid #444 !important;
    }

    /* THE OK / PRIMARY BUTTON (Ensuring it stays blue/visible) */
    html body .uk-modal-footer .uk-button-primary {
        background-color: #3498db !important;
        color: #ffffff !important;
    }
}

/* ==========================================================
   4. SEARCH ENGINE BOXES (Solid Dark Override)
   ========================================================== */
@media (prefers-color-scheme: dark) {
    html body .search-container.uk-card-default {
        background: #000000 !important;
        background-color: #1b1b1b !important;
        border: 2px solid #3498db !important;
    }

    html body .search-container .uk-search-input {
        background: #000000 !important;
        color: #ffffff !important;
        padding-left: 45px !important;  /* Creates space for the icon */
        border-radius: 500px;
    }

    /* Adjust the icon position if it looks off center */
    html body .search-container .uk-search-icon {
        left: 15px !important;
        color: #3498db !important;
    }
}

/* ==========================================================
   5. PERMANENT STYLES (Link Headings)
   ========================================================== */
.custom-link-header {
    text-align: center;
    padding: 0.1rem 0;
    width: 100%;
}
.custom-link-header span {
    text-decoration: underline;
    font-family: 'Montserrat', sans-serif;
    font-size: 2.0rem;
    font-weight: 100;
}