.luovaq-loop-form-wrap {
  flex-direction: column;
  gap: 10px;
  justify-content: flex-start;
  align-items: start;
  width: 100%;
  display: inline-flex;
  min-width: 100%;
}

/* Hintakentän tyylittely. WooCommercen teemat yrittävät monesti yliajata nämä, joten asetetaan !important näihin var()-kutsuihin. */
.luovaq-loop-price,
.luovaq-loop-price .price,
.luovaq-loop-price .amount,
.luovaq-loop-price bdi {
    color: var(--luovaq-price-color, var(--color-accent-2, #2d3748)) !important;
}

.luovaq-loop-price {
    font-size: 1.15em;
    font-weight: 600;
    margin-bottom: var(--luovaq-price-margin-bottom, 12px) !important;
    min-height: 1.5em;
}

.luovaq-loop-price del {
    opacity: 0.6; 
    font-size: 0.85em; 
    font-weight: 400; 
    margin-right: 6px;
}
.luovaq-loop-price ins { text-decoration: none; }

/* Variaationapit */
.luovaq-loop-swatches { 
    display: flex; 
    flex-direction: column; 
    gap: 10px; 
    margin-bottom: 15px; 
}
.luovaq-swatch-row { 
    display: flex; 
    flex-wrap: wrap; 
    align-items: center; 
    gap: 8px; 
}
.luovaq-swatch-label { 
    font-size: 13px; 
    font-weight: 600; 
    color: var(--luovaq-swatch-label-color, var(--color-text-body, #2d3748)) !important; 
}
.luovaq-swatch-group { 
    display: flex; 
    flex-wrap: wrap; 
    gap: 6px; 
}

/* Pakotetaan omat tyylit Elementorin/teeman ohi - CSS-muuttujilla + !important */
.luovaq-loop-swatches button.luovaq-swatch-item {
    display: inline-flex; 
    align-items: center; 
    justify-content: center;
    font-size: 13px; 
    font-weight: 500; 
    padding: 6px 12px;
    background-color: var(--luovaq-swatch-bg, var(--color-white, #ffffff)) !important; 
    border: 1px solid var(--luovaq-swatch-border-color, var(--color-secondary-2, #e2e8f0)) !important; 
    border-radius: var(--luovaq-swatch-border-radius, 4px) !important;
    color: var(--luovaq-swatch-text-color, var(--color-text-body, #b3b3b3)) !important;
    line-height: 1; 
    cursor: pointer; 
    transition: all 0.2s ease;
    outline: none; /* Estää selaimen focus-reunuksen */
    box-shadow: none;
}

.luovaq-loop-swatches button.luovaq-swatch-item:hover { 
    border-color: var(--luovaq-swatch-hover-border-color, var(--color-accent-1, #8d633a)) !important; 
    background-color: var(--luovaq-swatch-hover-bg, var(--color-white, #ffffff)) !important;
    color: var(--luovaq-swatch-hover-text-color, var(--color-text-body, #b3b3b3)) !important;
}

/* Aktiivinen valinta ja oletus */
.luovaq-loop-swatches button.luovaq-swatch-item.luovaq-swatch-item--active {
    background-color: var(--luovaq-swatch-active-bg, var(--color-secondary-2, #e2e8f0)) !important;
    border-color: var(--luovaq-swatch-active-border-color, var(--color-secondary-2, #e2e8f0)) !important;
    color: var(--luovaq-swatch-active-text-color, var(--color-text-body, #7a7a7a)) !important;
}

.luovaq-loop-action {
  width: 100%;
  display: flex;
  justify-content: var(--luovaq-btn-align, flex-start);
}

/* Piilotetaan WooCommercen oletus Näytä ostoskori -linkki */
.luovaq-loop-action .added_to_cart { display: none !important; }

.luovaq-add-to-cart-btn {
    width: var(--luovaq-btn-width, 100%) !important;
    position: relative;
    font-family: var(--button-base-text);
    font-weight: 300;
    font-size: var(--button-base-text-size);
    color: var(--luovaq-btn-text-color, var(--color-button-text-light, #ffffff)) !important;
    padding-block-start: var(--luovaq-btn-padding-y, 10px) !important;
    padding-block-end: var(--luovaq-btn-padding-y, 10px) !important;
    padding-inline-start: var(--luovaq-btn-padding-x, 20px) !important;
    padding-inline-end: var(--luovaq-btn-padding-x, 20px) !important;
    border-radius: var(--luovaq-btn-border-radius, var(--button-base-border-radius, 0px)) !important;
    border-width: 0px;
    border-style: solid;
    border-color: transparent;
    
    /* Default background (will be overridden by Elementor's native Group_Control_Background) */
    background-image: linear-gradient(5deg, #8d633a 0%,#aa8055 100%);
    background-repeat: repeat;
    background-attachment: scroll;
    background-size: auto auto;
    background-position: 0% 0%;
    background-color: #8d633a;
    
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all 0.3s ease;
    outline: none; /* Estää selaimen focus-reunuksen */
    box-shadow: none;
}

.luovaq-add-to-cart-btn:hover {
    background-color: #aa8055;
    background-image: none;
    color: var(--luovaq-btn-hover-text-color, var(--color-button-text-light, #ffffff)) !important;
}

.luovaq-add-to-cart-btn:disabled {
    opacity: 0.6; 
    cursor: not-allowed;
    background-color: #cbd5e0 !important; 
    background-image: none !important;
    color: #4a5568 !important; 
    border-color: #cbd5e0 !important;
}
.luovaq-add-to-cart-btn.loading {
    opacity: 0.8; 
    pointer-events: none;
}