#fw-section-rich-text-926b61f3-a3a0-42a4-bbaa-a9bc9e79c1ad {
--color-primary: #f49f46;
--color-primary-rgb: 244, 159, 70;
--color-background: #fefaf0;
--color-background-rgb: 254, 250, 240;
--color-on-primary: #000000;
--color-on-primary-rgb: 0, 0, 0;
--color-on-background: #4a3b28;
--color-on-background-rgb: 74, 59, 40;
--color-product-image-background: #fbea7f;
--color-background-brightness: 250;
background-color: var(--color-background);
color: var(--color-on-background);

}

#fw-section-footer {
--color-primary: #f49f46;
--color-primary-rgb: 244, 159, 70;
--color-background: #b08b83;
--color-background-rgb: 176, 139, 131;
--color-on-primary: #000000;
--color-on-primary-rgb: 0, 0, 0;
--color-on-background: #000000;
--color-on-background-rgb: 0, 0, 0;
--color-product-image-background: #fbea7f;
--color-background-brightness: 149;
background-color: var(--color-background);
color: var(--color-on-background);
/* 1. Main Footer Container */
footer, .footer, .footer-section, .section-footer {
    /* Updated Gradient: 
       Starts with your original Yellow (#f9ed88) to match the waves.
       Ends in a "Warm Caramel" (#c67c3e) instead of the harsh dark brown.
    */
    background: linear-gradient(to bottom, #f9ed88 0%, #c67c3e 100%) !important;
    
    /* Essential positioning settings */
    position: relative !important;
    overflow: visible !important;
    margin-top: 60px !important;
    border: none !important;
}

/* 2. The "Paw" Edge (Remains exactly the same to keep the shape) */
footer::before, .footer::before, .footer-section::before, .section-footer::before {
    content: "";
    position: absolute;
    left: 0;
    top: -50px; 
    width: 100%;
    height: 50px; 
    
    /* MUST match the top gradient color (#f9ed88) */
    background-image: radial-gradient(circle at 50% 100%, #f9ed88 65%, transparent 66%);
    background-size: 60px 50px; 
    background-repeat: repeat-x;
    z-index: 10;
}

/* 3. Playful Text Styling */
footer h1, footer h2, footer h3, footer p, footer a, footer li, footer span,
.footer-section h1, .footer-section p, .footer-section a, 
.section-footer h3, .section-footer a {
    color: #ffffff !important;
    /* Updated Shadow: Changed to a softer caramel-brown to match the new background */
    text-shadow: 2px 2px 0px #8f5321 !important; 
    font-weight: bold !important;
    text-decoration: none !important;
}

/* 4. Fix Background Overlap */
footer > div, .footer-section > div, .section-footer > div {
    background-color: transparent !important;
}
}
#fw-section-announcement-bar-f5ce57a5-5806-488f-a804-bd581259834a {
--font-heading-scale: 1.0;
--font-body-scale: 0.85;
}
#fw-section-announcement-bar-f5ce57a5-5806-488f-a804-bd581259834a {

/* 1. The Container: Compact & Textured */
div[class*="announcement"], .announcement-bar {
    /* Main Yellow Background */
    background-color: #f9ed88 !important;
    
    /* HANDMADE TEXTURE: Faint diagonal stripes */
    background-image: repeating-linear-gradient(
        45deg,
        rgba(124, 57, 19, 0.05),
        rgba(124, 57, 19, 0.05) 5px,
        transparent 5px,
        transparent 10px
    ) !important;
    
    color: #7c3913 !important;
    position: relative !important;
    border-bottom: none !important;
    overflow: visible !important;
    z-index: 2000 !important;
    
    /* COMPACT SIZING: Reduced padding to make it slim */
    padding-top:2px !important;
    padding-bottom: 2px !important;
    min-height: auto !important;
}

/* 2. The "Fine Tear" Edge (Smaller Zig-Zags) */
div[class*="announcement"]::after, .announcement-bar::after {
    content: "";
    position: absolute;
    left: 0;
    
    /* Hangs just slightly below */
    bottom: -6px; 
    width: 100%;
    height: 6px; /* Reduced from 10px to 6px */
    
    /* THE TEAR: Smaller, sharper triangles */
    background: linear-gradient(45deg, transparent 33.333%, #f9ed88 33.333%, #f9ed88 66.667%, transparent 66.667%), 
                linear-gradient(-45deg, transparent 33.333%, #f9ed88 33.333%, #f9ed88 66.667%, transparent 66.667%);
    background-size: 12px 12px; /* Smaller pattern for a finer edge */
    background-position: 0 -6px; 
    background-repeat: repeat-x;
}

/* 3. Compact Text Style */
div[class*="announcement"] p, 
div[class*="announcement"] a,
.announcement-bar p {
    color: #7c3913 !important;
    font-weight: 800 !important;
    font-style: italic !important;
    letter-spacing: 0.5px; /* Slightly tighter text */
    text-transform: uppercase;
    font-size: 13px !important; /* Smaller font to fit the compact bar */
    margin: 0 !important; /* Removes extra default spacing */
    
    text-shadow: 
        1px 1px 0px rgba(255, 255, 255, 0.4);
}

/* 4. Compact Close Button */
div[class*="announcement"] button svg {
    fill: #7c3913 !important;
    height: 14px !important; /* Smaller icon */
    width: 14px !important;
}
}
#fw-section-header {
--font-heading-scale: 1.07;
--font-body-scale: 1.16;
}
#fw-section-header {
--color-primary: #fefaf0;
--color-primary-rgb: 254, 250, 240;
--color-background: #fff4e6;
--color-background-rgb: 255, 244, 230;
--color-on-primary: #000000;
--color-on-primary-rgb: 0, 0, 0;
--color-on-background: #000000;
--color-on-background-rgb: 0, 0, 0;
--color-product-image-background: #fbea7f;
--color-background-brightness: 246;
background-color: var(--color-background);
color: var(--color-on-background);

}
#fw-section-product-product-default {
--color-primary: #f49f46;
--color-primary-rgb: 244, 159, 70;
--color-background: #fffdf5;
--color-background-rgb: 255, 253, 245;
--color-on-primary: #000000;
--color-on-primary-rgb: 0, 0, 0;
--color-on-background: #4a3b28;
--color-on-background-rgb: 74, 59, 40;
--color-product-image-background: #fbea7f;
--color-background-brightness: 253;
background-color: var(--color-background);
color: var(--color-on-background);

}