/*
============================================================
Favorite Page
============================================================
*/

.favorite_page{
    width:100%;
}

.favorite_content{
    margin-top:18px;
}


/*
============================================================
Favorite Toolbar
============================================================
*/

.favorite_toolbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;

    background:#151515;
    border:1px solid #3a3020;
    border-radius:14px;

    padding:14px 16px;
    margin-bottom:18px;
}

.favorite_summary{
    color:#ddd;
    font-size:15px;
}

.favorite_summary strong{
    color:#d6a84f;
    font-size:18px;
}

.favorite_controls{
    display:flex;
    align-items:center;
    gap:16px;
}

.favorite_controls label{
    display:flex;
    align-items:center;
    white-space:nowrap;

    color:#bbb;
    font-size:14px;
}

.favorite_controls label span{
    display:inline-block;
    margin-right:6px;
    white-space:nowrap;
}

.favorite_controls select{
    height:38px;

    background:#0e0e0e;
    color:#eee;

    border:1px solid #4a402e;
    border-radius:8px;

    padding:0 30px 0 10px;

    font-size:14px;
}


/*
============================================================
Favorite Grid
============================================================
*/

.favorite_grid{
    display:grid;
    grid-template-columns:repeat(5, minmax(0, 1fr));
    gap:18px;
}

.favorite_card{
    min-width:0;

    background:#151515;
    border:1px solid #302b22;
    border-radius:12px;

    overflow:hidden;
}

.favorite_card_link{
    display:block;
    color:inherit;
}

.favorite_card_image{
    position:relative;

    width:100%;
    aspect-ratio:154 / 220;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#0d0d0d;
    overflow:hidden;
}

.favorite_card_image img{
    display:block;

    width:100%;
    height:100%;

    object-fit:contain;
}

.favorite_no_image{
    color:#777;
    font-size:13px;
}

.favorite_card_body{
    padding:11px;
}

.favorite_card_name{
    min-height:42px;

    color:#eee;
    font-size:14px;
    line-height:1.5;

    overflow:hidden;
}

.favorite_card_no{
    margin-top:6px;

    color:#888;
    font-size:12px;
}

.favorite_card_tags{
    min-height:25px;

    display:flex;
    flex-wrap:wrap;
    gap:5px;

    margin-top:9px;
}

.favorite_tag{
    display:inline-block;

    border-radius:5px;
    padding:3px 6px;

    font-size:11px;
    line-height:1.2;
}

.favorite_tag.chinese{
    background:#713434;
    color:#fff;
}

.favorite_tag.first{
    background:#6a4c1f;
    color:#fff1c9;
}

.favorite_tag.bluray{
    background:#244f79;
    color:#d9edff;
}

.favorite_card_price{
    margin-top:8px;

    color:#d6a84f;
    font-size:16px;
    font-weight:bold;
}

.favorite_card_points{
    margin-top:4px;

    color:#999;
    font-size:12px;
}

.favorite_card_date{
    border-top:1px solid #2c2923;

    padding:9px 11px;

    color:#777;
    font-size:11px;
}


/*
============================================================
Empty State
============================================================
*/

.favorite_empty{
    text-align:center;

    background:#151515;
    border:1px solid #3a3020;
    border-radius:14px;

    padding:55px 20px;
}

.favorite_empty h2{
    margin:0 0 12px;

    color:#d6a84f;
    font-size:20px;
}

.favorite_empty p{
    margin:0 0 24px;

    color:#aaa;
    font-size:15px;
}

.favorite_empty_btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-width:180px;
    height:44px;

    background:#d6a84f;
    color:#111;

    border-radius:9px;

    font-size:15px;
    font-weight:bold;
}


/*
============================================================
Page Bar
============================================================
*/

.favorite_pagebar{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:16px;

    margin-top:22px;
}

.favorite_pagebar a,
.favorite_pagebar span{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:38px;

    border:1px solid #3a3020;
    border-radius:8px;

    padding:7px 13px;

    font-size:14px;
}

.favorite_pagebar a{
    background:#151515;
    color:#d6a84f;
}

.favorite_pagebar span{
    color:#999;
}


/*
============================================================
Responsive
============================================================
*/

@media (max-width:760px){

    .favorite_toolbar{
        align-items:flex-start;
        flex-direction:column;
    }

    .favorite_controls{
        width:100%;
        gap:10px;
    }

    .favorite_controls label{
        flex:1;
    }

    .favorite_controls select{
        width:100%;
    }

}


@media (max-width:520px){

    .favorite_controls{
        align-items:stretch;
        flex-direction:column;
    }

    .favorite_controls label{
        width:100%;
    }

    .favorite_controls label span{
        width:48px;
        flex:0 0 48px;
    }

    .favorite_empty{
        padding:40px 16px;
    }

    .favorite_empty p{
        font-size:14px;
    }

    .favorite_empty_btn{
        width:100%;
        max-width:280px;
    }

}

/*
============================================================
Favorite Product Card - Follow List Standard
============================================================
*/

.favorite_product_grid .card{
    display:flex;
    flex-direction:column;
    width:162px;
    padding:2px;
    box-sizing:border-box;
    overflow:hidden;

    background:#111;
    border:2px solid #222;
    border-radius:8px;
}

.favorite_product_grid .card > a{
    display:flex;
    flex:1;
    flex-direction:column;

    color:inherit;
    text-decoration:none;
}

.favorite_product_grid .card img{
    display:block;
    width:100%;
    height:auto;

    object-fit:contain;
    background:#fff;
    border:0;
    border-radius:6px;
    box-sizing:border-box;
}

.favorite_product_grid .name{
    height:40px;
    min-height:40px;
    margin:8px 4px 0;

    overflow:hidden;
    color:#eee;
    font-size:14px;
    line-height:20px;
}

.favorite_product_grid .product_meta_first{
    display:flex;
    align-items:center;

    height:28px;
    min-height:28px;
    margin:2px 4px 0;
    overflow:hidden;
}

.favorite_product_grid .product_meta_first .no{
    flex:1;
    min-width:0;
    margin:0;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.favorite_product_grid .tag_slot_first{
    flex:0 0 auto;
    margin-left:4px;
    white-space:nowrap;
}

.favorite_product_grid .product_meta_first .tag{
    margin:0;
}

.favorite_product_grid .product_meta_second{
    height:28px;
    min-height:28px;
    margin:0 4px;

    overflow:hidden;
    line-height:24px;
    white-space:nowrap;
}

.favorite_product_grid .product_meta_second .tag{
    margin-top:2px;
    margin-bottom:0;
}

.favorite_product_grid .price_row{
    display:flex;
    align-items:center;
    justify-content:space-between;

    height:28px;
    min-height:28px;
    margin:0 4px;

    font-size:13px;
    white-space:nowrap;
}

.favorite_product_grid .price,
.favorite_product_grid .points{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.favorite_product_grid .favorite_card_date{
    flex:0 0 auto;
    height:28px;
    margin:0 4px;
    padding:6px 0 0;
    box-sizing:border-box;

    border-top:1px solid #2c2923;
    color:#777;
    font-size:11px;
    line-height:18px;
}


@media(max-width:768px){

    .favorite_product_grid .card{
        width:100%;
    }

    .favorite_product_grid .name{
        height:38px;
        min-height:38px;
        font-size:13px;
        line-height:19px;
    }

    .favorite_product_grid .price_row{
        font-size:12px;
    }

}
/*
============================================================
Favorite Select And Actions
============================================================
*/

.favorite_batch{
    display:flex;
    align-items:center;
    gap:18px;
}

.favorite_select_all_label{
    display:flex;
    align-items:center;
    gap:7px;

    color:#ddd;
    font-size:14px;
    white-space:nowrap;
    cursor:pointer;
}

.favorite_select_all_label input{
    width:17px;
    height:17px;
    margin:0;
    cursor:pointer;
}

.favorite_batch_actions{
    display:flex;
    align-items:center;
    gap:8px;
}

.favorite_batch_actions button{
    height:36px;
    min-width:62px;

    padding:0 14px;

    background:#1b1b1b;
    color:#d6a84f;

    border:1px solid #4a402e;
    border-radius:7px;

    font-size:14px;
    cursor:pointer;
}

.favorite_batch_actions button:hover{
    background:#292319;
}

.favorite_batch_actions button:disabled{
    color:#666;
    background:#151515;
    border-color:#292929;
    cursor:default;
}

.favorite_product_grid .card{
    position:relative;
}

.favorite_card_select{
    position:absolute;
    z-index:5;
    top:8px;
    left:8px;

    display:flex;
    align-items:center;
    justify-content:center;

    width:25px;
    height:25px;

    background:rgba(0, 0, 0, .72);
    border:1px solid rgba(255, 255, 255, .35);
    border-radius:5px;

    cursor:pointer;
}

.favorite_card_select input{
    width:16px;
    height:16px;
    margin:0;
    cursor:pointer;
}

.favorite_product_grid .favorite_card_actions{
    display:flex;
    flex:0 0 auto;
    align-items:center;

    height:38px;
    margin:0 4px;

    border-top:1px solid #2c2923;
}

.favorite_card_actions button{
    display:flex;
    align-items:center;
    justify-content:center;

    width:50%;
    height:31px;
    padding:0;

    background:transparent;
    color:#bbb;

    border:0;
    border-radius:5px;

    font-size:13px;
    line-height:1;
    cursor:pointer;
}

.favorite_card_actions button + button{
    border-left:1px solid #302b22;
    border-radius:0 5px 5px 0;
}

.favorite_card_actions button:hover{
    background:#211d17;
    color:#d6a84f;
}


@media(max-width:760px){

    .favorite_batch{
        width:100%;
        justify-content:space-between;
    }

    .favorite_batch_actions{
        margin-left:auto;
    }

}


@media(max-width:520px){

    .favorite_batch{
        align-items:center;
    }

    .favorite_batch_actions button{
        min-width:58px;
        padding:0 11px;
    }

}


/*
============================================================
Cart Toolbar Summary
============================================================
*/

.cart_toolbar_status{
    display:flex;
    align-items:center;
    gap:16px;
    min-width:0;
}

.cart_summary_group{
    display:flex;
    align-items:center;
    gap:14px;
}

.cart_summary_item{
    color:#d0d0d0;
    font-size:14px;
    white-space:nowrap;
}

.cart_summary_item strong{
    color:#d6a84f;
    font-size:16px;
    font-weight:700;
}

.cart_summary_divider{
    width:1px;
    height:28px;
    flex:0 0 1px;
    background:#453b2b;
}


@media(max-width:760px){

    .cart_toolbar_status{
        align-items:flex-start;
        flex-wrap:wrap;
        gap:10px 14px;
    }

    .cart_summary_group{
        gap:10px;
    }

    .cart_summary_divider{
        display:none;
    }

}


@media(max-width:520px){

    .cart_summary_group{
        width:100%;
        justify-content:flex-start;
        flex-wrap:wrap;
    }

    .cart_summary_item{
        font-size:13px;
    }

    .cart_summary_item strong{
        font-size:15px;
    }

}


/*
============================================================
Selection Action Bar
============================================================
*/

.selection_action_bar{
    position:sticky;
    z-index:20;
    top:10px;

    display:flex;
    align-items:center;
    gap:8px;

    padding:12px 14px;
    margin-bottom:18px;

    background:#151515;
    border:1px solid #3a3020;
    border-radius:12px;

    box-shadow:
        0 8px 22px rgba(0, 0, 0, .42);
}

.selection_action_bar button,
.selection_action_bar a{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    height:36px;
    min-width:62px;
    padding:0 14px;

    background:#1b1b1b;
    color:#d6a84f;

    border:1px solid #4a402e;
    border-radius:7px;

    font-size:14px;
    line-height:1;
    text-decoration:none;
    white-space:nowrap;
    cursor:pointer;
}

.selection_action_bar button:hover,
.selection_action_bar a:hover{
    background:#292319;
}

.selection_action_bar button:disabled{
    color:#666;
    background:#151515;
    border-color:#292929;
    cursor:default;
}

.selection_action_bar .cart_checkout_btn{
    margin-left:auto;

    background:#d6a84f;
    color:#151515;
    border-color:#d6a84f;

    font-weight:700;
}

.selection_action_bar .cart_checkout_btn:hover{
    background:#e1ba70;
}


@media(max-width:760px){

    .selection_action_bar{
        top:6px;
        flex-wrap:wrap;
        gap:7px;

        padding:10px;
    }

    .selection_action_bar button,
    .selection_action_bar a{
        height:34px;
        min-width:58px;
        padding:0 11px;

        font-size:13px;
    }

    .selection_action_bar .cart_checkout_btn{
        margin-left:auto;
    }

}


@media(max-width:520px){

    .selection_action_bar{
        border-radius:10px;
    }

    .selection_action_bar button,
    .selection_action_bar a{
        flex:1 1 auto;
    }

    .selection_action_bar .cart_checkout_btn{
        flex:1 1 100%;
        margin-left:0;
    }

}

.cart_card_actions button{
    width:100%;
}

.cart_card_actions button + button{
    border-left:0;
}


/*
============================================================
Guest Cart Banner
============================================================
*/

.cart_guest_notice{

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;

    margin:0 0 18px;
    padding:18px 20px;

    background:#1c1c1c;
    border:1px solid #3a3020;
    border-radius:14px;

}

.cart_guest_notice_text{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.cart_guest_notice_text strong{
    color:#d6a84f;
    font-size:18px;
    font-weight:700;
}

.cart_guest_notice_text span{
    color:#b9b9b9;
    font-size:14px;
    line-height:1.6;
}

.cart_guest_notice_login{

    display:inline-flex;
    align-items:center;
    justify-content:center;

    height:42px;
    padding:0 22px;

    background:#d6a84f;
    color:#151515;

    border-radius:8px;

    font-weight:700;
    text-decoration:none;

    transition:.2s;

}

.cart_guest_notice_login:hover{
    background:#e4bd71;
}

@media(max-width:760px){

    .cart_guest_notice{

        flex-direction:column;
        align-items:flex-start;

    }

    .cart_guest_notice_login{

        width:100%;

    }

}

/*
============================================================
Guest Cart Layout V2
============================================================
*/

.cart_page .cart_guest_notice{
    padding:14px 18px;
    margin-bottom:16px;
    border-radius:10px;
}

.cart_page .cart_guest_notice_text{
    gap:3px;
}

.cart_page .cart_guest_notice_text strong{
    font-size:16px;
}

.cart_page .cart_guest_notice_text span{
    font-size:13px;
}

.cart_page .cart_guest_notice_login{
    height:38px;
    padding:0 20px;
}


.cart_page .cart_toolbar{
    min-height:48px;
    padding:12px 16px;
    margin-bottom:20px;
    box-sizing:border-box;
    background:#171717;
    border-radius:10px;
}

.cart_page .cart_toolbar_status{
    width:100%;
    gap:20px;
}

.cart_page .cart_select_all_label{
    padding-right:18px;
    border-right:1px solid #453b2b;
}

.cart_page .cart_summary_group{
    gap:22px;
}

.cart_page .cart_summary_item{
    display:flex;
    align-items:center;
    gap:5px;
}

.cart_page .cart_summary_item strong{
    color:#d6a84f;
}

.cart_page .cart_toolbar_actions{
    display:flex;
    align-items:center;
    margin-left:auto;
}

.cart_page .cart_toolbar_button{
    min-width:110px;
    height:40px;
    padding:0 18px;

    display:flex;
    align-items:center;
    justify-content:center;

    white-space:nowrap;

    background:#181818;
    color:#d6a84f;

    border:1px solid #7a6230;
    border-radius:8px;

    font-size:14px;
    font-weight:bold;
    cursor:pointer;

    box-sizing:border-box;
}

.cart_page .cart_toolbar_button:hover{
    background:#222;
    border-color:#b88628;
}

.cart_page .cart_toolbar_button:disabled{
    opacity:.55;
    cursor:default;
}

.cart_page .cart_product_grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, 162px);
    justify-content:start;
    gap:20px 18px;
    padding:2px 2px 20px;
}

.cart_page .cart_product_grid .card{
    margin:0;
}


@media(max-width:760px){

    .cart_page .cart_guest_notice{
        padding:14px;
    }

    .cart_page .cart_toolbar{
    padding:12px;
    flex-wrap:wrap;
}

.cart_page .cart_toolbar_status{
    width:100%;
}

.cart_page .cart_toolbar_actions{
    width:100%;
    margin-left:0;
}

.cart_page .cart_toolbar_button{
    width:100%;
}

    .cart_page .cart_select_all_label{
        padding-right:12px;
    }

    .cart_page .cart_summary_group{
        gap:12px;
    }

    .cart_page .cart_product_grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:12px 10px;
        padding-bottom:16px;
    }

}
