/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

/* ========================================
   WordPress Admin Dashboard Layout System
   ======================================== */

/* WordPress Admin Design System Variables */
:root {
    /* WordPress Admin Colors */
    --wp-admin-primary: #61ce70;
    --wp-admin-primary-hover: #4fb85d;
    --wp-admin-secondary: #666;
    --wp-admin-success: #46b450;
    --wp-admin-error: #dc3232;
    --wp-admin-warning: #ffb900;
    
    /* WordPress Admin Text Colors */
    --wp-admin-text-primary: #23282d;
    --wp-admin-text-secondary: #666;
    --wp-admin-text-muted: #999;
    
    /* WordPress Admin Background Colors */
    --wp-admin-bg-primary: #ffffff;
    --wp-admin-bg-secondary: #f1f1f1;
    --wp-admin-bg-tertiary: #f9f9f9;
    
    /* WordPress Admin Border Colors */
    --wp-admin-border: #ccd0d4;
    --wp-admin-border-light: #e1e1e1;
    
    /* WordPress Admin Shadows */
    --wp-admin-shadow: 0 1px 1px rgba(0,0,0,.04);
    --wp-admin-shadow-hover: 0 1px 3px rgba(0,0,0,.13);
    
    /* WordPress Admin Spacing */
    --wp-admin-spacing-xs: 4px;
    --wp-admin-spacing-sm: 8px;
    --wp-admin-spacing-md: 12px;
    --wp-admin-spacing-lg: 20px;
    --wp-admin-spacing-xl: 24px;
    
    /* WordPress Admin Typography */
    --wp-admin-font-size-xs: 11px;
    --wp-admin-font-size-sm: 12px;
    --wp-admin-font-size-base: 13px;
    --wp-admin-font-size-lg: 14px;
    --wp-admin-font-size-xl: 16px;
    --wp-admin-font-size-2xl: 18px;
    --wp-admin-font-size-3xl: 24px;
    
    /* WordPress Admin Font Weights */
    --wp-admin-font-weight-normal: 400;
    --wp-admin-font-weight-medium: 500;
    --wp-admin-font-weight-semibold: 600;
    --wp-admin-font-weight-bold: 700;
}

/* WordPress Admin Dashboard Container */
.profile-dashboard {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--wp-admin-spacing-lg);
    background: var(--wp-admin-bg-secondary);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    font-size: var(--wp-admin-font-size-base);
    line-height: 1.4;
}

/* WordPress Admin Dashboard Header */
.profile-dashboard-header {
    margin-bottom: var(--wp-admin-spacing-xl);
    padding: var(--wp-admin-spacing-lg);
    background: var(--wp-admin-bg-primary);
    border: 1px solid var(--wp-admin-border);
    border-radius: 3px;
    box-shadow: var(--wp-admin-shadow);
}

.profile-dashboard-title {
    font-size: var(--wp-admin-font-size-3xl);
    font-weight: var(--wp-admin-font-weight-bold);
    color: var(--wp-admin-text-primary);
    margin: 0;
    padding: 0;
}

/* WordPress Admin Postbox Sections */
.profile-section {
    background: var(--wp-admin-bg-primary);
    border: 1px solid var(--wp-admin-border);
    border-radius: 3px;
    margin-bottom: var(--wp-admin-spacing-lg);
    box-shadow: var(--wp-admin-shadow);
    position: relative;
}

.profile-section:hover {
    box-shadow: var(--wp-admin-shadow-hover);
}

.profile-section-title {
    font-size: var(--wp-admin-font-size-xl);
    font-weight: var(--wp-admin-font-weight-semibold);
    color: var(--wp-admin-text-primary);
    margin: 0;
    padding: var(--wp-admin-spacing-lg) var(--wp-admin-spacing-lg) var(--wp-admin-spacing-md);
    border-bottom: 1px solid var(--wp-admin-border-light);
    background: var(--wp-admin-bg-tertiary);
    position: relative;
}

.profile-section-title::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--wp-admin-primary);
}

/* WordPress Admin Form Fields */
.form-field {
    margin-bottom: var(--wp-admin-spacing-lg);
    padding: 0 var(--wp-admin-spacing-lg) var(--wp-admin-spacing-lg);
}

.form-field:last-child {
    margin-bottom: 0;
}

.form-label {
    display: block;
    font-weight: var(--wp-admin-font-weight-semibold);
    color: var(--wp-admin-text-primary);
    margin-bottom: var(--wp-admin-spacing-sm);
    font-size: var(--wp-admin-font-size-base);
    line-height: 1.3;
}

.form-input,
.form-textarea,
.form-select {
    width: 100%;
    padding: var(--wp-admin-spacing-sm);
    border: 1px solid var(--wp-admin-border);
    border-radius: 3px;
    font-size: var(--wp-admin-font-size-base);
    background: var(--wp-admin-bg-primary);
    color: var(--wp-admin-text-primary);
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    box-sizing: border-box;
    line-height: 1.4;
    font-family: inherit;
}

.form-input:focus,
.form-textarea:focus,
.form-select:focus {
    border-color: var(--wp-admin-primary);
    outline: none;
    box-shadow: 0 0 0 1px var(--wp-admin-primary);
}

.form-input:hover,
.form-textarea:hover,
.form-select:hover {
    border-color: var(--wp-admin-primary);
}

.form-textarea {
    resize: vertical;
    min-height: 100px;
    font-family: inherit;
}

/* WordPress Admin Form Row Layout */
.form-row {
    display: flex;
    flex-direction: column;
    gap: var(--wp-admin-spacing-lg);
    margin-bottom: var(--wp-admin-spacing-lg);
    padding: 0 var(--wp-admin-spacing-lg) var(--wp-admin-spacing-lg);
    align-items: stretch;
}

.form-row .form-field {
    display: flex;
    flex-direction: column;
    text-align: left;
    align-items: flex-start;
}

.form-row .form-field .form-label {
    text-align: left;
    align-self: flex-start;
}

.form-row .form-field .form-input,
.form-row .form-field .form-select {
    text-align: left;
    align-self: flex-start;
}

/* WordPress Admin Form Field Half */
.form-field-half {
    width: 100%;
    display: flex;
    flex-direction: column;
    text-align: left;
    align-items: flex-start;
    margin-bottom: var(--wp-admin-spacing-md);
}

.form-field-half .form-label {
    text-align: left;
    align-self: flex-start;
    width: 100%;
    margin-bottom: var(--wp-admin-spacing-sm);
}

.form-field-half .form-input,
.form-field-half .form-select {
    text-align: left;
    align-self: flex-start;
    width: 100%;
}

@media (max-width: 640px) {
    .form-row {
        flex-direction: column;
        gap: var(--wp-admin-spacing-md);
    }
}

/* WordPress Admin Checkbox Group */
.checkbox-group {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--wp-admin-spacing-sm);
    margin-top: var(--wp-admin-spacing-sm);
}

.checkbox-label {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: var(--wp-admin-spacing-sm);
    border-radius: 3px;
    transition: background-color 0.15s ease-in-out;
    font-size: var(--wp-admin-font-size-base);
}

.checkbox-label:hover {
    background: var(--wp-admin-bg-tertiary);
}

.checkbox-label input[type="checkbox"] {
    margin-right: var(--wp-admin-spacing-sm);
    width: 16px;
    height: 16px;
    accent-color: var(--wp-admin-primary);
}

.checkbox-text {
    color: var(--wp-admin-text-primary);
    font-weight: var(--wp-admin-font-weight-normal);
}

/* WordPress Admin Upload Areas */
.upload-area {
    border: 2px dashed var(--wp-admin-border);
    border-radius: 3px;
    padding: var(--wp-admin-spacing-xl);
    text-align: center;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    background: var(--wp-admin-bg-tertiary);
    position: relative;
}

.upload-area:hover {
    border-color: var(--wp-admin-primary);
    background: rgba(97, 206, 112, 0.05);
}

.upload-placeholder {
    color: var(--wp-admin-text-secondary);
}

.upload-icon {
    font-size: 2rem;
    margin-bottom: var(--wp-admin-spacing-sm);
    opacity: 0.7;
}

.upload-link {
    color: var(--wp-admin-primary);
    text-decoration: none;
    font-weight: var(--wp-admin-font-weight-semibold);
}

.upload-link:hover {
    text-decoration: underline;
}

.upload-info {
    font-size: var(--wp-admin-font-size-xs);
    color: var(--wp-admin-text-muted);
    margin-top: var(--wp-admin-spacing-sm);
}

/* WordPress Admin Form Actions */
.form-actions {
    text-align: center;
    margin-top: var(--wp-admin-spacing-xl);
    padding: var(--wp-admin-spacing-lg);
    border-top: 1px solid var(--wp-admin-border-light);
    background: var(--wp-admin-bg-tertiary);
}

.btn-primary {
    background: var(--wp-admin-primary);
    color: white;
    border: none;
    padding: var(--wp-admin-spacing-sm) var(--wp-admin-spacing-lg);
    border-radius: 3px;
    font-size: var(--wp-admin-font-size-base);
    font-weight: var(--wp-admin-font-weight-semibold);
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    min-width: 200px;
    box-shadow: var(--wp-admin-shadow);
    text-decoration: none;
    display: inline-block;
}

.btn-primary:hover {
    background: var(--wp-admin-primary-hover);
    box-shadow: var(--wp-admin-shadow-hover);
    color: white;
}

.btn-primary:active {
    transform: translateY(1px);
}

/* WordPress Admin Profile Footer */
.profile-footer {
    text-align: center;
    margin-top: var(--wp-admin-spacing-xl);
    padding: var(--wp-admin-spacing-lg);
    border-top: 1px solid var(--wp-admin-border-light);
    background: var(--wp-admin-bg-tertiary);
    color: var(--wp-admin-text-secondary);
    font-size: var(--wp-admin-font-size-sm);
}

.footer-link {
    color: var(--wp-admin-primary);
    text-decoration: none;
    font-weight: var(--wp-admin-font-weight-semibold);
}

.footer-link:hover {
    text-decoration: underline;
}

/* WordPress Admin Character Counter */
.char-counter {
    text-align: right;
    font-size: var(--wp-admin-font-size-xs);
    color: var(--wp-admin-text-muted);
    margin-top: var(--wp-admin-spacing-xs);
}

.char-counter .current-count {
    font-weight: var(--wp-admin-font-weight-semibold);
    color: var(--wp-admin-text-secondary);
}

/* WordPress Admin Error Messages */
.salary-error,
.message-error,
.upload-error {
    background: rgba(220, 50, 50, 0.1);
    color: var(--wp-admin-error);
    padding: var(--wp-admin-spacing-sm);
    border-radius: 3px;
    margin-top: var(--wp-admin-spacing-sm);
    font-size: var(--wp-admin-font-size-xs);
    border-left: 3px solid var(--wp-admin-error);
}

/* WordPress Admin Select2 Styling */
.select2-container--default .select2-selection--single {
    height: 32px;
    border: 1px solid var(--wp-admin-border);
    border-radius: 3px;
    padding: var(--wp-admin-spacing-xs);
    background: var(--wp-admin-bg-primary);
    text-align: left;
}

.select2-container--default .select2-selection--single:focus {
    border-color: #61ce70;
    box-shadow: 0 0 0 1px #61ce70;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    text-align: left;
    padding-left: 8px;
}

.select2-container--default .select2-selection--multiple {
    border: 1px solid var(--wp-admin-border);
    border-radius: 3px;
    min-height: 32px;
    background: var(--wp-admin-bg-primary);
    text-align: left;
}

.select2-container--default .select2-selection--multiple:focus {
    border-color: #61ce70;
    box-shadow: 0 0 0 1px #61ce70;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    text-align: left;
    padding-left: 8px;
}

/* WordPress Admin Select2 Choice Tags */
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: #61ce70;
    border: 1px solid #61ce70;
    border-radius: 3px;
    color: white;
    padding: var(--wp-admin-spacing-xs) var(--wp-admin-spacing-sm);
    margin: var(--wp-admin-spacing-xs);
    font-size: var(--wp-admin-font-size-xs);
    transition: all 0.2s ease;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice:hover {
    background: #4fb85d;
    border-color: #4fb85d;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(97, 206, 112, 0.3);
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: white;
    margin-right: var(--wp-admin-spacing-xs);
    font-weight: bold;
    transition: background-color 0.2s ease;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transform: scale(1.1);
}

/* WordPress Admin Select2 Dropdown */
.select2-container--default .select2-dropdown {
    border: 1px solid var(--wp-admin-border);
    border-radius: 3px;
    background: var(--wp-admin-bg-primary);
    box-shadow: var(--wp-admin-shadow-hover);
}

.select2-container--default .select2-results__option {
    padding: var(--wp-admin-spacing-sm) var(--wp-admin-spacing-md);
    color: var(--wp-admin-text-primary);
    background: var(--wp-admin-bg-primary);
    transition: background-color 0.2s ease;
}

.select2-container--default .select2-results__option:hover {
    background: rgba(97, 206, 112, 0.1);
    color: var(--wp-admin-text-primary);
    border-left: 3px solid #61ce70;
    padding-left: calc(var(--wp-admin-spacing-md) - 3px);
}

/* Überschreibe Select2 CDN Styles mit höherer Spezifität */
.select2-container--default .select2-results__option--highlighted,
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] {
    background: #61ce70 !important;
    color: white !important;
    border-left: 3px solid #4fb85d !important;
    padding-left: calc(var(--wp-admin-spacing-md) - 3px) !important;
}

/* Überschreibe Select2 CDN Styles für Selected States */
.select2-container--default .select2-results__option--selected,
.select2-container--default .select2-results__option--selected[aria-selected],
.select2-container--default .select2-results__option--selected[data-selected] {
    background: rgba(97, 206, 112, 0.15) !important;
    color: var(--wp-admin-text-primary) !important;
    border-left: 3px solid #61ce70 !important;
    padding-left: calc(var(--wp-admin-spacing-md) - 3px) !important;
}

.select2-container--default .select2-results__option--selected:hover,
.select2-container--default .select2-results__option--selected[aria-selected]:hover,
.select2-container--default .select2-results__option--selected[data-selected]:hover {
    background: #61ce70 !important;
    color: white !important;
    border-left: 3px solid #4fb85d !important;
    padding-left: calc(var(--wp-admin-spacing-md) - 3px) !important;
}

/* WordPress Admin Select2 Loading State */
.select2-container--default .select2-results__option[aria-disabled=true] {
    color: var(--wp-admin-text-muted);
    background: var(--wp-admin-bg-secondary);
}

/* Überschreibe alle Select2 CDN Styles für konsistente grüne Farben */
.select2-container--default .select2-results__option--highlighted[aria-selected="true"],
.select2-container--default .select2-results__option--highlighted[data-selected="true"] {
    background: #61ce70 !important;
    color: white !important;
}

/* Überschreibe Select2 Choice Tags */
.select2-container--default .select2-selection--multiple .select2-selection__choice[aria-selected="true"] {
    background: #61ce70 !important;
    border-color: #61ce70 !important;
    color: white !important;
}

/* Überschreibe Select2 Focus States */
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: #61ce70 !important;
    box-shadow: 0 0 0 1px #61ce70 !important;
}

/* WordPress Admin Select2 Search Field */
.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid var(--wp-admin-border);
    border-radius: 3px;
    padding: var(--wp-admin-spacing-sm);
    background: var(--wp-admin-bg-primary);
    color: var(--wp-admin-text-primary);
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: #61ce70;
    box-shadow: 0 0 0 1px #61ce70;
    outline: none;
}

/* WordPress Admin Select2 Container Alignment */
.select2-container {
    width: 100% !important;
    text-align: left;
}

.select2-container--default .select2-selection {
    text-align: left;
}

.select2-container--default .select2-search--inline .select2-search__field {
    text-align: left;
}

/* Force left alignment for all Select2 elements */
.select2-container * {
    text-align: left !important;
}

/* WordPress Admin Responsive Design */
@media (max-width: 768px) {
    .profile-dashboard {
        padding: var(--wp-admin-spacing-md);
    }
    
    .profile-section {
        margin-bottom: var(--wp-admin-spacing-md);
    }
    
    .profile-dashboard-title {
        font-size: var(--wp-admin-font-size-2xl);
    }
    
    .profile-section-title {
        font-size: var(--wp-admin-font-size-lg);
    }
    
    .checkbox-group {
        grid-template-columns: 1fr;
    }
    
    .form-field {
        padding: 0 var(--wp-admin-spacing-md) var(--wp-admin-spacing-md);
    }
    
    .form-row {
        padding: 0 var(--wp-admin-spacing-md) var(--wp-admin-spacing-md);
    }
}

@media (max-width: 480px) {
    .profile-dashboard {
        padding: var(--wp-admin-spacing-sm);
    }
    
    .profile-dashboard-header {
        padding: var(--wp-admin-spacing-md);
    }
    
    .btn-primary {
        width: 100%;
        min-width: auto;
    }
    
    .profile-dashboard-title {
        font-size: var(--wp-admin-font-size-xl);
    }
    
    .form-field {
        padding: 0 var(--wp-admin-spacing-sm) var(--wp-admin-spacing-sm);
    }
    
    .form-row {
        padding: 0 var(--wp-admin-spacing-sm) var(--wp-admin-spacing-sm);
    }
}

/* ========================================
   Upload System Styles
   ======================================== */

/* Upload Area States */
.upload-area.has-file {
    border-color: var(--wp-admin-primary);
    background-color: #f0fdf4;
}

.upload-area.drag-over {
    border-color: var(--wp-admin-primary);
    background-color: #e8f5e9;
    transform: scale(1.02);
    transition: all 0.2s ease;
}

/* Current File Display */
.current-photo-preview {
    max-width: 150px;
    max-height: 150px;
    border-radius: 50%;
    margin-bottom: var(--wp-admin-spacing-md);
    border: 2px solid var(--wp-admin-border-light);
    box-shadow: var(--wp-admin-shadow);
}

.current-file-display {
    display: flex;
    align-items: center;
    gap: var(--wp-admin-spacing-sm);
    padding: var(--wp-admin-spacing-md);
    background-color: #f8f9fa;
    border-radius: var(--wp-admin-border-radius);
    border: 1px solid var(--wp-admin-border-light);
}

.file-icon {
    font-size: 1.5rem;
}

.file-name {
    flex: 1;
    font-weight: 500;
    color: var(--wp-admin-text-primary);
}

/* Action Buttons */
.file-actions {
    display: flex;
    gap: var(--wp-admin-spacing-sm);
    margin-top: var(--wp-admin-spacing-sm);
}

.change-photo-btn,
.view-file-btn {
    background-color: var(--wp-admin-primary);
    color: white;
    border: none;
    padding: var(--wp-admin-spacing-sm) var(--wp-admin-spacing-md);
    border-radius: var(--wp-admin-border-radius);
    cursor: pointer;
    text-decoration: none;
    font-size: var(--wp-admin-font-size-sm);
    transition: background-color 0.2s ease;
}

.change-photo-btn:hover,
.view-file-btn:hover {
    background-color: var(--wp-admin-primary-hover);
    color: white;
    text-decoration: none;
}

.remove-photo-btn,
.remove-file-btn {
    background-color: var(--wp-admin-error);
    color: white;
    border: none;
    padding: var(--wp-admin-spacing-sm) var(--wp-admin-spacing-md);
    border-radius: var(--wp-admin-border-radius);
    cursor: pointer;
    font-size: var(--wp-admin-font-size-sm);
    transition: background-color 0.2s ease;
}

.remove-photo-btn:hover,
.remove-file-btn:hover {
    background-color: #c0392b;
}

/* Upload Placeholder Enhancements */
.upload-placeholder {
    text-align: center;
    padding: var(--wp-admin-spacing-xl);
    transition: all 0.2s ease;
}

.upload-area.drag-over .upload-placeholder {
    color: var(--wp-admin-primary);
}

.upload-icon {
    font-size: 2rem;
    margin-bottom: var(--wp-admin-spacing-md);
    opacity: 0.7;
}

.upload-area.drag-over .upload-icon {
    opacity: 1;
    transform: scale(1.1);
}

.upload-link {
    color: var(--wp-admin-primary);
    text-decoration: underline;
    cursor: pointer;
}

.upload-link:hover {
    color: var(--wp-admin-primary-hover);
}

.upload-info {
    font-size: var(--wp-admin-font-size-xs);
    color: var(--wp-admin-text-muted);
    margin-top: var(--wp-admin-spacing-sm);
}

/* Upload Error Styling */
.upload-error {
    color: var(--wp-admin-error);
    font-size: var(--wp-admin-font-size-sm);
    margin-top: var(--wp-admin-spacing-sm);
    padding: var(--wp-admin-spacing-sm);
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: var(--wp-admin-border-radius);
}

/* Responsive Upload Areas */
@media (max-width: 768px) {
    .current-file-display {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--wp-admin-spacing-sm);
    }
    
    .file-actions {
        width: 100%;
        justify-content: space-between;
    }
    
    .change-photo-btn,
    .remove-photo-btn,
    .view-file-btn,
    .remove-file-btn {
        flex: 1;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .current-photo-preview {
        max-width: 120px;
        max-height: 120px;
    }
    
    .upload-placeholder {
        padding: var(--wp-admin-spacing-lg);
    }
    
    .upload-icon {
        font-size: 1.5rem;
    }
}