/*
Theme Name: Yummy Box 2026
Theme URI: https://www.kadencewp.com/kadence-theme/
Template: kadence
Author: Kadence WP
Author URI: https://www.kadencewp.com/
Description: Kadence Theme is a lightweight yet full featured WordPress theme for creating beautiful fast loading and accessible websites, easier than ever. It features an easy to use drag and drop header and footer builder to build any type of header in minutes. It features a full library of gorgeous starter templates that are easy to modify with our intelligent global font and color controls. With extensive integration with the most popular 3rd party plugins, you can quickly build impressive ecommerce websites, course websites, business websites, and more.
Tags: translation-ready,accessibility-ready,two-columns,right-sidebar,left-sidebar,footer-widgets,blog,custom-logo,custom-background,custom-menu,rtl-language-support,editor-style,threaded-comments,custom-colors,featured-images,wide-blocks,full-width-template,theme-options,e-commerce
Version: 1.4.5.1777106063
Updated: 2026-04-25 08:34:23

*/

#order_review{
position:sticky;
top:30px;
align-self:start;
}

.woocommerce-checkout-review-order{
position:sticky;
top:30px;
}


/* Proceed to Checkout button */



#place_order{
background:#000000 !important;
border:none !important;
border-radius:16px !important;
padding:18px 24px !important;
font-size:18px;
font-weight:700;
width:100%;
box-shadow:0 8px 20px rgba(0,0,0,.12);
transition:.2s;
}

#place_order:hover{
transform:translateY(-2px);
}

/* ==========================================
   MINIMALIST ANDROID STYLE – MY ACCOUNT PAGE
   Inspired by Material Design 3
   ========================================== */
   
@media screen and (min-width: 768px) {
    .woocommerce-account .account-navigation-wrap {
        float: right;
        width: 30%;
        border-left: 0px solid var(--global-gray-400);
        margin-bottom: 0;
    }
}

/* 1. Import Google’s system font (Roboto) */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');

/* 2. Global reset for the My Account page */
.woocommerce-account {
    font-family: 'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
    background-color: #f5f5f5;
}

/* 3. Main layout – clean two‑column grid */
.woocommerce-account .woocommerce {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 16px;
    background: transparent;
}

/* 4. Left navigation – no card, just a simple list */
.woocommerce-account .woocommerce-MyAccount-navigation {
    flex: 1 1 240px;
    background: transparent;
    padding: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    margin: 0;
    padding: 0;
    list-style: none;
    background: white;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #e0e0e0;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    margin: 0;
    border-bottom: 1px solid #eeeeee;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child {
    border-bottom: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 14px 20px;
    font-size: 0.9rem;
    font-weight: 500;
    color: #202124;
    text-decoration: none;
    transition: background 0.15s ease;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    background-color: #f8f9fa;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    color: #1a73e8;   /* Material blue for active state */
    background-color: #e8f0fe;
    border-left: 3px solid #1a73e8;
}

/* 5. Right content – minimalist card */
.woocommerce-account .woocommerce-MyAccount-content {
    flex: 3 1 400px;
    background: white;
    border-radius: 12px;
    border: 1px solid #e0e0e0;
    padding: 24px;
    box-shadow: none;  /* no elevation – flat */
}

/* 6. Typography – crisp and simple */
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
    font-size: 1.4rem;
    font-weight: 500;
    color: #202124;
    margin: 0 0 1rem 0;
    padding-bottom: 0;
    border-bottom: none;
}

.woocommerce-MyAccount-content p {
    color: #5f6368;
    line-height: 1.5;
}

/* 7. Buttons – outlined / text style (Android) */
.woocommerce-account .button,
.woocommerce-MyAccount-content .button {
    background: transparent;
    color: #1a73e8;
    border: 1px solid #dadce0;
    border-radius: 20px;
    padding: 8px 20px;
    font-weight: 500;
    font-size: 0.85rem;
    text-transform: none;
    transition: background 0.2s;
    box-shadow: none;
}

.woocommerce-account .button:hover,
.woocommerce-MyAccount-content .button:hover {
    background: #f1f3f4;
    border-color: #c6c8ca;
    transform: none;
}

/* 8. Address and order sections – subtle cards */
.woocommerce-MyAccount-content .woocommerce-Addresses,
.woocommerce-MyAccount-content .woocommerce-order-details,
.woocommerce-MyAccount-content .woocommerce-customer-details {
    background: #fefefe;
    border-radius: 12px;
    padding: 16px;
    margin-top: 24px;
    border: 1px solid #e2e2e2;
}

/* 9. Orders table – minimal, no stripes */
.woocommerce-account .shop_table {
    width: 100%;
    border-collapse: collapse;
    background: white;
    border-radius: 12px;
    overflow: hidden;
}

.woocommerce-account .shop_table th {
    background-color: #fafafa;
    padding: 12px 8px;
    font-weight: 500;
    color: #5f6368;
    font-size: 0.85rem;
    border-bottom: 1px solid #e0e0e0;
}

.woocommerce-account .shop_table td {l
    padding: 12px 8px;
    border-bottom: 1px solid #eeeeee;
    color: #202124;
}

/* 10. Welcome message – simple, no gradient */
.woocommerce-MyAccount-content p:first-child {
    background: #e8f0fe;
    color: #174ea6;
    padding: 12px 16px;
    border-radius: 8px;
    font-weight: 500;
    margin-top: 0;
    box-shadow: none;
}

/* 11. Logout link – neutral, not red */
.woocommerce-MyAccount-navigation ul li:last-child a {
    color: #5f6368;
    border-top: 1px solid #eeeeee;
    margin-top: 0;
}

.woocommerce-MyAccount-navigation ul li:last-child a:hover {
    background-color: #f8f9fa;
    color: #d93025;  /* only on hover */
}

/* 12. Responsive – stacks on mobile */
@media (max-width: 768px) {
    .woocommerce-account .woocommerce {
        flex-direction: column;
        gap: 16px;
        padding: 16px;
    }
    .woocommerce-account .woocommerce-MyAccount-navigation {
        flex: auto;
    }
    .woocommerce-MyAccount-content {
        padding: 16px;
    }
}