@charset "utf-8";

/* SOSODODAM_SERVICE1_OVERRIDE_V1
 * rb.service1 구조를 유지하면서 소소도담 전용 기능/스타일만 이식합니다.
 */

/* Service 1 회원영역: 닉네임 앞 프로필 */
.rbs1-header .member_info_wrap .sdd-s1-member{display:inline-flex;align-items:center;gap:7px;vertical-align:middle}
.rbs1-header .member_info_wrap .sdd-s1-profile{display:inline-flex;width:28px;height:28px;flex:0 0 28px;border-radius:50%;overflow:hidden;background:#f7f2f4;border:1px solid rgba(201,95,130,.16)}
.rbs1-header .member_info_wrap .sdd-s1-profile img{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:50%!important}
.rbs1-header .member_info_wrap .sdd-s1-nick{min-width:0}
@media(max-width:1024px){.rbs1-header .member_info_wrap .sdd-s1-profile{width:26px;height:26px;flex-basis:26px}}

/* SOSODODAM_MOBILE_DOCK_GLASS_V5_START */

:root {
    --soso-mobile-dock-space:
        calc(98px + env(safe-area-inset-bottom, 0px));

    --soso-dock-pink:#F7AFC4;
    --soso-dock-pink-deep:#C95F82;
    --soso-dock-text:#66545B;
}

@media (max-width:1024px) {

    body {
        padding-bottom:var(--soso-mobile-dock-space) !important;
    }

    /*
     * 실제 반투명 Glass Dock
     * 흰색 자체는 매우 투명하게 두고
     * 뒤의 화면을 blur 처리한다.
     */
    .tail_fixed_gnb.soso-mobile-dock {
        position:fixed !important;

        left:12px !important;
        right:12px !important;
        bottom:calc(
            10px + env(safe-area-inset-bottom, 0px)
        ) !important;

        top:auto !important;

        width:auto !important;
        height:76px !important;
        min-height:76px !important;

        margin:0 !important;
        padding:8px 7px 7px !important;

        display:grid !important;
        grid-template-columns:repeat(5, minmax(0,1fr));
        align-items:center;
        gap:2px;

        /*
         * 핵심:
         * 이전 .46 → 현재 .18 수준
         */
        background:
            linear-gradient(
                145deg,
                rgba(255,255,255,.24) 0%,
                rgba(255,245,249,.15) 48%,
                rgba(255,255,255,.09) 100%
            ) !important;

        border:
            1px solid rgba(255,255,255,.48) !important;

        border-radius:24px !important;

        -webkit-backdrop-filter:
            blur(17px)
            saturate(175%)
            contrast(1.03);

        backdrop-filter:
            blur(17px)
            saturate(175%)
            contrast(1.03);

        box-shadow:
            0 14px 34px rgba(61,39,47,.13),
            0 4px 12px rgba(61,39,47,.07),
            inset 0 1px 0 rgba(255,255,255,.48),
            inset 0 -1px 0 rgba(255,255,255,.08);

        text-align:center !important;
        overflow:visible;
        isolation:isolate;

        z-index:98 !important;
    }

    /*
     * 유리 윗면 반사
     * 이것도 기존보다 훨씬 투명하게
     */
    .tail_fixed_gnb.soso-mobile-dock::before {
        content:"";

        position:absolute;
        z-index:0;

        left:9px;
        right:9px;
        top:5px;

        height:27px;

        border-radius:19px;

        background:
            linear-gradient(
                180deg,
                rgba(255,255,255,.24),
                rgba(255,255,255,.015)
            );

        opacity:.8;

        pointer-events:none;
    }

    /*
     * 아래쪽 아주 약한 핑크 유리 반사
     */
    .tail_fixed_gnb.soso-mobile-dock::after {
        content:"";

        position:absolute;
        z-index:0;

        left:18%;
        right:18%;
        bottom:1px;

        height:12px;

        border-radius:50%;

        background:rgba(247,175,196,.10);

        filter:blur(13px);

        pointer-events:none;
    }

    .soso-mobile-dock .soso-dock-item {
        position:relative;
        z-index:1;

        min-width:0;
        height:58px;

        margin:0;
        padding:4px 2px 3px;

        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;

        gap:4px;

        border:0;
        border-radius:16px;

        background:transparent;

        color:var(--soso-dock-text) !important;

        text-decoration:none !important;

        touch-action:manipulation;
        -webkit-tap-highlight-color:transparent;

        transition:
            transform .16s ease,
            color .16s ease,
            background-color .16s ease,
            box-shadow .16s ease;
    }

    .soso-mobile-dock .soso-dock-item:active {
        transform:scale(.95);
    }

    .soso-mobile-dock .soso-dock-emoji {
        display:block;

        height:26px;

        font-family:
            "Apple Color Emoji",
            "Segoe UI Emoji",
            "Noto Color Emoji",
            sans-serif;

        font-size:23px;
        line-height:26px;

        filter:saturate(1.06);
    }

    .soso-mobile-dock .soso-dock-label {
        display:block;

        width:100%;

        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;

        font-family:
            Pretendard,
            -apple-system,
            BlinkMacSystemFont,
            "Apple SD Gothic Neo",
            "Noto Sans KR",
            sans-serif;

        font-size:10.5px;
        line-height:1.1;

        font-weight:700;
        letter-spacing:-.28px;

        color:inherit;
    }

    /*
     * 활성 메뉴도 불투명한 핑크 박스가 아니라
     * 핑크빛 유리 얼룩처럼 처리
     */
    .soso-mobile-dock
    .soso-dock-item.is-active:not(.soso-dock-home) {

        color:var(--soso-dock-pink-deep) !important;

        background:
            rgba(247,175,196,.13);

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.30);
    }

    .soso-mobile-dock .soso-dock-home {
        transform:translateY(-4px);
    }

    .soso-mobile-dock .soso-dock-home:active {
        transform:
            translateY(-4px)
            scale(.95);
    }

    .soso-mobile-dock
    .soso-dock-home
    .soso-dock-emoji {

        height:31px;

        font-size:29px;
        line-height:31px;

        filter:
            saturate(1.08)
            drop-shadow(
                0 5px 8px rgba(181,103,129,.13)
            );
    }

    .soso-mobile-dock
    .soso-dock-home
    .soso-dock-label {

        font-size:10.5px;
        color:#755A64;
    }

    .soso-mobile-dock
    .soso-dock-home.is-active {

        background:
            rgba(247,175,196,.14);

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.32);
    }

    .soso-mobile-dock
    .soso-dock-home.is-active
    .soso-dock-label {

        color:var(--soso-dock-pink-deep);
    }

    .soso-mobile-dock .soso-dock-badge {
        position:absolute;

        z-index:4;

        top:-1px;
        left:50%;

        transform:translateX(9px);

        min-width:17px;
        height:17px;

        padding:0 5px;

        display:flex;
        align-items:center;
        justify-content:center;

        border:
            1.5px solid rgba(255,255,255,.72);

        border-radius:999px;

        background:
            rgba(229,83,128,.90);

        color:#fff;

        font-size:9px;
        line-height:1;
        font-weight:800;

        box-shadow:
            0 3px 8px rgba(133,48,75,.17);
    }

    .chat_open_btn {
        bottom:
            calc(
                var(--soso-mobile-dock-space) + 12px
            ) !important;
    }

    @media (max-width:380px) {

        .tail_fixed_gnb.soso-mobile-dock {
            left:8px !important;
            right:8px !important;

            border-radius:22px !important;

            padding-left:4px !important;
            padding-right:4px !important;
        }

        .soso-mobile-dock .soso-dock-emoji {
            font-size:21px;
        }

        .soso-mobile-dock
        .soso-dock-home
        .soso-dock-emoji {
            font-size:27px;
        }

        .soso-mobile-dock .soso-dock-label {
            font-size:9.5px;
        }
    }

    @media (prefers-reduced-motion:reduce) {

        .soso-mobile-dock,
        .soso-mobile-dock *,
        .soso-mobile-dock *::before,
        .soso-mobile-dock *::after {
            transition:none !important;
        }
    }
}


/*
 * backdrop-filter 자체를 지원하지 않는 환경에서만
 * 불투명 대체 배경 사용
 */
@supports not (
    (backdrop-filter:blur(1px))
    or
    (-webkit-backdrop-filter:blur(1px))
) {

    @media (max-width:1024px) {

        .tail_fixed_gnb.soso-mobile-dock {
            background:
                rgba(255,250,252,.82) !important;
        }
    }
}


@media (min-width:1025px) {

    .tail_fixed_gnb.soso-mobile-dock {
        display:none !important;
    }
}

/* SOSODODAM_MOBILE_DOCK_GLASS_V5_END */

/* SOSODODAM_FLOATING_STACK_V1_START (2026-09-28)
 * 하단 dock(≤1024px)과 떠 있는 버튼(카카오 캐릭터 · PWA 앱·알림 · 상품상세 구매바) 충돌 정리
 * - dock이 실제로 있는 페이지에서만 적용(body:has)
 * - 카카오 버튼: dock 위 12px
 * - PWA 버튼: 카카오 버튼 바로 위(같은 오른쪽 열) → 왼쪽 채널톡 런처와 겹치지 않음
 * - 장바구니 · 주문서 · 상품상세: PWA 버튼은 아이콘만, 카카오 버튼은 46px로 축소(기능 유지)
 * - 상품상세: 구매바(#sit_buy · #sum_section · 접기 버튼)를 dock 높이만큼 위로 올림
 */
@media (max-width:1024px) {

    body:has(.tail_fixed_gnb.soso-mobile-dock) .sdc-contact-float {
        bottom:calc(var(--soso-mobile-dock-space) + 12px) !important;
    }

    body:has(.tail_fixed_gnb.soso-mobile-dock) #soso-pwa-launcher.soso-pwa-launcher {
        left:auto !important;
        right:var(--soso-float-x, 24px) !important;
        bottom:calc(var(--soso-mobile-dock-space) + 12px + var(--soso-float-size, 58px) + 10px) !important;
    }

    /* 장바구니 · 주문서 · 상품상세: 작은 버튼 */
    body:has(#sod_bsk) #soso-pwa-launcher.soso-pwa-launcher,
    body:has(.sdd-od) #soso-pwa-launcher.soso-pwa-launcher,
    body:has(#sit_ov) #soso-pwa-launcher.soso-pwa-launcher {
        width:40px !important;
        height:40px !important;
        padding:0 !important;
        justify-content:center !important;
        border-radius:50% !important;
        bottom:calc(var(--soso-mobile-dock-space) + 12px + 46px + 10px) !important;
        right:calc(var(--soso-float-x, 24px) + 3px) !important;
    }
    body:has(#sod_bsk) #soso-pwa-launcher.soso-pwa-launcher > span:not([aria-hidden]),
    body:has(.sdd-od) #soso-pwa-launcher.soso-pwa-launcher > span:not([aria-hidden]),
    body:has(#sit_ov) #soso-pwa-launcher.soso-pwa-launcher > span:not([aria-hidden]) {
        display:none !important;
    }
    body:has(#sod_bsk) .sdc-contact-float .sdc-kakao-button,
    body:has(.sdd-od) .sdc-contact-float .sdc-kakao-button,
    body:has(#sit_ov) .sdc-contact-float .sdc-kakao-button {
        width:46px !important;
        height:46px !important;
    }

    /* PWA 안내 시트: dock 위 */
    body:has(.tail_fixed_gnb.soso-mobile-dock) #soso-pwa-onboarding {
        bottom:calc(var(--soso-mobile-dock-space) + 8px) !important;
    }

    /* 상품상세 구매바: dock 위로 */
    body:has(.tail_fixed_gnb.soso-mobile-dock) #sit_buy.fix,
    body:has(.tail_fixed_gnb.soso-mobile-dock) #sum_section.sum_section,
    body:has(.tail_fixed_gnb.soso-mobile-dock) #sit_buy_tog.sit_buy_tog {
        translate:0 calc(-1 * (var(--soso-mobile-dock-space) - 12px));
    }
}
@media (max-width:767px) {
    :root { --soso-float-x:18px; --soso-float-size:54px; }
}
/* SOSODODAM_FLOATING_STACK_V1_END */

/* SOSODODAM_ITEM_DETAIL_TABS_V1_START */

/*
 * 소소도담 상품상세 하단 탭
 * - 상품정보 / 사용후기 / 상품문의 / 배송·교환
 * - 기존 파란 밑줄 제거
 * - 라운드 탭바 + 차콜 선택버튼
 * - 상세내용 라운드 카드
 */
@media (min-width:1101px) {

    #sit_info {
        display:block !important;
        width:100% !important;
        min-height:0 !important;

        box-sizing:border-box !important;

        margin:28px 0 30px !important;
        padding:0 !important;

        border:0 !important;
        background:transparent !important;
    }

    #sit_tab {
        display:block !important;

        width:100% !important;
        max-width:none !important;

        box-sizing:border-box !important;
    }

    /* 예전 하단 중복 구매박스는 PC에서 제거 */
    #sit_info > #sit_buy {
        display:none !important;
    }

    /* ── 탭 전체 ── */
    #sit_tab .tab_tit {
        display:grid !important;
        grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
        align-items:center !important;

        gap:4px !important;

        width:100% !important;
        box-sizing:border-box !important;

        margin:0 0 14px !important;
        padding:6px !important;

        border:1px solid #e7e1e3 !important;
        border-radius:15px !important;

        background:#fff !important;

        overflow:hidden !important;
    }

    #sit_tab .tab_tit:after {
        display:none !important;
    }

    #sit_tab .tab_tit li {
        display:block !important;
        float:none !important;

        width:auto !important;
        margin:0 !important;
        padding:0 !important;

        border:0 !important;
    }

    #sit_tab .tab_tit li button {
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        width:100% !important;
        height:42px !important;

        box-sizing:border-box !important;

        margin:0 !important;
        padding:0 12px !important;

        border:0 !important;
        border-radius:10px !important;

        background:transparent !important;
        color:#746e71 !important;

        font-size:13px !important;
        font-weight:600 !important;
        line-height:1 !important;

        text-align:center !important;

        transition:
            background .18s ease,
            color .18s ease !important;
    }

    #sit_tab .tab_tit li button:hover {
        background:#faf7f8 !important;
        color:#3a3437 !important;
    }

    /* 선택 탭 */
    #sit_tab .tab_tit li button.selected {
        background:#302b2d !important;
        color:#fff !important;

        font-weight:700 !important;
    }

    /* 기존 파란 밑줄 강제 제거 */
    #sit_tab .tab_tit li button.selected:before,
    #sit_tab .tab_tit li button.selected:after {
        display:none !important;
        content:none !important;
    }

    /* 후기/문의 숫자도 별도 회색 뱃지 대신 텍스트처럼 */
    #sit_tab .item_use_count,
    #sit_tab .item_qa_count {
        display:inline !important;

        min-width:0 !important;
        width:auto !important;
        height:auto !important;

        margin-left:3px !important;
        padding:0 !important;

        border:0 !important;
        border-radius:0 !important;

        background:transparent !important;
        color:inherit !important;

        font-size:inherit !important;
        line-height:inherit !important;
    }

    /* ── 상세내용 카드 ── */
    #sit_tab .tab_con {
        width:100% !important;
        min-height:110px !important;

        box-sizing:border-box !important;

        margin:0 !important;
        padding:26px !important;

        border:1px solid #e7e1e3 !important;
        border-radius:16px !important;

        background:#fff !important;

        overflow:hidden !important;
    }

    #sit_tab .tab_con > li {
        box-sizing:border-box !important;
    }

    #sit_tab .tab_con h2,
    #sit_tab .tab_con .contents_tit {
        margin:0 0 20px !important;

        color:#282326 !important;

        font-size:21px !important;
        font-weight:700 !important;
        line-height:1.4 !important;
    }
}

/* SOSODODAM_ITEM_DETAIL_TABS_V1_END */

/* SOSODODAM_ITEM_DETAIL_TABS_PINK_V2_START */
/*
 * 소소도담 상품상세 하단 탭 색상 V2
 * 구조/크기/배치 변경 없음
 * 색상만 소소도담 핑크 계열로 변경
 */
@media (min-width:1101px) {

    /* 탭 외곽 */
    #sit_tab .tab_tit {
        border-color:#f0dfe4 !important;
        background:#fff !important;
    }

    /* 기본 탭 */
    #sit_tab .tab_tit li button {
        background:transparent !important;
        color:#776f72 !important;
    }

    /* 마우스 오버 */
    #sit_tab .tab_tit li button:hover {
        background:#fff5f8 !important;
        color:#a5526b !important;
    }

    /* 선택된 탭 */
    #sit_tab .tab_tit li button.selected {
        background:#F7AFC4 !important;
        color:#633b49 !important;
        box-shadow:0 4px 12px rgba(247,175,196,.24) !important;
    }

    /* 후기/문의 숫자 */
    #sit_tab .item_use_count,
    #sit_tab .item_qa_count {
        color:#b18391 !important;
    }

    #sit_tab .tab_tit li button.selected .item_use_count,
    #sit_tab .tab_tit li button.selected .item_qa_count {
        color:#633b49 !important;
    }

    /* 아래 상세내용 카드 */
    #sit_tab .tab_con {
        border-color:#f0e2e6 !important;
        background:#fff !important;
    }

    /* 상품정보 제목 */
    #sit_tab .tab_con h2,
    #sit_tab .tab_con .contents_tit {
        color:#302b2d !important;
    }
}
/* SOSODODAM_ITEM_DETAIL_TABS_PINK_V2_END */

/* SOSODODAM_SORTLST_SINGLE_ROW_V1_START */

/*
 * 정렬바와 우측 상품목록 컨트롤을 한 행으로 복귀.
 * 부모 자체를 위/아래로 이동하지 않는다.
 */
#sct_sortlst {
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    flex-wrap:nowrap !important;

    gap:8px !important;

    min-height:48px !important;

    margin-top:4px !important;

    padding-top:0 !important;
    padding-bottom:0 !important;

    box-sizing:border-box !important;
}


/* ========================
   PC
   ======================== */
@media (min-width:768px) {

    #sct_sortlst #sct_sort.pc {
        position:static !important;

        flex:1 1 auto !important;

        width:auto !important;
        min-width:0 !important;
        max-width:none !important;

        min-height:36px !important;

        margin:0 !important;
        padding:0 !important;

        display:flex !important;
        align-items:center !important;
        justify-content:flex-end !important;
    }

    #sct_sortlst #ssch_sort {
        display:flex !important;
        align-items:center !important;
        justify-content:flex-end !important;

        flex-wrap:nowrap !important;

        width:auto !important;

        margin:0 !important;
        padding:0 !important;

        gap:5px !important;
    }

    #sct_sortlst #ssch_sort > li {
        flex:0 0 auto !important;
        margin:0 !important;
    }
}


/* ========================
   MOBILE
   ======================== */
@media (max-width:767px) {

    #sct_sortlst #sct_sort.pc {
        display:none !important;
    }

    #sct_sortlst .ssch_sort_mobile {
        position:static !important;

        flex:1 1 auto !important;

        width:132px !important;
        max-width:132px !important;
        height:42px !important;

        margin:0 !important;

        float:none !important;
    }
}

/* SOSODODAM_SORTLST_SINGLE_ROW_V1_END */

/* SOSODODAM_SORT_BUTTON_TUNE_V1_START */
@media (min-width:768px) {

    /* 정렬 버튼 묶음만 살짝 아래로 */
    #sct_sortlst #sct_sort.pc #ssch_sort {
        transform:translateY(3px) !important;
    }

    /* 버튼 크기 축소 */
    #sct_sortlst #sct_sort.pc #ssch_sort li a {
        min-height:30px !important;
        height:30px !important;

        padding:0 10px !important;

        border-radius:9px !important;

        font-size:11px !important;
        line-height:30px !important;
    }
}
/* SOSODODAM_SORT_BUTTON_TUNE_V1_END */

/* SOSODODAM_PRODUCT_LIST_TOP_GAP_V1_START */

/* 정렬영역 하단 구분선과 첫 상품카드 사이 여백 */
#sct_sortlst + ul.sct {
    margin-top:14px !important;
}

/* SOSODODAM_PRODUCT_LIST_TOP_GAP_V1_END */


/* ===== Service1 이식: 상품리스트 UI v6 ===== */
/* 소소도담 상품리스트 UI 정리 v6 */
.rb-stock-line{margin-top:8px !important;line-height:1.4;}
.rb-stock-badge{display:inline !important;min-height:0 !important;padding:0 !important;border:0 !important;border-radius:0 !important;background:transparent !important;font-size:12px !important;font-weight:500 !important;box-shadow:none !important;}
.rb-stock-badge.is-ok{color:#4c8068 !important;}
.rb-stock-badge.is-low{color:#a66a32 !important;}
.rb-stock-badge.is-soldout{color:#8a888d !important;}

.sct_40{margin-top:12px !important;}
.sct_40 .sct_li{position:relative;min-height:205px;padding:18px 16px 18px 0 !important;border-bottom:1px solid #eceaec !important;transition:background-color .15s ease;}
.sct_40 .sct_li:hover{background:#fffafb;}
.sct_40 .sct_img{margin-right:22px !important;}
.sct_40 .sct_img a{z-index:1 !important;}
.sct_40 .sct_img img{border-radius:9px;}
.sct_40 .sct_txt{margin:5px 190px 8px 0 !important;padding:0 !important;line-height:1.45;}
.sct_40 .sct_txt a{font-size:16px !important;font-weight:600 !important;color:#2f2d30;}
.sct_40 .sct_basic{margin:0 190px 8px 0 !important;color:#7a767b;line-height:1.5;}
.sct_40 .rb-stock-line{margin-right:190px;}
.sct_40 .sct_icon{position:absolute;top:18px;right:16px;display:flex;align-items:center;justify-content:flex-end;gap:4px;margin:0 !important;}
.sct_40 .sct_icon .shop_icon{float:none !important;}
.sct_40 .sct_cost{position:absolute;top:48px;right:16px;min-width:140px;margin:0 !important;text-align:right;font-size:17px !important;line-height:1.35;}
.sct_40 .sct_dict{margin-bottom:2px;font-size:12px !important;}
.sct_40 .sododam-list40-actions{margin:10px 190px 0 0;}
.sct_40 .sododam-list40-cart{height:31px;padding:0 11px;border:1px solid #e2d8dc;border-radius:6px;background:#fff;color:#6e666b;font-size:12px;cursor:pointer;}
.sct_40 .sododam-list40-cart:hover{border-color:#d6a8b5;background:#fff8fa;color:#aa4f69;}
.sct_40 .sododam-list40-cart i{margin-right:4px;font-size:11px;}
.sct_40 .sct_op_btn{right:16px !important;bottom:18px !important;display:flex;gap:3px;}
.sct_40 .sct_op_btn>button{width:30px !important;height:30px !important;border-radius:6px !important;color:#9a969b !important;}
.sct_40 .sct_op_btn>button:hover{background:#f8f5f6 !important;color:#b64f6d !important;}

@media all and (max-width:768px){
    #sct_sortlst{min-height:44px;border-top:0 !important;}
    .ssch_sort_mobile{width:auto !important;min-width:130px;}
    .sct_40 .sct_li{min-height:150px;padding:14px 0 !important;}
    .sct_40 .sct_img{margin-right:14px !important;}
    .sct_40 .sct_txt,.sct_40 .sct_basic,.sct_40 .rb-stock-line,.sct_40 .sododam-list40-actions{margin-right:0 !important;}
    .sct_40 .sct_cost{position:static;min-width:0;margin-top:7px !important;text-align:left;font-size:16px !important;}
    .sct_40 .sct_icon{position:static;justify-content:flex-start;margin:0 0 5px !important;}
    .sct_40 .sct_op_btn{position:static !important;display:flex;justify-content:flex-end;margin-top:8px;}
}
