/**
 * ===================================================================
 * wezunu - Country Landing Explore Mode v3
 * Fullscreen Karte, Bento-Slideout, Filter-Dropdown, Detail-Layer
 * Developed by Toni Sciacca - mail@tonisciacca.com
 * ===================================================================
 */

.cle-fs{position:relative;height:calc(100vh - 72px);margin-top:72px;overflow:hidden;}
.cle-map{position:absolute;inset:0;z-index:1;}

/* ── Info Panel (links) ── */
.cle-info-panel{position:absolute;top:0;left:0;bottom:0;width:380px;z-index:10;background:#fff;box-shadow:4px 0 24px rgba(0,0,0,.08);transform:translateX(-100%);transition:transform .3s ease;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,56,92,.1) transparent;}
.cle-info-panel::-webkit-scrollbar{width:4px;}.cle-info-panel::-webkit-scrollbar-thumb{background:rgba(255,56,92,.1);border-radius:4px;}
.cle-info-panel.visible{transform:translateX(0);}
.cle-ip-close{position:absolute;top:14px;right:14px;width:32px;height:32px;border:none;border-radius:50%;background:rgba(0,0,0,.04);cursor:pointer;display:flex;align-items:center;justify-content:center;color:#9a9a9a;z-index:2;transition:all .2s;}
.cle-ip-close:hover{background:rgba(255,56,92,.08);color:#FF385C;}.cle-ip-close i{width:16px;height:16px;}
.cle-ip-head{padding:24px 20px 16px;display:flex;gap:12px;align-items:flex-start;}
.cle-ip-icon{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}.cle-ip-icon i{width:20px;height:20px;color:#fff;}
.cle-ip-title{font-size:18px;font-weight:700;color:#1a1a1a;line-height:1.3;}
.cle-ip-cat{font-size:11px;color:#9a9a9a;font-weight:500;margin-top:2px;}
.cle-ip-content{padding:0 20px 24px;}
.cle-ip-desc{font-size:14px;color:#4a4a4a;line-height:1.7;margin:0 0 16px;}
.cle-ip-facts{display:flex;flex-direction:column;gap:4px;margin-bottom:16px;}
.cle-ip-fact{display:flex;align-items:center;gap:8px;font-size:13px;color:#1a1a1a;padding:5px 0;border-bottom:1px solid #f5f0ed;}.cle-ip-fact:last-child{border-bottom:none;}
.cle-ip-fact i{width:15px;height:15px;color:#FF385C;flex-shrink:0;}.cle-ip-fact span{flex:1;}
.cle-ip-highlights{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:16px;}
.cle-ip-hl{padding:4px 10px;border-radius:50px;font-size:11px;font-weight:500;background:rgba(255,56,92,.06);color:#FF385C;}
.cle-ip-links{display:flex;flex-direction:column;gap:6px;margin-top:16px;padding-top:16px;border-top:1px solid #f0ebe8;}
.cle-ip-link{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:10px;background:#faf8f5;text-decoration:none;color:#1a1a1a;font-size:13px;font-weight:500;transition:all .2s;border:none;cursor:pointer;font-family:'Outfit',sans-serif;text-align:left;width:100%;}
.cle-ip-link:hover{background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.04);}
.cle-ip-link i{width:15px;height:15px;color:#FF385C;}
.cle-ip-link-plan{background:#FF385C;color:#fff;}.cle-ip-link-plan:hover{background:#e0304f;}.cle-ip-link-plan i{color:#fff;}

/* ── Filter (rechts oben, Dropdown) ── */
.cle-filter-pills{position:absolute;top:12px;right:12px;z-index:12;}
.cle-filter-trigger{display:flex;align-items:center;gap:6px;padding:8px 16px;border-radius:50px;border:none;background:#fff;color:#1a1a1a;font-family:'Outfit',sans-serif;font-size:12px;font-weight:600;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.1);transition:all .2s;}
.cle-filter-trigger:hover{box-shadow:0 4px 16px rgba(0,0,0,.12);}
.cle-filter-trigger i{width:15px;height:15px;color:#FF385C;}
.cle-filter-trigger span{font-size:10px;background:rgba(255,56,92,.08);color:#FF385C;padding:1px 6px;border-radius:8px;font-weight:700;}
.cle-filter-dropdown{position:absolute;top:calc(100% + 8px);right:0;width:220px;max-height:0;overflow:hidden;background:#fff;border-radius:14px;box-shadow:0 8px 32px rgba(0,0,0,.12);transition:max-height .3s ease;z-index:20;}
.cle-filter-dropdown.open{max-height:70vh;overflow-y:auto;}
.cle-fd-item{display:flex;align-items:center;gap:8px;width:100%;padding:9px 14px;border:none;background:transparent;font-family:'Outfit',sans-serif;font-size:12px;font-weight:500;color:#4a4a4a;cursor:pointer;transition:background .15s;text-align:left;}
.cle-fd-item:hover{background:rgba(255,56,92,.03);}
.cle-fd-item.active{background:rgba(255,56,92,.06);color:#FF385C;font-weight:600;}
.cle-fd-item i{width:14px;height:14px;color:#FF385C;}
.cle-fd-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;}
.cle-fd-item span{margin-left:auto;font-size:10px;color:#9a9a9a;font-weight:600;}

/* ── Slideout (oben Mitte) ── */
.cle-slideout-trigger{position:absolute;top:0;left:50%;transform:translateX(-50%);z-index:20;width:44px;height:26px;background:#fff;border-radius:0 0 12px 12px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.08);transition:all .2s;}
.cle-slideout-trigger i{width:16px;height:16px;color:#9a9a9a;transition:transform .3s;}
.cle-slideout-trigger:hover{background:#FF385C;}.cle-slideout-trigger:hover i{color:#fff;}
.cle-slideout-trigger.open i{transform:rotate(180deg);}
.cle-slideout{position:absolute;top:0;left:12%;right:12%;z-index:15;background:#fff;border-radius:0 0 16px 16px;box-shadow:0 8px 32px rgba(0,0,0,.1);max-height:0;overflow:hidden;transition:max-height .35s ease;}
.cle-slideout.open{max-height:65vh;overflow-y:auto;}
.cle-slideout-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #f0ebe8;position:sticky;top:0;background:#fff;z-index:2;}
.cle-slideout-tabs{display:flex;gap:4px;}
.cle-so-tab{padding:5px 14px;border:1px solid #e8e0e4;border-radius:50px;background:#fff;color:#6b6b6b;font-family:'Outfit',sans-serif;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s;}
.cle-so-tab:hover{border-color:#FF385C;color:#FF385C;}
.cle-so-tab.active{background:#FF385C;color:#fff;border-color:#FF385C;}
.cle-slideout-close{width:28px;height:28px;border:none;border-radius:50%;background:rgba(0,0,0,.04);cursor:pointer;display:flex;align-items:center;justify-content:center;color:#9a9a9a;transition:all .2s;}
.cle-slideout-close:hover{background:rgba(255,56,92,.08);color:#FF385C;}.cle-slideout-close i{width:14px;height:14px;}
.cle-slideout-body{padding:14px 16px 20px;position:relative;min-height:120px;}

/* ── Bento Grid im Slideout ── */
.cle-bento{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.cle-bn-cell{background:#faf8f5;border:1px solid #f0ebe8;border-radius:14px;padding:16px;cursor:pointer;transition:all .2s;position:relative;overflow:hidden;}
.cle-bn-cell:hover{border-color:rgba(255,56,92,.15);box-shadow:0 4px 16px rgba(255,56,92,.04);transform:translateY(-2px);}
.cle-bn-wide{grid-column:span 2;}
.cle-bn-accent{background:linear-gradient(135deg,#FF385C,#ff6b8a);color:#fff;border:none;}
.cle-bn-accent .cle-bn-label{color:rgba(255,255,255,.7);}
.cle-bn-accent .cle-bn-row{color:#fff;}
.cle-bn-accent .cle-bn-row i{color:rgba(255,255,255,.7);}
.cle-bn-icon{margin-bottom:8px;}.cle-bn-icon i{width:20px;height:20px;color:#FF385C;}
.cle-bn-accent .cle-bn-icon i{color:rgba(255,255,255,.8);}
.cle-bn-label{font-size:10px;font-weight:700;color:#9a9a9a;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;}
.cle-bn-value{font-size:13px;font-weight:500;color:#1a1a1a;line-height:1.4;}
.cle-bn-stat{font-family:'Playfair Display',serif;font-size:24px;font-weight:700;color:#1a1a1a;line-height:1;}
.cle-bn-more{font-size:10px;color:#FF385C;font-weight:500;margin-top:6px;}
.cle-bn-row{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500;padding:4px 0;}
.cle-bn-row i{width:14px;height:14px;color:#FF385C;flex-shrink:0;}

/* ── Detail Layer (gleitet im Slideout rein) ── */
.cle-detail-layer{position:absolute;inset:0;background:#fff;z-index:5;transform:translateX(100%);transition:transform .3s ease;overflow-y:auto;padding:0;}
.cle-detail-layer.open{transform:translateX(0);}
.cle-dl-head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid #f0ebe8;position:sticky;top:0;background:#fff;z-index:2;}
.cle-dl-back{width:32px;height:32px;border:none;border-radius:50%;background:rgba(0,0,0,.04);cursor:pointer;display:flex;align-items:center;justify-content:center;color:#1a1a1a;transition:all .2s;flex-shrink:0;}
.cle-dl-back:hover{background:rgba(255,56,92,.08);color:#FF385C;}.cle-dl-back i{width:16px;height:16px;}
.cle-dl-head h3{font-size:15px;font-weight:700;color:#1a1a1a;margin:0;}
.cle-dl-content{padding:14px 16px 20px;}
.cle-dl-item{padding:10px 0;border-bottom:1px solid #f5f0ed;}
.cle-dl-item:last-child{border-bottom:none;}
.cle-dl-item strong{font-size:13px;font-weight:600;color:#1a1a1a;display:block;margin-bottom:2px;}
.cle-dl-item p{font-size:12px;color:#6b6b6b;line-height:1.5;margin:4px 0 0;}
.cle-dl-tag{display:inline-block;padding:2px 8px;border-radius:50px;font-size:10px;font-weight:600;background:rgba(255,56,92,.06);color:#FF385C;margin-left:6px;}
.cle-dl-hint{display:flex;align-items:center;gap:4px;font-size:11px;color:#9a9a9a;margin-top:4px;}.cle-dl-hint i{width:11px;height:11px;color:#FF385C;}
.cle-dl-tr{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid #f8f4f2;font-size:12px;}.cle-dl-tr:last-child{border-bottom:none;}
.cle-dl-tr-route{font-weight:600;color:#1a1a1a;flex:1;}
.cle-dl-tr-carrier{color:#9a9a9a;font-size:10px;}
.cle-dl-tr-price{color:#FF385C;font-weight:600;}
.cle-dl-tr-dur{color:#9a9a9a;font-size:10px;}

/* ── Marker ── */
.cle-m{transition:transform .2s;}
body.cl-mode-explore .footer{display:none;}

/* ── Responsive ── */
@media(max-width:900px){.cle-bento{grid-template-columns:repeat(2,1fr);}.cle-slideout{left:4%;right:4%;}}
@media(max-width:768px){
    .cle-info-panel{width:100%;top:auto;bottom:0;height:50vh;transform:translateY(100%);box-shadow:0 -4px 24px rgba(0,0,0,.08);}.cle-info-panel.visible{transform:translateY(0);}
    .cle-bento{grid-template-columns:1fr 1fr;}.cle-bn-wide{grid-column:span 2;}
    .cle-filter-pills{top:8px;right:8px;}
}

/* ── Gallery im Info-Panel ── */
.cle-ip-gallery{width:100%;height:200px;position:relative;overflow:hidden;background:#f0ebe8;}
.cle-ip-gallery-img{width:100%;height:100%;background-size:cover;background-position:center;position:relative;}
.cle-ip-gallery-count{position:absolute;bottom:10px;right:10px;padding:3px 10px;border-radius:50px;background:rgba(0,0,0,0.5);color:#fff;font-size:11px;font-weight:600;display:flex;align-items:center;gap:4px;}
.cle-ip-gallery-count i{width:12px;height:12px;}
.cle-ip-gallery-empty{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#ccc;}
.cle-ip-gallery-empty i{width:32px;height:32px;}

/* ── Related Links im Info-Panel ── */
.cle-ip-related{margin-top:16px;padding-top:16px;border-top:1px solid #f0ebe8;}
.cle-ip-related-title{font-size:11px;font-weight:700;color:#9a9a9a;text-transform:uppercase;letter-spacing:.5px;margin:0 0 10px;display:flex;align-items:center;gap:5px;}
.cle-ip-related-title i{width:13px;height:13px;color:#FF385C;}
.cle-ip-related-grid{display:flex;flex-wrap:wrap;gap:6px;}

/* ── Nearby im Info-Panel ── */
.lf-nearby-sec{margin-bottom:16px;}
.lf-nearby-title{font-size:11px;font-weight:700;color:#9a9a9a;text-transform:uppercase;letter-spacing:.5px;margin:0 0 8px;display:flex;align-items:center;gap:5px;}
.lf-nearby-title i{width:13px;height:13px;color:#FF385C;}
.lf-nearby-list{display:flex;flex-direction:column;gap:0;}
.lf-nearby-card{padding:8px 0;border-bottom:1px solid #f5f0ed;}
.lf-nearby-card:last-child{border-bottom:none;}
.lf-nearby-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.lf-nearby-name{font-size:13px;font-weight:500;color:#1a1a1a;}
.lf-nearby-dist{font-size:11px;color:#9a9a9a;font-weight:500;flex-shrink:0;}
.lf-nearby-sub{font-size:11px;color:#FF385C;font-weight:500;}

/* ── Spin fuer Nearby Loader ── */
@keyframes lf-spin-anim{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.lf-spin{animation:lf-spin-anim 1s linear infinite;}

/* ── Header Mode Overrides ── */
body.cl-mode-grid .header{background:#fff;border-bottom:1px solid #ddd;}
body.cl-mode-grid .header .logo-compass{color:#FF385C;}
body.cl-mode-grid .header .logo-text{color:#FF385C;}
body.cl-mode-grid .header .cl-vs{background:#fff;border-color:#e8e8e8;color:#9a9a9a;}
body.cl-mode-grid .header .cl-vs:hover{border-color:#FF385C;color:#FF385C;}
body.cl-mode-grid .header .cl-vs.active{background:#1a1a1a;color:#fff;border-color:#1a1a1a;}
body.cl-mode-grid .header .sh-av-lg{border-color:#e8e8e8;}
body.cl-mode-grid .header .sh-av-lg i{color:#9a9a9a;}
body.cl-mode-explore .header{background:#fff;border-bottom:1px solid #ddd;}
body.cl-mode-explore .header .logo-compass{color:#FF385C;}
body.cl-mode-explore .header .logo-text{color:#FF385C;}
body.cl-mode-explore .header .cl-vs{background:#fff;border-color:#e8e8e8;color:#9a9a9a;}
body.cl-mode-explore .header .cl-vs:hover{border-color:#FF385C;color:#FF385C;}
body.cl-mode-explore .header .cl-vs.active{background:#1a1a1a;color:#fff;border-color:#1a1a1a;}
body.cl-mode-explore .header .sh-av-lg{border-color:#e8e8e8;}
body.cl-mode-explore .header .sh-av-lg i{color:#9a9a9a;}
