/* ============================================================
 * responsive.css — Media queries for mobile, tablet, landscape, and touch devices
 * My Travel History v2.0 — Modular CSS
 * (중복 미디어쿼리 블록 병합 완료)
 * ============================================================ */

/* ========== Mobile Portrait (< 768px) ========== */
@media(max-width:767px){
  /* Trips View mobile */
  .tv-nav{padding:0 var(--sp-4);height:56px}
  .tv-nav-brand span{display:none}
  .tv-body{padding:var(--sp-4)}
  .tv-top{margin:calc(var(--sp-4) * -1);margin-bottom:0;padding:var(--sp-4);padding-bottom:0}
  .tv-header h2{font-size:20px}
  .tv-grid{grid-template-columns:1fr}
  .tv-user span{font-size:12px}
  .tcard-hero{height:160px}

  /* Detail View mobile */
  .dv-layout{grid-template-columns:1fr}
  .dv-layout:not(.show-map) .dv-map-area{display:none}
  .dv-layout:not(.show-map) .dv-side{display:block}
  .dv-layout.show-map .dv-side{display:none}
  .dv-layout.show-map .dv-map-area{display:block}
  /* Mobile: show bottom nav, hide sidebar tabs */
  .dv-bnav{display:flex}
  .tabs{display:none !important}

  /* Modal mobile — bottom sheet */
  .modal{max-width:100%;margin:0;border-radius:var(--r-2xl) var(--r-2xl) 0 0;
    max-height:calc(var(--vvh,85vh) * 0.92)}
  .modal-ov.on{align-items:flex-end;padding:0}
  .modal-handle{display:block}

  /* Toast mobile */
  .toast-c{top:auto;bottom:84px;right:12px;left:12px}
  .toast{min-width:auto}

  /* Modal footer safe area */
  .modal-ft{padding-bottom:calc(16px + var(--safe-b))}

  /* Mobile search dropdown height */
  .srch-dd{max-height:150px}

  /* Always show action buttons on touch */
  .tcard-acts{opacity:1}
  .aitem-acts{opacity:1}
  .eitem-btn{opacity:1}
  .cl-del{opacity:.6}

  /* Shared detail responsive (merged) */
  #shared-detail-view .dv-layout{grid-template-columns:1fr}
  #shared-detail-view .dv-layout:not(.show-map) .dv-map-area{display:none}
  #shared-detail-view .dv-layout:not(.show-map) .dv-side{display:block}
  #shared-detail-view .dv-layout.show-map .dv-side{display:none}
  #shared-detail-view .dv-layout.show-map .dv-map-area{display:block}
  #shared-detail-view .dv-bnav{display:flex}
  #shared-detail-view .tabs{display:none}
  .join-card{padding:28px 24px}
  .join-trip-title{font-size:22px}
}

/* ========== Small Mobile (< 480px) ========== */
@media(max-width:480px){
  .tv-grid{gap:var(--sp-3)}
  .tcard-hero{height:140px}
  .frow{grid-template-columns:1fr}
  .exp-summary{grid-template-columns:1fr}
  .dv-nav{padding:0 var(--sp-3);gap:var(--sp-2)}
  .dv-back{padding:8px 12px;font-size:17px}
  .dv-title{font-size:18px}
  .ac-head h1{font-size:22px}
  .ac-head{padding:32px 24px 24px}
  .rate-date-badge{font-size:11px;padding:8px 10px}
}

/* ========== Short Screen ========== */
@media(max-height:500px){
  .modal{max-height:calc(var(--vvh,95vh) * 0.95)}
}

/* ========== Landscape Mode (merged) ========== */
@media(max-width:926px) and (orientation:landscape){
  /* Personal detail */
  .dv-layout{grid-template-columns:340px 1fr !important}
  .dv-layout:not(.show-map) .dv-map-area{display:block !important}
  .dv-layout:not(.show-map) .dv-side{display:block !important}
  .dv-layout.show-map .dv-side{display:none}
  .dv-layout.show-map .dv-map-area{display:block}

  .dv-nav{height:44px}
  .dv-bnav{height:calc(48px + var(--safe-b))}
  .tv-nav{height:44px}

  .modal-ov.on{align-items:center;padding:12px}
  .modal{max-width:90%;max-height:calc(var(--vvh,100vh) - 24px);
    border-radius:var(--r-xl);margin:auto}
  .modal-handle{display:none}

  .td-title{font-size:18px}
  .td-head{padding:16px}
  .day-title{font-size:14px}

  .dv-bnav{display:none !important}
  .tabs{display:flex !important}
  .tab{font-size:20px;padding:14px 24px;min-height:52px;gap:8px}

  .tv-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
  .tcard-hero{min-height:120px}

  /* Shared detail (merged) */
  #shared-detail-view .dv-layout{grid-template-columns:340px 1fr !important}
  #shared-detail-view .dv-layout:not(.show-map) .dv-map-area{display:block !important}
  #shared-detail-view .dv-layout:not(.show-map) .dv-side{display:block !important}
  #shared-detail-view .dv-layout.show-map .dv-side{display:none}
  #shared-detail-view .dv-layout.show-map .dv-map-area{display:block}
  #shared-detail-view .dv-bnav{display:none !important}
  #shared-detail-view .tabs{display:flex !important}
}

/* ========== Touch Devices — always show action buttons ========== */
@media(hover:none){
  .tcard-acts{opacity:1}
  .aitem-acts{opacity:1}
  .eitem-btn{opacity:1}
  .cl-del{opacity:.6}
}