.App{text-align:left;max-width:1200px;margin:0 auto;padding:20px}.App-header{background-color:#f5f5f5;padding:20px;border-radius:8px;margin-bottom:20px}.App-header h1{color:#333;margin-bottom:20px;text-align:center}.controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:15px}.view-toggle button{padding:8px 16px;border:2px solid #007bff;background:#fff;color:#007bff;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.view-toggle button.active{background:#007bff;color:#fff}.category-filter select{padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:16px;min-width:250px}.action-buttons{display:flex;gap:10px}.add-btn,.save-btn{padding:10px 16px;border:none;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500}.add-btn{background:#28a745;color:#fff}.add-btn:hover{background:#218838}.save-btn{background:#17a2b8;color:#fff}.save-btn:hover{background:#138496}.duas-list{display:grid;gap:20px}.dua-card{border:1px solid #ddd;border-radius:8px;padding:20px;background:#fff;box-shadow:0 2px 4px #0000001a}.dua-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;border-bottom:1px solid #eee;padding-bottom:10px}.dua-header h3{margin:0;color:#2c5aa0;font-size:18px;flex:1}.dua-actions{display:flex;gap:8px}.dua-header button{background:#007bff;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px}.dua-header button:hover{background:#0056b3}.delete-btn{background:#dc3545!important}.delete-btn:hover{background:#c82333!important}.dua-content p{margin:8px 0;line-height:1.6}.dua-text{background:#f8f9fa;padding:15px;border-radius:4px;margin-top:15px}.dua-text p{margin:10px 0}.edit-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;padding:30px;border-radius:8px;width:90%;max-width:600px;max-height:80vh;overflow-y:auto}.modal-content h2{margin-top:0;color:#333;border-bottom:1px solid #eee;padding-bottom:10px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:5px;font-weight:700;color:#555}.form-group input,.form-group select,.form-group textarea{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;font-family:inherit}.form-group textarea{min-height:80px;resize:vertical}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px;padding-top:20px;border-top:1px solid #eee}.modal-actions button{padding:10px 20px;border:none;border-radius:4px;cursor:pointer;font-size:14px}.modal-actions button:first-child{background:#28a745;color:#fff}.modal-actions button:first-child:hover{background:#218838}.modal-actions button:last-child{background:#6c757d;color:#fff}.modal-actions button:last-child:hover{background:#545b62}.view-toggle{display:flex;gap:10px}.view-toggle button{padding:8px 16px;border:1px solid #ddd;background:#fff;cursor:pointer;border-radius:4px}.view-toggle button.active{background:#007bff;color:#fff;border-color:#007bff}.view-toggle button:hover{background:#f8f9fa}.view-toggle button.active:hover{background:#0056b3}.categories-list{display:flex;flex-direction:column;gap:30px}.category-section{border:2px solid #e9ecef;border-radius:8px;padding:20px;background:#f8f9fa}.category-info h2{margin:0 0 5px;color:#495057;font-size:24px}.category-malayalam{margin:5px 0;font-size:18px;color:#6c757d;font-style:italic}.category-stats{margin:5px 0 0;font-size:14px;color:#868e96}.category-actions{display:flex;gap:10px}.edit-btn{background:#28a745!important;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px}.edit-btn:hover{background:#218838!important}.no-duas{text-align:center;color:#6c757d;font-style:italic;padding:20px}.form-group label input[type=checkbox]{width:auto;margin-right:8px}.modal-content h3{margin:25px 0 15px;padding:10px 0;border-top:2px solid #e9ecef;color:#495057;font-size:18px}.assumed-section{background:#f8f9fa;padding:15px;border-radius:6px;margin:15px 0}.dua-content .assumed-info{background:#e3f2fd;padding:10px;border-radius:4px;margin-top:10px;border-left:4px solid #2196f3}.dua-content .assumed-info p{margin:5px 0;font-size:14px;color:#1565c0}.category-duas-header{margin:15px 0;padding:10px 0;border-bottom:1px solid #dee2e6}.add-dua-buttons{display:flex;gap:10px}.add-dua-btn,.add-existing-btn{background:#17a2b8;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500}.add-dua-btn:hover,.add-existing-btn:hover{background:#138496}.reorder-list{max-height:400px;overflow-y:auto;margin:20px 0}.reorder-item{display:flex;align-items:center;justify-content:space-between;padding:12px;border:1px solid #dee2e6;border-radius:6px;margin-bottom:8px;background:#f8f9fa}.move-btn{background:#6c757d;color:#fff;border:none;padding:6px 10px;border-radius:4px;cursor:pointer;font-size:12px;min-width:35px}.move-btn:hover:not(:disabled){background:#545b62}.move-btn:disabled{background:#adb5bd;cursor:not-allowed}.current-order{background:#e9ecef;padding:15px;border-radius:6px;margin:15px 0}.current-order h4{margin:0 0 8px;color:#495057}.current-order p{margin:0;font-family:monospace;font-size:14px;color:#6c757d;word-break:break-all}.available-duas-list{max-height:400px;overflow-y:auto;margin:20px 0}.available-dua-item{display:flex;justify-content:space-between;align-items:center;padding:15px;border:1px solid #dee2e6;border-radius:6px;margin-bottom:10px;background:#f8f9fa}.dua-info h4{margin:0 0 5px;color:#495057}.dua-info p{margin:0;font-size:14px;color:#6c757d}.import-btn{background:#28a745;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500}.import-btn:hover{background:#218838}.import-method-toggle{display:flex;gap:10px;margin-bottom:20px;border-bottom:1px solid #dee2e6;padding-bottom:15px}.import-method-toggle button{padding:8px 16px;border:2px solid #007bff;background:#fff;color:#007bff;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.import-method-toggle button:hover{background:#f8f9fa}.import-method-toggle button.active{background:#007bff;color:#fff}.import-file-section,.import-manual-section{margin:20px 0}.file-input{width:100%;padding:8px 12px;border:2px dashed #dee2e6;border-radius:6px;background:#f8f9fa;cursor:pointer;transition:all .2s}.file-input:hover{border-color:#007bff;background:#e3f2fd}.help-text{font-size:14px;color:#6c757d;margin-top:8px;font-style:italic}.json-example{background:#f8f9fa;padding:15px;border-radius:6px;margin-top:15px}.json-example h4{margin:0 0 10px;color:#495057;font-size:16px}.json-example pre{background:#fff;padding:12px;border-radius:4px;border:1px solid #dee2e6;font-size:12px;color:#495057;overflow-x:auto;margin:0;font-family:Courier New,monospace}.wordbyword-section{background:#f8f9fa;padding:15px;border-radius:6px;margin:15px 0;border:1px solid #dee2e6}.wordbyword-item{background:#fff;padding:15px;border-radius:6px;margin-bottom:10px;border:1px solid #e9ecef;position:relative}.wordbyword-item .form-group{margin-bottom:10px}.delete-word-btn{background:#dc3545;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:12px;position:absolute;top:10px;right:10px}.delete-word-btn:hover{background:#c82333}.add-word-btn{background:#28a745;color:#fff;border:none;padding:10px 16px;border-radius:4px;cursor:pointer;font-size:14px;margin-top:10px}.wordbyword-display{background:#f8f9fa;padding:15px;border-radius:6px;margin-top:15px;border-left:4px solid #007bff}.wordbyword-display h4{margin:0 0 10px;color:#495057;font-size:16px}.wordbyword-grid{display:grid;gap:8px}.word-pair{display:flex;align-items:center;background:#fff;padding:8px 12px;border-radius:4px;border:1px solid #dee2e6}.arabic-word{font-weight:700;color:#2c5aa0;margin-right:15px;min-width:80px;text-align:right;font-size:16px}.word-meaning{color:#495057;flex:1}.count-info{background:#e3f2fd;padding:10px;border-radius:4px;margin:10px 0;border-left:4px solid #2196f3}.count-info p{margin:3px 0;font-size:14px}.count-info p:first-child{color:#1565c0}.count-info p:nth-child(2){color:#f57c00;font-weight:700}.count-info p:last-child{color:#2e7d32;font-weight:700;font-size:15px}.field-help{display:block;font-size:12px;color:#6c757d;margin-top:4px;font-style:italic}.count-input{width:60px;padding:4px 8px;border:1px solid #dee2e6;border-radius:4px;text-align:center;margin-left:10px}.reorder-item .count-section{display:flex;align-items:center;margin-left:15px}.reorder-item .count-section label{font-size:12px;color:#6c757d;margin-right:5px}.duas-section{background:#f8f9fa;padding:20px;border-radius:8px;margin:20px 0;border:2px solid #dee2e6}.dua-text-section{background:#fff;padding:20px;border-radius:8px;margin-bottom:20px;border:1px solid #e9ecef;position:relative}.dua-text-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:10px;border-bottom:2px solid #e9ecef}.dua-text-header h4{margin:0;color:#495057;font-size:18px}.delete-dua-btn{background:#dc3545;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:12px}.delete-dua-btn:hover{background:#c82333}.add-dua-section{text-align:center;padding:20px;border:2px dashed #dee2e6;border-radius:8px;background:#f8f9fa}.add-dua-text-btn{background:#17a2b8;color:#fff;border:none;padding:12px 24px;border-radius:6px;cursor:pointer;font-size:16px;font-weight:500}.add-dua-text-btn:hover{background:#138496}.wordbyword-list{max-height:300px;overflow-y:auto;margin:15px 0}.wordbyword-item{display:flex;align-items:flex-start;background:#f8f9fa;padding:15px;border-radius:6px;margin-bottom:10px;border:1px solid #dee2e6;position:relative}.word-number{background:#007bff;color:#fff;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;margin-right:15px;flex-shrink:0}.word-inputs .form-group{margin-bottom:0}.arabic-input{text-align:right;font-size:16px;font-weight:700}.word-actions{margin-left:15px}.remove-word-btn{background:#dc3545;color:#fff;border:none;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:16px;font-weight:700;display:flex;align-items:center;justify-content:center}.wordbyword-actions{display:flex;gap:10px;justify-content:center;margin-top:15px;padding-top:15px;border-top:1px solid #dee2e6}.clear-words-btn{background:#ffc107;color:#212529;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px}.no-words{text-align:center;padding:20px;color:#6c757d;font-style:italic;background:#f8f9fa;border-radius:6px;border:1px dashed #dee2e6}.section-help{color:#6c757d;font-size:14px;margin-bottom:15px;font-style:italic}.multiple-duas-display .dua-part{background:#f8f9fa;padding:15px;border-radius:6px;margin-bottom:15px;border-left:4px solid #007bff}.multiple-duas-display .dua-part-header{font-weight:700;color:#495057;margin-bottom:10px;font-size:14px}.multiple-duas-display .dua-part-content p{margin:8px 0}@media (max-width: 768px){.word-inputs{grid-template-columns:1fr;gap:10px}.wordbyword-item{flex-direction:column;align-items:stretch}.word-number{align-self:flex-start;margin-bottom:10px}.word-actions{margin-left:0;margin-top:10px;align-self:flex-end}}.file-actions{display:flex;gap:8px;flex-wrap:wrap}.upload-btn{background:#6f42c1;color:#fff;border:none;padding:10px 16px;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500}.upload-btn:hover{background:#5a32a3}.upload-section{margin:20px 0}.upload-group{margin-bottom:25px;padding:20px;border:1px solid #dee2e6;border-radius:6px;background:#f8f9fa}.upload-group h3{margin:0 0 15px;color:#495057;font-size:18px}.file-input{width:100%;padding:10px;border:2px dashed #ced4da;border-radius:6px;background:#fff;cursor:pointer;font-size:14px}.file-input:hover{border-color:#007bff;background:#f8f9fa}.upload-help{margin:8px 0 0;font-size:14px;color:#6c757d;font-style:italic}.upload-info{background:#e3f2fd;padding:15px;border-radius:6px;margin:20px 0;border-left:4px solid #2196f3}.upload-info h4{margin:0 0 10px;color:#1565c0}.upload-info ul{margin:0;padding-left:20px}.upload-info li{margin-bottom:5px;color:#1565c0;font-size:14px}.count-info{background:#e8f5e8;padding:12px;border-radius:6px;margin:10px 0;border-left:4px solid #28a745}.count-info p{margin:4px 0;font-size:14px}.count-info p:first-child{color:#155724;font-weight:500}.count-info p:nth-child(2){color:#856404;font-weight:500}.count-info p:last-child{color:#0c5460;font-weight:700;font-size:15px}.field-help{display:block;margin-top:5px;font-size:12px;color:#6c757d;font-style:italic;line-height:1.4}.count-help{display:block;margin-top:3px;font-size:11px;color:#6c757d;font-style:italic}.wordbyword-section{background:#f8f9fa;padding:20px;border-radius:8px;margin:20px 0;border:1px solid #dee2e6}.section-help{margin:0 0 15px;font-size:14px;color:#6c757d;font-style:italic}.wordbyword-list{margin-bottom:20px}.wordbyword-item{display:flex;align-items:flex-start;gap:15px;padding:15px;background:#fff;border:1px solid #dee2e6;border-radius:6px;margin-bottom:10px}.word-number{background:#007bff;color:#fff;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0}.word-inputs{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:15px}.word-inputs .form-group{margin:0}.word-inputs .form-group label{font-size:13px;font-weight:500;color:#495057;margin-bottom:5px}.arabic-input{font-family:Arial Unicode MS,Tahoma,sans-serif;font-size:16px;text-align:right;direction:rtl}.word-actions{display:flex;align-items:center}.remove-word-btn{background:#dc3545;color:#fff;border:none;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:18px;font-weight:700;display:flex;align-items:center;justify-content:center;transition:background-color .2s}.remove-word-btn:hover{background:#c82333}.no-words{text-align:center;color:#6c757d;font-style:italic;padding:30px;background:#fff;border:2px dashed #dee2e6;border-radius:6px;margin-bottom:20px}.wordbyword-actions{display:flex;gap:10px;justify-content:center}.add-word-btn{background:#28a745;color:#fff;border:none;padding:10px 20px;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:background-color .2s}.add-word-btn:hover{background:#218838}.clear-words-btn{background:#ffc107;color:#212529;border:none;padding:10px 20px;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:background-color .2s}.clear-words-btn:hover{background:#e0a800}.wordbyword-display{background:#f0f8ff;padding:15px;border-radius:6px;margin-top:15px;border-left:4px solid #007bff}.wordbyword-display h4{margin:0 0 12px;color:#0056b3;font-size:16px}.wordbyword-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}.word-pair{background:#fff;padding:8px 12px;border-radius:4px;border:1px solid #dee2e6;display:flex;flex-direction:column;gap:4px}.arabic-word{font-family:Arial Unicode MS,Tahoma,sans-serif;font-size:16px;font-weight:700;color:#2c5aa0;text-align:right;direction:rtl}.word-meaning{font-size:14px;color:#495057;font-style:italic}.count-control{display:flex;align-items:center;gap:8px;margin-left:15px}.count-control label{font-size:14px;font-weight:500;color:#495057;margin:0}.count-input{width:60px;padding:4px 8px;border:1px solid #ced4da;border-radius:4px;font-size:14px;text-align:center}.count-input:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 2px #007bff40}.reorder-content{display:flex;align-items:center;flex:1;gap:10px}.dua-info{flex:1}.dua-info strong{display:block;margin-bottom:4px}.category-duas-header{margin-bottom:15px;padding:10px;background:#f8f9fa;border-radius:6px;border:1px solid #e9ecef}.add-dua-buttons{display:flex;gap:10px;flex-wrap:wrap}.add-dua-btn,.add-existing-btn{background:#28a745;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500}.add-dua-btn:hover,.add-existing-btn:hover{background:#218838}.add-existing-btn{background:#17a2b8}.add-existing-btn:hover{background:#138496}.reorder-btn{background:#ffc107!important;color:#212529;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500}.reorder-btn:hover{background:#e0a800!important}.reorder-list{max-height:400px;overflow-y:auto;border:1px solid #e9ecef;border-radius:6px;padding:10px}.reorder-item{display:flex;justify-content:space-between;align-items:center;padding:10px;margin-bottom:8px;background:#f8f9fa;border-radius:4px;border:1px solid #e9ecef}.order-number{font-weight:700;margin-right:10px;color:#495057;min-width:30px}.dua-name{color:#212529}.reorder-controls{display:flex;gap:5px}.move-btn{background:#007bff;color:#fff;border:none;padding:5px 10px;border-radius:3px;cursor:pointer;font-size:16px;font-weight:700;min-width:35px}.move-btn:hover:not(:disabled){background:#0056b3}.available-duas-list{max-height:400px;overflow-y:auto;border:1px solid #e9ecef;border-radius:6px;padding:10px}.available-dua-item{display:flex;justify-content:space-between;align-items:center;padding:15px;margin-bottom:10px;background:#f8f9fa;border-radius:6px;border:1px solid #e9ecef}.available-dua-item .dua-info{flex:1}.available-dua-item .dua-info h4{margin:0 0 5px;color:#212529;font-size:16px}.available-dua-item .dua-info p{margin:0;color:#6c757d;font-size:14px}.available-dua-item .add-btn{background:#28a745;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500;margin-left:15px}.available-dua-item .add-btn:hover{background:#218838}.reorder-btn{background:#17a2b8!important;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px;margin-right:10px}.reorder-btn:hover{background:#138496!important}.reorder-modal{max-width:700px}.reorder-list{max-height:400px;overflow-y:auto;border:1px solid #ddd;border-radius:6px;padding:10px;margin:20px 0}.reorder-item{display:flex;justify-content:space-between;align-items:center;padding:12px;margin:8px 0;background:#f8f9fa;border:1px solid #e9ecef;border-radius:6px;transition:all .2s ease}.reorder-item:hover{background:#e9ecef;border-color:#dee2e6}.reorder-content{display:flex;align-items:center;flex:1}.order-number{font-weight:700;color:#495057;margin-right:15px;min-width:30px}.dua-info{display:flex;flex-direction:column}.dua-info strong{color:#2c5aa0;margin-bottom:4px}.dua-info small{color:#6c757d;font-size:12px}.reorder-controls{display:flex;flex-direction:column;gap:4px}.move-btn{background:#007bff;color:#fff;border:none;width:32px;height:32px;border-radius:4px;cursor:pointer;font-size:16px;font-weight:700;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.move-btn:hover:not(:disabled){background:#0056b3;transform:scale(1.1)}.move-btn:disabled{background:#6c757d;cursor:not-allowed;opacity:.5}.up-btn:hover:not(:disabled){background:#28a745}.down-btn:hover:not(:disabled){background:#dc3545}.current-order{background:#e3f2fd;padding:15px;border-radius:6px;margin:20px 0;border-left:4px solid #2196f3}.current-order h4{margin:0 0 8px;color:#1565c0}.current-order p{margin:0;font-family:Courier New,monospace;background:#fff;padding:8px;border-radius:4px;font-size:14px;word-break:break-all}.categories-list{display:grid;gap:30px}.category-section{border:2px solid #e9ecef;border-radius:12px;padding:20px;background:#f8f9fa}.category-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #dee2e6}.category-info h2{margin:0 0 8px;color:#495057;font-size:24px}.category-malayalam{margin:0 0 8px;color:#6c757d;font-size:18px;font-style:italic}.category-stats{margin:0;color:#6c757d;font-size:14px}.category-actions{display:flex;gap:10px;flex-shrink:0}.edit-btn{background:#ffc107;color:#212529;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500}.edit-btn:hover{background:#e0a800}.category-duas{display:grid;gap:15px}.category-duas .dua-card{margin-left:20px;border-left:4px solid #007bff;background:#fff}.no-duas{text-align:center;color:#6c757d;font-style:italic;padding:20px;background:#fff;border-radius:8px;margin-left:20px}