/* Doctor Profile Submission Form - Frontend Styles v2 */

.dpss-form-wrapper { max-width: 960px; margin: 0 auto; font-family: Arial, sans-serif; }

.dpss-form-header { background: linear-gradient(135deg, #781715, #a52422); color: #fff; padding: 30px; border-radius: 8px 8px 0 0; }
.dpss-form-header h2 { margin: 0 0 10px; font-size: 24px; color: #fff; }
.dpss-form-header p { margin: 5px 0; font-size: 14px; opacity: 0.9; }
.dpss-form-header .dpss-note { background: rgba(255,255,255,0.15); padding: 8px 12px; border-radius: 4px; margin-top: 10px; }

.dpss-form { background: #fff; border: 1px solid #ddd; border-top: none; border-radius: 0 0 8px 8px; }
.dpss-section { padding: 25px 30px; border-bottom: 1px solid #eee; }
.dpss-section h3 { color: #781715; font-size: 20px; margin: 0 0 15px; padding-bottom: 8px; border-bottom: 2px solid #781715; }
.dpss-section h3 i { margin-right: 8px; }
.dpss-section h4 { color: #555; font-size: 16px; margin: 0 0 10px; }

.dpss-field { margin-bottom: 15px; }
.dpss-field label { display: block; font-weight: 600; margin-bottom: 5px; color: #333; font-size: 14px; }
.dpss-field input[type="text"], .dpss-field input[type="email"], .dpss-field input[type="url"],
.dpss-field textarea, .dpss-field select {
    width: 100%; padding: 10px 12px; border: 1px solid #ccc; border-radius: 4px; font-size: 14px; box-sizing: border-box; transition: border-color 0.2s;
}
.dpss-field input:focus, .dpss-field textarea:focus, .dpss-field select:focus { border-color: #781715; outline: none; box-shadow: 0 0 0 2px rgba(120,23,21,0.1); }
.dpss-field small { display: block; color: #888; font-size: 12px; margin-top: 4px; }

.dpss-field-row { display: flex; gap: 20px; flex-wrap: wrap; }
.dpss-half { flex: 1; min-width: 250px; }
.dpss-third { flex: 1; min-width: 200px; }
.dpss-required { color: #dc3545; font-weight: bold; }
.dpss-hint { color: #666; font-size: 13px; font-style: italic; margin: 0 0 10px; }

/* Update Section */
.dpss-update-box { background: #f0f7ff; border: 1px solid #b3d4fc; border-radius: 6px; padding: 20px; margin-top: 15px; overflow: hidden; clear: both; }
.dpss-update-box h4 { color: #007bff; margin: 0 0 5px; font-size: 16px; }
.dpss-update-box .dpss-field-row { display: flex; gap: 20px; flex-wrap: wrap; width: 100%; }
.dpss-update-box .dpss-field { margin-bottom: 15px; width: 100%; }
.dpss-update-box .dpss-half { flex: 1 1 45%; min-width: 200px; }
.dpss-update-box select { width: 100% !important; max-width: 100% !important; padding: 10px 12px; border: 1px solid #ccc; border-radius: 4px; font-size: 14px; box-sizing: border-box; }
.dpss-profile-card { background: #fff; border: 1px solid #28a745; border-radius: 5px; padding: 12px 15px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dpss-profile-card strong { font-size: 16px; color: #333; }
.dpss-profile-card span { color: #666; font-size: 14px; }

/* Force form to stay within its container */
.dpss-form-wrapper, .dpss-form, .dpss-section { overflow: hidden; }
.dpss-form * { box-sizing: border-box; }
.dpss-form select, .dpss-form input, .dpss-form textarea { max-width: 100%; }

/* Tables */
.dpss-table { width: 100%; border-collapse: collapse; margin-bottom: 10px; }
.dpss-table th { background: #f5f5f5; padding: 8px 10px; text-align: left; font-size: 13px; font-weight: 600; color: #555; border: 1px solid #ddd; }
.dpss-table td { padding: 6px 8px; border: 1px solid #ddd; vertical-align: top; }
.dpss-table td input, .dpss-table td textarea { width: 100%; padding: 6px 8px; border: 1px solid #ddd; border-radius: 3px; font-size: 13px; box-sizing: border-box; }
.dpss-table td input:focus, .dpss-table td textarea:focus { border-color: #781715; outline: none; }
.dpss-sno { width: 45px; text-align: center; font-weight: 600; color: #666; }

.dpss-remove-row { background: none; border: none; color: #dc3545; cursor: pointer; font-size: 14px; padding: 5px; }
.dpss-remove-row:hover { color: #a71d2a; }
.dpss-add-row { background: #f8f9fa; border: 1px dashed #ccc; color: #666; padding: 8px 16px; cursor: pointer; border-radius: 4px; font-size: 13px; transition: all 0.2s; }
.dpss-add-row:hover { background: #e9ecef; border-color: #781715; color: #781715; }
.dpss-add-row i { margin-right: 5px; }

/* Method Selection Cards */
.dpss-method-options { display: flex; gap: 20px; flex-wrap: wrap; }
.dpss-method-card { flex: 1; min-width: 250px; cursor: pointer; }
.dpss-method-card input[type="radio"] { display: none; }
.dpss-method-content { background: #f8f9fa; border: 2px solid #ddd; border-radius: 8px; padding: 25px; text-align: center; transition: all 0.3s; }
.dpss-method-content i { font-size: 36px; color: #781715; display: block; margin-bottom: 12px; }
.dpss-method-content strong { display: block; font-size: 16px; color: #333; margin-bottom: 6px; }
.dpss-method-content p { font-size: 13px; color: #666; margin: 0; }
.dpss-method-card input[type="radio"]:checked + .dpss-method-content { border-color: #781715; background: #fdf2f2; box-shadow: 0 2px 8px rgba(120,23,21,0.15); }
.dpss-method-card:hover .dpss-method-content { border-color: #999; }

/* Upload Section */
.dpss-upload-section { background: #f8f9fa; }

.dpss-submit-section { padding: 30px; text-align: center; background: #f8f9fa; border-radius: 0 0 8px 8px; }
.dpss-submit-btn { background: linear-gradient(135deg, #781715, #a52422); color: #fff; border: none; padding: 14px 40px; font-size: 18px; font-weight: 600; border-radius: 6px; cursor: pointer; transition: all 0.3s; }
.dpss-submit-btn:hover { background: linear-gradient(135deg, #5c110f, #781715); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(120,23,21,0.3); }
.dpss-submit-btn i { margin-right: 8px; }
.dpss-disclaimer { color: #888; font-size: 12px; margin-top: 12px; }

.dpss-success-message { text-align: center; padding: 50px 30px; max-width: 600px; margin: 0 auto; }
.dpss-success-icon { font-size: 60px; color: #28a745; margin-bottom: 20px; }
.dpss-success-message h2 { color: #28a745; margin-bottom: 15px; }
.dpss-success-message p { color: #666; font-size: 16px; line-height: 1.6; }
.dpss-btn { display: inline-block; background: #781715; color: #fff; padding: 10px 24px; border-radius: 5px; text-decoration: none; margin-top: 15px; }
.dpss-btn:hover { background: #5c110f; color: #fff; }

@media (max-width: 768px) {
    .dpss-field-row { flex-direction: column; gap: 0; }
    .dpss-section { padding: 15px 20px; }
}