/* Theme DHK Festival — Wine & Dine Festival */
:root {
	/* Theme color start */
	/* # global */
	--title-font-color:#613830;
	--main-font-color: #000;
	--link-color: #000;
	--link-color-hover: #e74629;
	--primary-button-font-color: #fff;
	--primary-button-bgcolor: #fb702d;
	--selection-font-color: #fff;
	--selection-bgcolor: #8F1D8D;
	--scrollarea-scrollbar-color-thumb: #613830;
	--scrollarea-scrollbar-color-track: #ebe5e9;
	--scrollarea-scrollbar-width: 5px;
	--swiper-pagination-bullet-active-color: #e74629;
	/* # intro */
	--intro-font-color: #fff;
	--intro-bgcolor: #fb702d;
	--intro-video-icon: url(/content/dam/dhk/common/theme/2024/halloween/icon-video-play.svg);
	--intro-date-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29' fill='none'%3E%3Crect x='2.31728' y='6' width='26' height='23' rx='2' fill='url(%23paint0_linear_92_79)'/%3E%3Cpath d='M9.08184 19.6675V21.9552H6.79414V19.6675H9.08184ZM14.8011 19.6675V21.9552H12.5134V19.6675H14.8011ZM20.5204 19.6675V21.9552H18.2327V19.6675H20.5204ZM9.08184 14.2075V16.4952H6.79414V14.2075H9.08184ZM14.8011 14.2075V16.4952H12.5134V14.2075H14.8011ZM20.5204 14.2075V16.4952H18.2327V14.2075H20.5204Z' fill='white' stroke='white' stroke-width='0.2'/%3E%3Cpath d='M7.71015 1V3.51648' stroke='white' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M19.9109 1V3.51648' stroke='white' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M24.7921 3.88257H2.52514C1.68283 3.88257 1 4.5654 1 5.40771V24.9295C1 25.7718 1.68283 26.4546 2.52514 26.4546H24.7921C25.6345 26.4546 26.3173 25.7718 26.3173 24.9295V5.40771C26.3173 4.5654 25.6345 3.88257 24.7921 3.88257Z' stroke='white' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M1 9.81561H26.2258' stroke='white' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_92_79' x1='15.3173' y1='6' x2='15.3173' y2='29' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23FF1700'/%3E%3Cstop offset='0.65' stop-color='%23AE2C10'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E");
	/* # page tabs */
	--page-tabs-normal-font-color: #fff;
	--page-tabs-normal-border-color: #FFC2B9;
	--page-tabs-normal-bgcolor: #fb702d;
	--page-tabs-active-font-color: #613830;
	--page-tabs-active-border-color: #e3cac6;
	--page-tabs-active-bgcolor: #fff;
	--page-tabs-dropdown-color-main: #613830;
	--page-tabs-dropdown-color-secondary: #b1908b;
	--page-tabs-dropdown-bgcolor-main: #fff;
	--page-tabs-dropdown-bgcolor-secondary: #e9d6d3;
	--page-tabs-dropdown-border-color: #e3cac6;
	/* # story */
	--story-font-color: #000;
	--story-bgcolor: #FFE9E4;
	--story-border-color: #FCCDC4;
	--story-button-font-color: #fff;
	--story-button-bgcolor: #5F1406;
	--story-swiper-button-arrow-color: #5F1406;
	--story-swiper-button-bgcolor: #fff;
	--story-more-bio-date-color: #9B9098;
	/* # image text list */
	--imagetextlist-alignment: flex-start;
	--imagetextlist-seperate-border-color: transparent;
	--imagetextlist-circle-bgcolor: #fb702d;
	--imagetextlist-circle-arrow-color: #fff;
	/* # line table */
	--line-table-font-color: #000;
	/* # line box */
	--linebox-font-color: #000;
	--linebox-bgcolor: #FFE9E4;
	--linebox-border-color: #FCCDC4;
	--linebox-swiper-button-arrow-color: #5F1406;
	--linebox-swiper-button-bgcolor: #fff;
	/* # deals & offers */
	--offer-name-color: #807370;
	--offer-name-border-bottom-color: #e2d8d6;
	--offer-desc-color: #613830;
	/* Theme color end */
}

/* 2025 halloween */

/* event calender section */
.upcoming-event-list .list-content {     gap: 0 0px !important;} 
#event-calendar .upcoming-event-list .list-content .list-item .card-content .card-title {
    font-size: 22px !important;
    line-height: 1.35 !important;
    font-weight: bold !important;
    margin-bottom: 10px !important;
}
#event-calendar .data-view-filter-search-and-date-with-tags-wrapper .search-and-date-filter-container {
    margin-top: 10px !important; }
#theme-events .winterfest2021_container > .sectionBox {
    background-color: #57136b !important;
    border-radius: 16px;
    overflow: hidden;
}
#theme-events .dataviewcontainer .upcoming-event-list .list-content .list-item :is(.card-title, .card-title *) {
    color: #fff !important;
}
#theme-events .upcoming-event-list .toggle-events-page .toggle-page_input {
    background-color: #57136b;
    border: 1.5px solid;
    border-color: #57136b;
}

/* event promtions section */
#theme-promotions .winterfest2021_container > .sectionBox {
    background-color: #ffe9e4 !important;
    border-radius: 16px;
    overflow: hidden;
}
#theme-promotions .winterfest2021_container > .sectionBox, #theme-promotions .winterfest2021_container > .sectionBox * {
    --main-font-color:  #613830 !important;
    color:  #613830 ;
}

/* event more-fun section */
#theme-more-fun .winterfest2021_container > .sectionBox {
    background-color: #f4eaf9 !important;
    border-radius: 16px;
    overflow: hidden;
}
#theme-more-fun .winterfest2021_container > .sectionBox, #theme-more-fun .winterfest2021_container > .sectionBox * {
    --main-font-color:  #000 !important;
    color:  #000 !important;
}

/* event showcase section */
#theme-showcase .winterfest2021_container > .sectionBox {
    background-color: #ffe9e4 !important;
    border-radius: 16px;
    overflow: hidden;
}
#theme-showcase .winterfest2021_container > .sectionBox, #theme-showcase .winterfest2021_container > .sectionBox * {
    --main-font-color:  #613830 !important;
    color:  #613830 ;
}
.poi-button {
    position: relative;
    display: inline-block;
    border-radius: 16px;
    /* padding: 12px 38px 12px 20px; */
    /* margin-bottom: 4px; */
    border: 0;
    background-color: var(--primary-button-bgcolor);
    /* outline: none; */
    /* line-height: 1.15; */
    max-width: 100%;
    text-align: center;
}
#theme-showcase .poi-button h5 { margin-bottom: 0px !important; }


/* Section | Timetable */
:root{
    --timetable-border-color: #ff521d;
    --timetable-bgcolor: #ffe9e4;
    --timetable-col-width-1: 28%;
    --timetable-col-width-2: 36%;
    --timetable-col-width-3: 36%; 
    --timetable-padding-x: 30px; 
    --timetable-padding-y: 20px; 
}
.timetable-wrapper{display:flex; flex-direction:column; row-gap:45px; margin:45px 0;}
.timetable-wrapper .tt-group .group-header *{font-family:var(--main-font) !important;}
.timetable{display:flex; flex-direction: column; row-gap:6px;}
.timetable .tt-head, .timetable .tt-row{display:flex; flex-direction:row; flex-wrap:nowrap;}

.timetable :is(.tt-head, .tt-head *){line-height:1.3 !important;}
.timetable .tt-head > div{padding:8px var(--timetable-padding-x); border-radius:12px; background-color:var(--timetable-border-color); --main-font-color:#fff; font-weight:700 !important; text-align:center; display:flex; flex-direction: column; justify-content: center;}
.timetable .tt-head > div:nth-child(1){flex:0 0 var(--timetable-col-width-1);}
/* .timetable .tt-head > div:nth-child(2){flex:0 0 calc(var(--timetable-col-width-2) + var(--timetable-col-width-3));} */
.timetable .tt-head > div:nth-child(2){flex:1 0 var(--timetable-col-width-2);}
.timetable .tt-head > div:nth-child(3){flex:0 0 var(--timetable-col-width-3);}

.timetable .tt-row{border:1px solid var(--timetable-border-color); border-radius:16px; background-color:var(--timetable-bgcolor);}
.timetable .tt-row > div{padding:var(--timetable-padding-y) var(--timetable-padding-x);}
.timetable .tt-row > div:not(:first-child){border-left:1px solid var(--timetable-border-color);}
.timetable .tt-row > div:nth-child(1){flex:0 0 var(--timetable-col-width-1); text-align:center;}
.timetable .tt-row > div:nth-child(2){flex:1 0 var(--timetable-col-width-2);}
.timetable .tt-row > div:nth-child(3){flex:0 0 var(--timetable-col-width-3);}

.timetable .tt-imagetext{display:flex; flex-direction:row; flex-wrap:nowrap; align-items:flex-start; gap:1.82vw;}
.timetable .tt-imagetext .tt-imagetext-cover{flex:0 0 160px; border-radius:12px; overflow:hidden;}
.timetable .tt-imagetext .tt-imagetext-text{flex:1;}
.timetable .tt-supplementary{margin-top:var(--timetable-padding-y); padding-top:calc(var(--timetable-padding-y) / 2); border-top:1px solid #ddd2d2; --main-font-size:15px; /* border-radius: 12px; background-color: #f7f0f0; padding: 10px; */}
.timetable .text-del{margin-top:0;}

#theme-fest .timetable-wrapper .tt-head :is(div, span, p, a, li, table th, table td, b) {
    color: #fff;
}
#theme-fest .timetable-wrapper .tt-data, #theme-fest .timetable-wrapper .tt-data .tt-date :is(div, span, p, a, li, table th, table td, b) {
    color: #000;
}

@media (max-width: 767.98px) {
/* Section | Timetable */
   :root{
      --timetable-col-width-1: 25%;
      --timetable-col-width-2: 75%;
      /* --timetable-col-width-3: 22%; */
      --timetable-padding-x: 15px; 
      --timetable-padding-y: 15px; 
   }
   
   .timetable .tt-head{display:none;}
   .timetable .tt-head > div{padding:8px var(--timetable-padding-x);}
   .timetable .tt-head > div:nth-child(3){display:none;}
   
   .timetable .tt-row{position:relative; flex-direction:column; }
   .timetable .tt-row > div:nth-child(1){padding:8px var(--timetable-padding-x); border-radius:12px; background-color:var(--timetable-border-color); --main-font-color: #fff; font-weight: 700 !important; text-align:center; display:flex; flex-direction:column; justify-content:center;}
   .timetable .tt-row > div:nth-child(2){flex:1 0 var(--timetable-col-width-2); border-left:0;}
   .timetable .tt-row > div:nth-child(3){flex:1 0 var(--timetable-col-width-2); border-top:1px solid var(--timetable-border-color); border-left:0;}
   
   .timetable .tt-imagetext{flex-direction:column; gap:12px;}
   .timetable .tt-imagetext .tt-imagetext-cover{flex:0 0 auto;}
   .timetable .tt-imagetext .tt-imagetext-text{flex:0 0 auto;}

   .timetable .tt-supplementary{--main-font-size:13px;}

   #theme-fest .timetable-wrapper .tt-data .tt-date :is(div, span, p, a, li, table th, table td, b) {    color: #fff; }
}


#poi-button {
            display: flex; /* 使用 flexbox 布局 */
            align-items: center; /* 垂直居中对齐 */
        }

#poi-button .poi-point{
            background-image: url(/content/dam/dhk/common/icon/icon-pin-white.svg);
            background-repeat: no-repeat;
            background-size: 36px 36px; /* 限制背景图像大小 */
            width: 36px; /* 图标宽度 */
            height: 36px; /* 图标高度 */
            margin-right: 8px; /* 图标与文字之间的间距 */
        }

