/* =========================
   ALX Site Tools - frontend
   ========================= */

::selection {
    color: #fff;
    background: #333;
    text-shadow: none;
}

/* Modal / overlay helpers */
.alxst-overlay[hidden] { display: none !important; }
.alxst-overlay {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0,0,0,.7);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.alxst-modal {
    width: min(500px, 90vw);
    padding: 30px;
    border: 1px solid #333;
    border-radius: 10px;
    background: rgba(0,0,0,.88);
    color: #fff;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,.5);
    animation: alxstFadeIn .35s ease-out;
}
.alxst-modal-small { width: min(400px, 90vw); }
.alxst-modal h2 { color: #fff; }
.alxst-modal .alxst-danger { color: #ff5252; }
.alxst-modal a { color: #ffd700; }
.alxst-buttons { display:flex; align-items:center; justify-content:center; gap:15px; flex-wrap:wrap; margin-top:20px; }
.alxst-btn { min-width:140px; padding:12px 25px; border:0; border-radius:5px; cursor:pointer; font-weight:700; background:#bcbcbc; color:#111; }
.alxst-btn-accept { background:#4caf50; color:#fff; }
.alxst-btn-decline { background:#f44336; color:#fff; }
.alxst-btn-register { background:#ffd700; color:#1a1a1a; }
.alxst-btn-later { background:transparent; color:#ffd700; border:2px solid #ffd700; }
.alxst-countdown { font-size:14px; opacity:.75; }
.alxst-benefits { max-width:350px; margin:20px auto; text-align:left; }
@keyframes alxstFadeIn { from { opacity:0; transform:translateY(-20px); } to { opacity:1; transform:none; } }

/* =========================
   Night mode
   Migrated from Theme Custom CSS/JS
   ========================= */
body.night-mode {
    background-color: var(--alxst-night-page-bg, #121212);
    color: var(--alxst-night-text, #e0e0e0);
}

body.night-mode #top-bar-wrap,
body.night-mode #top-bar,
body.night-mode #site-header,
body.night-mode .footer-widgets-inner,
body.night-mode #footer-widgets,
body.night-mode .site-content,
body.night-mode .page-header,
body.night-mode .container,
body.night-mode .page-header-inner,
body.night-mode .meta,
body.night-mode #top-bar-content,
body.night-mode .page-header-title,
body.night-mode #main,
body.night-mode #content,
body.night-mode h3#reply-title,
body.night-mode h4.widget-title,
body.night-mode .wp-block-search__input,
body.night-mode #s {
    background-color: var(--alxst-night-surface-bg, #1e1e1e);
    color: var(--alxst-night-text, #e0e0e0) !important;
}

body.night-mode .wp-block-search__input::placeholder,
body.night-mode #s::placeholder {
    color: var(--alxst-night-text, #e0e0e0);
}

body.night-mode a,
body.night-mode .meta a {
    color: var(--alxst-night-link, #bb86fc) !important;
}

body.night-mode .site-footer a,
body.night-mode .footer-widget a {
    color: var(--alxst-night-link, #bb86fc);
}

#night-mode-toggle {
    position: fixed;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--alxst-night-toggle-bg, #bfbfbf);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    z-index: 1000;
    line-height: 1;
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
    color: var(--alxst-night-toggle-icon, #333333) !important;
}

#night-mode-toggle svg {
    width: 30px;
    height: 30px;
    display: block;
}
body.night-mode #night-mode-toggle {
    background-color: var(--alxst-night-toggle-bg-on, #e0e0e0);
    color: var(--alxst-night-toggle-icon-on, #6f42c1) !important;
}

body.night-mode textarea#comment {
    background-color: var(--alxst-night-input-bg, #333333);
    color: var(--alxst-night-text, #e0e0e0);
    border: 1px solid var(--alxst-night-input-border, #555555);
}
body.night-mode textarea#comment::placeholder {
    color: var(--alxst-night-text, #e0e0e0);
}
body.night-mode #block-6 {
    background-color: var(--alxst-night-surface-bg, #1e1e1e) !important;
    color: var(--alxst-night-text, #e0e0e0) !important;
}
body.night-mode #block-6 a {
    color: var(--alxst-night-text, #e0e0e0) !important;
}
body.night-mode #block-6 a:hover {
    color: var(--alxst-night-link, #bb86fc) !important;
}
body.night-mode #block-6 h2 {
    color: var(--alxst-night-text, #e0e0e0) !important;
}

/* =========================
   Top bar visual rules
   ========================= */
.top-bar-content { display: none; }
.home .top-bar-content { display: block; }
:not(.home) .top-bar-content.visible { display: block; }
#top-bar-wrap { position: relative; text-align: center; }
.toggle-content-btn {
    display: inline-block;
    margin: -6px auto;
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    font-size: 16px;
    text-align: center;
    padding: 10px;
    z-index: 9999;
}
.home .toggle-content-btn { display: none; }
.menu-item-button {
    display: inline-block;
    margin: 0;
    padding: 0;
    vertical-align: middle;
    position: relative;
}
.toggle-content-btn .fa-chevron-down,
.toggle-content-btn .fa-chevron-up { font-size: 16px; }

/* =========================
   Related Posts
   ========================= */
.related-posts {
    text-align: center;
    position: relative;
    overflow: hidden;
    max-width: 100%;
}
.related-container {
    display: flex;
    flex-direction: column;
    max-height: 395px;
    overflow-y: auto;
    padding: 10px;
}
.related-rows {
    display: flex;
    flex-wrap: wrap;
    column-gap: 12px;
    row-gap: 15px;
    justify-content: center;
}
.related-column {
    flex: 1 0 32%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}
.related-column img.related-thumb {
    width: 100%;
    height: auto;
    max-height: 200px;
    object-fit: contain;
    margin-bottom: 5px;
}

/* =========================
   Search
   ========================= */
.search-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 25px;
}
.search-item {
    background: #fff;
    padding: 15px;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    min-width: 0;
}
.search-entry-thumbnail {
    margin: 10px 0 12px;
    text-align: center;
}
.search-entry-thumbnail img {
    width: 100%;
    height: auto;
    max-height: 360px;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}
.alx-search-count-posts,
.alx-search-heading-posts { color: blue; }
.alx-search-heading-posts { margin-top: 20px; }
.alx-search-count-pages { color: red; margin-top: 40px; }
.alx-search-heading-pages { color: red; margin-top: 10px; }
@media (max-width: 900px) {
    .search-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
    .search-grid { grid-template-columns: 1fr; }
}

/* Search cards in night mode */
body.night-mode .search-item {
    background: var(--alxst-night-surface-bg, #1e1e1e);
    border-color: var(--alxst-night-input-border, #555555);
    color: var(--alxst-night-text, #e0e0e0);
}

/* =========================
   bbPress
   ========================= */
.bbp-template-notice.info { display: none !important; }
#bbpress-forums div.bbp-reply-header {
    background-color: #716b6b !important;
    color: #ffffff !important;
}
.bbp-first-post-sticky { border:2px solid #ddd; padding:15px; margin-bottom:20px; background:#f9f9f9; }
.alx-reply-status-controls {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-right: 8px;
    vertical-align: middle;
}
.bbp-status-badge {
    display: inline-block;
    width: auto;
    padding: 3px 8px;
    margin: 0;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1.4;
}
.bbp-status-badge.open { background:#ff9800; color:#fff; }
.bbp-status-badge.completed { background:#4caf50; color:#fff; }
.bbp-link-locked { font-weight:600; }
.alx-mark-answered {
    margin: 0;
    padding: 3px 8px;
    cursor: pointer;
    line-height: 1.4;
    font-size: 11px;
}

/* =========================
   Categories
   ========================= */
.cat-grid {
    display: grid;
    grid-template-columns: repeat(var(--alxst-cat-columns, 4), minmax(0, 1fr));
    gap: 14px;
    list-style: none;
    padding: 0;
    margin: 0;
    overflow: visible;
}
.cat-grid > li {
    position: relative;
    background: var(--alxst-cat-bg, #f2f2f2);
    padding: 12px;
    border-radius: 6px;
    text-align: center;
    transition: background-color .2s ease, color .2s ease;
    list-style: none;
    margin: 0;
    overflow: visible;
}
.cat-grid > li > a {
    color: var(--alxst-cat-text, #333333);
    text-decoration: none;
    font-weight: 500;
    display: block;
}
.cat-grid > li:hover,
.cat-grid > li:focus-within {
    background: var(--alxst-cat-hover-bg, #4db2ff);
}
.cat-grid > li:hover > a,
.cat-grid > li:focus-within > a {
    color: var(--alxst-cat-hover-text, #ffffff);
}

/* Nested categories no longer enlarge the parent grid button. */
.cat-grid > li > ul.children {
    display: none !important;
    position: absolute;
    z-index: 9999;
    top: calc(100% + 2px);
    left: 0;
    min-width: 100%;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 6px;
    list-style: none;
    background: var(--alxst-cat-sub-bg, #ffffff);
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(0,0,0,.18);
    text-align: left;
}
.cat-grid > li:hover > ul.children,
.cat-grid > li:focus-within > ul.children {
    display: block !important;
}
.cat-grid ul.children li {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
    background: transparent;
    border-radius: 4px;
    text-align: left;
}
.cat-grid ul.children li > a {
    display: block;
    padding: 8px 10px;
    color: var(--alxst-cat-sub-text, #333333);
    text-decoration: none;
    white-space: normal;
    overflow-wrap: anywhere;
    border-radius: 4px;
}
.cat-grid ul.children li:hover > a,
.cat-grid ul.children li:focus-within > a {
    background: var(--alxst-cat-hover-bg, #4db2ff);
    color: var(--alxst-cat-hover-text, #ffffff);
}

/* Deeper levels open to the right. */
.cat-grid ul.children ul.children {
    display: none;
    position: absolute;
    top: -6px;
    left: calc(100% + 4px);
    min-width: 180px;
    margin: 0;
    padding: 6px;
    list-style: none;
    background: var(--alxst-cat-sub-bg, #ffffff);
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(0,0,0,.18);
}
.cat-grid ul.children li:hover > ul.children,
.cat-grid ul.children li:focus-within > ul.children {
    display: block;
}

@media (max-width: 900px) {
    .cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
    .cat-grid { grid-template-columns: 1fr; }
    .cat-grid > li > ul.children,
    .cat-grid ul.children ul.children {
        left: 0;
        right: auto;
        max-width: 88vw;
    }
}

/* =========================
   Search filter + page link previews
   ========================= */
.alx-search-type-filter {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin: 0 0 24px;
    padding: 12px;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    background: #fafafa;
}
.alx-search-type-filter label {
    font-weight: 600;
    margin: 0;
}
.alx-search-type-filter select {
    min-width: 170px;
}
.alx-page-link-preview {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #e5e5e5;
    text-align: center;
}
.alx-page-preview-images {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: flex-start;
    justify-content: center;
    margin: 0 0 12px;
}
.alx-page-preview-image {
    flex: 0 0 auto;
    width: min(var(--alxst-page-preview-size, 200px), 100%);
    max-width: 100%;
}
.alx-page-preview-image a {
    display: block;
    text-align: center;
    cursor: pointer;
}
.alx-page-preview-image a.alxst-direct-image-link {
    outline: none;
}
.alx-page-preview-image img {
    display: block;
    width: var(--alxst-page-preview-size, 200px);
    height: var(--alxst-page-preview-size, 200px);
    max-width: 100%;
    object-fit: contain;
    border-radius: 4px;
    margin: 0 auto;
}
.alx-page-link-preview-title {
    margin: 0 0 6px;
    font-size: .92em;
    font-weight: 700;
    text-align: center;
}
.alx-page-link-preview ul {
    margin: 0 auto;
    padding: 0;
    list-style-position: inside;
    text-align: center;
}
.alx-page-link-preview li {
    margin: 4px 0;
    overflow-wrap: anywhere;
    text-align: center;
}
.alx-page-link-host {
    opacity: .65;
    font-size: .88em;
    margin-left: 4px;
}
body.night-mode .alx-search-type-filter,
body.night-mode .alx-page-link-preview {
    border-color: var(--alxst-night-input-border, #555555);
}
body.night-mode .alx-search-type-filter {
    background: var(--alxst-night-surface-bg, #1e1e1e);
    color: var(--alxst-night-text, #e0e0e0);
}


/* Result-type selector added to standard WordPress/OceanWP search forms. */
.alx-search-form-type-wrap {
    display: inline-block;
    margin-left: 6px;
    vertical-align: middle;
}
.alx-search-form-type {
    max-width: 160px;
    min-height: 36px;
}
body.night-mode .alx-search-form-type,
body.night-mode .alx-search-type-filter select {
    background: var(--alxst-night-input-bg, #333333);
    border-color: var(--alxst-night-input-border, #555555);
    color: var(--alxst-night-text, #e0e0e0);
}

/* Linked images: preserve pointer behavior while bypassing theme lightboxes. */
a.alxst-image-link-new-tab {
    cursor: pointer;
}


/* ALX Site Tools - BBCode compatibility */
.alxst-bbcode-u { text-decoration: underline; }
/* Match the old [CENTER] BBCode behavior even when nested shortcodes
   render their own block-level wrappers (for example protected/download links). */
.alxst-bbcode-center {
    width: 100%;
    text-align: center;
}
.alxst-bbcode-center > *,
.alxst-bbcode-center > div,
.alxst-bbcode-center > form,
.alxst-bbcode-center > table,
.alxst-bbcode-center > section,
.alxst-bbcode-center > article {
    margin-left: auto;
    margin-right: auto;
}
.alxst-bbcode-center div,
.alxst-bbcode-center form,
.alxst-bbcode-center p {
    text-align: center;
}
.alxst-bbcode-center table {
    margin-left: auto !important;
    margin-right: auto !important;
}
.alxst-bbcode-center button,
.alxst-bbcode-center input[type="button"],
.alxst-bbcode-center input[type="submit"],
.alxst-bbcode-center .button {
    margin-left: auto;
    margin-right: auto;
}
.alxst-bbcode-quote { margin: 12px 0; }
.alxst-bbcode-quote blockquote { margin: 6px 0 0; padding: 10px 14px; border-left: 3px solid currentColor; }
.alxst-bbcode-code pre { overflow: auto; white-space: pre-wrap; }
.alxst-bbcode-video { max-width: 100%; overflow: hidden; }
.alxst-bbcode-video iframe { max-width: 100%; border: 0; }
.alxst-bbcode-spoiler { margin: 12px 0; }
.alxst-bbcode-spoiler summary { cursor: pointer; font-weight: 600; }
.alxst-bbcode-spoiler-content { padding: 8px 0; }
.alxst-bbcode-table { border-collapse: collapse; }
.alxst-bbcode-table td { padding: 4px 8px; }
.alxst-bbcode-textarea { max-width: 100%; }

/* Multisite network search source label */
.alx-search-source-site {
    margin: 2px 0 8px;
    text-align: center;
    font-size: .85em;
    opacity: .82;
}


/* Keep search scope options hidden until the visitor interacts with the search field. */
.alx-search-form-type-wrap.alxst-search-options-collapsible {
    display: none;
}
form.alxst-search-options-focused .alx-search-form-type-wrap.alxst-search-options-collapsible,
form.alxst-search-options-has-value .alx-search-form-type-wrap.alxst-search-options-collapsible,
form:focus-within .alx-search-form-type-wrap.alxst-search-options-collapsible,
.alx-search-form-type-wrap.alxst-search-options-force-visible {
    display: block;
}

/* Result-type selector inside standard and OceanWP search forms.
   The wrapper is appended at the end of the form; JS adds a form-level
   position class so the selector can sit to the right or below. */
form.alxst-search-selector-below {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
form.alxst-search-selector-below > .alx-search-form-type-wrap {
    order: 99;
    flex: 0 0 100%;
    width: 100%;
    margin: 6px 0 0;
}
form.alxst-search-selector-below > .alx-search-form-type-wrap .alx-search-form-type {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
}

form.alxst-search-selector-right {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 6px;
}
form.alxst-search-selector-right > .alx-search-form-type-wrap {
    order: 99;
    flex: 0 0 auto;
    width: auto;
    margin: 0 0 0 6px;
}
form.alxst-search-selector-right > .alx-search-form-type-wrap .alx-search-form-type {
    width: auto;
    min-width: 130px;
    max-width: 170px;
    box-sizing: border-box;
}

/* OceanWP shortcode wrapper follows the same positioning rules. */
.alx-search-shortcode-type-wrap .alx-search-form-type {
    min-height: 36px;
}

@media (max-width: 600px) {
    form.alxst-search-selector-right {
        flex-wrap: wrap;
    }
    form.alxst-search-selector-right > .alx-search-form-type-wrap {
        flex: 0 0 100%;
        width: 100%;
        margin: 6px 0 0;
    }
    form.alxst-search-selector-right > .alx-search-form-type-wrap .alx-search-form-type {
        width: 100%;
        max-width: none;
    }
}


/* OceanWP shortcode: when the selector is configured on the right, keep the
   shortcode's own width on the search form and center the combined unit. */
.alxst-ocean-search-shell.alxst-ocean-search-shell-right {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: max-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}
.alxst-ocean-search-shell-right > form.alxst-ocean-search-form-detached-selector {
    flex: 0 0 auto;
    margin: 0 !important;
}
.alxst-ocean-search-shell-right > .alx-search-form-type-wrap.alxst-search-options-detached {
    display: none;
    flex: 0 0 auto;
    width: auto;
    margin: 0;
}
.alxst-ocean-search-shell-right > .alx-search-form-type-wrap.alxst-search-options-detached.alxst-search-options-visible,
.alxst-ocean-search-shell-right > .alx-search-form-type-wrap.alxst-search-options-detached.alxst-search-options-force-visible {
    display: block;
}
.alxst-ocean-search-shell-right > .alx-search-form-type-wrap.alxst-search-options-detached .alx-search-form-type {
    width: auto;
    min-width: 130px;
    max-width: 170px;
    box-sizing: border-box;
}

@media (max-width: 600px) {
    .alxst-ocean-search-shell.alxst-ocean-search-shell-right {
        flex-wrap: wrap;
        width: 100%;
    }
    .alxst-ocean-search-shell-right > .alx-search-form-type-wrap.alxst-search-options-detached {
        flex: 0 0 100%;
        width: 100%;
        text-align: center;
    }
    .alxst-ocean-search-shell-right > .alx-search-form-type-wrap.alxst-search-options-detached .alx-search-form-type {
        width: min(100%, 300px);
        max-width: 300px;
    }
}
