/* =====================================================================
   리유아 v5 — 화면 우측에 붙는 책갈피형 빠른 상담
   메인/서브 공통. 모바일은 기존 safe-area 하단 상담 바를 유지한다.
   ===================================================================== */

@media (min-width: 801px) {
  .rv-v4 .quick {
    right: 0;
    bottom: clamp(92px, 13vh, 148px);
    width: 62px;
    padding: 7px 0 7px 7px;
    gap: 1px;
    align-items: stretch;
    overflow: hidden;
    pointer-events: auto;
    border: 1px solid rgba(72, 53, 44, .12);
    border-right: 0;
    border-radius: 22px 0 0 22px;
    background: rgba(251, 248, 244, .92);
    box-shadow: -12px 16px 36px rgba(47, 35, 29, .12);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
    transition: width .42s cubic-bezier(.22, 1, .36, 1), box-shadow .3s ease;
  }

  .rv-v4 .quick:hover,
  .rv-v4 .quick:focus-within {
    width: 150px;
    box-shadow: -18px 20px 46px rgba(47, 35, 29, .15);
  }

  .rv-v4 .quick .quick__top,
  .rv-v4 .quick .quick__kakao,
  .rv-v4 .quick .quick__naver,
  .rv-v4 .quick .quick__call {
    position: relative;
    width: 100%;
    height: 52px;
    min-height: 52px;
    flex: 0 0 52px;
    justify-content: flex-end;
    padding: 0 19px 0 14px;
    overflow: hidden;
    border-radius: 14px 0 0 14px;
    box-shadow: none;
    background: transparent;
    color: #2d241f;
    transition: background-color .28s ease, color .28s ease;
  }

  .rv-v4 .quick .quick__top { background: #876f61; color: #fff; }
  .rv-v4 .quick .quick__top:not(.is-visible) { display: none; }
  .rv-v4 .quick .quick__top::before,
  .rv-v4 .quick .quick__kakao::before,
  .rv-v4 .quick .quick__naver::before,
  .rv-v4 .quick .quick__call::before {
    position: absolute;
    left: 18px;
    top: 50%;
    translate: -8px -50%;
    opacity: 0;
    white-space: nowrap;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: .08em;
    transition: opacity .24s ease .04s, translate .38s cubic-bezier(.22, 1, .36, 1);
  }
  .rv-v4 .quick .quick__top::before { content: "TOP"; }
  .rv-v4 .quick .quick__kakao::before { content: "카카오 상담"; }
  .rv-v4 .quick .quick__naver::before { content: "네이버 예약"; }
  .rv-v4 .quick .quick__call::before { content: "전화 상담"; }

  .rv-v4 .quick:hover > :not(.quick__mobilebar)::before,
  .rv-v4 .quick:focus-within > :not(.quick__mobilebar)::before {
    opacity: 1;
    translate: 0 -50%;
  }

  .rv-v4 .quick .quick__naver { font-size: 18px; }
  .rv-v4 .quick .quick__kakao svg,
  .rv-v4 .quick .quick__call svg,
  .rv-v4 .quick .quick__top svg {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
  }
  .rv-v4 .quick .quick__kakao svg { fill: #2d241f; }
  .rv-v4 .quick .quick__call svg { stroke: #2d241f; }

  .rv-v4 .quick .quick__top:hover,
  .rv-v4 .quick .quick__kakao:hover,
  .rv-v4 .quick .quick__naver:hover,
  .rv-v4 .quick .quick__call:hover,
  .rv-v4 .quick .quick__top:focus-visible,
  .rv-v4 .quick .quick__kakao:focus-visible,
  .rv-v4 .quick .quick__naver:focus-visible,
  .rv-v4 .quick .quick__call:focus-visible {
    transform: none;
    background: #2d241f;
    color: #fff;
    outline: none;
  }
  .rv-v4 .quick .quick__kakao:hover svg,
  .rv-v4 .quick .quick__kakao:focus-visible svg { fill: #fff; }
  .rv-v4 .quick .quick__call:hover svg,
  .rv-v4 .quick .quick__call:focus-visible svg { stroke: #fff; }
}

@media (max-width: 800px) {
  .rv-v4 .quick {
    right: 0;
    bottom: 0;
    width: auto;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .rv-v4 .quick__mobilebar {
    border-radius: 18px;
    border-color: rgba(71, 52, 43, .1);
    background: rgba(252, 249, 245, .96);
    box-shadow: 0 12px 34px rgba(47, 35, 29, .16);
  }
  .rv-v4 .quick__mobilebar a:first-child { background: #f1e8df; }
  .rv-v4 .quick__mobilebar a:nth-child(2) { background: #f6e16b; }
  .rv-v4 .quick__mobilebar a:nth-child(3) { background: #2fb66f; }
}

@media (prefers-reduced-motion: reduce) {
  .rv-v4 .quick,
  .rv-v4 .quick > *::before { transition: none !important; }
}
