@charset "UTF-8";
/*
Theme Name: flatsome Child
Description: This is a child theme for flatsome Theme
Author: dak
Template: flatsome
Version: 1.0.1
*/

/**
 * ==================== 性能优化说明 ====================
 * 所有CSS文件已通过 functions/script-style.php 使用 wp_enqueue_style 并行加载
 * 原18个 @import 串行加载已优化为并行加载，性能提升5-10倍
 *
 * 加载的CSS文件列表：
 * - diy.css (基础样式)
 * - css/product.css (产品单页)
 * - css/page.css (单页面)
 * - css/single-archive.css (文章存档)
 * - css/single.css (文章单页)
 * - css/block-faq-list.css (折叠卡)
 * - css/plugin.css (插件)
 * - css/font-type.css (字体)
 * - css/header.css (头部)
 * - css/footer.css (底部)
 * - css/block-btn.css (按钮)
 * - css/clean-layout.css (布局/间距/填充/阴影)
 * - css/icon.css (图标)
 * - css/block-breadcrumb.css (面包屑)
 * - css/block-slider.css (轮播)
 * - css/block-lightbox.css (弹窗)
 * - css/block-tabs.css (切换卡)
 * - css/block-UX.css (UX编辑器，条件加载)
 * ===================================================
 */
.lazy-load {
    background: none !important;
}
 
 /* ==========================================================================
   Fluent Forms 全局极简样式
   ========================================================================== */


/* ==========================================================================
   普通输入框 / 邮箱 / URL / 电话 / 数字 / 下拉框
   ========================================================================== */

.fluentform .ff-el-form-control,
.fluentform input[type="text"],
.fluentform input[type="email"],
.fluentform input[type="url"],
.fluentform input[type="tel"],
.fluentform input[type="number"],
.fluentform input[type="password"],
.fluentform select,
.fluentform textarea {
    width: 100%;

    border: 1px solid #d9d9d9 !important;
    border-radius: 0 !important;

    background: #fff !important;

    box-shadow: none !important;
    -webkit-box-shadow: none !important;

    outline: none !important;

    color: #222;

    transition:
        border-color .2s ease,
        background-color .2s ease;
}


/* 单行输入框高度 */
.fluentform input[type="text"],
.fluentform input[type="email"],
.fluentform input[type="url"],
.fluentform input[type="tel"],
.fluentform input[type="number"],
.fluentform input[type="password"],
.fluentform select {
    height: 44px !important;

    padding: 0 13px !important;
}


/* 多行文本 */
.fluentform textarea {
    min-height: 125px;

    padding: 12px 14px !important;

    resize: vertical;
}


/* ==========================================================================
   Focus
   极简，只改变边框颜色
   ========================================================================== */

.fluentform .ff-el-form-control:focus,
.fluentform input[type="text"]:focus,
.fluentform input[type="email"]:focus,
.fluentform input[type="url"]:focus,
.fluentform input[type="tel"]:focus,
.fluentform input[type="number"]:focus,
.fluentform input[type="password"]:focus,
.fluentform select:focus,
.fluentform textarea:focus {
    border-color: #222 !important;

    background: #fff !important;

    box-shadow: none !important;
    -webkit-box-shadow: none !important;

    outline: none !important;
}


/* ==========================================================================
   Placeholder
   ========================================================================== */

.fluentform input::placeholder,
.fluentform textarea::placeholder {
    color: #aaa;

    opacity: 1;
}


/* ==========================================================================
   Label
   ========================================================================== */

.fluentform .ff-el-input--label label {
    color: #333;

    font-size: 13px;
    font-weight: 400;
    line-height: 1.4;
}


/* 必填星号 */
.fluentform .ff-el-is-required.asterisk-right label::after {
    margin-left: 5px;
}


/* ==========================================================================
   H3 分组标题

   上方间距明显一些
   下方间距稍微收紧
   ========================================================================== */

.fluentform .ff-custom_html h3 {
    margin-top: 36px !important;
    margin-bottom: 16px !important;

    padding: 0 !important;

    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
}


/* 第一个标题也保留适量顶部空间 */
.fluentform form > fieldset > .ff-custom_html:first-of-type h3 {
    margin-top: 24px !important;
}


/* ==========================================================================
   表单字段纵向间距
   ========================================================================== */

.fluentform .ff-el-group {
    margin-bottom: 20px;
}


/* 两列之间稍微增加呼吸感 */
.fluentform .ff-t-container {
    gap: 16px;
}


/* ==========================================================================
   Checkbox
   极简方框 + 勾选后内部实心小方块
   ========================================================================== */

.fluentform input[type="checkbox"].ff-el-form-check-input {
    appearance: none !important;
    -webkit-appearance: none !important;

    position: relative;

    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;

    margin: 0 7px 0 0 !important;

    padding: 0 !important;

    vertical-align: -3px;

    border: 1px solid #999 !important;
    border-radius: 0 !important;

    background-color: #fff !important;

    background-image: none !important;

    box-shadow: none !important;
    -webkit-box-shadow: none !important;

    cursor: pointer;

    transition:
        border-color .18s ease,
        background-color .18s ease;
}


/* 勾选状态：
   外框 + 中间一个小方块
 */
.fluentform input[type="checkbox"].ff-el-form-check-input:checked {
    border-color: var(--primary-color, #1683ff) !important;

    background-color: #fff !important;

    background-image:
        linear-gradient(
            var(--primary-color, #1683ff),
            var(--primary-color, #1683ff)
        ) !important;

    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 8px 8px !important;
}


/* Hover */
.fluentform input[type="checkbox"].ff-el-form-check-input:hover {
    border-color: var(--primary-color, #1683ff) !important;
}


/* Focus */
.fluentform input[type="checkbox"].ff-el-form-check-input:focus {
    outline: none !important;

    box-shadow: none !important;
}


/* Checkbox 文字 */
.fluentform .ff-el-form-check-label {
    display: inline-flex;

    align-items: center;

    color: #222;

    font-size: 13px;
    font-weight: 500;

    cursor: pointer;
}


/* Inline Checkbox 间距 */
.fluentform .ff_list_inline .ff-el-form-check {
    margin-right: 20px;
    margin-bottom: 8px;
}


/* ==========================================================================
   Submit 按钮
   全部居中
   稍微加宽
   无圆角 / 无阴影
   ========================================================================== */

.fluentform .ff_submit_btn_wrapper {
    width: 100%;

    margin-top: 26px !important;

    text-align: center !important;
}


.fluentform .ff-btn-submit,
.fluentform button[type="submit"] {
    display: inline-flex !important;

    align-items: center;
    justify-content: center;

    width: auto !important;
    min-width: 160px;

    height: 44px;

    margin-left: auto !important;
    margin-right: auto !important;

    padding: 0 26px !important;

    border: 1px solid var(--primary-color, #1683ff) !important;
    border-radius: 0 !important;

    background: var(--primary-color, #1683ff) !important;

    color: #fff !important;

    box-shadow: none !important;
    -webkit-box-shadow: none !important;

    font-size: 14px;
    font-weight: 400;

    text-transform: none;

    transition:
        background-color .2s ease,
        border-color .2s ease;
}


/* Button Hover */
.fluentform .ff-btn-submit:hover,
.fluentform button[type="submit"]:hover {
    border-color: #111 !important;

    background: #111 !important;

    box-shadow: none !important;

    transform: none !important;
}


/* Button Focus */
.fluentform .ff-btn-submit:focus,
.fluentform button[type="submit"]:focus {
    outline: none !important;

    box-shadow: none !important;
}


/* ==========================================================================
   错误状态
   仍保持极简
   ========================================================================== */

.fluentform .ff-el-is-error .ff-el-form-control {
    border-color: #d63638 !important;

    box-shadow: none !important;
}
.fluentform .ff-el-form-check-label,
.ff-default .ff-el-input--label label{
    font-size: 15px !important;
}

@media only screen and (min-width: 641px) {
    .fluentform .ff-el-group.ff_list_inline .ff-el-form-check {
      
        margin: 0 35px 10px 0 !important;
      
    }
}


.fluentform .ff-el-input--label.ff-el-is-required.asterisk-right label:after {
    color: var(--fluentform-danger);
    content: " *";
    margin-left: 3px;
    POSITION: absolute;
    left: -4px;
    font-size: 21px;
}

.ff-default .ff-el-input--label label {
    display: inline-block;
    font-weight: 500;
    line-height: inherit;
    margin-bottom: 0;
    margin-left: 8px;
}


/* ==========================================================================
   手机
   ========================================================================== */

@media (max-width: 549px) {

    .fluentform .ff-custom_html h3 {
        margin-top: 28px !important;
        margin-bottom: 13px !important;

        font-size: 18px;
    }


    .fluentform .ff-el-group {
        margin-bottom: 16px;
    }


    .fluentform .ff-btn-submit,
    .fluentform button[type="submit"] {
        min-width: 150px;
        font-size: 18px !important;
        height: 42px;
    }


    .fluentform .ff_list_inline .ff-el-form-check {
        margin-right: 14px;
    }
}
 
#post-list .text-left .button {
    display: list-item !important;
    width: 120px !important;
    border-radius: 90px !important;
    position: relative !important;
}
    .fluentform .ff-btn-submit,
    .fluentform button[type="submit"] {
        min-width: 250px;
        font-size: 18px !important;
        height: 42px;
    }

.ff_list_inline .ff-el-input--label label{
    margin-left: 0 !important;
    font-size: 17px !important;
    margin-bottom: 10px !important;
}
/* ==========================================================================
   DAK Resin Series Selector V2
   ========================================================================== */


 /* ==========================================================================
文章详情
   ========================================================================== */
 .entry-content p .button {
     border-radius: 40px;
 } 
 @media (min-width: 851px) {
     .single-post .entry-title{
         font-size: 36px;
     }
 
}

.entry-content {
    padding-bottom: 0;
    padding-top: 1.5em;
}


 .entry-header-text-top{
     padding-bottom: 0;
 }
  .dak-meta *{
    font-size: 14px !important;  
  }
 .dak-meta{
     border-top: 1px solid #eee;
     border-bottom: 1px solid #eee;
     padding: 15px 5px;
     margin-bottom: 30px;
     
 }
 
/*文章目录插件*/
 .lwptoc_item {
    margin-top: 12px !important;
    font-size: 13px !important;
    
    
  
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    line-height: 1.5 !important;
    min-height: 3em;

}
 
 /* ==========================================================================
博客分页
   ========================================================================== */
   
.nav-pagination .next.page-number i,
.nav-pagination .prev.page-number i {
    display: none !important;
}

/* 注入 Next 文字 */
.nav-pagination .next.page-number::after {
    content: "Next";
    font-weight: 300;
}

/* 注入 Prev 文字 */
.nav-pagination .prev.page-number::before {
    content: "Prev";
    font-weight: 300;
}

/* 简单美化：给文字增加一点间距和鼠标效果 */
.nav-pagination .next.page-number,
.nav-pagination .prev.page-number {
    min-width: 60px; /* 给文字留出足够空间 */
    text-decoration: none;
}

.nav-pagination>li>a, .nav-pagination>li>span {
    border: 1px solid;
    border-radius: 4px;
    display: block;
    font-size: 1.1em;
    font-weight: bolder;
    height: 2.25em;
    line-height: 2em;
    min-width: 2.25em;
    padding: 0 7px;
    text-align: center;
    transition: all .3s;
    vertical-align: top;
    width: auto;
}
 
  /* ==========================================================================
博客分类
   ========================================================================== */
   
.blog-list-dak .post-item .box .from_the_blog_excerpt {
        font-size: 14px;
        padding-top: 10px;
    }
    
.blog-list-dak .post-item .col-inner {
    box-shadow: 1px 1px 10px #00000026;
    margin-bottom: 0;
}
 
 .blog-list-dak .post-item:last-child {
    border-bottom: none;
}
.category .post-item:first-child {
    margin-top: 0;
    padding-top: 0; 
}

@media (min-width: 851px) {
    .category .post-item{
        margin-bottom:40px;
       
    }
}

@media (max-width: 549px) {
    .category .post-item{
        margin-bottom:20px;
       
    }

}
.category .faq-dak-list{
    padding-bottom: 0;
}
.category .page-wrapper{
    padding-top: 0 ;
}

.post-item .box .post-title a{
    padding: 20px 0;
    font-size: 115%;
}


.post-meta.inline.is-small.op-8::before {
    content: "\eb21"; /* Remix Icon 的 time-line 编码 */
    font-family: 'remixicon' !important;
    display: inline-block;
    margin-right: 6px;
    vertical-align: middle;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 17px;
}

  .blog-list-dak *{
      border-radius: 0 !important;
  }


/* 1. 确保容器裁剪超出部分，并设置过渡动画 */
.blog-list-dak .post-item .image-cover {
    overflow: hidden;
}

.blog-list-dak .post-item .image-cover img {
    transition: transform 0.5s ease; /* 控制放大速度和顺滑度 */
    display: block; /* 消除图片底部间隙 */
}

/* 2. 悬停效果：当鼠标进入文章项时，图片放大 */
.blog-list-dak .post-item:hover .image-cover img {
    transform: scale(1.1); /* 1.1表示放大10%，可以根据需要调整 */
}


@media (max-width: 549px) {
.blog-list-dak .cat-label{
    font-size: 10px;
}
}



.blog-list-dak .box-text-inner {
    padding-left: 40px;
    padding-right: 40px;
}
  @media (max-width: 549px) {
    .blog-list-dak .box-text-inner {
    padding-left: 0px;
}  
    
   

  }
  
 /* ==========================================================================
支持
   ========================================================================== */
 
 .support-all-tabs-box .nav-simple a{
     color: #fff !important;
     padding: 20px 20px;
 }
 
  .support-all-tabs-box .nav-simple{
      padding-bottom: 60px;
  }
  
  @media (max-width: 549px) {
      
  .support-all-tabs-box .nav-simple a{
     color: #000 !important;
     padding: 4px 10px;
 }
  .support-all-tabs-box .nav-simple{
      padding-bottom: 0px;
  }
}

  .support-all-tabs-box .nav-simple .active>a{
      text-decoration: underline !important;
  }
 
 .faq-dak-list-all>.nav span{
     font-weight: 600;
 } 


 



 /*手机自动滚动的箭头箭头缩小*/
 
 @media screen and (max-width: 549px) {
    .row-slider .flickity-prev-next-button svg {
        border: 0 !important;
        padding: 7px !important;
    }
}


 /*色板宽度*/
/* =========================================================
   Color List：紧凑、自动居中、手机端缩小至 80%
   ========================================================= */

.color-list {
    --color-item-width: 44px;
    --color-item-gap: 2px;
    --color-image-size: 30px;
    --color-text-size: 0.85em;

    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: var(--color-item-gap) !important;

    width: fit-content !important;
    max-width: 100% !important;

    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 0 10px 0 !important;

    overflow: visible !important;
}

/* 清除 Flatsome Row 默认负边距 */
.color-list.row {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 每个颜色项目 */
.color-list > .col {
    flex: 0 0 var(--color-item-width) !important;
    width: var(--color-item-width) !important;
    max-width: var(--color-item-width) !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;
}

/* 清除列内部间距 */
.color-list > .col > .col-inner {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Featured Box */
.color-list .featured-box,
.color-list .icon-box {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 颜色图片 */
.color-list .icon-box-img {
    width: var(--color-image-size) !important;
    max-width: var(--color-image-size) !important;

    margin: 0 auto 3px !important;
    padding: 0 !important;
}

.color-list .icon-box-img img {
    display: block;
    width: 100% !important;
    height: auto !important;

    margin: 0 auto !important;
}

/* 文字区域 */
.color-list .icon-box-text,
.color-list .ux-text {
    margin: 0 !important;
    padding: 0 !important;
}

.color-list .icon-box-text p,
.color-list .ux-text p {
    margin: 0 !important;
    padding: 0 !important;

    font-size: var(--color-text-size) !important;
    line-height: 1.2 !important;
    text-align: center !important;
    white-space: nowrap;
}

/* =========================================================
   手机端：整体尺寸缩小至桌面端的 80%
   44 × 0.8 = 35.2px
   30 × 0.8 = 24px
   2 × 0.8 = 1.6px
   ========================================================= */

@media (max-width: 549px) {
    .color-list {
        --color-item-width: 35.2px;
        --color-item-gap: 1.6px;
        --color-image-size: 24px;
        --color-text-size: 0.68em;

        max-width: 100% !important;
        overflow: visible !important;
    }

    .color-list .icon-box-img {
        margin-bottom: 2.4px !important;
    }
}

.color-list .icon-box-center p{
    font-size: 10px !important;
}

@media (max-width: 549px) {
    .color-list .icon-box-center p{
        font-size: 10px !important;
    }
    
    .color-list {
        max-width: 160px !important;
    }
}


.color-list .icon-box-center .icon-box-img img{
    max-width: 22px !important;
}
.color-list .icon-box-center .icon-box-img {
    margin: 0 auto 5px;
}