.bg-color,
section.bg-color,
section.call-to-action,
#mainmenu li li a:hover,
#mainmenu ul li:hover>a,
.price-row,
.slider-info .text1,
.btn-primary,
.bg-id-color,
.dropcap,
.fullwidthbanner-container a.btn,
.feature-box-big-icon i,
#testimonial-full,
.icon-deco i,
.feature-box-small-icon .border,
.date-post,
.team-list .small-border,
.de-team-list .small-border,
.owl-arrow span,
.de-progress .progress-bar,
#btn-close-x:hover,
.box-fx .info,
.btn-more,
.widget .small-border,
.product img:hover,
#btn-search,
.de_tab.timeline li.active .dot,
.btn-id,
.tiny-border,
#subheader .small-border-deco span,
#services-list li a:hover,
.timeline .tl-block .tl-line,
.de_tab.tab_style_2 .de_nav li.active span,
.de_tab.tab_methods.style-2 .de_nav li.active span,
.feature-box-small-icon.style-2 .number.bg-color,
.owl-custom-nav .btn-next:before,
.owl-custom-nav .btn-prev:before,
.timeline>li>.timeline-badge,
.de_light .de_tab.tab_style_3 .de_nav li.active span,
.de_tab.tab_style_4 .de_nav li.active span,
.social-icons-sm i:hover,
.btn-rsvp,
.pricing-s1 .ribbon,
.de_tab.tab_style_4 .de_nav li.active,
#preloader .s1 span,
#filters a.selected,
.custom-show:after,
.custom-close:after,
.widget-post .date,
.style-2 .date-box,
.feature-box-type-1 i,
.owl-item.active>div blockquote:before,
.accordion-section-title:before,
#form_subscribe #btn-submit i,
.bg-gradient-to-right-2,
.feature-box-type-1.hover i,
.feature-box-type-1:hover i,
.ribbon,
.box-icon-simple .num,
.box-highlight.s2,
.feature-box.f-boxed:hover,
.fpw-overlay-btm,
.fp-wrap .fpwow-icons,
.owl-item.active.center .feature-box-type-2,
.testimonial-color .item:nth-child(1n) blockquote:before,
.spinner>div,
.d-gallery-item .dgi-1,
a.btn-border:hover,
.dih-overlay,
.widget_tags li a,
.nav-pills .nav-link.active,
.nav-pills .show>.nav-link,
#selector .sc-opt,
#cookieConsent a.cookieConsentOK,
.mask .cover,
.icon-box:hover,
#topbar,
.feature-box.f-boxed.invert,
.text-light .container-timeline ul li::before,
.text-light .de_countdown,
.de_tab .de_nav li.active span,
.text-light .dropdown li span,
#selector #dark-mode,
#selector #related-items,
.dark-scheme .nft__item .de_countdown,
.info-box i,
.d__table-sch h4,
#contact_form .radio-img input[type="radio"]:checked+label img,
#contact_form .radio-img input[type="checkbox"]:checked+label img,
a.btn-main,
.btn-main,
.bg-color-2,
.bg-color-secondary,
.timeline h5,
.testimonial-color .item:nth-child(2n) blockquote:before,
a.btn-main.bg-color-2,
a.btn-main.invert,
#mainmenu li li a:hover,
#mainmenu ul li:hover>a,
.icon-box.invert:hover,
#form_subscribe #btn-subscribe i.bg-color-secondary,
#jpreBar,
.t-circle,
.nft_item_pp i,
.author_list_pp i,
.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus,
.nft_coll_pp i,
.profile_avatar i,
#btn_copy.clicked,
#form_quick_search #btn-submit i,
.owl-dot.active,
.p_list_pp i,
.author_list_pp img,
.activity-filter li.active,
.dark-scheme .de_countdown.bg-color-secondary,
.btn-line:hover,
a.btn-line:hover,
.btn-line.hover,
a.btn-line.hover,
.de_form input[type="checkbox"]:checked+label:before,
.coll_list_pp i,
#form_sb #btn-submit i,
.de-switch input[type=checkbox]:checked+label,
.nft__item_extra button:hover,
.nft__item_share a,
#de-click-menu-notification .d-count,
.play-pause,
#mainmenu ul li a strong,
.space-border,
body::-webkit-scrollbar-thumb,
#de_modal::-webkit-scrollbar-thumb,
body.dark-scheme::-webkit-scrollbar-thumb,
.dark-scheme #de_modal::-webkit-scrollbar-thumb,
.d_timeline-title:before,
.post-image .d-border,
.de_project-info h4:before,
.d-bar .d-progress-line span,
h5 span.label,
.owl-theme .owl-nav [class*=owl-]:hover {
    background: var(--primary-color);
}


a,
a:hover,
footer .widget a:hover,
.id-color,
span.id-color,
.text-light .id-color h3,
.icon-box i,
.mask:hover .cover h3 i,
address.s1 span i,
.de_table .tr .td:nth-child(2) span,
.activity-filter i,
.dark-scheme .demo-icon-wrap i,
.dark-scheme .demo-icon-wrap-s2 span,
.de_tab .de_nav li span,
.dark-scheme .small-border,
.profile_username,
.de_tab.tab_methods .de_nav li.active span i,
a.btn-main.btn-light,
.nft_attr h5,
.de__h-widget i,
#mainmenu a.active,
header.header-light #mainmenu a.active,
.d_timeline-text .d_company,
blockquote.q-big .d-big,
#mainmenu-v2 li a:hover,
#de-menu-container .d-social i:hover {
    color: var(--primary-color);
}

.container-timeline ul li,
blockquote {
    border-left-color: var(--primary-color);
}

header #mainmenu a span,
header.transparent #mainmenu a span,
.de-grey #subheader h1,
h3.s_border {
    border-bottom-color: var(--primary-color);
}


.container-timeline ul li {
    border-top-color: var(--primary-color);
}

.line-preloader .p-line:nth-child(1) {
    border-right-color: var(--primary-color);
    border-bottom-color: var(--primary-color);
}

.line-preloader .p-line:nth-child(2) {
    border-left-color: var(--primary-color);
    border-top-color: var(--primary-color);
}

.line-preloader .p-line:nth-child(3) {
    border-right-color: var(--primary-color);
    border-top-color: var(--primary-color);
}

.button-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}

.amazon-button {
    display: flex;
    align-items: center;
    justify-content: left;
    background-color: white;
    border: none;
    width: fit-content;
    border-radius: 25px;
    padding: 10px 20px;
    font-size: 16px;
    font-weight: bold;
    color: black;
    text-decoration: none;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    transition: all 0.3s ease;
}

.amazon-button img {
    height: 25px;
    margin-right: 8px;
}

.amazon-button:hover {
    background-color: #f7f7f7;
}

.iconstyle {
    font-size: 40px;
    margin: 20px;
    color: var(--primary-color);
}

.bloglist.item {
    position: relative;
    border-left: 2px solid #ddd;
    padding-left: 20px;
}

header.transparent.header-light {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    background-color: rgba(255, 255, 255, 0.95);
}

.swiper {
    width: 100%;
    max-width: 1200px;
    margin: auto;
    padding-bottom: 50px;
}

.swiper-slide {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.swiper-button-next,
.swiper-button-prev {
    color: #333;
    transition: color 0.3s ease;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    color: #007bff;
}

.swiper-pagination-bullet-active {
    background-color: #007bff;
}

.modal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.8);
}

.modal-content {
    position: relative;
    margin: 5% auto;
    width: 90%;
    max-width: 800px;
}

.modal iframe {
    width: 100%;
    height: 450px;
    border: none;
}

.close {
    position: absolute;
    top: -15px;
    right: -15px;
    background: #fff;
    color: #000;
    font-size: 24px;
    font-weight: bold;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    cursor: pointer;
    z-index: 10000;
}

.video-card {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.video-card:hover {
    transform: scale(1.02);
}

.thumbnail-img {
    width: 100%;
    display: block;
    cursor: pointer;
}

.play-button-overlay {
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.play-button-overlay img {
    width: 60px;
    height: auto;
}

.video-info {
    padding: 15px;
}

.video-title {
    font-size: 16px;
    font-weight: bold;
    margin: 5px 0;
    display: inline-block;
    max-width: 350px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.video-date,
.video-views,
.video-description {
    font-size: 14px;
    color: #555;
    margin-bottom: 4px;
}

.channel-header {
    display: flex;
    flex-direction: column;
    background-color: #f9f9f9;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    margin-bottom: 2rem;
}

.channel-banner {
    width: 100%;
    height: auto;
    object-fit: cover;
    max-height: 250px;
}

.channel-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    flex-wrap: wrap;
}

.channel-left {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.channel-logo {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #ccc;
}

.channel-info {
    display: flex;
    flex-direction: column;
}

.channel-title {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
}

.channel-meta {
    font-size: 0.95rem;
    color: #666;
}

.youtube-button {
    background-color: #ff0000;
    color: #fff;
    padding: 0.6rem 1.2rem;
    text-decoration: none;
    border-radius: 6px;
    font-weight: 500;
    transition: background 0.3s ease;
}

.youtube-button:hover {
    background-color: #cc0000;
}

/* Responsive adjustments */
@media (max-width: 600px) {
    .channel-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .channel-right {
        width: 100%;
        text-align: left;
        margin-top: 16px;
    }

    .youtube-button {
        width: 100%;
        text-align: center;
    }
}