/* KareTrip Sections CSS - 추가 스타일 및 오버라이드 */

/* Nectar Scrolling Text Overflow 강제 적용 */
.nectar-scrolling-text[data-sep-text="true"],
.nectar-scrolling-text[data-sep-text="true"] > .nectar-scrolling-text-inner {
    overflow: hidden !important;
}

/* Google Fonts 적용 */
body, .u-sans-serif, .c-button, .c-navigation, .c-menu, p, span, a, div {
    font-family: 'PT Sans', sans-serif;
}

.u-serif, .u-italic-serif, h1, h2, h3, h4, h5, h6, .u-heading-1, .u-heading-2, .u-heading-3 {
    font-family: 'PT Serif', serif;
}

/* WordPress 환경에서 전체 너비 강제 적용 */
.karetrip-fullwidth-section {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    overflow: hidden !important;
}

/* Salient 테마 컨테이너 오버라이드 */
.karetrip-fullwidth-section .container,
.karetrip-fullwidth-section .container-wrap,
.karetrip-fullwidth-section .main-content,
.karetrip-fullwidth-section .wpb_row {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 원본 o-section 스타일 유지 */
.karetrip-fullwidth-section .o-section {
    width: 100%;
    position: relative;
    padding: 0 !important;
    overflow: visible !important; /* 상단 텍스트 보이도록 */
}

.karetrip-fullwidth-section .o-section--no-overflow {
    overflow: visible !important; /* o-section--no-overflow 클래스 오버라이드 */
}

/* 원본 o-container 스타일 유지 */
.karetrip-fullwidth-section .o-container {
    max-width: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
    overflow: visible !important; /* 상단 텍스트 보이도록 */
}

.karetrip-fullwidth-section .c-home-header-module {
    padding-top: 120px !important; /* 상단 텍스트를 위한 공간 확보 */
    overflow: visible !important; /* 상단 텍스트 보이도록 */
}

.karetrip-fullwidth-section .js-home-header {
    overflow: visible !important; /* 상단 텍스트 보이도록 */
}

/* H4 제목과 슬라이더 사이 간격 조정 */
.karetrip-fullwidth-section .c-home-header-module__title {
    margin-bottom: var(--s-220) !important;
}

/* 슬라이더 좌우 그라데이션 효과 */
.karetrip-fullwidth-section .c-home-header-module__slider-wrapper-outside {
    position: relative !important;
    overflow: visible !important; /* 상단 텍스트가 보이도록 */
    height: auto !important;
    max-height: none !important;
    display: flex !important;
    align-items: center !important; /* 세로 중앙 정렬 */
    justify-content: center !important; /* 가로 중앙 정렬 */
}

/* 그라데이션 가상 요소의 높이를 wrapper 전체로 확장 */
.karetrip-fullwidth-section .c-home-header-module__slider-wrapper-outside::before,
.karetrip-fullwidth-section .c-home-header-module__slider-wrapper-outside::after {
    top: 0 !important;
    bottom: auto !important; /* bottom 제한 제거 */
    height: 100% !important; /* 명시적 높이 설정 */
    pointer-events: none !important;
}

.karetrip-fullwidth-section .c-home-header-module__slider-wrapper {
    position: relative !important;
    overflow: visible !important; /* 상단 텍스트가 보이도록 */
    height: auto !important;
    max-height: none !important;
}

/* Swiper 메인 슬라이더 - 원본 스타일 유지 */

.karetrip-fullwidth-section .c-home-header-module__slider-wrapper-outside::before,
.karetrip-fullwidth-section .c-home-header-module__slider-wrapper-outside::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 300px !important;
    z-index: 10 !important;
    pointer-events: none !important;
}

.karetrip-fullwidth-section .c-home-header-module__slider-wrapper-outside::before {
    left: 0 !important;
    background: linear-gradient(90deg, #000000, transparent) !important;
}

.karetrip-fullwidth-section .c-home-header-module__slider-wrapper-outside::after {
    right: 0 !important;
    background: linear-gradient(270deg, #000000, transparent) !important;
}

/* 모바일에서는 그라데이션 숨기기 */
@media (max-width: 800px) {
    .karetrip-fullwidth-section .c-home-header-module__slider-wrapper-outside::before,
    .karetrip-fullwidth-section .c-home-header-module__slider-wrapper-outside::after {
        display: none !important;
    }
}

/* 오버레이 박스 콘텐츠 조정 - 배경 안에 맞도록 */
.karetrip-fullwidth-section .c-home-header-module__slider-overlay {
    overflow: visible !important; /* 상단 텍스트 보이도록 */
    position: absolute !important;
    top: 50% !important; /* 세로 중앙 */
    left: 50% !important; /* 가로 중앙 */
    transform: translate(-50%, -50%) !important; /* 정확한 중앙 정렬 */
}

.karetrip-fullwidth-section .c-home-header-module__slider-overlay-border {
    overflow: hidden !important; /* 박스 모양 유지 */
    position: relative !important;
    padding-top: 4px !important; /* 위쪽 여백 */
    padding-bottom: 4px !important; /* 아래쪽 여백 */
    /* 높이는 JavaScript로 슬라이더에 맞춰 동적 설정 */
}

/* 오버레이 박스 내부의 슬라이더 - 이미지 크기에 맞춰 조정 */
.karetrip-fullwidth-section .c-home-header-module__slider-top img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important; /* 박스에 맞춰 채우기 */
    display: block !important;
}

/* 가운데 박스 내부 상하 패딩 조정 */
.karetrip-fullwidth-section .c-home-header-module__slider-overlay-top {
    padding-top: 25px !important; /* 상단 패딩 증가 */
    padding-bottom: 25px !important; /* 하단 패딩 증가 */
}

.karetrip-fullwidth-section .c-home-header-module__slider-overlay-bottom {
    padding-top: 25px !important; /* 상단 패딩 증가 */
    padding-bottom: 25px !important; /* 하단 패딩 증가 */
}

/* 슬라이드 제목 고정 높이 및 폰트 크기 */
.karetrip-fullwidth-section .c-home-header-module__slide-title {
    min-height: 2.4em !important;
    display: flex !important;
    align-items: center !important;
    font-size: 28px !important;
    line-height: 1.2 !important;
}

/* 배경 슬라이더 이미지 설정 */
.karetrip-fullwidth-section .c-home-header-module__slider .swiper-slide img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* 오버레이 박스 내부 텍스트 크기 조정 - 2줄로 떨어지지 않도록 */
.karetrip-fullwidth-section .o-section .c-home-header-module .c-home-header-module__slider-overlay .c-home-header-module__slider-overlay-top-wrap span,
.karetrip-fullwidth-section .o-section .c-home-header-module .c-home-header-module__slider-overlay .c-home-header-module__slider-overlay-top span,
.karetrip-fullwidth-section .o-section .c-home-header-module .c-home-header-module__slider-overlay span.u-font-secondary,
.karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap span,
.karetrip-fullwidth-section .c-home-header-module__slider-overlay-top span,
.karetrip-fullwidth-section .u-font-secondary,
.karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap h1,
.karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap h2,
.karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap h3 {
    font-size: 28px !important; /* 42px에서 28px로 축소 */
    line-height: 1.2 !important;
    white-space: nowrap !important;
    font-family: 'PT Serif', serif !important;
    font-weight: 400 !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    color: #000000 !important;
    transform: none !important;
    clip-path: none !important;
    width: auto !important;
    height: auto !important;
}

.karetrip-fullwidth-section .c-home-header-module__slider-overlay-bottom-text {
    font-size: 28px !important; /* 42px에서 28px로 축소 */
    line-height: 1.2 !important;
    white-space: nowrap !important;
    font-family: 'PT Serif', serif !important;
    font-weight: 400 !important;
}

/* Get in Touch 버튼 숨기기 */
.karetrip-fullwidth-section .c-home-header-module__slider-overlay-bottom .c-button {
    display: none !important;
}

/* 배경 슬라이더 제목 색상 - 흰색 */
.karetrip-fullwidth-section .c-home-header-module__slider .c-home-header-module__slide-title {
    color: #ffffff !important;
}

/* 오버레이 박스 안 슬라이더 제목 색상 - 검정색 */
.karetrip-fullwidth-section .c-home-header-module__slider-top .c-home-header-module__slide-title {
    color: #000000 !important;
}

/* 모바일에서 텍스트 크기 조정 */
@media (max-width: 800px) {
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap span,
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap h1,
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap h2,
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap h3 {
        font-size: 18px !important;
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-bottom-text {
        font-size: 28px !important;
    }
}

/* 작은 모바일에서 추가 조정 */
@media (max-width: 480px) {
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap span,
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap h1,
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap h2,
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap h3 {
        font-size: 16px !important;
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-bottom-text {
        font-size: 28px !important;
    }
}

/* 슬라이더 모바일 최적화 */
@media (max-width: 800px) {
    .karetrip-fullwidth-section .c-home-header-module__slider-wrapper-outside {
        max-width: 100% !important;
        margin-left: -20px !important;
        margin-right: -20px !important;
        padding: 0 20px !important;
        overflow: visible !important; /* 상단 텍스트 보이도록 */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-wrapper {
        transform: none !important;
        opacity: 1 !important;
        overflow: visible !important; /* 상단 텍스트 보이도록 */
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider.swiper {
        overflow: hidden !important;
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider .swiper-slide {
        width: 70vw !important;
        max-width: 280px !important;
        min-width: 200px !important;
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-top {
        width: 70vw !important;
        max-width: 280px !important;
        min-width: 200px !important;
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-top .swiper-slide {
        width: 70vw !important;
        max-width: 280px !important;
        min-width: 200px !important;
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay {
        width: 75vw !important;
        max-width: 300px !important;
        min-width: 220px !important;
        overflow: visible !important; /* 상단 텍스트 보이도록 */
    }
    
    .karetrip-fullwidth-section .c-home-header-module {
        padding-top: 100px !important; /* 모바일에서는 조금 줄임 */
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-top-wrap,
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-border,
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-bottom {
        max-width: 100% !important;
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-border {
        /* 높이는 JavaScript로 슬라이더에 맞춰 동적 설정 */
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-top {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-overlay-bottom {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }
}

/* Google Translator 스타일 - 메뉴와 통일 */
.google-translator-menu-item {
    float: left !important;
    list-style: none !important;
    margin: 0 0 0 20px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
}

/* GTranslate 위젯 스타일 */
.google-translator-menu-item .skiptranslate,
.google-translator-menu-item .goog-te-gadget,
.google-translator-menu-item div.skiptranslate {
    display: inline-block !important;
    background: transparent !important;
    font-family: 'PT Sans', sans-serif !important;
    font-size: 14px !important;
    padding: 0 !important;
    line-height: 1 !important;
}

.google-translator-menu-item .goog-te-gadget-simple {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    display: inline-block !important;
}

.google-translator-menu-item .goog-te-gadget-simple .goog-te-menu-value {
    color: #ffffff !important;
    font-family: 'PT Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
}

.google-translator-menu-item .goog-te-gadget-simple .goog-te-menu-value span {
    color: #ffffff !important;
    border: none !important;
    display: inline !important;
}

.google-translator-menu-item .goog-te-gadget-simple .goog-te-menu-value span:first-child {
    margin-right: 5px !important;
}

.google-translator-menu-item .goog-te-gadget-icon {
    display: none !important;
}

.google-translator-menu-item img {
    display: none !important;
}

#glt-translate-trigger {
    display: none !important;
}

/* "에서 제공" 텍스트 숨기기 - 모든 자식 요소 숨기고 select만 보이도록 */
.google-translator-menu-item .skiptranslate > *:not(#\\:0\\.targetLanguage),
.google-translator-menu-item .goog-te-gadget > *:not(#\\:0\\.targetLanguage) {
    display: none !important;
}

.google-translator-menu-item .skiptranslate > span,
.google-translator-menu-item .goog-te-gadget > span {
    display: none !important;
}

/* select를 담고 있는 div만 보이도록 */
.google-translator-menu-item #\\:0\\.targetLanguage {
    display: inline-block !important;
}

.google-translator-menu-item .skiptranslate select,
.google-translator-menu-item .goog-te-gadget select,
.google-translator-menu-item .goog-te-combo {
    display: inline-block !important;
}

.google-translator-menu-item select,
.google-translator-menu-item .gt-selector,
#header-outer .google-translator-menu-item select,
#header-outer .buttons .google-translator-menu-item select {
    background: #000000 !important;
    border: 1px solid #ffffff !important;
    border-radius: 3px !important;
    box-shadow: none !important;
    font-family: 'PT Sans', sans-serif !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    padding: 6px 24px 6px 12px !important;
    margin: 0 !important;
    cursor: pointer !important;
    outline: 0 !important;
    outline-width: 0 !important;
    outline-style: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-repeat: no-repeat !important;
    background-position: right 8px center !important;
    background-size: 8px !important;
    line-height: normal !important;
    vertical-align: middle !important;
    display: inline-block !important;
}

.google-translator-menu-item select:hover {
    opacity: 0.7 !important;
}


/* 옵션 드롭다운 */
.google-translator-menu-item select option {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    padding: 10px !important;
}

/* 모바일 메뉴에서의 Google Translator 스타일 */
#mobile-menu .google-translator-menu-item,
.off-canvas-menu-container .google-translator-menu-item {
    float: none !important;
    display: block !important;
    margin: 0 !important;
    padding: 15px 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
    position: relative !important;
    z-index: 100 !important;
}

#mobile-menu .google-translator-menu-item select,
.off-canvas-menu-container .google-translator-menu-item select {
    width: 100% !important;
    display: block !important;
    padding: 10px 12px !important;
    font-size: 16px !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    position: relative !important;
    z-index: 100 !important;
    color: #ffffff !important;
    border-color: #ffffff !important;
}

/* 반응형 조정 */
@media (max-width: 768px) {
    .karetrip-fullwidth-section {
        width: 100vw !important;
        margin-left: calc(50% - 50vw) !important;
    }
}

/* 모바일에서도 전체 너비 유지 */
@media (max-width: 480px) {
    .karetrip-fullwidth-section {
        width: 100vw !important;
        max-width: 100vw !important;
    }
    
    .karetrip-fullwidth-section .c-home-header-module__slider-wrapper-outside {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .c-home-header-module__slider .swiper-slide {
        width: 240px !important;
        max-width: 75vw !important;
    }
    
    .c-home-header-module__slider-top {
        width: 240px !important;
        max-width: 75vw !important;
    }
    
    .c-home-header-module__slider-top .swiper-slide {
        width: 240px !important;
        max-width: 75vw !important;
    }
    
    .c-home-header-module__slider-overlay {
        width: 260px !important;
        max-width: 80vw !important;
        overflow: visible !important;
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
    }
    
    .c-home-header-module {
        padding-top: 80px !important; /* 작은 모바일에서는 더 줄임 */
    }
    
    .c-home-header-module__slider-overlay-top {
        padding-top: 15px !important;
        padding-bottom: 15px !important;
    }
    
    .c-home-header-module__slider-overlay-bottom {
        padding-top: 15px !important;
        padding-bottom: 15px !important;
    }
}
