/*
Theme Name: Flatsome Sport
Theme URI: https://example.com/flatsome-sport
Description: A sports-focused child theme for Flatsome
Author: Your Name
Author URI: https://example.com
Template: flatsome
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: flatsome-sport
*/

/* Import parent theme styles */
@import url("../flatsome/style.css");

/* CSS Variables */
:root {
    --yellow-primary: #FFC300;
    --yellow-secondary: #FFD54F;
    --yellow-dark: #FFA000;
    --yellow-light: #FFE082;
    --yellow-gradient-start: #FFA000;
    --yellow-gradient-middle: #FFC300;
    --yellow-gradient-end: #FFD54F;
    --yellow-shadow-dark: rgba(194, 107, 24, 0.5);
    --yellow-shadow-light: rgba(255, 195, 0, 0.5);
    --yellow-shadow-highlight: #FFD54F;
    --yellow-text: #000;
    --fs-primary-solid-rgb: 60, 68, 89;
    --fs-primary-color: #feba4b;

    /* Main colors */
    --fs-primary-light: #38C42A;
    --fs-primary-dark: #217A16;
    --fs-primary-darker: #232324;
    
    /* RGB values for rgba usage */
    --fs-primary-rgb: 41, 168, 30;
    --fs-primary-light-rgb: 56, 196, 42;
    --fs-primary-dark-rgb: 33, 122, 22;
    --fs-primary-darker-rgb: 21, 90, 13;
    
    /* State colors */
    --fs-live-color: #ff3860;
    --fs-hot-color: #feba4b;
    --fs-success-color: #29A81E;
    --fs-error-color: #ff4b2b;
    
    /* RGB values for state colors */
    --fs-live-rgb: 255, 56, 96;
    --fs-hot-rgb: 254, 186, 75;
    --fs-success-rgb: 41, 168, 30;
    --fs-error-rgb: 255, 75, 43;
    
    /* Secondary colors */
    --fs-secondary-color: #005294;
    --fs-secondary-light: #0078d7;
    
    /* RGB values for secondary colors */
    --fs-secondary-rgb: 0, 82, 148;
    --fs-secondary-light-rgb: 0, 120, 215;
    
    /* Background and surface colors */
    --fs-bg-dark: #151617;
    --fs-surface-dark: #1d1c1c;
    --fs-surface-darker: #2e2e2e;
    
    /* Text colors */
    --fs-text-color: #ffffff;
    --fs-text-light: #888888;
    --fs-text-secondary: #8c8c8c;
    
    /* Borders and UI elements */
    --fs-border-color: #2f2f2f;
    --fs-border-radius: 8px;
    --fs-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

/* Modern login/register button styles */
.fs-login-button,
.fs-register-button {
    position: relative !important;
    width: 100% !important;
    height: 48px !important;
    padding: 0 24px !important;
    background: linear-gradient(45deg, #29A81E, #38C42A) !important;
    color: white !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    line-height: 48px !important;
    text-align: center !important;
    display: block !important;
    margin: 0 !important;
    box-shadow: 0 4px 15px rgba(41, 168, 30, 0.2) !important;
    text-decoration: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    transition: all 0.3s ease !important;
    transform: none !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    overflow: hidden !important;
    min-width: 120px !important;
    max-width: 100% !important;
}

.fs-login-button:hover,
.fs-register-button:hover {
    background: linear-gradient(45deg, #38C42A, #29A81E) !important;
    color: white !important;
    text-decoration: none !important;
    box-shadow: 0 6px 20px rgba(41, 168, 30, 0.3) !important;
    transform: translateY(-1px) !important;
}

.fs-login-button:focus,
.fs-register-button:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(41, 168, 30, 0.3) !important;
}

.fs-login-button:active,
.fs-register-button:active {
    transform: translateY(1px) !important;
    box-shadow: 0 2px 10px rgba(41, 168, 30, 0.2) !important;
}

/* Reset Flatsome button styles */
.fs-login-button,
.fs-login-button:hover,
.fs-login-button:focus,
.fs-login-button:active,
.fs-register-button,
.fs-register-button:hover,
.fs-register-button:focus,
.fs-register-button:active {
    all: unset !important;
    box-sizing: border-box !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    text-decoration: none !important;
    text-align: center !important;
    display: inline-block !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    font-family: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
    color: inherit !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    word-spacing: normal !important;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
    filter: none !important;
    -webkit-filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    outline: none !important;
    -webkit-tap-highlight-color: transparent !important;
}

.section-title-normal {
    border-bottom: none !important;
}
.ux-logo-image {
    width: 200px !important;
    height: auto !important;
}
.off-canvas-left.dark .mfp-content, .off-canvas-right.dark .mfp-content {
	background: linear-gradient(0deg, #181820 50%, #181818 100%) !important;
}
.dark .nav-vertical li li.menu-item-has-children>a, .dark .nav-vertical-fly-out>li>a, .dark .nav-vertical>li>ul li a, .dark .nav>li.html, .dark .nav>li>a, .nav-dark .is-outline, .nav-dark .nav>li>a, .nav-dark .nav>li>button, .nav-dropdown.dark .nav-column>li>a, .nav-dropdown.dark>li>a { color: #fff !important }
.links>li>a:before, i[class*=" icon-"], i[class^=icon-] { color: #29A81E !important }
.footer-wrapper {
	background: #191919 !important;
}
blockquote{
	color: #29A81E !important;
}
label{
	color: #fff !important;
}
.wp-block-search__button {
	white-space: nowrap !important;
}
.ux-menu-title{
	color: #2fb925 !important;
}
.absolute-footer.dark{
	color: #fff !important;
}
code {
	color: #000 !important;
	background: #ffbf00 !important;
}
.title_box h1, .title_box h2, .title_box h3, .title_box h4, .title_box span {
    font-family: 'Oswald';
    display: inline !important;
    padding: 5px 10px;
    margin: 0;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
    border-radius: 6px;
    background: linear-gradient(142deg, #BB5014 0%, #8B0000 100%);
    color: #FFF;
    font-size: 1.25rem;
    font-style: normal;
    line-height: 1.625rem;
}
.mb-3, .my-3 {
    margin-bottom: 1rem !important;
}
.title_box {
    margin-top: 15px;
    margin-bottom: 0px;
    border-left: 0px;
    padding: 0px;
}
@media screen and (max-width: 991px) {
.title_box > h1,
.title_box > h2,
.title_box > h3,
.title_box > h4,
.title_box > span {
  display: inline-block !important;
}
}

/* Nhỏ lại 1/2 trên mobile */
@media (max-width: 768px) {
    #logo {
        width: 130px !important;
		height: 34px !important;
		object-fit: contain !important;
    }
	.header-main {
        height: 56px !important;
    }
}
.blog-wrapper.blog-archive {
    padding: 15px;
    margin-top: 10px;
}
.page-wrapper{
    padding-bottom: 0px !important;
    padding-top: 0px !important;
}
.home .entry-content{
    padding: 0px;
}
.home header.entry-header.text-center {
    display: none !important;
}
.blog-wrapper.blog-single.page-wrapper{
      padding: 15px;
      margin-top: 10px;
}