/*
Theme Name: TianXiaoZhiAi Theme
Theme URI: https://tianxiaozhiai.com
Author: TianXiaoZhiAi Team
Author URI: https://tianxiaozhiai.com
Description: A professional medical device company theme for TianXiaoZzhiAi, featuring premium hyperbaric chambers. Includes responsive design, custom sections for products, financing, and contact forms.
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: txz
Tags: medical, healthcare, one-column, custom-colors, custom-logo, custom-menu, featured-images, responsive-layout
*/

/*  */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    line-height: 1.6;
    color: #333;
}

/*  */
.nav-fixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: #000;
}

/*  */
.hero-section {
    position: relative;
    min-height: 100vh;
    padding-top: 80px;
    overflow: hidden;
}

/*  */
.hero-video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    transform: translate(-50%, -50%);
    z-index: -2;
    object-fit: cover;
}

/*  */
.hero-image-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
}

/*  */
.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));
    z-index: -1;
}

/*  */
.brand-section {
    background: #1e3a5f;
    color: white;
}

/*  */
.impact-section {
    background: linear-gradient(rgba(30, 58, 95, 0.95), rgba(30, 58, 95, 0.95)),
                url('images/globe-bg.jpg') center/cover;
    color: white;
    position: relative;
}

/*  */
.finance-section {
    background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
                url('images/finance-bg.jpg') center/cover;
    color: white;
}

/*  */
.btn-primary {
    background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
    transition: all 0.3s ease;
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(37, 99, 235, 0.3);
}

.btn-black {
    background: #000;
    transition: all 0.3s ease;
}

.btn-black:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}

/*  */
.card-hover {
    transition: all 0.3s ease;
}

.card-hover:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
}

/*  */
.mobile-menu {
    display: none;
}

@media (max-width: 768px) {
    .desktop-menu {
        display: none;
    }
    .mobile-menu {
        display: block;
    }
    .mobile-nav {
        display: none;
    }
    .mobile-nav.active {
        display: flex;
    }
}

/*  */
input, textarea, select {
    transition: all 0.3s ease;
}

input:focus, textarea:focus, select:focus {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

/*  */
.carousel-btn {
    transition: all 0.3s ease;
}

.carousel-btn:hover {
    background: rgba(255, 255, 255, 0.3);
}

/* WordPress */
.alignleft {
    display: inline;
    float: left;
    margin-right: 1.5em;
}

.alignright {
    display: inline;
    float: right;
    margin-left: 1.5em;
}

.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption {
    margin-bottom: 1.5em;
    max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption .wp-caption-text {
    margin: 0.8075em 0;
}

.wp-caption-text {
    text-align: center;
}

.gallery {
    margin-bottom: 1.5em;
}

.gallery-item {
    display: inline-block;
    text-align: center;
    vertical-align: top;
    width: 100%;
}

.gallery-columns-2 .gallery-item {
    max-width: 50%;
}

.gallery-columns-3 .gallery-item {
    max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
    max-width: 25%;
}

.gallery-columns-5 .gallery-item {
    max-width: 20%;
}

.gallery-columns-6 .gallery-item {
    max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
    max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
    max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
    max-width: 11.11%;
}

.gallery-caption {
    display: block;
}

/* ============================================================
 * Auto-Scroll Carousels (Certificates & Partners)
 * ============================================================ */
.txz-scroll-wrapper {
    position: relative;
    padding: 0 48px;
}

.txz-scroll-container {
    overflow: hidden;
}

.txz-scroll-track {
    display: flex;
    gap: 24px;
    will-change: transform;
    transition: none;
}

.txz-scroll-item {
    flex-shrink: 0;
}

/* Partner logo grayscale + hover effect */
.txz-partner-item img {
    filter: grayscale(100%);
    opacity: 0.6;
    transition: all 0.3s ease;
}

.txz-partner-item:hover img {
    filter: grayscale(0%);
    opacity: 1;
}

.txz-scroll-btn {
    transition: all 0.3s ease;
}

/* ============================================================
 * Product Slideshow (Single Product Page)
 * ============================================================ */
.product-slideshow {
    position: relative;
    overflow: hidden;
}

.slideshow-track {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.slideshow-slide {
    transition: opacity 0.5s ease-in-out;
    inset: 0;
}

.slideshow-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.slideshow-prev,
.slideshow-next {
    backdrop-filter: blur(4px);
    transition: all 0.3s ease;
}

.slideshow-prev:hover,
.slideshow-next:hover {
    transform: translateY(-50%) scale(1.1);
}

.slideshow-dot {
    cursor: pointer;
    border: none;
    padding: 0;
    transition: all 0.3s ease;
}

.slideshow-dot:hover {
    background: white !important;
    transform: scale(1.2);
}

/* ============================================================
 * Product Parameters Table
 * ============================================================ */
.product-params-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.product-params-table thead tr {
    background: #1e3a5f;
}

.product-params-table th {
    color: white;
    font-weight: 600;
    padding: 16px 24px;
    text-align: left;
}

.product-params-table td {
    padding: 14px 24px;
    border-bottom: 1px solid #e5e7eb;
}

.product-params-table tbody tr:hover {
    background: #eff6ff;
}

.product-params-table tbody tr:last-child td {
    border-bottom: none;
}

.param-tag {
    display: inline-block;
    background: rgba(30, 58, 95, 0.06);
    color: #1e3a5f;
    padding: 4px 14px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
    margin: 2px 4px;
}

/* ============================================================
 * Responsive Adjustments for New Sections
 * ============================================================ */
@media (max-width: 768px) {
    .txz-scroll-wrapper {
        padding: 0 36px;
    }

    .txz-scroll-track {
        gap: 16px;
    }

    .txz-scroll-btn {
        width: 36px !important;
        height: 36px !important;
    }

    .txz-scroll-btn svg {
        width: 16px;
        height: 16px;
    }
}

/* Product Parameters - auto wrap 2 columns */
.txz-params-grid {
    display: flex;
    flex-wrap: wrap;
    margin: -12px;
}

.txz-params-grid > div {
    width: 100%;
    padding: 12px;
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .txz-params-grid > div {
        width: 50%;
    }
}
