/* Form Editor Styles */
.wpayme-field-row {
    margin-bottom: 15px;
    padding: 20px;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
}

.wpayme-field-row label {
    display: block;
    margin-bottom: 10px;
    font-weight: 600;
    color: #333;
}

.wpayme-variants-container .variant-row {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
    align-items: center;
}

.wpayme-thumbnail-upload .thumbnail-preview img {
    max-width: 150px;
    height: auto;
    margin: 10px 0;
    border-radius: 4px;
    border: 1px solid #e5e5e5;
}

.quantity-limits {
    display: flex;
    gap: 10px;
    margin-top: 5px;
}

.shipping-tax-settings {
    display: flex;
    gap: 10px;
}

/* Input Styling */
.wpayme-field-row input[type="text"],
.wpayme-field-row input[type="number"],
.wpayme-field-row select {
    width: 100%;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

/* Button Styling */
.wpayme-field-row .button {
    min-height: 32px;
    line-height: 30px;
}

/* Section Spacing */
.wpayme-pay-form-section {
    margin-bottom: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid #eee;
}

.wpayme-pay-form-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

/* Surcharge Group Styling */
.wpayme-surcharge-group {
    padding: 20px;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    margin-bottom: 15px;
}

.wpayme-surcharge-group h3 {
    margin-top: 0;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}

.wpayme-surcharge-type {
    margin-bottom: 15px;
}

.wpayme-surcharge-amount,
.wpayme-surcharge-label {
    margin-bottom: 15px;
}

.wpayme-surcharge-description {
    font-style: italic;
    color: #666;
    margin: 5px 0;
    font-size: 13px;
}

/* Button Settings Styling */
.wpayme-button-settings {
    display: grid;
    gap: 15px;
}

.wpayme-button-text,
.wpayme-button-class,
.wpayme-button-color,
.wpayme-button-text-color {
    margin-bottom: 15px;
}

.wpayme-button-settings label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
}

.wpayme-button-text-color label,
.wpayme-button-color label {
    display: block;
    margin-bottom: 5px;
}

/* Update field description positioning */
.wpayme-field-description {
    margin-top: 5px;
    margin-bottom: 10px;
    margin-left: 0;
    color: #666;
    font-style: italic;
    display: block;
    clear: both;
}

/* Payment Options Styling */
.wpayme-payment-type,
.wpayme-amount-method,
.wpayme-currency-options {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
}

.wpayme-radio-group {
    display: flex;
    gap: 20px;
    margin-top: 10px;
}

.wpayme-radio-group label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-weight: normal;
    margin-bottom: 0;
}

.wpayme-amount-choices {
    margin-top: 15px;
}

.amount-choice-row {
    margin-bottom: 10px !important;
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    gap: 10px !important;
}

.amount-choice-row label {
    display: flex;
    align-items: center;
    gap: 5px;
}

.amount-choice-row input {
    width: 150px !important;
}

.amount-choice-row .remove-amount-choice {
    margin-left: 8px !important;
}

.wpayme-currency-select {
    margin-bottom: 15px;
}

.wpayme-currency-customer-choice {
    margin-top: 15px;
}

.wpayme-currency-customer-choice label {
    font-weight: normal;
    margin-bottom: 5px;
}

/* Fixed Price Input Styling */
.wpayme-fixed-price-input {
    margin-top: 15px;
    padding: 15px;
    background: #f8f8f8;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
}

.fixed-price-field {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 8px;
}

.currency-symbol {
    font-weight: 500;
    color: #666;
}

.wpayme-fixed-price-input input[type="number"] {
    width: 150px;
}

/* Amount Choices Styling */
.amount-choice-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.amount-choice-row label {
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 0;
}

.amount-choice-row input[type="number"] {
    width: 150px;
}

.remove-amount-choice {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 6px !important;
    height: 30px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
}

.remove-amount-choice .dashicons {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 18px !important;
    height: 18px !important;
    font-size: 18px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
}

.add-amount-choice {
    margin-top: 10px;
}

/* Amount Options Styling */
.wpayme-amount-options {
    margin-top: 15px;
    padding: 20px;
    background: #f8f8f8;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
}

.input-limits {
    display: flex;
    gap: 20px;
    margin-top: 10px;
}

.amount-input-field {
    flex: 1;
}

.amount-input-field label {
    display: block;
    margin-bottom: 5px;
}

.amount-choices-container {
    margin-bottom: 10px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

.amount-choice-row {
    margin-bottom: 10px !important;
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
}

.amount-choice-row input {
    width: 150px;
}

.input-limits-section {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #e5e5e5;
}

.currency-symbol {
    margin-right: 5px;
    font-weight: 500;
}

/* Quantity Settings Styling */
.wpayme-quantity-option {
    display: block;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #eee;
}

.wpayme-quantity-option:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.wpayme-quantity-option label {
    display: block;
    margin-bottom: 5px;
    font-weight: 500;
}

.wpayme-quantity-option input[type="number"] {
    width: 100px;
}

.wpayme-quantity-option input[type="checkbox"] {
    margin-right: 5px;
}

.wpayme-stock-quantity-option {
    margin-left: 20px;
    padding-left: 10px;
    border-left: 3px solid #f0f0f0;
}

/* Toggle Switch Styles - With !important to ensure consistency */
.wpayme-toggle-switch {
    position: relative !important;
    display: inline-block !important;
    width: 50px !important;
    height: 24px !important;
    margin-right: 10px !important;
    vertical-align: middle !important;
    overflow: visible !important;
}

.wpayme-toggle-switch input {
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute !important;
}

.wpayme-toggle-slider {
    position: absolute !important;
    cursor: pointer !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background-color: #ccc !important;
    transition: background-color 0.4s !important;
    border-radius: 24px !important;
}

.wpayme-toggle-slider:before {
    position: absolute !important;
    content: "" !important;
    height: 18px !important;
    width: 18px !important;
    left: 3px !important;
    bottom: 3px !important;
    background-color: white !important;
    transition: transform 0.4s !important;
    border-radius: 50% !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.wpayme-toggle-switch input:checked + .wpayme-toggle-slider {
    background-color: #0073aa !important;
}

.wpayme-toggle-switch input:focus + .wpayme-toggle-slider {
    box-shadow: 0 0 1px #0073aa !important;
}

.wpayme-toggle-switch input:checked + .wpayme-toggle-slider:before {
    transform: translateX(26px) !important;
}

/* Remove any conflicting styles */
input:checked + .wpayme-toggle-slider,
.wpayme-toggle-slider.checked {
    background-color: #0073aa !important;
}

input:checked + .wpayme-toggle-slider:before,
.wpayme-toggle-slider.checked:before {
    transform: translateX(26px) !important;
}

.wpayme-toggle-label {
    font-weight: 500;
    vertical-align: middle;
    margin-left: 10px;
    display: inline-block;
}

/* Adjust spacing for toggle switches in options */
.wpayme-quantity-option:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.wpayme-quantity-option label {
    display: flex;
    align-items: center;
}

/* Adjust stock quantity options */
.wpayme-stock-quantity-option {
    margin-left: 20px;
    padding-left: 20px;
    border-left: 3px solid #eee;
}

/* Modern Radio Button Styles */
.wpayme-radio-group {
    display: flex;
    gap: 20px;
    margin-top: 10px;
}

.wpayme-radio-label {
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    display: inline-block;
    font-weight: 500;
}

.wpayme-radio-label input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.wpayme-radio-checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #eee;
    border-radius: 50%;
    transition: all 0.3s ease;
}

.wpayme-radio-label:hover input ~ .wpayme-radio-checkmark {
    background-color: #ccc;
}

.wpayme-radio-label input:checked ~ .wpayme-radio-checkmark {
    background-color: #0073aa;
}

.wpayme-radio-checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.wpayme-radio-label input:checked ~ .wpayme-radio-checkmark:after {
    display: block;
}

.wpayme-radio-label .wpayme-radio-checkmark:after {
    top: 6px;
    left: 6px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}

/* Modern Form Field Styles */
.wpayme-pay-form-section {
    background: #fff;
    border: 1px solid #e2e4e7;
    border-radius: 4px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.wpayme-pay-form-section h3 {
    margin-top: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
    font-size: 16px;
    color: #23282d;
}

.wpayme-field-row {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f0f0f0;
}

.wpayme-field-row:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.wpayme-field-row > label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #23282d;
}

/* Input field styling */
.wpayme-pay-form-section input[type="text"],
.wpayme-pay-form-section input[type="number"],
.wpayme-pay-form-section select {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 8px 12px;
    height: 36px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);
    transition: border-color 0.3s ease;
}

.wpayme-pay-form-section input[type="text"]:focus,
.wpayme-pay-form-section input[type="number"]:focus,
.wpayme-pay-form-section select:focus {
    border-color: #0073aa;
    box-shadow: 0 0 0 1px #0073aa;
    outline: none;
}

/* Button styling */
.wpayme-pay-form-section .button {
    height: 36px;
    line-height: 34px;
    padding: 0 15px;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.wpayme-pay-form-section .button-primary {
    background: #0073aa;
    border-color: #0073aa;
}

.wpayme-pay-form-section .button-primary:hover {
    background: #006291;
    border-color: #006291;
}

/* Variant rows styling */
.variant-row {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
    align-items: center;
}

.variant-row input {
    flex: 1;
}

.variant-row .button {
    flex-shrink: 0;
}

/* Thumbnail preview styling */
.thumbnail-preview {
    margin-bottom: 10px;
    max-width: 150px;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid #ddd;
}

.thumbnail-preview img {
    display: block;
    max-width: 100%;
    height: auto;
}

/* Additional toggle switch styling for consistency */
.wpayme-toggle-slider.checked {
    background-color: #0073aa;
}

.wpayme-toggle-slider.checked:before {
    transform: translateX(26px);
}

/* Toggle container styling */
.wpayme-toggle-container {
    display: flex;
    align-items: center;
    margin-bottom: 5px;
}

/* Input field styling for quantity options */
.wpayme-quantity-option input[type="number"] {
    width: 100px;
    margin-top: 5px;
}

/* Thank you page dropdown styling */
select[name="wpayme_thank_you_page"]  {
    line-height: 1;
}

/* Ensure consistent select styling */
.wpayme-field-row select {
    min-height: 36px;
}

/* Coupon Admin Styles */
.wpayme-coupon-options-container {
    margin-top: 15px;
    padding: 0;
}

.wpayme-discount-container {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 10px;
}

.wpayme-discount-type {
    flex: 2;
}

.wpayme-discount-amount {
    flex: 1;
    position: relative;
}

.wpayme-discount-symbol {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #666;
}

.wpayme-redemption-count {
    padding: 8px 12px;
    background: #f0f0f0;
    border-radius: 4px;
    border: 1px solid #ddd;
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
}

#wpayme-specific-products {
    margin-top: 15px;
    padding: 15px;
    background: #f9f9f9;
    border: 1px solid #eee;
    border-radius: 4px;
}

/* Status styling for list view */
.coupon-status {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
}

.coupon-status.active {
    background: #dff0d8;
    color: #3c763d;
}

.coupon-status.inactive {
    background: #f2dede;
    color: #a94442;
}

/* Select2 styling */
.select2-container--default .select2-selection--multiple {
    border: 1px solid #ddd;
    border-radius: 4px;
    min-height: 36px;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #f0f0f0;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 4px 8px;
    margin-top: 4px;
}

/* Enhanced Select2 Styling for Coupon Admin */
.wpayme-specific-products-container {
    margin-top: 15px;
}

.select2-container--default .select2-selection--multiple {
    min-height: 38px;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 4px;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #f0f7fb;
    border: 1px solid #cce5ff;
    border-radius: 3px;
    padding: 4px 8px;
    margin: 4px 5px 0 0;
    color: #0073aa;
    font-weight: 500;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    margin-right: 6px;
    color: #0073aa;
    font-weight: bold;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #00a0d2;
}

.select2-container--default .select2-search--inline .select2-search__field {
    min-width: 150px;
    margin-top: 5px;
    height: 28px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #0073aa;
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #f0f7fb;
    color: #0073aa;
}

/* Dropdown styling */
.wpayme-select2-dropdown {
    border-color: #ddd;
    box-shadow: 0 3px 5px rgba(0,0,0,0.1);
}

.select2-container--open .select2-dropdown--below {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

/* Container styling */
.wpayme-select2-container .select2-selection {
    border: 1px solid #8c8f94;
    box-shadow: 0 0 0 transparent;
}

.wpayme-select2-container.select2-container--focus .select2-selection {
    border-color: #2271b1;
    box-shadow: 0 0 0 1px #2271b1;
}

/* Custom styles for the multiple select dropdown */
.wpayme-specific-products-container select[multiple] {
    min-height: 150px;
    padding: 8px;
    border: 1px solid #8c8f94;
    border-radius: 4px;
    box-shadow: 0 0 0 transparent;
    background-color: #fff;
}

.wpayme-specific-products-container select[multiple]:focus {
    border-color: #2271b1;
    box-shadow: 0 0 0 1px #2271b1;
    outline: 2px solid transparent;
}

.wpayme-specific-products-container select[multiple] option {
    padding: 6px;
    margin-bottom: 2px;
    border-radius: 2px;
}

.wpayme-specific-products-container select[multiple] option:checked {
    background-color: #f0f7fb;
    color: #0073aa;
    background: linear-gradient(0deg, #f0f7fb 0%, #f0f7fb 100%);
}

.wpayme-specific-products-container select[multiple] option:hover {
    background-color: #f8f9fa;
}

/* Make the description below the multiple select more prominent */
.wpayme-specific-products-container .description {
    margin-top: 8px;
    font-style: italic;
    color: #666;
}

/* Select2 Tag-like Styling for tags-like UI */
.select2-container--classic .select2-selection--multiple {
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    padding: 2px 6px !important;
    min-height: 38px !important;
    background-color: #fff !important;
}

.select2-container--classic .select2-selection--multiple .select2-selection__choice {
    background-color: #e9f0f5 !important;
    border: 1px solid #c5d6e6 !important;
    border-radius: 3px !important;
    padding: 4px 8px !important;
    margin: 4px 5px 0 0 !important;
    color: #0073aa !important;
    font-weight: normal !important;
    display: inline-flex !important;
    align-items: center !important;
}

.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
    margin-right: 6px !important;
    color: #0073aa !important;
    font-weight: bold !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    font-size: 14px !important;
}

.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #00a0d2 !important;
    background: transparent !important;
}

.select2-container--classic .select2-search--inline .select2-search__field {
    min-width: 150px !important;
    margin-top: 7px !important;
    font-size: 14px !important;
}

.select2-container--classic .select2-selection--multiple .select2-selection__rendered {
    padding: 0 !important;
}

.select2-container--classic.select2-container--focus .select2-selection--multiple {
    border-color: #0073aa !important;
    box-shadow: 0 0 0 1px #0073aa !important;
    outline: none !important;
}

.select2-container--classic .select2-results__option--highlighted[aria-selected] {
    background-color: #0073aa !important;
    color: #fff !important;
}

.select2-container--classic .select2-dropdown {
    border-color: #0073aa !important;
    border-radius: 4px !important;
    box-shadow: 0 3px 5px rgba(0,0,0,0.1) !important;
}

.select2-container--classic .select2-results__option[aria-selected=true] {
    background-color: #f0f7fb !important;
    color: #0073aa !important;
}

.select2-container--classic .select2-selection--multiple .select2-selection__clear {
    margin-top: 2px !important;
    margin-right: 8px !important;
    font-size: 16px !important;
    color: #72777c !important;
}

/* Admin thumbnail in list table */
.wpayme-admin-thumbnail {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #ddd;
    background-color: #f9f9f9;
    display: block;
}

/* Adjust column width for thumbnail column */
.fixed .column-wpayme_form_thumbnail {
    width: 60px;
}

/* Style for the ID column */
.fixed .column-wpayme_payment_form_id {
    width: 80px;
    text-align: center;
}

.column-wpayme_payment_form_id strong {
    display: inline-block;
    padding: 4px 8px;
    background-color: #f0f0f1;
    border-radius: 4px;
    font-family: Consolas, Monaco, monospace;
    font-size: 12px;
    color: #23282d;
}

/* Amount Choice Row Styles */
.amount-choice-row {
    display: flex !important;
    align-items: center !important;
    margin-bottom: 8px !important;
}

.amount-choice-input-container {
    display: flex !important;
    align-items: center !important;
    flex: 1 !important;
    margin-right: 8px !important;
    position: relative !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    background: #fff !important;
    max-width: 300px !important;
}

.amount-choice-input-container .currency-symbol {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 8px !important;
    background: #f9f9f9 !important;
    border-right: 1px solid #ddd !important;
    color: #666 !important;
    font-weight: 500 !important;
    height: 100% !important;
}

.amount-choice-input-container input[type="number"] {
    border: none !important;
    flex: 1 !important;
    box-shadow: none !important;
    padding: 6px 8px !important;
    margin: 0 !important;
}

.amount-choice-input-container input[type="number"]:focus {
    box-shadow: none !important;
    outline: none !important;
}

.amount-choices-container {
    margin-bottom: 10px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

/* Button style fix */
.add-amount-choice {
    margin-top: 5px !important;
} 