:root { --primary-color: #0073aa; --border-color: #ddd; --background-color: #f6f7f7; --text-dark: #2c3e50; --text-light: #555; --success-color: #27ae60; --error-color: #e74c3c; }
body { background-color: var(--background-color); }
.ad-uploader-wrapper, .ad-login-wrapper { max-width: 800px; margin: 40px auto; padding: 30px; background-color: #fff; border: 1px solid var(--border-color); border-radius: 8px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; }
.ad-uploader-wrapper h1, .ad-login-wrapper h1 { font-size: 24px; font-weight: 600; color: var(--text-dark); margin-top: 0; margin-bottom: 25px; border-bottom: 1px solid var(--border-color); padding-bottom: 15px; }
#ad-new-product-form .form-row { margin-bottom: 25px; } #ad-new-product-form label { display: block; font-weight: 600; margin-bottom: 8px; color: var(--text-dark); }
.ad-login-wrapper #loginform p { margin-bottom: 20px; } .ad-login-wrapper #loginform label { font-weight: 600; color: var(--text-dark); display: block; margin-bottom: 8px; } .ad-login-wrapper #loginform input[type="text"], .ad-login-wrapper #loginform input[type="password"] { width: 100%; padding: 12px; font-size: 16px; border: 1px solid var(--border-color); border-radius: 4px; box-sizing: border-box; } .ad-login-wrapper #loginform .forgetmenot { margin-bottom: 20px; } .ad-login-wrapper #loginform #wp-submit { width: 100%; background-color: var(--primary-color); color: #fff; border: none; padding: 12px 25px; font-size: 16px; font-weight: 600; border-radius: 4px; cursor: pointer; transition: background-color 0.2s; } .ad-login-wrapper #loginform #wp-submit:hover { background-color: #005a87; } .ad-login-wrapper #nav, .ad-login-wrapper #backtoblog { display: none; }
.ad-image-uploader { border: 2px dashed var(--border-color); border-radius: 8px; padding: 15px; } .ad-image-preview-wrapper { display: flex; flex-wrap: wrap; gap: 15px; margin-bottom: 15px; min-height: 50px; } .ad-preview-item { position: relative; } .ad-preview-item img { width: 100px; height: 100px; object-fit: cover; border-radius: 4px; border: 1px solid var(--border-color); } .ad-remove-image { position: absolute; top: -8px; right: -8px; background: var(--error-color); color: white !important; border: 2px solid white; border-radius: 50%; width: 24px; height: 24px; cursor: pointer; font-weight: bold; font-size: 14px; box-shadow: 0 2px 5px rgba(0,0,0,0.2); display: flex; align-items: center; justify-content: center; padding: 0; line-height: 1; } .ad-remove-image:hover { background: #c0392b; } .ad-upload-buttons { display: flex; gap: 10px; flex-wrap: wrap; } .ad-upload-buttons .button { background: #f0f0f1; border-color: #dcdcde; color: #50575e; } .ad-upload-buttons .button:hover { background: #e6e6e7; }
#ad-camera-modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 9999; display: flex; align-items: center; justify-content: center; } #ad-camera-modal .modal-content { background: #fff; padding: 20px; border-radius: 8px; text-align: center; } #ad-camera-modal video { max-width: 100%; width: 500px; border-radius: 4px; } #ad-camera-modal .modal-controls { margin-top: 15px; display: flex; gap: 10px; justify-content: center; }
#ad-new-product-form input[type="text"], #ad-new-product-form input[type="number"] { width: 100%; padding: 12px; font-size: 16px; border: 1px solid var(--border-color); border-radius: 4px; box-sizing: border-box; transition: border-color 0.2s, box-shadow 0.2s; } #ad-new-product-form input[type="text"]:focus, #ad-new-product-form input[type="number"]:focus { outline: none; border-color: var(--primary-color); box-shadow: 0 0 0 2px rgba(0, 115, 170, 0.2); } #ad-new-product-form select:not([multiple]) { width: 100%; height: 48px; padding: 0 12px; font-size: 16px; border: 1px solid var(--border-color); border-radius: 4px; box-sizing: border-box; background-color: #fff; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%232c3e50%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'); background-repeat: no-repeat; background-position: right 15px top 50%; background-size: .65em auto; } #ad-new-product-form select:focus { outline: none; border-color: var(--primary-color); box-shadow: 0 0 0 2px rgba(0, 115, 170, 0.2); }
.select2-container--default .select2-selection--single, .select2-container--default .select2-selection--multiple { border: 1px solid var(--border-color) !important; border-radius: 4px !important; height: auto !important; } .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 48px !important; padding-left: 12px !important; font-size: 16px; color: var(--text-dark); } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 46px !important; } .select2-container--default .select2-selection--multiple { padding: 5px !important; min-height: 48px; } .select2-container--default.select2-container--focus .select2-selection--multiple, .select2-container--default.select2-container--focus .select2-selection--single { border-color: var(--primary-color) !important; box-shadow: 0 0 0 2px rgba(0, 115, 170, 0.2); } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: var(--primary-color) !important; border: 1px solid #005a87 !important; color: #fff !important; border-radius: 4px !important; padding: 5px 10px !important; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: rgba(255, 255, 255, 0.8) !important; margin-right: 5px !important; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #fff !important; } .select2-container--default .select2-search--inline .select2-search__field { width: 100% !important; margin-top: 0 !important; padding: 0 12px !important; height: 36px !important; line-height: 36px !important; }
#ad-form-status { padding: 15px; margin-bottom: 20px; border-radius: 4px; font-weight: 500; } #ad-form-status.success { background-color: #eaf7ed; color: #2a6f3d; border: 1px solid #a3d5b0; } #ad-form-status.error { background-color: #fbeae9; color: #b92c2c; border: 1px solid #f1b0b0; }
#ad-submit-product { background-color: var(--success-color); color: #fff; border: none; padding: 12px 25px; font-size: 16px; font-weight: 600; border-radius: 4px; cursor: pointer; transition: background-color 0.2s; min-width: 150px; text-align: center; } #ad-submit-product:hover { background-color: #219d52; } #ad-submit-product:disabled { background-color: #95a6a6; cursor: not-allowed; }
.ad-add-new-container { margin-top: 8px; } .ad-add-new-tax-btn { background: none !important; border: none !important; color: var(--text-light) !important; cursor: pointer; padding: 4px 0 !important; font-size: 13px; font-weight: 500; text-decoration: none !important; transition: color 0.2s; } .ad-add-new-tax-btn:hover { color: var(--primary-color) !important; } .ad-add-new-tax-btn::before { content: '+ '; font-weight: bold; } .ad-new-tax-form { margin-top: 10px; background-color: #fafafa; border: 1px solid var(--border-color); padding: 15px; border-radius: 6px; display: flex; flex-direction: column; gap: 15px; } .ad-new-tax-form .ad-new-tax-name { flex-grow: 1; } .ad-parent-cat-container { width: 100%; } .ad-parent-cat-container label { font-size: 13px; font-weight: normal; color: var(--text-light); } .ad-parent-cat-container select { width: 100%; padding: 8px; font-size: 14px; border-radius: 4px; border-color: var(--border-color); } .ad-new-tax-form-actions { display: flex; justify-content: flex-end; gap: 10px; } .ad-new-tax-form-actions .button { margin: 0; } .ad-new-tax-form-actions .button.ad-cancel-new-tax-btn { background-color: #f0f0f1; border-color: #dcdcde; color: #50575e; }
#ad_variable_product_fields h3, .ad-uploader-wrapper h3 { font-size: 1.2rem; margin: 0 0 10px; border-bottom: 1px solid var(--border-color); padding-bottom: 10px; } #ad_variable_product_fields p { font-size: 13px; color: var(--text-light); margin-top: 0; }
.ad-attributes-section, .ad-variations-section { background-color: #fafafa; padding: 20px; border-radius: 6px; border: 1px solid var(--border-color); }
.ad-attribute-inputs { display: flex; gap: 15px; } .ad-attribute-inputs input { flex: 1; } #ad_generate_variations { margin-bottom: 15px; }

/* YAHAN NAYA CODE ADD KIYA GAYA HAI */
#ad_variations_container { display: flex; flex-direction: column; gap: 10px; }
.ad-variation-row { display: flex; align-items: center; gap: 15px; padding: 15px; background-color: #fff; border: 1px solid var(--border-color); border-radius: 4px; }
.ad-variation-name { font-weight: 600; color: var(--text-dark); flex-basis: 120px; flex-shrink: 0; }
.ad-variation-inputs { flex-grow: 1; }
.ad-variation-inputs input { width: 100%; padding: 8px; font-size: 14px; }