/*
 Theme Name:   Flatsome Child WC2026
 Theme URI:    https://tyso.net/flatsome-child-wc2026/
 Description:  Flatsome Child Theme for World Cup 2026 Football Portal, featuring a beautiful modern bright tone, customized styles, and seamless integration with Tyso Football Plugin.
 Author:       Antigravity
 Author URI:   https://github.com/google-deepmind
 Template:     flatsome
 Version:      1.0.0
 Text Domain:  flatsome-child-wc2026
*/

/* 1. Global Layout Enhancements */
body {
    background-color: #f5fbf7 !important; /* Sleek bright canvas */
    font-family: "Inter", "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    color: #0f1c14 !important;
}

/* Header Adjustments */
#header {
    background-color: #ffffff !important;
    box-shadow: 0 4px 20px rgba(15, 28, 20, 0.03) !important;
    border-bottom: 1px solid #dbeee4 !important;
}
.header-nav-main .nav > li > a {
    color: #0f1c14 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    font-size: 13px !important;
}
.header-nav-main .nav > li > a:hover {
    color: var(--tyso-accent) !important;
}

/* Search Box Customization */
.header-searchform input[type="search"] {
    background-color: #f5fbf7 !important;
    border: 1px solid #dbeee4 !important;
    border-radius: 30px !important;
    padding-left: 20px !important;
    color: #0f1c14 !important;
}

/* Footer Adjustments */
#footer {
    background-color: #ffffff !important;
    color: #4a5550 !important;
    border-top: 1px solid #dbeee4 !important;
    padding: 40px 0 20px 0 !important;
}
#footer a {
    color: #4a5550 !important;
    font-weight: 700 !important;
}
#footer a:hover {
    color: var(--tyso-accent) !important;
}
.footer-primary {
    background: none !important;
}
.absolute-footer {
    background-color: #f5fbf7 !important;
    border-top: 1px solid #dbeee4 !important;
    color: #627269 !important;
}

/* Card and Block Styling overrides in Flatsome */
.box, .card, .post-item {
    background: #ffffff !important;
    border: 1px solid #dbeee4 !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 30px -10px rgba(15, 28, 20, 0.05) !important;
    overflow: hidden;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.box:hover, .card:hover, .post-item:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 15px 35px -12px rgba(15, 28, 20, 0.1) !important;
}