/*
Theme Name: Yummy Box Theme
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.5.0.1780547961
Updated: 2026-06-04 04:39:21

*/

body, main {
	background: #F7FAFC;
}

#xs-app {
    max-width: 420px;
    margin: 60px auto;
    text-align: center;
    font-family: Arial;
}

.xs-btn {
    width: 100%;
    padding: 14px;
    margin: 10px 0;
    border: none;
    border-radius: 12px;
    background: #ff2b85;
    color: white;
    font-size: 16px;
    cursor: pointer;
}

.xs-dark {
    background: #333;
}

input {
    width: 100%;
    padding: 12px;
    margin: 8px 0;
    border-radius: 10px;
    border: 1px solid #ddd;
}


/* ==========================================================================
   YUMMY BOX: CLEAN iOS MINIMALIST APP PROFILE (NO SIMULATED PHONE BORDERS)
   ========================================================================== */

/* Clean Up Default WooCommerce Layout Constraints */
.woocommerce-account .woocommerce {
    display: block !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation {
    display: none !important; /* Hide old sidebar menu permanently */
}
.woocommerce-account .woocommerce-MyAccount-content {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 1. The Core 9:16 Aspect Ratio App Canvas Container */
.ybxs-app-canvas {
    width: 100%;
    max-width: 410px; /* Locks standard device width on desktop monitors */
    min-height: 730px; /* Math proportional matching for clean 9:16 aspect scaling */
    margin: 40px auto;
    background: #F2F2F7; /* Apple system background color layer */
    border-radius: 24px; /* Soft, seamless modern dashboard roundness metric */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); /* Soft background canvas isolation drop shadow */
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", sans-serif;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    overflow: hidden;
}

/* Smooth fluid fallback transition behavior for native touch smartphones */
@media (max-width: 480px) {
    .ybxs-app-canvas {
        margin: 0 auto;
        border-radius: 0;
        max-width: 100%;
        min-height: 100vh; /* Takes full workspace screen height on mobile */
        box-shadow: none;
    }
}

/* 2. Sleek iOS Navigation Header */
.ybxs-app-header {
    background: rgba(255, 255, 255, 0.8); /* Translucent iOS glassmorphism feel */
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    padding: 30px 24px 20px 24px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end; /* Aligns contents neatly over the row baseline */
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.ybxs-app-greeting span {
    font-size: 13px;
    font-weight: 500;
    color: #8E8E93; /* System gray label */
    text-transform: uppercase;
    letter-spacing: -0.1px;
}

.ybxs-app-greeting h3 {
    margin: 4px 0 0 0;
    font-size: 26px;
    font-weight: 700;
    color: #000000;
    letter-spacing: -0.5px;
}

/* iOS Pill Badge Styles */
.ybxs-app-badge {
    background: #FFF2E6; /* Light translucent version of your identity orange */
    color: #FF9500; /* Apple default standard system orange accent tint */
    padding: 6px 14px;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.2px;
}

/* 3. iOS Grouped Menu Container Blocks */
.ybxs-app-menu {
    padding: 20px 16px;
    display: flex;
    flex-direction: column;
    background: transparent;
    flex: 1;
}

/* Transform touch links into unified block lists */
.ybxs-menu-row {
    background: #FFFFFF;
    display: flex;
    align-items: center;
    padding: 16px 20px;
    text-decoration: none !important;
    border-bottom: 1px solid #F2F2F7; /* Apple divider system styling lines */
    transition: background-color 0.15s ease;
}

/* Dynamic iOS Border Radius Rounding Rules for Native List Layouts */
.ybxs-app-menu .ybxs-menu-row:first-child {
    border-top-left-radius: 14px;
    border-top-right-radius: 14px;
}
.ybxs-app-menu .ybxs-menu-row:nth-last-child(2) {
    border-bottom-left-radius: 14px;
    border-bottom-right-radius: 14px;
    border-bottom: none; /* Strip internal divider from the last structural menu choice */
}

/* 4. Active Tap/Press Interaction Micro Feedbacks */
.ybxs-menu-row:active {
    background-color: #E5E5EA !important; /* iOS Native tap cell gray background state overlay */
}

.ybxs-icon {
    font-size: 20px;
    margin-right: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    background: #FAFAFC;
    border-radius: 10px;
}

.ybxs-label {
    font-size: 16px;
    font-weight: 500;
    color: #000000;
    flex: 1;
    letter-spacing: -0.3px;
}

.ybxs-arrow {
    color: #C4C4C6; /* Standard light gray chevron indicator arrow coloring template */
    font-size: 17px;
    font-weight: 300;
}

/* 5. Isolated Bottom Floating Logout Button (Distinct Custom Item) */
.ybxs-logout-row {
    margin-top: auto; /* Uses standard layout push to isolate exit options on footer spaces */
    background: #FFFFFF;
    border-radius: 14px !important; /* Standalone pill card frame roundness */
    border-bottom: none !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);
}

/* --- YUMMY BOX BRAND INFO ALERTS MATRIX --- */
.woocommerce-info {
    background-color: #ffffff !important; /* Soft premium orange background accent */
    border: 1px solid #CBD5E0 !important;  /* Your exact brand orange signature border track */
    color: #333333 !important;             /* Crisp, readable dark gray text */
    border-radius: 6px !important;         /* Smooth rounded matching corners */
    padding: 15px 20px !important;
}

/* Ensure any internal links or button triggers match beautifully */
.woocommerce-info a {
    color: #ffffff !important;
    font-weight: 700 !important;
    text-decoration: underline !important;
}

.woocommerce-info a:hover {
    color: #333333 !important;
}

/* Style the native info icon if your layout theme maps it via pseudo-elements */
.woocommerce-info::before {
    color: #CCCCCC !important;
}



.ybxs-logout-row .ybxs-label {
    color: #FF3B30; /* Native system destructive alert red */
    font-weight: 600;
}

.ybxs-logout-row .ybxs-icon {
    background: #FFEBEA;
}

.ybxs-logout-row .ybxs-arrow {
    color: #FF3B30;
    opacity: 0.5;
}

.ybxs-logout-row:active {
    background-color: #FEECEB !important;
}

 
/* ==========================================================================
   🐼 FOODPANDA-STYLE LOST PASSWORD FORM OVERHAUL (#BD2424 & BLACK ACCENTS)
   ========================================================================== */

.woocommerce-ResetPassword {
    max-width: 410px !important; /* snap-aligned to exact application profile fluid width */
    margin: 40px auto !important;
    padding: 36px 24px !important;
    background: #ffffff !important;
    border-radius: 24px !important; /* Signature Foodpanda soft fluid corner radius */
    border: none !important; /* Ditch the harsh black borders completely */
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.05), 0 2px 8px rgba(0, 0, 0, 0.02) !important; /* Muted mobile app shadow depth */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    box-sizing: border-box !important;
}

/* Master Descriptive Context Paragraph Element */
.woocommerce-ResetPassword p:first-of-type {
    text-align: left !important; /* Foodpanda headers/descriptions are cleanly left-aligned */
    color: #707070 !important; /* Muted modern application grey text */
    font-size: 14px !important;
    line-height: 1.5 !important;
    margin-bottom: 32px !important;
    font-weight: 400 !important;
    text-transform: none !important;
}

/* --- THE SUBTITLE ELEMENT SCALED LABELS --- */
.woocommerce-ResetPassword .woocommerce-form-row label {
    display: block !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #222222 !important;
    margin-bottom: 8px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    text-align: left !important;
}

/* --- FOODPANDA CLEAN INPUT TRACES --- */
.woocommerce-ResetPassword input.input-text {
    width: 100% !important;
    padding: 16px 16px !important;
    background-color: #f7f7f7 !important; /* Pristine foodpanda cool-gray workspace containers */
    border: 1px solid #e2e2e2 !important; /* Soft, delicate framing line asset */
    border-radius: 12px !important; /* Uniform component rounded corner tracking */
    box-sizing: border-box !important;
    font-size: 15px !important;
    color: #111111 !important;
    font-weight: 500 !important;
    transition: all 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

/* Interactive Focus Selection Highlighting Track */
.woocommerce-ResetPassword input.input-text:focus {
    background-color: #ffffff !important; /* Inverts cleanly to pure white on click selection focus */
    border-color: #BD2424 !important; /* Rich signature deep red bounding ring wrapper */
    outline: none !important;
    box-shadow: 0 0 0 4px rgba(189, 36, 36, 0.1) !important; /* Soft descriptive glowing ring accent */
}

/* --- SATURATED PRIMARY ACTION CAPSULE BUTTON --- */
.woocommerce-ResetPassword button.button {
    display: block !important;
    width: 100% !important;
    padding: 15px 24px !important;
    background: #BD2424 !important; /* Saturated brand deep red core color fill */
    color: #ffffff !important; /* High contrast pure white text */
    border: none !important; /* Edge to edge crisp solid flat element faces */
    border-radius: 16px !important; /* Foodpanda pill-shaped squat action button profile */
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: none !important; /* Matches modern clean app labels navigation guidelines */
    letter-spacing: 0px !important;
    cursor: pointer !important;
    margin-top: 12px !important;
    box-shadow: 0 4px 12px rgba(189, 36, 36, 0.2) !important; /* Radiant primary button hover shadow track */
    transition: all 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

/* Hover Action Surface Interaction Layer */
.woocommerce-ResetPassword button.button:hover {
    background-color: #a31e1e !important; /* Smooth color darkening transition sweep */
    box-shadow: 0 6px 16px rgba(189, 36, 36, 0.3) !important;
    color: #ffffff !important;
}

/* Tactile Active Click Press State Response (The Black Flash Animation Inversion) */
.woocommerce-ResetPassword button.button:active {
    background-color: #111111 !important; /* Inverts instantly to high-contrast pitch black on click down action execution */
    box-shadow: none !important;
    transform: scale(0.97) !important; /* Real-time tactile responsive scaling compression shrink */
}

/* Clean up structural form wrapper row grids layout gaps */
.woocommerce-ResetPassword .woocommerce-form-row {
    padding: 0 !important;
    margin-bottom: 24px !important;
}

/* --- FOODPANDA CLEAN CHECKOUT INPUT WELLS VARIATION --- */
.woocommerce-checkout .form-row {
    padding: 0 !important;
    margin-bottom: 20px !important;
}

.woocommerce-checkout .form-row label {
    display: block !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #222222 !important;
    margin-bottom: 6px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.woocommerce-checkout input.input-text,
.woocommerce-checkout select,
.woocommerce-checkout textarea {
    width: 100% !important;
    padding: 16px 16px !important;
    background-color: #f7f7f7 !important; /* Premium app cool gray fluid backing container */
    border: 1px solid #e2e2e2 !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    font-size: 15px !important;
    color: #111111 !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    transition: all 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

/* Focused active border track animation states */
.woocommerce-checkout input.input-text:focus {
    background-color: #ffffff !important;
    border-color: #BD2424 !important; /* Your crisp signature brand deep red bounding indicator */
    outline: none !important;
    box-shadow: 0 0 0 4px rgba(189, 36, 36, 0.1) !important;
}

.woocommerce-additional-fields {
	display: none;
}