.elementor-5486 .elementor-element.elementor-element-7232b512{--display:flex;--background-transition:0.3s;}.elementor-5486 .elementor-element.elementor-element-01b0181{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;}/* Start custom CSS for elementskit-accordion, class: .elementor-element-9f51b11 *//* Custom CSS for Accordion Widget */

/* 1. Style the main accordion container */
.elementor-5486 .elementor-element.elementor-element-9f51b11 .elementor-accordion {
    border: none; /* Remove default borders */
    background: transparent;
}

/* 2. Style each accordion item (the wrapper for the title and content) */
.elementor-5486 .elementor-element.elementor-element-9f51b11 .elementor-accordion-item {
    margin-bottom: 15px; /* Spacing between the accordions */
    border-radius: 12px; /* Rounded corners for the entire item */
    overflow: hidden; /* Ensures the background color fits the rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05); /* Subtle shadow for depth (optional) */
}

/* 3. Style the accordion title/header */
.elementor-5486 .elementor-element.elementor-element-9f51b11 .elementor-tab-title {
    background-color: #fce4ec; /* Light pink background color */
    padding: 20px 25px; /* Increase padding for a larger touch area */
    border-bottom: none; /* Remove any border that might appear at the bottom of the title */
    border-radius: 12px; /* Ensure title also has rounded corners */
    cursor: pointer;
    display: flex; /* Enable flexbox for icon and text alignment */
    align-items: center;
}

/* 4. Style the text within the title */
.elementor-5486 .elementor-element.elementor-element-9f51b11 .elementor-tab-title a {
    color: #333; /* Dark text color */
    font-size: 18px;
    font-weight: 600; /* Bolder text for visibility */
    display: flex;
    align-items: center;
    width: 100%; /* Make the link fill the title area */
    text-decoration: none; /* Remove underline */
}

/* 5. Style the icons (if using icon fonts or SVG) */
/* The elementor-tab-title a:before targets the default icon space, 
   but you may need to adjust if you're using the built-in Elementor icon feature. */

/* For "Description" icon (Paper/Document icon) - assuming you insert this via the widget settings */
.elementor-5486 .elementor-element.elementor-element-9f51b11 .elementor-tab-title:first-of-type a:before {
    content: "\e62e"; /* Example Unicode for a document/paper icon (often needs specific font-family) */
    font-family: 'eicon'; /* Elementor's default icon font */
    color: #cc3366; /* Pink icon color */
    margin-right: 15px;
    font-size: 20px;
}

/* For "Product info" icon (Box/Cube icon) - assuming you insert this via the widget settings */
.elementor-5486 .elementor-element.elementor-element-9f51b11 .elementor-tab-title:nth-of-type(2) a:before {
    content: "\e60b"; /* Example Unicode for a cube/box icon */
    font-family: 'eicon';
    color: #cc3366; 
    margin-right: 15px;
    font-size: 20px;
}

/* 6. Style the arrow/toggle indicator */
.elementor-5486 .elementor-element.elementor-element-9f51b11 .elementor-tab-title .elementor-accordion-icon {
    /* Position the arrow on the far right */
    margin-left: auto; 
    /* Style the arrow icon itself */
    font-size: 20px;
    color: #cc3366; /* Pink color for the arrow */
}

/* Change the arrow icon from right (default) to down-arrow when closed */
.elementor-5486 .elementor-element.elementor-element-9f51b11 .elementor-accordion-icon i:before {
    content: "\e948"; /* Elementor's eicon for a down arrow/chevron */
    transform: rotate(0deg);
}

/* Style the content area (when open) */
.elementor-5486 .elementor-element.elementor-element-9f51b11 .elementor-tab-content {
    background-color: #fff0f5; /* Lighter background for the open content (optional) */
    padding: 20px 25px;
    border-radius: 0 0 12px 12px; /* Round only bottom corners */
}/* End custom CSS */