


:root {
    --feshar-primary: #8B5CF6;
    --feshar-primary-dark: #7C3AED;
    --feshar-primary-light: #A78BFA;
    --feshar-secondary: #EC4899;
    --feshar-success: #10B981;
    --feshar-warning: #F59E0B;
    --feshar-error: #EF4444;
    --feshar-gray-50: #F9FAFB;
    --feshar-gray-100: #F3F4F6;
    --feshar-gray-200: #E5E7EB;
    --feshar-gray-300: #D1D5DB;
    --feshar-gray-400: #9CA3AF;
    --feshar-gray-500: #6B7280;
    --feshar-gray-600: #4B5563;
    --feshar-gray-700: #374151;
    --feshar-gray-800: #1F2937;
    --feshar-gray-900: #111827;
    --feshar-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --feshar-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    --feshar-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --feshar-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --feshar-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    --feshar-border-radius: 0.5rem;
    --feshar-border-radius-lg: 0.75rem;
    --feshar-border-radius-xl: 1rem;
    --feshar-transition: all 0.2s ease-in-out;
}


.feshar-container * {
    box-sizing: border-box;
    font-family: inherit;
}

.feshar-container {
    font-family: 'danaFaNum', 'Dana', 'Vazir', 'Irancell Sans', 'IRANSans', 'Tahoma', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    max-width: 1200px;
    margin: 0 auto;
    padding: 1rem;
    background: linear-gradient(135deg, #F8FAFC 0%, #F1F5F9 100%);
    border-radius: var(--feshar-border-radius-xl);
    box-shadow: var(--feshar-shadow-xl);
    position: relative;
    direction: rtl;
    text-align: right;
}


.feshar-highlight {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.1) 0%, rgba(236, 72, 153, 0.1) 100%) !important;
    box-shadow: 0 0 20px rgba(139, 92, 246, 0.3) !important;
    border: 2px solid rgba(139, 92, 246, 0.3) !important;
    border-radius: var(--feshar-border-radius-lg) !important;
    transition: all 0.3s ease-in-out !important;
    transform: scale(1.02) !important;
}

.feshar-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--feshar-primary), var(--feshar-secondary));
    border-radius: var(--feshar-border-radius-xl) var(--feshar-border-radius-xl) 0 0;
}


.feshar-step {
    display: none;
    padding: 0.7rem 0;
    text-align: center;
    transition: var(--feshar-transition);
}

.feshar-step.active {
    display: block;
    animation: fadeInUp 0.5s ease-out;
}

.feshar-step-1.drag-active {
    background: rgba(139, 92, 246, 0.03);
    border-radius: var(--feshar-border-radius-lg);
    transform: scale(1.01);
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.feshar-step h3 {
    color: var(--feshar-gray-800);
    font-size: 1.875rem;
    font-weight: 700;
    margin-bottom: 0.7rem;
    background: linear-gradient(135deg, var(--feshar-primary), var(--feshar-secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}


.feshar-upload-area {
    border: 2px dashed var(--feshar-gray-300);
    border-radius: var(--feshar-border-radius-lg);
    padding: 1.5rem 2rem;
    margin: 1rem 0;
    background: var(--feshar-gray-50);
    transition: var(--feshar-transition);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    min-height: 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}


.feshar-step-1 { cursor: pointer; }
.feshar-step-1.drag-active { outline: 3px dashed rgba(139, 92, 246, 0.45); outline-offset: 6px; }

.feshar-upload-area::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(139, 92, 246, 0.1), transparent);
    transition: left 0.6s ease;
}

.feshar-upload-area:hover::before {
    left: 100%;
}

.feshar-upload-area:hover {
    border-color: var(--feshar-primary);
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.05), rgba(236, 72, 153, 0.05));
    transform: translateY(-2px);
    box-shadow: var(--feshar-shadow-lg);
}

.feshar-upload-area.feshar-drag-over {
    border-color: var(--feshar-primary);
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.1), rgba(236, 72, 153, 0.1));
    transform: scale(1.02);
}

.feshar-upload-icon {
    margin-bottom: 0.35rem;
}

.feshar-upload-icon svg {
    width: 48px;
    height: 48px;
    color: var(--feshar-primary);
    filter: drop-shadow(0 2px 4px rgba(139, 92, 246, 0.2));
}

.feshar-upload-text {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--feshar-gray-700);
    margin-bottom: 0.1rem;
}

.feshar-upload-subtext {
    font-size: 0.875rem;
    color: var(--feshar-gray-500);
    margin-bottom: 0.5rem;
}


.feshar-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.5rem;
    border-radius: var(--feshar-border-radius);
    font-weight: 600;
    text-decoration: none;
    transition: var(--feshar-transition);
    cursor: pointer;
    border: none;
    font-size: 0.875rem;
    line-height: 1.25rem;
    position: relative;
    overflow: hidden;
}

.feshar-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.6s ease;
}

.feshar-btn:hover::before {
    left: 100%;
}

.feshar-btn-primary {
    background: linear-gradient(135deg, var(--feshar-primary), var(--feshar-primary-dark));
    color: white !important;
    box-shadow: var(--feshar-shadow);
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.feshar-btn-primary:hover {
    background: linear-gradient(135deg, var(--feshar-primary-dark), var(--feshar-primary));
    color: white !important;
    transform: translateY(-2px);
    box-shadow: var(--feshar-shadow-lg);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.feshar-btn-secondary {
    background: linear-gradient(135deg, var(--feshar-secondary), #BE185D);
    color: white !important;
    box-shadow: var(--feshar-shadow);
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.feshar-btn-secondary:hover {
    background: linear-gradient(135deg, #BE185D, var(--feshar-secondary));
    color: white !important;
    transform: translateY(-2px);
    box-shadow: var(--feshar-shadow-lg);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.feshar-btn-outline {
    background: white;
    color: var(--feshar-primary) !important;
    border: 2px solid var(--feshar-primary);
    box-shadow: var(--feshar-shadow);
    font-weight: 600;
}

.feshar-btn-outline:hover {
    background: var(--feshar-primary);
    color: white !important;
    transform: translateY(-2px);
    box-shadow: var(--feshar-shadow-lg);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.feshar-btn-small {
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
}

.feshar-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
    background: var(--feshar-gray-400) !important;
    color: var(--feshar-gray-600) !important;
    border-color: var(--feshar-gray-400) !important;
}

.feshar-btn:disabled:hover {
    transform: none;
    box-shadow: var(--feshar-shadow);
    opacity: 0.6;
    background: var(--feshar-gray-400) !important;
    color: var(--feshar-gray-600) !important;
}


.feshar-btn-success {
    background: var(--feshar-success);
    color: white !important;
    box-shadow: var(--feshar-shadow);
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.feshar-btn-success:hover {
    background: #059669;
    color: white !important;
    transform: translateY(-2px);
    box-shadow: var(--feshar-shadow-lg);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.feshar-btn-warning {
    background: var(--feshar-warning);
    color: white !important;
    box-shadow: var(--feshar-shadow);
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.feshar-btn-warning:hover {
    background: #D97706;
    color: white !important;
    transform: translateY(-2px);
    box-shadow: var(--feshar-shadow-lg);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.feshar-btn-error {
    background: var(--feshar-error);
    color: white !important;
    box-shadow: var(--feshar-shadow);
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.feshar-btn-error:hover {
    background: #DC2626;
    color: white !important;
    transform: translateY(-2px);
    box-shadow: var(--feshar-shadow-lg);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}


.feshar-file-list {
    display: none;
    margin: 1.4rem 0;
    background: white;
    border-radius: var(--feshar-border-radius-lg);
    padding: 1rem;
    box-shadow: var(--feshar-shadow-md);
    max-height: 400px;
    overflow-y: auto;
    direction: rtl;
    text-align: right;
}

.feshar-file-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--feshar-gray-200);
    transition: var(--feshar-transition);
    direction: rtl;
    text-align: right;
    animation: slideInRight 0.4s ease-out;
    opacity: 0;
    animation-fill-mode: forwards;
}

.feshar-file-item:last-child {
    border-bottom: none;
}

.feshar-file-item:hover {
    background: var(--feshar-gray-50);
    transform: translateX(-3px);
    box-shadow: var(--feshar-shadow);
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.feshar-file-info {
    flex: 1;
    text-align: right;
    direction: rtl;
}

.feshar-file-name {
    display: block;
    font-weight: 600;
    color: var(--feshar-gray-800);
    margin-bottom: 0.25rem;
    text-align: right;
    direction: rtl;
    word-break: break-word;
}

.feshar-file-size {
    font-size: 0.875rem;
    color: var(--feshar-gray-500);
    text-align: right;
    direction: rtl;
}

.feshar-file-status {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    min-width: 140px;
    text-align: right;
    direction: rtl;
}

.feshar-status-text {
    font-size: 0.875rem;
    font-weight: 500;
    text-align: right;
}

.feshar-status-text.success {
    color: var(--feshar-success);
}

.feshar-status-text.error {
    color: var(--feshar-error);
}

.feshar-status-text.processing {
    color: var(--feshar-primary);
    animation: pulse 1.5s infinite;
    position: relative;
}

.feshar-status-text.processing::after {
    content: '⏳';
    margin-right: 5px;
    animation: spin 2s linear infinite;
}

.feshar-status-text.waiting {
    color: var(--feshar-gray-500);
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

.feshar-file-progress {
    width: 120px;
    height: 6px;
    background: var(--feshar-gray-200);
    border-radius: 3px;
    overflow: hidden;
    direction: ltr; 
    position: relative;
}

.feshar-file-progress-bar {
    height: 100%;
    background: linear-gradient(90deg, var(--feshar-primary), var(--feshar-secondary));
    width: 0%;
    transition: width 0.4s ease-out, background 0.3s ease;
    border-radius: 3px;
    position: relative;
}

.feshar-file-progress-bar.processing::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, 
        transparent 25%, 
        rgba(255,255,255,0.3) 25%, 
        rgba(255,255,255,0.3) 50%, 
        transparent 50%, 
        transparent 75%, 
        rgba(255,255,255,0.3) 75%
    );
    background-size: 20px 20px;
    animation: progressStripes 1s linear infinite;
}

@keyframes progressStripes {
    0% { background-position: 0 0; }
    100% { background-position: 20px 0; }
}

.feshar-file-progress-bar.success {
    background: var(--feshar-success);
}

.feshar-file-progress-bar.success::after {
    display: none;
}

.feshar-file-progress-bar.error {
    background: var(--feshar-error);
}

.feshar-file-progress-bar.error::after {
    display: none;
}

.feshar-file-progress-text {
    font-size: 0.75rem;
    color: var(--feshar-gray-600);
    margin-top: 0.25rem;
    text-align: right;
    direction: rtl;
}


.feshar-options {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
    margin: 2rem 0;
}

.feshar-option {
    position: relative;
}

.feshar-option input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.feshar-option label {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    background: white;
    border: 2px solid var(--feshar-gray-200);
    border-radius: var(--feshar-border-radius-lg);
    cursor: pointer;
    transition: var(--feshar-transition);
    box-shadow: var(--feshar-shadow);
}

.feshar-option label:hover {
    border-color: var(--feshar-primary);
    transform: translateY(-2px);
    box-shadow: var(--feshar-shadow-lg);
}

.feshar-option input[type="radio"]:checked + label {
    border-color: var(--feshar-primary);
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.05), rgba(236, 72, 153, 0.05));
    box-shadow: var(--feshar-shadow-lg);
}

.feshar-option-icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--feshar-primary), var(--feshar-secondary));
    border-radius: var(--feshar-border-radius);
    color: white;
}

.feshar-option-content h4 {
    margin: 0 0 0.5rem 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--feshar-gray-800);
}

.feshar-option-content p {
    margin: 0;
    font-size: 0.875rem;
    color: var(--feshar-gray-600);
}


.feshar-recommended-badge {
    display: inline-block;
    background: linear-gradient(45deg, #10b981, #059669);
    color: white;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    border-radius: 12px;
    margin-right: 0.5rem;
    vertical-align: middle;
    cursor: help;
    position: relative;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(16, 185, 129, 0.3);
    animation: pulse-badge 2s ease-in-out infinite;
}

.feshar-recommended-badge:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 8px rgba(16, 185, 129, 0.4);
    animation: none;
}

@keyframes pulse-badge {
    0%, 100% { 
        transform: scale(1);
        box-shadow: 0 2px 4px rgba(16, 185, 129, 0.3);
    }
    50% { 
        transform: scale(1.02);
        box-shadow: 0 3px 6px rgba(16, 185, 129, 0.4);
    }
}


.feshar-recommended-badge::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 120%;
    right: 50%;
    transform: translateX(50%);
    background: rgba(0, 0, 0, 0.9);
    color: white;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 400;
    line-height: 1.4;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
    z-index: 1000;
    max-width: 380px;
    white-space: normal;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    min-width: 144px;
}

.feshar-recommended-badge::before {
    content: '';
    position: absolute;
    bottom: 108%;
    right: 50%;
    transform: translateX(50%);
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid rgba(0, 0, 0, 0.9);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    z-index: 1001;
}

.feshar-recommended-badge:hover::after,
.feshar-recommended-badge:hover::before {
    opacity: 1;
    visibility: visible;
}

.feshar-recommended-badge:hover::after {
    transform: translateX(50%) translateY(-5px);
}


.feshar-progress {
    display: none;
    margin: 2rem 0;
    text-align: center;
}

.feshar-progress-bar {
    width: 100%;
    height: 8px;
    background: var(--feshar-gray-200);
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 1rem;
    direction: ltr;
}

.feshar-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--feshar-primary), var(--feshar-secondary));
    width: 0%;
    transition: width 0.3s ease;
    border-radius: 4px;
}

.feshar-progress-text {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--feshar-gray-700);
}


.feshar-results {
    display: none;
    margin: 2rem 0;
}

.feshar-summary {
    background: white;
    padding: 1.5rem;
    border-radius: var(--feshar-border-radius-lg);
    margin-bottom: 1.5rem;
    box-shadow: var(--feshar-shadow-md);
    border-left: 4px solid var(--feshar-primary);
}

.feshar-summary h4 {
    margin: 0 0 1rem 0;
    color: var(--feshar-gray-800);
    font-size: 1.25rem;
}

.feshar-summary p {
    margin: 0.5rem 0;
    color: var(--feshar-gray-600);
}


.feshar-results-cards {
    display: grid;
    gap: 1rem;
    margin-top: 2rem;
    direction: rtl;
    text-align: right;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.feshar-result-card {
    background: white;
    border-radius: var(--feshar-border-radius-lg);
    padding: 1rem;
    box-shadow: var(--feshar-shadow-md);
    border: 1px solid var(--feshar-gray-200);
    transition: var(--feshar-transition);
    position: relative;
    overflow: hidden;
}

.feshar-result-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--feshar-shadow-lg);
    border-color: var(--feshar-primary);
}

.feshar-result-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--feshar-primary), var(--feshar-secondary));
}

.feshar-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.75rem;
    gap: 0.75rem;
    direction: rtl;
    text-align: right;
}

.feshar-card-filename {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--feshar-gray-800);
    word-break: break-word;
    flex: 1;
    text-align: right;
    direction: rtl;
}

.feshar-card-status {
    flex-shrink: 0;
}

.feshar-card-info {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.feshar-card-info-item {
    text-align: center;
    background: var(--feshar-gray-50);
    padding: 0.5rem;
    border-radius: var(--feshar-border-radius);
}

.feshar-card-info-label {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--feshar-gray-500);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.125rem;
}

.feshar-card-info-value {
    font-size: 1rem;
    font-weight: 600;
    color: var(--feshar-gray-800);
}

.feshar-card-actions {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-start;
    flex-wrap: wrap;
    direction: rtl;
    text-align: right;
}

.feshar-card-error {
    background: rgba(239, 68, 68, 0.05);
    border-color: rgba(239, 68, 68, 0.2);
}

.feshar-card-error::before {
    background: var(--feshar-error);
}

.feshar-card-success {
    background: rgba(16, 185, 129, 0.05);
    border-color: rgba(16, 185, 129, 0.2);
}

.feshar-card-success::before {
    background: var(--feshar-success);
}

.feshar-card-error-message {
    color: var(--feshar-error);
    font-size: 0.875rem;
    font-weight: 500;
    padding: 0.375rem;
    background: rgba(239, 68, 68, 0.1);
    border-radius: var(--feshar-border-radius);
    margin-top: 0.375rem;
    border-left: 3px solid var(--feshar-error);
}


.feshar-results-table {
    display: none;
}

.feshar-savings {
    font-weight: 600;
    color: var(--feshar-success);
}

.feshar-card-savings {
    font-weight: 600;
    color: var(--feshar-success);
    font-size: 1.125rem;
}

.feshar-card-savings.negative {
    color: var(--feshar-error);
}

.feshar-status {
    font-weight: 500;
    padding: 0.25rem 0.5rem;
    border-radius: var(--feshar-border-radius);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: 1px solid transparent;
}

.feshar-status.success {
    background: var(--feshar-success);
    color: white;
    border-color: var(--feshar-success);
}

.feshar-status.error {
    background: var(--feshar-error);
    color: white;
    border-color: var(--feshar-error);
}


.feshar-step-actions {
    display: flex;
    gap: 1rem;
    justify-content: center;
    margin-top: 0.7rem;
    flex-wrap: wrap;
    direction: ltr;
}

.feshar-step-actions .feshar-btn {
    direction: ltr;
    text-align: center;
}


.feshar-messages {
    margin-bottom: 1rem;
}

.feshar-message {
    padding: 1rem;
    border-radius: var(--feshar-border-radius);
    margin-bottom: 1rem;
    font-weight: 500;
    border-left: 4px solid;
}

.feshar-message-success {
    background: rgba(16, 185, 129, 0.1);
    color: var(--feshar-success);
    border-left-color: var(--feshar-success);
}

.feshar-message-error {
    background: rgba(239, 68, 68, 0.1);
    color: var(--feshar-error);
    border-left-color: var(--feshar-error);
}

.feshar-message-warning {
    background: rgba(245, 158, 11, 0.1);
    color: var(--feshar-warning);
    border-left-color: var(--feshar-warning);
}


@media (max-width: 768px) {
    .feshar-container {
        padding: 1rem;
        margin: 1rem;
    }
    
    .feshar-step h3 {
        font-size: 1.5rem;
    }
    
    .feshar-upload-area {
        padding: 0.5rem 1rem;
    }
    
    .feshar-options {
        grid-template-columns: 1fr;
    }
    
    .feshar-option label {
        flex-direction: column;
        text-align: center;
        gap: 0.5rem;
        padding: 0.75rem;
    }
    
    .feshar-step-actions {
        flex-direction: column;
        align-items: center;
    }
    
    .feshar-btn {
        width: 100%;
        max-width: 300px;
    }
    
    .feshar-results-cards {
        gap: 0.75rem;
    }
    
    .feshar-result-card {
        padding: 0.75rem;
    }
    
    .feshar-card-info {
        grid-template-columns: 1fr 1fr;
    }
    
    .feshar-card-actions {
        justify-content: center;
    }
    
    .feshar-recommended-badge {
        font-size: 0.65rem;
        padding: 0.2rem 0.4rem;
        margin-right: 0.25rem;
    }
    
    .feshar-recommended-badge::after {
        max-width: 320px;
        font-size: 0.75rem;
        padding: 0.5rem 0.75rem;
        bottom: 130%;
    }
}

@media (max-width: 480px) {
    .feshar-file-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .feshar-file-status {
        width: 100%;
        justify-content: space-between;
    }
    
    .feshar-card-info {
        grid-template-columns: 1fr;
    }
    
    .feshar-card-header {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 0.375rem;
    }
    
    .feshar-card-actions {
        justify-content: stretch;
    }
    
    .feshar-card-actions .feshar-btn {
        flex: 1;
        min-width: 0;
    }
    
    .feshar-recommended-badge {
        font-size: 0.6rem;
        padding: 0.15rem 0.3rem;
        margin-right: 0.2rem;
        border-radius: 8px;
    }
    
    .feshar-recommended-badge::after {
        max-width: 260px;
        font-size: 0.7rem;
        padding: 0.4rem 0.6rem;
        bottom: 140%;
        right: 0;
        transform: none;
    }
    
    .feshar-recommended-badge::before {
        right: 20px;
        transform: none;
    }
}


.feshar-loading {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 3px solid var(--feshar-gray-200);
    border-radius: 50%;
    border-top-color: var(--feshar-primary);
    animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}


.feshar-container *:focus {
    outline: 2px solid var(--feshar-primary);
    outline-offset: 2px;
}

.feshar-btn:focus {
    outline: 2px solid var(--feshar-primary);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.2);
}


.feshar-btn-light {
    background: var(--feshar-gray-100);
    color: var(--feshar-gray-800) !important;
    border: 1px solid var(--feshar-gray-300);
    box-shadow: var(--feshar-shadow-sm);
    font-weight: 600;
}

.feshar-btn-light:hover {
    background: var(--feshar-gray-200);
    color: var(--feshar-gray-900) !important;
    border-color: var(--feshar-gray-400);
    transform: translateY(-1px);
    box-shadow: var(--feshar-shadow);
}


.feshar-btn-dark {
    background: var(--feshar-gray-800);
    color: white !important;
    border: 1px solid var(--feshar-gray-700);
    box-shadow: var(--feshar-shadow);
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.feshar-btn-dark:hover {
    background: var(--feshar-gray-900);
    color: white !important;
    border-color: var(--feshar-gray-800);
    transform: translateY(-2px);
    box-shadow: var(--feshar-shadow-lg);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}


@media print {
    .feshar-container {
        box-shadow: none;
        background: white;
    }
    
    .feshar-btn {
        display: none;
    }
    
    .feshar-upload-area {
        display: none;
    }
} 

.feshar-card-actions .feshar-btn {
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
    margin: 0.25rem;
    min-width: 80px;
    text-align: center;
    border: 1px solid transparent;
}

.feshar-card-actions .feshar-btn-primary {
    background: var(--feshar-primary);
    color: white !important;
    border-color: var(--feshar-primary);
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.feshar-card-actions .feshar-btn-primary:hover {
    background: var(--feshar-primary-dark);
    border-color: var(--feshar-primary-dark);
    color: white !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.feshar-card-actions .feshar-btn-secondary {
    background: var(--feshar-secondary);
    color: white !important;
    border-color: var(--feshar-secondary);
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.feshar-card-actions .feshar-btn-secondary:hover {
    background: #BE185D;
    border-color: #BE185D;
    color: white !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.feshar-card-actions .feshar-btn-success {
    background: var(--feshar-success);
    color: white !important;
    border-color: var(--feshar-success);
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.feshar-card-actions .feshar-btn-success:hover {
    background: #059669;
    border-color: #059669;
    color: white !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
} 



.feshar-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.feshar-popup-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(5px);
}

.feshar-popup-content {
    position: relative;
    background: white;
    border-radius: var(--feshar-border-radius-lg);
    box-shadow: var(--feshar-shadow-xl);
    max-width: 500px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    animation: fadeInUp 0.3s ease-out;
}

.feshar-popup-header {
    padding: 1.5rem;
    border-bottom: 1px solid var(--feshar-gray-200);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.feshar-popup-header h3 {
    margin: 0;
    color: var(--feshar-primary);
    font-size: 1.25rem;
    font-weight: 600;
}

.feshar-popup-close {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: var(--feshar-gray-500);
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: var(--feshar-transition);
}

.feshar-popup-close:hover {
    background: var(--feshar-gray-100);
    color: var(--feshar-gray-700);
}

.feshar-popup-body {
    padding: 1.5rem;
}

.feshar-popup-message {
    text-align: center;
    margin-bottom: 1.5rem;
}

.feshar-popup-message p {
    margin: 0.5rem 0;
    color: var(--feshar-gray-700);
    line-height: 1.6;
}

.feshar-popup-message strong {
    color: var(--feshar-primary);
}

.feshar-form-group {
    margin-bottom: 1rem;
}

.feshar-form-group label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 500;
    color: var(--feshar-gray-700);
}

.feshar-form-group input {
    width: 100%;
    padding: 0.75rem;
    border: 2px solid var(--feshar-gray-300);
    border-radius: var(--feshar-border-radius);
    font-size: 1rem;
    transition: var(--feshar-transition);
    box-sizing: border-box;
}

.feshar-form-group input:focus {
    outline: none;
    border-color: var(--feshar-primary);
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.1);
}

.feshar-btn-full {
    width: 100%;
    justify-content: center;
}

.feshar-auth-switch {
    text-align: center;
    margin-top: 1rem;
}

.feshar-auth-switch p {
    color: var(--feshar-gray-600);
    margin: 0;
}

.feshar-auth-switch a {
    color: var(--feshar-primary);
    text-decoration: none;
    font-weight: 500;
}

.feshar-auth-switch a:hover {
    text-decoration: underline;
}

.feshar-success-message {
    padding: 2rem 1rem;
}

.feshar-success-icon {
    width: 60px;
    height: 60px;
    background: var(--feshar-success);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
    color: white;
    font-size: 2rem;
    font-weight: bold;
}

.feshar-success-message p {
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--feshar-gray-800);
}


.feshar-btn.loading {
    position: relative;
    color: transparent;
}

.feshar-btn.loading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 20px;
    height: 20px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}


@media (max-width: 768px) {
    .feshar-popup-content {
        width: 95%;
        margin: 1rem;
    }
    
    .feshar-popup-header {
        padding: 1rem;
    }
    
    .feshar-popup-body {
        padding: 1rem;
    }
}



.feshar-summary-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.5rem;
    margin: 1rem 0;
}

.feshar-summary-card {
    background: white;
    border-radius: var(--feshar-border-radius);
    box-shadow: var(--feshar-shadow);
    padding: 0.75rem;
    transition: var(--feshar-transition);
    border: 1px solid transparent;
    position: relative;
    overflow: hidden;
    min-height: 85px;
}

.feshar-summary-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--feshar-primary), var(--feshar-secondary));
    border-radius: var(--feshar-border-radius-lg) var(--feshar-border-radius-lg) 0 0;
}

.feshar-summary-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--feshar-shadow-lg);
    border-color: var(--feshar-primary);
}

.feshar-summary-card-header {
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem;
}


.feshar-summary-card-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.5rem;
    flex-shrink: 0;
}

.feshar-summary-card-icon i {
    font-size: 18px;
    color: white;
}


.feshar-summary-card-icon i {
    position: relative;
}

.feshar-summary-card-icon i.fas.fa-folder::before {
    content: "📁";
    font-family: 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', monospace !important;
    font-size: 18px;
    display: inline-block;
    text-align: center;
    width: 100%;
    line-height: 1;
}

.feshar-summary-card-icon i.fas.fa-thumbs-up::before {
    content: "✓";
    font-family: 'Segoe UI', 'Arial', sans-serif !important;
    font-size: 22px;
    font-weight: bold;
    display: inline-block;
    text-align: center;
    width: 100%;
    line-height: 1;
}

.feshar-summary-card-icon i.fas.fa-compress::before {
    content: "⚡";
    font-family: 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', monospace !important;
    font-size: 18px;
    display: inline-block;
    text-align: center;
    width: 100%;
    line-height: 1;
}

.feshar-summary-card-icon i.fas.fa-piggy-bank::before {
    content: "💰";
    font-family: 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', monospace !important;
    font-size: 18px;
    display: inline-block;
    text-align: center;
    width: 100%;
    line-height: 1;
}

.feshar-summary-card-icon i.fas.fa-circle-exclamation::before {
    content: "!";
    font-family: 'Segoe UI', 'Arial', sans-serif !important;
    font-size: 22px;
    font-weight: bold;
    display: inline-block;
    text-align: center;
    width: 100%;
    line-height: 1;
}

.feshar-summary-card-icon.success {
    background: linear-gradient(135deg, #10B981, #059669);
}

.feshar-summary-card-icon.warning {
    background: linear-gradient(135deg, #F59E0B, #D97706);
}

.feshar-summary-card-icon.info {
    background: linear-gradient(135deg, #3B82F6, #2563EB);
}

.feshar-summary-card-icon.savings {
    background: linear-gradient(135deg, #EC4899, #DB2777);
}

.feshar-summary-card-title {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--feshar-gray-600);
    margin: 0;
    text-align: right;
}

.feshar-summary-card-value {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--feshar-gray-800);
    margin: 0.25rem 0 0 0;
    line-height: 1.1;
    text-align: right;
}

.feshar-summary-card-subtitle {
    font-size: 0.7rem;
    color: var(--feshar-gray-500);
    margin: 0.1rem 0 0 0;
    text-align: right;
}

.feshar-summary-main {
    background: white;
    border-radius: var(--feshar-border-radius-lg);
    box-shadow: var(--feshar-shadow-lg);
    padding: 2rem;
    margin: 2rem 0;
    border: 2px solid var(--feshar-primary);
    position: relative;
    overflow: hidden;
}

.feshar-summary-main::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: linear-gradient(90deg, var(--feshar-primary), var(--feshar-secondary), var(--feshar-success));
    border-radius: var(--feshar-border-radius-lg) var(--feshar-border-radius-lg) 0 0;
}

.feshar-summary-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--feshar-gray-200);
}

.feshar-summary-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--feshar-primary);
    margin: 0;
    display: flex;
    align-items: center;
}

.feshar-summary-title::before {
    content: '\f080';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    margin-left: 12px;
    font-size: 1.8rem;
}

.feshar-download-all-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--feshar-success);
    color: white !important;
    border: 2px solid var(--feshar-success);
    padding: 12px 24px;
    border-radius: var(--feshar-border-radius);
    font-weight: 600;
    text-decoration: none !important;
    transition: var(--feshar-transition);
    box-shadow: var(--feshar-shadow);
}

.feshar-download-all-btn:hover {
    background: #059669;
    border-color: #059669;
    transform: translateY(-1px);
    box-shadow: var(--feshar-shadow-lg);
    color: white !important;
}

.feshar-download-all-btn::before {
    content: '\f019';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 1.1rem;
}


.feshar-summary-card.highlight {
    background: linear-gradient(135deg, var(--feshar-primary), var(--feshar-secondary));
    color: white;
    border: none;
}

.feshar-summary-card.highlight::before {
    display: none;
}

.feshar-summary-card.highlight .feshar-summary-card-title,
.feshar-summary-card.highlight .feshar-summary-card-value,
.feshar-summary-card.highlight .feshar-summary-card-subtitle {
    color: white;
}

.feshar-summary-card.highlight .feshar-summary-card-icon {
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
}


@media (max-width: 768px) {
    .feshar-summary-cards {
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        gap: 0.4rem;
    }
    
    .feshar-summary-card {
        padding: 0.6rem;
    }
    
    .feshar-summary-card-value {
        font-size: 1.1rem;
    }
    
    .feshar-summary-main {
        padding: 1.5rem;
        margin: 1rem 0;
    }
    
    .feshar-summary-header {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }
    
    .feshar-summary-title {
        text-align: center;
        font-size: 1.3rem;
    }
    
    .feshar-download-all-btn {
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 480px) {
    .feshar-summary-cards {
        grid-template-columns: 1fr 1fr;
        gap: 0.3rem;
    }
    
    .feshar-summary-card {
        padding: 0.5rem;
        min-height: 70px;
    }
    
    .feshar-summary-card-header {
        margin-bottom: 0.3rem;
    }
    
    .feshar-summary-card-icon {
        width: 24px;
        height: 24px;
        font-size: 0.8rem;
        margin-left: 6px;
    }
    
    .feshar-summary-card-value {
        font-size: 1rem;
    }
} 
/* The original selectors and display states remain compatible with existing processing JS. */
.feshaar-studio .feshar-summary-title:before,.feshaar-studio .feshar-summary-main:before,.feshaar-studio .feshar-result-card:before{display:none}.feshaar-studio .fs-format-hint{background:#ebeff7;border:1px solid #e9e8d5;border-radius:9px;padding:10px 12px;font-size:10px;color:#7d7949;margin-bottom:12px}.feshaar-studio .fs-format-hint[hidden]{display:none}.feshaar-studio .feshar-option input:disabled+label{opacity:.5;cursor:not-allowed}.feshaar-studio .feshar-btn:before{display:none}
.feshaar-studio #feshar-select-files,.feshaar-studio #feshar-select-files:hover{color:#1d2636!important;text-shadow:none}.feshaar-studio .feshar-btn:disabled{color:#828b9b!important}.feshaar-studio .feshar-btn-outline{color:#374865!important}.feshaar-studio .feshar-btn-primary{color:#fff!important;text-shadow:none}
.feshaar-studio .feshar-btn:disabled,.feshaar-studio .feshar-btn:disabled:hover{background:#f2f4ef!important;color:#828b9b!important}.feshaar-studio .feshar-results-cards{display:grid;grid-template-columns:1fr;gap:12px}.feshaar-studio .feshar-result-card{background:#fcfdf9;border:1px solid #d2dae8;border-radius:12px;padding:16px;box-shadow:none;transform:none;margin:0;min-width:0}.feshaar-studio .feshar-result-card:hover{transform:none;box-shadow:none}.feshaar-studio .feshar-card-filename{font-size:11px;overflow-wrap:anywhere;color:#283956}.feshaar-studio .feshar-card-header{border-bottom:1px solid #dce2ed;padding-bottom:10px;margin-bottom:12px;gap:8px}.feshaar-studio .feshar-card-info{gap:8px;margin-bottom:14px}.feshaar-studio .feshar-card-info-label{font-size:9px;color:#748196}.feshaar-studio .feshar-card-info-value{font-size:12px;font-weight:600;color:#33425d}.feshaar-studio .feshar-card-savings{color:#2e4f87}.feshaar-studio .feshar-card-actions .feshar-btn{width:100%;background:var(--fs-ink);border-color:var(--fs-ink);box-shadow:none;text-shadow:none;font-size:11px;padding:9px}.feshaar-studio .feshar-status.success{background:#d8e3f5;color:#274a85;font-size:9px;border-radius:6px}.feshaar-studio .feshar-summary-main{margin:16px 0;background:#e8eef8;border:1px solid #d2dbea;border-radius:14px;padding:17px;box-shadow:none}.feshaar-studio .feshar-summary-header{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:15px;border:0;padding:0}.feshaar-studio .feshar-summary-title{font-size:15px;margin:0;background:none;-webkit-text-fill-color:#213353;color:#213353}.feshaar-studio .feshar-download-all-btn{font-size:10px;padding:8px 11px;border-radius:8px;background:#2d4165;border:0;box-shadow:none;transform:none;gap:5px}.feshaar-studio .feshar-download-all-btn:hover{background:#1c2e4d;transform:none;box-shadow:none}.feshaar-studio .feshar-download-all-btn:before{font-family:Arial;content:'↓';font-size:15px}.feshaar-studio .feshar-summary-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.feshaar-studio .feshar-summary-card{min-width:0;margin:0;transform:none;background:#fff}.feshaar-studio .feshar-summary-card:before{display:none}.feshaar-studio .feshar-summary-card.highlight{border-color:#94acd4;background:#ecf3ff;transform:none;box-shadow:none}.feshaar-studio .feshar-summary-card:last-child:nth-child(odd){grid-column:1/-1}.feshaar-studio .feshar-summary-card-icon{background:#e3eaf5!important;color:#415e90!important;width:27px;height:27px;border-radius:8px}.feshaar-studio .feshar-summary-card-icon i:before{font-family:Arial!important;font-size:15px!important;font-style:normal}.feshaar-studio .feshar-summary-card-icon i.fa-folder:before{content:'▤'}.feshaar-studio .feshar-summary-card-icon i.fa-thumbs-up:before{content:'✓'}.feshaar-studio .feshar-summary-card-icon i.fa-compress:before{content:'↘'}.feshaar-studio .feshar-summary-card-icon i.fa-piggy-bank:before{content:'−'}.feshaar-studio .feshar-summary-card-icon i.fa-circle-exclamation:before{content:'!'}
.feshaar-studio .feshar-container{background:none;box-shadow:none;border:0;border-radius:0;max-width:none;margin:0;padding:19px 0 0;font-family:inherit;text-align:right;color:var(--fs-ink)}
.feshaar-studio .feshar-container:before{display:none}.feshaar-studio .feshar-container *{font-family:inherit}.feshaar-studio .feshar-step{padding:0;text-align:right;animation:none}.feshaar-studio .feshar-step>h3{font-size:12px;font-weight:600;background:none;color:#596272;-webkit-text-fill-color:currentColor;letter-spacing:0;margin:0 0 14px;text-align:right}
.feshaar-studio .feshar-upload-area{padding:27px 18px 22px;min-height:248px;background:#fafcf6;border:1.5px dashed #b7c2d7;border-radius:16px;box-shadow:none;transition:border-color .15s,background .15s;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;cursor:pointer;text-align:center}.feshaar-studio .feshar-upload-area:hover,.feshaar-studio .feshar-upload-area.dragover,.feshaar-studio .feshar-upload-area.drag-over{background:#e2eaf8;border-color:#405f96;transform:none}.feshaar-studio .feshar-upload-icon{display:grid;place-items:center;width:52px;height:52px;background:#e3eaf5;border:1px solid #d0d9ea;border-radius:15px;margin:0 0 15px;color:#3c5683}.feshaar-studio .feshar-upload-icon svg{width:26px;height:26px;stroke-width:1.7}.feshaar-studio .feshar-upload-text{font-size:12px;font-weight:600;color:#3d4a61;margin:0 0 6px;line-height:1.9}.feshaar-studio .feshar-upload-subtext{font-size:10px;color:#7a8596;margin:0 0 12px}.feshaar-studio .feshar-btn{border-radius:9px;font-size:11px;font-weight:600;padding:11px 17px;line-height:1.7;min-height:40px;border:1px solid transparent;box-shadow:none;transform:none;transition:background .15s,border-color .15s;white-space:normal;display:inline-flex;gap:7px;align-items:center;justify-content:center}.feshaar-studio .feshar-btn-primary{background:var(--fs-ink);color:#fff}.feshaar-studio .feshar-btn-primary:hover:not(:disabled){background:#303e56;box-shadow:none;transform:none}.feshaar-studio #feshar-select-files{background:var(--fs-lime);color:#1d2636;font-size:12px;padding:10px 27px}.feshaar-studio #feshar-select-files:hover{background:#84b0fc}.feshaar-studio .feshar-btn-outline{background:#fff;border-color:#d0d7e3;color:#49566d}.feshaar-studio .feshar-btn-outline:hover{background:#e7ecf5;border-color:#acb7cb;color:#1d2e4b}.feshaar-studio .feshar-btn-secondary{background:#e3e9f3;color:#334565;border-color:#d0d9e9}.feshaar-studio .feshar-btn:disabled,.feshaar-studio .feshar-btn:disabled:hover{background:#f2f4ef;color:#949ba7;border-color:#dfe4ed;opacity:1;cursor:not-allowed;transform:none;box-shadow:none}.feshaar-studio .feshar-step-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0 19px;padding:0}.feshaar-studio .feshar-step-1 .feshar-step-actions{justify-content:flex-end}.feshaar-studio #feshar-next-step{padding-inline:22px}.feshaar-studio #feshar-next-step:not(:disabled){background:var(--fs-ink);border-color:var(--fs-ink);color:#fff}.feshaar-studio .feshar-file-list{margin-top:12px;display:grid;grid-template-columns:1fr;gap:8px}.feshaar-studio .feshar-file-list:empty{display:none}.feshaar-studio .feshar-file-item{background:#fafbf7;border:1px solid #d8dee9;border-radius:10px;padding:10px;box-shadow:none;transform:none;margin:0;gap:10px}.feshaar-studio .feshar-file-item:hover{transform:none;box-shadow:none}.feshaar-studio .feshar-file-name{font-size:10px;font-weight:600;color:#263146;overflow-wrap:anywhere;word-break:break-word}.feshaar-studio .feshar-file-size{font-size:9px;color:#7b8494}.feshaar-studio .feshar-file-preview{width:39px;height:39px;border-radius:7px}.feshaar-studio .feshar-file-remove{background:#f4e9e7;color:#a4564a;border-radius:7px;width:27px;height:27px;border:0;flex-shrink:0}.feshaar-studio .feshar-options{display:grid;grid-template-columns:1fr;gap:12px;margin:15px 0 24px}.feshaar-studio .feshar-option label{min-height:95px;padding:18px;border:1.5px solid #d4dbe7;background:#fbfcf9;border-radius:12px;display:flex;align-items:center;gap:15px;box-shadow:none;transform:none;text-align:right}.feshaar-studio .feshar-option label:hover{border-color:#708ab8;transform:none}.feshaar-studio .feshar-option input:checked+label{border-color:#416096;background:#e6edf9;box-shadow:0 0 0 2px #8aa7d822}.feshaar-studio .feshar-option-icon{width:39px;height:39px;background:#dce3f0;color:#3b5583;border-radius:10px;display:grid;place-items:center;margin:0;flex-shrink:0}.feshaar-studio .feshar-option input:checked+label .feshar-option-icon{background:#c0d2f0;color:#1d3969}.feshaar-studio .feshar-option-content h4{font-size:13px;font-weight:700;color:var(--fs-ink);line-height:1.8;margin:0 0 3px}.feshaar-studio .feshar-option-content p{font-size:10px;color:#6b7688;line-height:1.9;margin:0}.feshaar-studio .feshar-recommended-badge{background:#c8d5ed;color:#2f4a78;border:0;padding:2px 6px;font-size:8px;border-radius:5px;box-shadow:none;animation:none;margin-right:5px;display:inline-block;vertical-align:middle}.feshaar-studio .feshar-progress{background:#f8faf5;border:1px solid #d8dfea;border-radius:12px;padding:18px;margin:15px 0 20px}.feshaar-studio .feshar-progress-bar{background:#dbe1ec;border-radius:99px;height:7px}.feshaar-studio .feshar-progress-fill{background:#436fba;border-radius:99px;transition:width .3s}.feshaar-studio .feshar-progress-text{font-size:11px;color:#475a7b;margin-top:9px}.feshaar-studio .feshar-results{margin:0}.feshaar-studio .feshar-result-item{padding:14px;background:#fcfdf9;border:1px solid #d8dfea;border-radius:12px;margin:0 0 12px;box-shadow:none;transform:none}.feshaar-studio .feshar-result-item:hover{transform:none;box-shadow:none}.feshaar-studio .feshar-result-info{font-size:10px}.feshaar-studio .feshar-result-name{font-size:12px;color:#1c2b44;overflow-wrap:anywhere}.feshaar-studio .feshar-result-stats{font-size:10px;color:#5e6b80}.feshaar-studio .feshar-compression-ratio{background:#d3e0f5;color:#214279;border-radius:6px;font-size:10px}.feshaar-studio .feshar-summary{background:#e9eff9;border:1px solid #d1daeb;border-radius:14px;padding:18px;box-shadow:none;margin-block:20px}.feshaar-studio .feshar-summary h3{font-size:16px;background:none;color:#1a2b48;-webkit-text-fill-color:currentColor}.feshaar-studio .feshar-summary-grid{gap:9px}.feshaar-studio .feshar-summary-card{padding:13px;background:white;border:1px solid #d5dce9;border-radius:10px;box-shadow:none;transform:none}.feshaar-studio .feshar-summary-card:hover{transform:none;box-shadow:none}.feshaar-studio .feshar-summary-card-title{font-size:10px;color:#657083}.feshaar-studio .feshar-summary-card-value{font-size:21px;color:#233555;font-weight:800}.feshaar-studio .feshar-summary-card-subtitle{font-size:9px;color:#798495}.feshaar-studio .feshar-message{font-size:11px;padding:12px 14px;border-radius:9px;box-shadow:none;text-align:right;overflow-wrap:anywhere}.feshaar-studio .feshar-message-error{background:#fcf0ed;color:#963d36;border:1px solid #efd5ce}.feshaar-studio .feshar-message-success{background:#dfe8f7;color:#234073;border:1px solid #c2d0e8}.feshaar-studio .feshar-message-warning{background:#fbf6e8;color:#867037;border:1px solid #eee2c4}.feshaar-studio .feshar-message-info{background:#f0f5ed;color:#415578;border:1px solid #d0d9e7}.feshaar-studio .feshar-highlight{background:none!important;border:none!important;transform:none!important;box-shadow:none!important}.feshaar-studio .feshar-popup-content{background:#fff;border:1px solid #d2dbe9;border-radius:20px;box-shadow:0 20px 80px #111a2a33;font-family:Vazirmatn,Tahoma,sans-serif}.feshaar-studio .feshar-popup-header{background:#e2e9f6;color:#222d40;border-bottom:1px solid #cdd8e9;padding:20px}.feshaar-studio .feshar-popup-header h3{color:#222d40;font-size:18px}.feshaar-studio .feshar-popup-close{color:#55647d}.feshaar-studio .feshar-popup-body{padding:24px}.feshaar-studio .feshar-form-group input{border:1px solid #cad3e2;border-radius:9px;background:#fcfdf9;box-shadow:none;font-size:13px;min-height:46px}.feshaar-studio .feshar-popup-message{background:#ebf0f8;color:#485976;font-size:12px;border:0}.feshaar-studio .feshar-auth-switch a{color:#27467c}.feshaar-studio .feshar-result-item .feshar-btn{font-size:10px;padding:8px 12px}.feshaar-studio .feshar-success-icon{background:#dae5f7;color:#244e96}.feshaar-studio .feshar-btn.loading::after{border-color:#4f8bf2;border-top-color:transparent}.feshaar-studio .feshar-popup-overlay{background:#0d1829cc;backdrop-filter:blur(5px)}
@media(max-width:500px){.feshaar-studio .feshar-container{padding-top:15px}.feshaar-studio .feshar-upload-area{min-height:229px;padding:24px 12px 21px}.feshaar-studio .feshar-upload-text{font-size:11px}.feshaar-studio .feshar-step>h3{font-size:11px;margin-bottom:12px}.feshaar-studio .feshar-option label{padding:14px;gap:12px}.feshaar-studio .feshar-option-content h4{font-size:12px}.feshaar-studio .feshar-option-content p{font-size:9px}.feshaar-studio .feshar-step-actions{margin:13px 0 16px}.feshaar-studio .feshar-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feshaar-studio .feshar-result-item{padding:12px}.feshaar-studio .feshar-result-stats{flex-wrap:wrap;gap:6px}.feshaar-studio .feshar-popup-content{max-width:calc(100% - 28px);width:400px;margin:20px auto;max-height:calc(100dvh - 40px);overflow:auto}.feshaar-studio .feshar-popup-body{padding:20px}}

.feshaar-studio .feshar-container{padding-top:0;--feshar-primary:#1767ff;--feshar-primary-dark:#0850d7;--feshar-secondary:#318bff;--feshar-gray-800:#173462;--feshar-gray-900:#102747}
.feshaar-studio .feshar-step-1>h3{display:none}.feshaar-studio .feshar-step>h3{color:#7187aa;font-size:12px}.feshaar-studio .feshar-upload-area{min-height:250px;padding:24px;background:#f5f9ff;border:2px dashed #b4cef8;border-radius:13px;gap:0}.feshaar-studio .feshar-upload-area:hover,.feshaar-studio .feshar-upload-area.dragover,.feshaar-studio .feshar-upload-area.drag-over{background:#eaf3ff;border-color:#1767ff}.feshaar-studio .feshar-upload-icon{width:57px;height:57px;background:#e2edff;border:1px solid #cbdfff;border-radius:15px;color:#1767ff;margin-bottom:13px}.feshaar-studio .feshar-upload-icon svg{width:29px;height:29px}.feshaar-studio .feshar-upload-text{font-size:14px;color:#3f5f90;font-weight:600}.feshaar-studio .feshar-upload-subtext{font-size:10px;color:#879fc1;margin-bottom:11px}.feshaar-studio #feshar-select-files,.feshaar-studio #feshar-select-files:hover{background:#1767ff;color:#fff!important;font-size:14px;font-weight:600;min-width:235px;min-height:49px;padding:12px 32px;border-radius:9px;box-shadow:0 6px 17px #1767ff24}.feshaar-studio #feshar-select-files:hover{background:#0850d7}.feshaar-studio .feshar-step-1 .feshar-step-actions:has(#feshar-next-step:disabled){display:none}.feshaar-studio .feshar-step-actions{margin:15px 0}.feshaar-studio .feshar-workspace-footer{border-color:#e3edfc}.feshaar-studio .feshar-btn-primary,.feshaar-studio #feshar-next-step:not(:disabled),.feshaar-studio .feshar-card-actions .feshar-btn{background:#1767ff;border-color:#1767ff;color:#fff!important}.feshaar-studio .feshar-btn-primary:hover:not(:disabled),.feshaar-studio .feshar-card-actions .feshar-btn:hover{background:#0850d7;border-color:#0850d7}.feshaar-studio .feshar-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin:15px 0 22px}.feshaar-studio .feshar-option label{min-height:126px;gap:12px;border-color:#d4e3fa;background:#f8fbff;border-radius:11px;align-items:flex-start}.feshaar-studio .feshar-option input:checked+label{background:#edf5ff;border-color:#4386f6;box-shadow:0 0 0 2px #1767ff0d}.feshaar-studio .feshar-option-icon{background:#e6efff;color:#1767ff}.feshaar-studio .feshar-option input:checked+label .feshar-option-icon{background:#dbe9ff;color:#1767ff}.feshaar-studio .feshar-option-content h4{color:#173462;font-size:14px}.feshaar-studio .feshar-option-content p{color:#7890b5;font-size:11px}.feshaar-studio .feshar-recommended-badge{background:#d8e8ff;color:#3175d7}.feshaar-studio .feshar-results-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.feshaar-studio .feshar-summary-cards{grid-template-columns:repeat(4,minmax(0,1fr))}.feshaar-studio .feshar-summary-card:last-child:nth-child(odd){grid-column:auto}.feshaar-studio .feshar-summary-main{background:#eff5ff;border-color:#dbe8fc}.feshaar-studio .feshar-summary-title{color:#234f8f;-webkit-text-fill-color:#234f8f}.feshaar-studio .feshar-summary-card{border-color:#dbe6f7}.feshaar-studio .feshar-summary-card.highlight{background:#e8f1ff;border-color:#a2c5ff}.feshaar-studio .feshar-summary-card-value{color:#1767ff}.feshaar-studio .feshar-summary-card-icon{color:#1767ff!important;background:#e8f1ff!important}.feshaar-studio .feshar-download-all-btn{background:#1767ff}.feshaar-studio .feshar-download-all-btn:hover{background:#0850d7}.feshaar-studio .feshar-result-card{background:#fbfdff;border-color:#dbe7f9}.feshaar-studio .feshar-card-filename{color:#244e89}.feshaar-studio .feshar-card-info-value{color:#1f4d90}.feshaar-studio .feshar-status.success{background:#e3f0ff;color:#286dcb}.feshaar-studio .feshar-message-success{background:#edf5ff;color:#2f68b4;border-color:#d8e8ff}.feshaar-studio .feshar-progress{background:#f4f8ff;border-color:#dce8fb}.feshaar-studio .feshar-progress-fill{background:#1767ff}.feshaar-studio .feshar-file-item{background:#f8fbff;border-color:#dce8fb}.feshaar-studio .feshar-btn-outline{color:#5475a7!important;border-color:#cfdef4}.feshaar-studio .feshar-popup-header{background:#eaf2ff;border-color:#cddfff}.feshaar-studio .feshar-popup-header h3{color:#234c89}.feshaar-studio .feshar-popup-message{background:#f1f6ff;color:#5877a9}.feshaar-studio .feshar-auth-switch a{color:#1767ff}
@media(max-width:780px){.feshaar-studio .feshar-options{grid-template-columns:1fr}.feshaar-studio .feshar-option label{min-height:90px;align-items:center}.feshaar-studio .feshar-summary-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.feshaar-studio .feshar-results-cards{grid-template-columns:1fr}}
@media(max-width:500px){.feshaar-studio .feshar-upload-area{min-height:222px;padding:21px 12px}.feshaar-studio .feshar-upload-text{font-size:11px}.feshaar-studio .feshar-upload-icon{width:48px;height:48px;margin-bottom:12px;border-radius:12px}.feshaar-studio .feshar-upload-icon svg{width:25px;height:25px}.feshaar-studio #feshar-select-files,.feshaar-studio #feshar-select-files:hover{font-size:12px;min-width:220px;min-height:45px;padding:11px 22px;max-width:100%}.feshaar-studio .feshar-option-content h4{font-size:13px}.feshaar-studio .feshar-option-content p{font-size:10px}.feshaar-studio .feshar-option label{padding:15px}.feshaar-studio .feshar-step>h3{font-size:11px}}

.feshaar-studio .feshar-upload-area{min-height:224px;padding:21px}.feshaar-studio .feshar-upload-icon{margin-bottom:10px}@media(max-width:500px){.feshaar-studio .feshar-upload-area{min-height:214px;padding:20px 12px}}
