/* Theme DHK Arts in Hong Kong 2025 – inner page */
:root{
   /* # line box */
	--linebox-bgcolor: #fff;
   /* # line table */
	--line-table-font-color: #000;
   --line-table-border-color: #ddd1d9;
   /* # event inner page */
	--event-inner-bgcolor:#fff;
}

#theme-artsinhk{background-color:#F8E4FC;}
html[lang="en"] #theme-artsinhk :is(h1, h1 *){line-height:1 !important;}
.overlay-scrollarea{height:473px; padding-right:12px;}

.btn-return{position:relative; display:inline-flex; align-items:center; padding:0 26px 0 22px; margin-left:15px; height:43px; border-radius:4px; text-decoration:none!important; z-index:99;}
.btn-return:before{display:block; content:''; position:absolute; left:0; top:calc(50% - 6px); width:16px; height:12px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16.45' height='12.922' viewBox='0 0 16.45 12.922'%3E%3Cpath id='Icon_ionic-ios-redo' data-name='Icon ionic-ios-redo' d='M18.7,18.547h-.106a.159.159,0,0,1-.151-.1,7.983,7.983,0,0,0-.786-1.457,8.955,8.955,0,0,0-3.469-3.065,8.575,8.575,0,0,0-3.565-.852.147.147,0,0,0-.154.147v3a.148.148,0,0,1-.228.125l-7.926-5.22a.147.147,0,0,1,0-.246l7.929-5.22a.146.146,0,0,1,.228.125V8.808a.146.146,0,0,0,.139.147,8.546,8.546,0,0,1,6,2.4A7.8,7.8,0,0,1,18.7,17.185C18.7,17.563,18.7,18.114,18.7,18.547Z' transform='translate(-2.25 -5.625)' fill='%23000000'/%3E%3C/svg%3E%0A"); background-size:100% auto; background-position:0 0;}
.btn-return:hover{color:var(--link-color-hover) !important;}
.btn-return:hover:before{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16.45' height='12.922' viewBox='0 0 16.45 12.922'%3E%3Cpath id='Icon_ionic-ios-redo' data-name='Icon ionic-ios-redo' d='M18.7,18.547h-.106a.159.159,0,0,1-.151-.1,7.983,7.983,0,0,0-.786-1.457,8.955,8.955,0,0,0-3.469-3.065,8.575,8.575,0,0,0-3.565-.852.147.147,0,0,0-.154.147v3a.148.148,0,0,1-.228.125l-7.926-5.22a.147.147,0,0,1,0-.246l7.929-5.22a.146.146,0,0,1,.228.125V8.808a.146.146,0,0,0,.139.147,8.546,8.546,0,0,1,6,2.4A7.8,7.8,0,0,1,18.7,17.185C18.7,17.563,18.7,18.114,18.7,18.547Z' transform='translate(-2.25 -5.625)' fill='%23C73A9C'/%3E%3C/svg%3E%0A");}
html[lang="ar"] .btn-return{padding:0 22px 0 26px;}
html[lang="ar"] .btn-return:before{left:auto; right:0; transform:scaleX(-100%);}

.terms,
.terms :is(p, a, li, div, span) {
	font-size: 13px !important; line-height: 1.5;
}
.terms>h5 {font-size: 15px !important; font-weight: 800;}
.terms ol {margin-bottom: 0 !important;}
.terms ol>li:nth-child(n + 4) {display: none;}
.terms ol.expand>li:nth-child(n + 4) {display: list-item;}
a.btn-expand-terms {color: #802781 !important;}

#theme-artsinhk :is(span.icon, span.icon *){color:#9d7f95 !important;}

/* Component {Article Info} */
#theme-artsinhk .dhkarticleinfo .article-detail__heading{padding-left:0 !important; padding-top:0 !important; margin-top:30px; margin-bottom:20px;}

/* Element {Tour Table} */
.tour-table{
   display:flex; flex-direction:column; margin:0 auto; border-radius:16px; background-color:#fcf4fe; overflow: hidden;
   --main-font-color: #000;
}
.tour-table:not(:last-child){margin-bottom:20px;}
.tour-table .t-row{display:flex; flex-direction:row; flex-wrap:nowrap;}
.tour-table .t-row:not(:first-child){border-top:2px solid #F8E4FC;}
.tour-table .t-cell{flex:1; padding:25px 50px;}
.tour-table .cell-head{flex:0 0 26%; padding:25px 50px; padding-right:2%; color:#b13091 !important; font-weight:800 !important; line-height:1.2 !important;}
.tour-table .cell-content{flex:1;}
.tour-table .cell-content > .t-cell, .tour-table .cell-content > .t-row > .t-cell{padding-left:2%;}
.tour-table .cell-content > .cell-head{padding-bottom:0; margin-bottom:-25px;}
.tour-table .data-head{margin-bottom:10px; font-weight:800 !important; color:#802781 !important; line-height:1.2 !important;}
.tour-table .colorTable{border-radius:8px;}
.tour-table .colorTable:last-child{margin-bottom:0;}
.tour-table .colorTable.cellwithcolor th, .tour-table .colorTable.cellwithcolor td{background-color:#fff;}

/* Section | Map */
.map-info-title{margin-bottom:-10px;}
.map-info-title h6{Margin-bottom:0 !important;}
.map-info{display:flex; flex-direction:row; flex-wrap:nowrap; align-items:flex-start; gap:8px;}
.map-info .map-info-left{
   flex:0 0 30%; min-width:280px; max-height:100%; overflow:hidden; align-self:stretch; opacity:0.01;
   transition:opacity .3s cubic-bezier(0.25, 1, 0.5, 1);
	-moz-transition:opacity .3s cubic-bezier(0.25, 1, 0.5, 1);
	-ms-transition:opacity .3s cubic-bezier(0.25, 1, 0.5, 1);
	-webkit-transition:opacity .3s cubic-bezier(0.25, 1, 0.5, 1);
}
.map-info .map-info-left.visible{opacity:1;}
.map-info .map-info-right{position:relative; flex:1 1 auto; height:auto;}
.map-info .map-info-right img{border-radius:12px;}
/* .map-info .map-holder:not(:last-child){margin-bottom:20px;} */
.btn-primary.btn-view-map{
   position:absolute !important; bottom:10px; right:10px; margin-bottom:0 !important; padding:10px 26px 10px 14px !important; border-radius:8px !important;
   transition:background-color .2s cubic-bezier(0.25, 1, 0.5, 1);
	-moz-transition:background-color .2s cubic-bezier(0.25, 1, 0.5, 1);
	-ms-transition:background-color .2s cubic-bezier(0.25, 1, 0.5, 1);
	-webkit-transition:background-color .2s cubic-bezier(0.25, 1, 0.5, 1);
   --main-font-size: .95em;
   --primary-button-bgcolor: #45b69f;
}
.btn-primary.btn-view-map:hover{--primary-button-bgcolor: #52cfb5;}
.btn-primary.btn-view-map:after{right:12px !important; top:calc(50% - 7px) !important; width:7px !important; height:14px !important;}

.bus-stop-list-head{display:flex; flex-direction:row; align-items:center; min-height:26px; padding-left:calc(42px + 6px); margin-bottom:12px; background-size:42px 26px; background-image:url(/content/dam/dhk/common/theme/2025/arts/icon-bus.svg); background-repeat:no-repeat; background-position:left top; font-weight:800 !important; color:#b13091 !important;}
ol.bus-stop-list{position:relative; list-style:none; padding-left:0; padding-top:18px; padding-bottom:30px; counter-reset:my-awesome-counter;}
ol.bus-stop-list:before{display:block; content:''; position:absolute; top:0; left:12px; border-radius:999px; width:24px; height:100%; background-color:transparent; border:1px dashed #9d9aa1;}
ol.bus-stop-list:after{display:block; content:''; position:absolute; top:0; left:6px; width:12px; height:100%; background-image: url("data:image/svg+xml,%3Csvg width='11' height='337' viewBox='0 0 11 337' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.210111 31.7754L4.77538 27.2101C5.05553 26.93 5.50974 26.93 5.78989 27.2101L10.3552 31.7754C10.6353 32.0555 10.6353 32.5097 10.3552 32.7899C10.075 33.07 9.6208 33.07 9.34066 32.7899L5.28264 28.7319L1.22462 32.7899C0.944468 33.07 0.490259 33.07 0.210111 32.7899C-0.070037 32.5097 -0.070037 32.0555 0.210111 31.7754Z' fill='%23E30026'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.218756 186.775L4.97188 182.21C5.26355 181.93 5.73645 181.93 6.02812 182.21L10.7812 186.775C11.0729 187.056 11.0729 187.51 10.7812 187.79C10.4896 188.07 10.0167 188.07 9.72499 187.79L5.5 183.732L1.27501 187.79C0.98333 188.07 0.510431 188.07 0.218756 187.79C-0.0729188 187.51 -0.0729188 187.056 0.218756 186.775Z' fill='%23E30026'/%3E%3C/svg%3E%0A"); background-repeat:repeat-y; background-position:top center;}
ol.bus-stop-list li{position:relative; padding-left:60px; margin-bottom:14px; min-height:24px; counter-increment:my-awesome-counter;}
ol.bus-stop-list li:last-child{margin-bottom:0;}
ol.bus-stop-list li::before{display:inline-block; content:counter(my-awesome-counter); position:absolute; left:24px; top:0; width:24px; height:24px; font-weight:800; color:#fff; background-color:#E30026; line-height:22px; border-radius:50%; text-align:center;}
ol.bus-stop-list .list-note{margin-top:6px;}
a.btn-map-route{display:inline-block; margin-left:8px; width:24px; height:24px; background-image:url(/content/dam/dhk/common/theme/2025/arts/icon-map-route.svg); background-size:100% auto; background-repeat:no-repeat;}
a.btn-nearby{
   position:relative; display:inline-block; padding:3px calc(8px + 6px + 8px) 3px 8px; max-width:85%; border-radius:10px; /* background-color:#f3e7f3 !important; */ background-color:#fff; box-shadow: 0px 0px 7px -3px rgba(0,0,0,0.55) !important;
   transition:background-color .3s cubic-bezier(0.25, 1, 0.5, 1);
	-moz-transition:background-color .3s cubic-bezier(0.25, 1, 0.5, 1);
	-ms-transition:background-color .3s cubic-bezier(0.25, 1, 0.5, 1);
	-webkit-transition:background-color .3s cubic-bezier(0.25, 1, 0.5, 1);
}
a.btn-nearby:hover{background-color:#fff4ff;}
a.btn-nearby, a.btn-nearby *{font-size:13px !important; line-height:1.3;}
a.btn-nearby:after{display:inline-block; content:''; position:absolute; right:8px; top:calc(50% - 5px); margin-left:8px; width:6px; height:10px; background-image:url("data:image/svg+xml,%3Csvg width='10' height='16' viewBox='0 0 10 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.78584 7.99797L0.828583 1.95035C0.389691 1.50338 0.39059 0.77964 0.830582 0.333791C1.27057 -0.112058 1.98303 -0.111144 2.42192 0.335823L9.17234 7.18817C9.59613 7.62009 9.61063 8.31427 9.20534 8.76408L2.42693 15.6642C1.98803 16.1111 1.27558 16.1121 0.835588 15.6662C0.395596 15.2204 0.394697 14.4966 0.833589 14.0497L6.78584 7.99797Z' fill='%233B002B'/%3E%3C/svg%3E%0A"); background-repeat:no-repeat; background-size: 100% auto; background-position:center;}
/* .mapbox-bottom{padding-top:20px; border-top:1px solid var(--line-table-border-color);} */
.mapbox .line-table :is(.data-head, .data-head *){color:#b13091 !important;}
.map-info-footer{display:flex; flex-direction:row; flex-wrap:nowrap;}
.map-info-footer .map-info-footer-right{flex:auto; margin-left:20px;}
.map-info-footer .map-info-footer-right > a{white-space:nowrap;}

/* Section | Events */
span.icon-bus{display:inline-block; min-height:calc(18px + 3px); padding-left:calc(29px + 6px); background-image:url(/content/dam/dhk/common/theme/2025/arts/icon-bus.svg); background-size:29px 18px; background-repeat:no-repeat; background-position:left top 3px;}

/* Section | Tourists pass */
.tourists-pass-wrapper > .row{padding-left:0 !important; padding-right:0 !important; margin-left:-15px !important; margin-right:-15px !important;}
.tourists-pass .bio-cover{margin-bottom:20px;}
.tourists-pass .bio-name:not(:last-child){margin-bottom:20px;}
.tourists-pass :is(.bio-name, .bio-name *){font-size:var(--h5-font-size) !important; font-weight:800 !important; line-height:1.2 !important;}



/* `lg` applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
   /* Element {Tour Table} */
   .tour-table{width:auto; border-radius:10px;}
	.tour-table .t-row{flex-wrap:wrap;}
	.tour-table .t-cell{flex:1 1 100%; padding-right:30px;}
	.tour-table .t-cell:not(:first-child){border-left:0; border-top:2px solid #F8E4FC;}
	.tour-table .cell-content{flex:1; padding:0;}
	.tour-table .cell-head{padding-left:30px;}
   
   /* Section | Map */
   /* .map-info .map-holder:not(:last-child){margin-bottom:15px;} */
   .btn-primary.btn-view-map{bottom:auto; top:10px;}
   a.btn-map-route{margin-left:6px; width:22px; height:22px;}
   a.btn-nearby, a.btn-nearby *{font-size:12px !important;}
}

/* `md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
   .btn-return{margin-left:0;}

   /* Element {Tour Table} */
	.tour-table .t-cell{padding:15px 12px;}
	.tour-table .cell-head{flex: 1 1 100%; padding:15px 12px;}
	.tour-table .cell-content{padding:0 12px;}
	.tour-table .cell-content > .t-cell{padding-top:0;}
	.tour-table .cell-content > .t-cell, .tour-table .cell-content > .t-row > .t-cell{padding-left:0; padding-right:0;}

   /* Section | Map */
   .map-info{flex-direction:column; gap:16px;}
   .map-info .map-info-left{flex:auto; min-width:0; order:2;}
   .map-info .map-info-right{flex:auto; order:1;}
   .map-info .map-holder:not(:last-child){margin-bottom:10px;}
   .btn-primary.btn-view-map{position:relative !important; float:right; top:auto; right:auto;}
   .map-info .overlay-scrollarea:not(:last-child){margin-bottom:15px;}
   .mapbox .line-table-col{padding-left:0 !important; padding-right:0 !important;}

   /* Section | Events */
   span.icon-bus{min-height:16px; padding-left:calc(26px + 6px); background-size:26px 16px; background-position:left top;}
   
   /* Section | Tourists pass */
   .tourists-pass-wrapper > .row{gap:30px;}

}