/* Created by Andrey Kurdin in 01/22/2026 */

:root {
    --body-color: #ffffff;
    --text-color: #111111;
    /* Accent controls link color + UI highlights (user-configurable in /settings.html) */
    --accent-color: #9370DB;
    --accent-contrast-color: #FFFFFF;
    --link-color: var(--accent-color);
    --agilog-title-color: #222222;
    --block-color: #ffffff;
    --data-block-color: #ffffff;
    --data-block-border-color: #d7d7d7;
    --block-text-color: #111111;
    --block-color-for-blur: rgba(17, 17, 17, 0.06);
    --table-border-color: #e8e8e8;
    --table-row-hover-color: rgba(0, 0, 0, 0.04);
    --outline-selected-color: var(--accent-color);
    --footer_color: #111111;
    --nav-active-bg: #222;
}

html[data-theme="dark"] {
    --body-color: #222;
    --text-color: #cbcbcb;
    /* Keep accent consistent across themes (can be overridden from localStorage) */
    --link-color: var(--accent-color);
    --agilog-title-color: #ffffff;
    --block-color: #111;
    --data-block-color: #2e2e2e;
    --data-block-border-color: #7f7f7f;
    --block-text-color: #fff;
    --block-color-for-blur: #11111146;
    --table-border-color: #848484;
    --table-row-hover-color: rgba(255, 255, 255, 0.1490196078);
    --outline-selected-color: var(--accent-color);
    --footer_color: #111;
    --nav-active-bg: #000;
}

body {
    background: var(--body-color);
    color: var(--text-color);
}

#fh5co-single-content {
    background: var(--body-color);
}

html[data-theme="dark"] #fh5co-single-content {
    background: #222 !important;
}

a {
    color: var(--link-color);
}

a:hover {
    color: var(--link-color);
    opacity: 0.9;
}

/* Replace hardcoded "theme accent" color from style_1.css with user-selected accent */
.fh5co_tagg:hover,
.fh5co_tagg:focus {
    background: var(--accent-color) !important;
    color: #fff !important;
    text-decoration: none;
}

.treding_btn,
.treding_btn:hover,
.treding_btn:focus {
    background: var(--accent-color) !important;
    color: #fff !important;
}

.fh5co_display_table:hover,
.fh5co_display_table:focus {
    border-color: var(--accent-color) !important;
}

.fh5co_display_table_footer:hover,
.fh5co_display_table_footer:focus {
    border-color: var(--accent-color) !important;
}

.footer_menu li > a:hover,
.footer_menu li > a:focus {
    color: var(--accent-color) !important;
}

.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
    background: var(--accent-color) !important;
    color: #fff !important;
}

.navbar-light .navbar-nav .open > .nav-link,
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.open,
.navbar-light .navbar-nav .nav-link.active {
    background: var(--nav-active-bg) !important;
    color: #fff !important;
}

/* Keep active item stable on hover (prevent "flip" to accent while hovering active) */
.navbar-light .navbar-nav .open > .nav-link:hover,
.navbar-light .navbar-nav .active > .nav-link:hover,
.navbar-light .navbar-nav .nav-link.open:hover,
.navbar-light .navbar-nav .nav-link.active:hover,
.navbar-light .navbar-nav .open > .nav-link:focus,
.navbar-light .navbar-nav .active > .nav-link:focus,
.navbar-light .navbar-nav .nav-link.open:focus,
.navbar-light .navbar-nav .nav-link.active:focus {
    background: var(--nav-active-bg) !important;
    color: #fff !important;
}

.bg-faded {
    background-color: var(--block-color) !important;
}

.navbar-light .navbar-nav .nav-link {
    color: var(--text-color) !important;
}

html[data-theme="dark"] .fh5co_display_table {
    color: #fff !important;
}

.agilog_header_actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.agilog_header_row1,
.agilog_header_row2 {
    display: flex;
    align-items: center;
    gap: 10px;
}

.agilog_share_btn_article {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    background: transparent;
    color: #fff;
    padding: 0;
    text-decoration: none;
    transition: border-color 0.2s, background 0.2s;
}

.agilog_share_btn_article:hover {
    border-color: rgba(255, 255, 255, 0.9);
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    text-decoration: none;
}

.agilog_share_btn_article img {
    display: block;
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.agilog_share_copy_btn {
    width: auto;
    padding: 0 12px;
    font-size: 13px;
    white-space: nowrap;
}

.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.active {
    color: #fff !important;
    opacity: 1;
}

/* In dark theme, active menu item: white background, black text */
html[data-theme="dark"] .navbar-light .navbar-nav .open > .nav-link,
html[data-theme="dark"] .navbar-light .navbar-nav .active > .nav-link,
html[data-theme="dark"] .navbar-light .navbar-nav .nav-link.open,
html[data-theme="dark"] .navbar-light .navbar-nav .nav-link.active {
    background: #fff !important;
    color: #000 !important;
}

html[data-theme="dark"] .navbar-light .navbar-nav .open > .nav-link:hover,
html[data-theme="dark"] .navbar-light .navbar-nav .active > .nav-link:hover,
html[data-theme="dark"] .navbar-light .navbar-nav .nav-link.open:hover,
html[data-theme="dark"] .navbar-light .navbar-nav .nav-link.active:hover,
html[data-theme="dark"] .navbar-light .navbar-nav .open > .nav-link:focus,
html[data-theme="dark"] .navbar-light .navbar-nav .active > .nav-link:focus,
html[data-theme="dark"] .navbar-light .navbar-nav .nav-link.open:focus,
html[data-theme="dark"] .navbar-light .navbar-nav .nav-link.active:focus {
    background: #fff !important;
    color: #000 !important;
}

.fh5co_heading {
    color: var(--text-color);
}

.agilog_card_title {
    color: var(--agilog-title-color) !important;
}

html[data-theme="dark"] .fh5co_magna {
    color: var(--agilog-title-color) !important;
}

html[data-theme="dark"] .most_fh5co_treding_font {
    color: var(--agilog-title-color) !important;
}

html[data-theme="dark"] .fh5co_mini_time,
html[data-theme="dark"] .fh5co_consectetur,
html[data-theme="dark"] .most_fh5co_treding_font_123,
html[data-theme="dark"] .c_b,
html[data-theme="dark"] .c_g {
    color: var(--text-color) !important;
}

.fh5co_heading_border_bottom {
    border-bottom-color: var(--data-block-border-color) !important;
}

.fh5co_tags_all a.fh5co_tagg {
    border-color: var(--data-block-border-color) !important;
}

.form-control {
    background: var(--data-block-color);
    border-color: var(--data-block-border-color);
    color: var(--text-color);
}

.form-control:focus {
    background: var(--data-block-color);
    border-color: var(--outline-selected-color);
    color: var(--text-color);
}

html[data-theme="dark"] .fh5co_footer_bg {
    background: var(--footer_color) !important;
}

html[data-theme="dark"] .fh5co_footer_bg,
html[data-theme="dark"] .fh5co_footer_bg a,
html[data-theme="dark"] .fh5co_footer_bg .footer_main_title,
html[data-theme="dark"] .fh5co_footer_bg .footer_sub_about,
html[data-theme="dark"] .fh5co_footer_bg .footer_menu li a,
html[data-theme="dark"] .fh5co_footer_right_reserved,
html[data-theme="dark"] .fh5co_footer_right_reserved a,
html[data-theme="dark"] .fh5co_footer_right_reserved .Reserved {
    color: var(--block-text-color) !important;
}

/* In light theme, footer is dark (#222) - keep links white, not accent color */
.fh5co_footer_bg a,
.fh5co_footer_bg .footer_menu li a,
.fh5co_footer_right_reserved a {
    color: #fff !important;
}

.fh5co_footer_bg a:hover,
.fh5co_footer_bg a:focus,
.fh5co_footer_bg .footer_menu li a:hover,
.fh5co_footer_bg .footer_menu li a:focus,
.fh5co_footer_right_reserved a:hover,
.fh5co_footer_right_reserved a:focus {
    color: #fff !important;
    text-decoration: underline;
}

html[data-theme="dark"] .agilog_search input {
    border-color: var(--data-block-border-color);
    color: var(--text-color);
    background: var(--data-block-color);
}

html[data-theme="dark"] .agilog_search button {
    border-color: var(--data-block-border-color);
    background: var(--block-color);
    color: var(--block-text-color);
}

html[data-theme="dark"] .agilog_bottom_bar {
    border-top-color: var(--data-block-border-color) !important;
}

html[data-theme="dark"] .agilog_bottom_links a {
    color: var(--link-color) !important;
}

.agilog_theme_switch {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    user-select: none;
    cursor: pointer;
    font-weight: 800;
    color: var(--text-color);
}

.agilog_theme_switch_header {
    height: 40px;
    padding: 0 12px;
    border-radius: 999px;
    border: none;
    background: var(--data-block-color);
}

/* Header settings button (replaces theme toggle in header) */
.agilog_settings_btn {
    height: 40px;
    padding: 0 12px;
    border-radius: 999px;
    background: var(--data-block-color);
    color: var(--text-color);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-weight: 300;
    text-decoration: none;
    border: 1px solid transparent;
}

.agilog_settings_btn:hover {
    text-decoration: none;
    opacity: 0.9;
}

.agilog_settings_btn:focus-visible {
    outline: 3px solid var(--outline-selected-color);
    outline-offset: 2px;
}

.agilog_settings_btn_text {
    font-size: 21px;
    opacity: 0.9;
    font-weight: 300;
}

.agilog_settings_icon {
    width: auto;
    height: 32px;
    display: block;
}

.agilog_settings_icon_dark {
    display: none;
}

html[data-theme="dark"] .agilog_settings_icon_light {
    display: none;
}

html[data-theme="dark"] .agilog_settings_icon_dark {
    display: block;
}

/* Keep title-like links readable (do not use accent color) */
a.most_fh5co_treding_font,
a.fh5co_small_post_heading {
    color: var(--agilog-title-color) !important;
}

a.most_fh5co_treding_font:hover,
a.most_fh5co_treding_font:focus,
a.fh5co_small_post_heading:hover,
a.fh5co_small_post_heading:focus {
    color: var(--agilog-title-color) !important;
    opacity: 0.9;
}

html[data-theme="dark"] .agilog_social_icon_dzen {
    filter: invert(1);
}

.agilog_theme_switch input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.agilog_theme_slider {
    width: 44px;
    height: 26px;
    border-radius: 999px;
    border: 1px solid var(--data-block-border-color);
    background: var(--block-color);
    position: relative;
    box-shadow: 0 0 0 0 var(--outline-selected-color);
    transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.agilog_theme_slider::after {
    content: "";
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: var(--text-color);
    position: absolute;
    top: 50%;
    left: 3px;
    transform: translateY(-50%);
    transition: left 140ms ease, background 140ms ease;
}

.agilog_theme_switch input:focus-visible + .agilog_theme_slider {
    box-shadow: 0 0 0 3px var(--outline-selected-color);
}

.agilog_theme_switch input:checked + .agilog_theme_slider::after {
    left: 21px;
}

.agilog_theme_label {
    font-size: 13px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    opacity: 0.9;
}