/* ===========================================
   PLACE ORDER BUTTON
   Primary CTA styling
   =========================================== */

/* Place order container */
#payment .form-row.place-order {
    padding: 0 !important;
    margin-top: 14px !important;
}

/* Primary CTA – Place Order */
#payment #place_order {
    width: 100% !important;
    background-color: #21b601;
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    padding: 20px 15px;
    border: none;
    border-bottom: 4px solid #009900;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.1s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

/* Lock icon before button text */
#payment #place_order::before {
    content: '';
    display: inline-block;
    width: 13px;
    height: 20px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 28" fill="white"><path d="M5 12h8v-3c0-2.203-1.797-4-4-4s-4 1.797-4 4v3zM18 13.5v9c0 0.828-0.672 1.5-1.5 1.5h-15c-0.828 0-1.5-0.672-1.5-1.5v-9c0-0.828 0.672-1.5 1.5-1.5h0.5v-3c0-3.844 3.156-7 7-7s7 3.156 7 7v3h0.5c0.828 0 1.5 0.672 1.5 1.5z"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
}

/* Hover (desktop traffic still matters) */
#payment #place_order:hover {
    background-color: #01ad00;
}

/* Disabled / loading state */
#payment #place_order:disabled {
    background-color: #9bdc8a;
    border-bottom-color: #7cbf6d;
    cursor: not-allowed;
    opacity: 0.9;
}

/* Keyboard / accessibility focus */
#payment #place_order:focus-visible {
    outline: 3px solid rgba(0,0,0,0.25);
    outline-offset: 2px;
}