.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);position:relative;overflow:hidden}.login-page:before{content:"";position:absolute;width:150%;height:150%;background:radial-gradient(circle,rgba(255,255,255,.1) 1px,transparent 1px);background-size:50px 50px;animation:moveBackground 20s linear infinite}@keyframes moveBackground{0%{transform:translate(0)}to{transform:translate(50px,50px)}}.login-card{background:#fff;border-radius:var(--radius-xl);box-shadow:0 25px 70px #00000040;padding:var(--spacing-2xl) var(--spacing-xl);width:100%;max-width:440px;position:relative;z-index:1;animation:slideUp .5s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.login-header{text-align:center;margin-bottom:var(--spacing-2xl)}.login-header h1{font-size:32px;margin-bottom:var(--spacing-sm);color:var(--gray-900);font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.login-header p{color:var(--gray-500);font-size:15px}.login-form{display:flex;flex-direction:column;gap:var(--spacing-lg)}.form-group{display:flex;flex-direction:column;gap:var(--spacing-sm)}.form-group label{font-size:14px;font-weight:600;color:var(--gray-700)}.form-group input{padding:14px 16px;border:2px solid var(--gray-200);border-radius:var(--radius-md);font-size:15px;transition:var(--transition)}.form-group input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px #667eea1a}.error-message{padding:14px 16px;background:var(--danger-light);color:var(--danger);border-radius:var(--radius-md);font-size:14px;border-left:4px solid var(--danger);animation:shake .4s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}.login-form button{margin-top:var(--spacing-md);width:100%;padding:16px;font-size:16px;font-weight:600;border-radius:var(--radius-md);transition:var(--transition)}.login-form button:hover{transform:translateY(-2px);box-shadow:0 12px 24px #667eea4d}.login-form button:active{transform:translateY(0)}@media(max-width:480px){.login-card{padding:var(--spacing-xl) var(--spacing-lg);max-width:90%}.login-header h1{font-size:26px}}.dashboard{max-width:1400px;animation:fadeIn .5s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.page-header{margin-bottom:var(--spacing-2xl)}.page-header h1{font-size:32px;margin-bottom:var(--spacing-sm);color:var(--gray-900);font-weight:700}.page-header p{color:var(--gray-500);font-size:15px}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-lg);margin-bottom:var(--spacing-2xl)}.stat-card{background:#fff;border-radius:var(--radius-lg);padding:var(--spacing-xl);display:flex;align-items:center;gap:var(--spacing-lg);border-left:4px solid;box-shadow:var(--shadow-md);transition:var(--transition);animation:slideIn .5s ease-out;animation-fill-mode:both}.stat-card:nth-child(1){animation-delay:.1s}.stat-card:nth-child(2){animation-delay:.2s}.stat-card:nth-child(3){animation-delay:.3s}.stat-card:nth-child(4){animation-delay:.4s}@keyframes slideIn{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}.stat-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl)}.stat-icon{width:64px;height:64px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;flex-shrink:0}.stat-info{flex:1}.stat-label{font-size:13px;color:var(--gray-500);margin-bottom:var(--spacing-xs);text-transform:uppercase;letter-spacing:.5px;font-weight:600}.stat-value{font-size:32px;font-weight:700;color:var(--gray-900);line-height:1}.dashboard-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(450px,1fr));gap:var(--spacing-lg)}.lang-stats{margin-top:var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-md)}.lang-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md);background:var(--gray-50);border-radius:var(--radius-md);transition:var(--transition)}.lang-item:hover{background:var(--primary-light);transform:translate(4px)}.lang-label{font-size:15px;color:var(--gray-700);font-weight:500}.lang-value{font-size:20px;font-weight:700;color:var(--primary)}.greetings-stats{margin-top:var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-md)}.greeting-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--gray-50);border-radius:var(--radius-md);transition:var(--transition)}.greeting-item:hover{background:var(--info-light);transform:translate(4px)}.greeting-label{font-size:13px;color:var(--gray-500);margin-bottom:2px;text-transform:uppercase;letter-spacing:.3px}.greeting-value{font-size:20px;font-weight:700;color:var(--gray-900)}@media(max-width:768px){.stats-grid,.dashboard-row{grid-template-columns:1fr}.page-header h1{font-size:24px}}.users-page{max-width:1400px;animation:fadeIn .5s ease-in}.search-bar{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background:#fff;border-radius:var(--radius-lg) var(--radius-lg) 0 0;border-bottom:2px solid var(--gray-100)}.search-bar svg{color:var(--gray-400);width:20px;height:20px}.search-bar input{border:none;flex:1;font-size:15px;outline:none;color:var(--gray-700)}.search-bar input::placeholder{color:var(--gray-400)}.table-container{overflow-x:auto;border-radius:0 0 var(--radius-lg) var(--radius-lg);background:#fff}.user-info{display:flex;align-items:center;gap:var(--spacing-md)}.user-avatar{width:40px;height:40px;border-radius:var(--radius-full);background:linear-gradient(135deg,var(--primary),var(--primary-dark));display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:16px;flex-shrink:0}.user-details{display:flex;flex-direction:column;gap:2px}.user-name{font-weight:600;color:var(--gray-900)}.user-username{font-size:13px;color:var(--gray-500)}.actions{display:flex;gap:var(--spacing-sm)}.btn-icon{padding:var(--spacing-sm);border:none;border-radius:var(--radius-md);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition)}.btn-icon svg{width:18px;height:18px}.btn-icon.primary:hover{background:var(--info);color:#fff;transform:scale(1.1)}.btn-icon.danger:hover{background:var(--danger);color:#fff;transform:scale(1.1)}.btn-icon.success:hover{background:var(--success);color:#fff;transform:scale(1.1)}.pagination{display:flex;justify-content:center;align-items:center;gap:var(--spacing-lg);padding:var(--spacing-xl);background:#fff;border-top:2px solid var(--gray-100);border-radius:0 0 var(--radius-lg) var(--radius-lg)}.pagination span{font-size:14px;color:var(--gray-600);font-weight:500}.pagination button{padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-md);border:2px solid var(--primary);background:#fff;color:var(--primary);font-weight:600;transition:var(--transition)}.pagination button:hover:not(:disabled){background:var(--primary);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-md)}.pagination button:disabled{opacity:.4;cursor:not-allowed;border-color:var(--gray-300);color:var(--gray-400)}@media(max-width:768px){.actions{flex-direction:column;gap:var(--spacing-xs)}}.settings-page{padding:20px;max-width:1200px;margin:0 auto}.form-group select{padding:12px;border:1px solid #e0e0e0;border-radius:8px;font-size:14px;font-family:inherit;transition:all .2s;background:#fff;cursor:pointer}.form-group select:focus{outline:none;border-color:#8b5cf6;box-shadow:0 0 0 3px #8b5cf61a}.toggle-group{padding:16px;background:#f9fafb;border-radius:8px;border:1px solid #e5e5e5}.toggle-label{display:flex;justify-content:space-between;align-items:center;cursor:pointer}.toggle-label strong{display:block;font-size:15px;color:#1a1a1a;margin-bottom:4px}.toggle-desc{font-size:13px;color:#666;margin:0}.switch{position:relative;display:inline-block;width:52px;height:28px;flex-shrink:0}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#d1d5db;transition:.3s;border-radius:28px}.slider:before{position:absolute;content:"";height:20px;width:20px;left:4px;bottom:4px;background-color:#fff;transition:.3s;border-radius:50%;box-shadow:0 2px 4px #0003}input:checked+.slider{background-color:#8b5cf6}input:checked+.slider:before{transform:translate(24px)}.info-card{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:24px;border-radius:12px;box-shadow:0 4px 12px #667eea4d}.info-card strong{color:gold}width: 100%; } } .greetings-page{max-width:1100px;animation:fadeIn .5s ease-in}.greetings-tabs{display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-xl);background:#fff;padding:var(--spacing-md);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.tab{display:flex;align-items:center;gap:var(--spacing-sm);padding:12px 24px;background:transparent;border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);font-size:14px;font-weight:600;color:var(--gray-600)}.tab:hover{background:var(--gray-50);color:var(--primary)}.tab.active{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;border-color:var(--primary);box-shadow:0 4px 12px #667eea4d}.tab svg{width:18px;height:18px}.greetings-list{display:flex;flex-direction:column;gap:var(--spacing-lg)}.greeting-card{background:#fff;border-radius:var(--radius-lg);padding:var(--spacing-xl);box-shadow:var(--shadow-md);position:relative;transition:var(--transition);border:2px solid var(--gray-100);animation:slideIn .4s ease-out}.greeting-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl);border-color:var(--gray-200)}.greeting-card.approved{border-left:5px solid var(--success);background:linear-gradient(to right,var(--success-light) 0%,white 5%)}.greeting-card.rejected{border-left:5px solid var(--danger);background:linear-gradient(to right,var(--danger-light) 0%,white 5%)}.greeting-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-md);border-bottom:2px solid var(--gray-100)}.user-badge{display:inline-flex;align-items:center;gap:var(--spacing-sm);font-size:14px;color:var(--gray-700);font-weight:600;padding:6px 12px;background:var(--gray-50);border-radius:var(--radius-full)}.greeting-date{font-size:12px;color:var(--gray-500);font-weight:500}.greeting-content{padding:var(--spacing-lg) 0;margin-bottom:var(--spacing-lg)}.greeting-content p{font-size:15px;line-height:1.8;color:var(--gray-700);white-space:pre-wrap}.greeting-actions{display:flex;gap:var(--spacing-md);padding-top:var(--spacing-md);border-top:2px solid var(--gray-100)}.greeting-actions button{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:12px 20px;border-radius:var(--radius-md);font-weight:600;transition:var(--transition)}.greeting-actions button:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.empty-state{text-align:center;padding:var(--spacing-2xl) var(--spacing-lg);background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.empty-state svg{margin-bottom:var(--spacing-lg);opacity:.2;color:var(--gray-400)}.empty-state p{color:var(--gray-400);font-size:15px;font-weight:500}.section-title{margin:var(--spacing-2xl) 0 var(--spacing-lg);font-size:20px;color:var(--gray-700);font-weight:700;padding-left:var(--spacing-md);border-left:4px solid var(--primary)}@media(max-width:768px){.greetings-tabs{flex-direction:column}.tab{width:100%;justify-content:center}.greeting-actions{flex-direction:column}.greeting-actions button{width:100%}}.bot-info-page{padding:20px;max-width:1200px;margin:0 auto}.form-group input,.form-group textarea{padding:12px;border:1px solid #e0e0e0;border-radius:8px;font-size:14px;font-family:inherit;transition:all .2s}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#8b5cf6;box-shadow:0 0 0 3px #8b5cf61a}.form-group textarea{resize:vertical;min-height:100px}.channels-page{padding:24px;max-width:1200px;margin:0 auto}.add-channel-form{background:#fff;padding:24px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:24px}.add-channel-form h3{margin:0 0 20px;color:#1a202c}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin-bottom:20px}.form-group input[type=text]{padding:10px;border:1px solid #e2e8f0;border-radius:6px;font-size:14px}.form-group input[type=text]:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 3px #007bff1a}.form-group small{margin-top:4px;color:#718096;font-size:12px}.checkbox-label{display:flex;align-items:center;cursor:pointer;margin-top:8px}.checkbox-label input[type=checkbox]{margin-right:8px;width:18px;height:18px;cursor:pointer}.btn-success:hover:not(:disabled){background:#218838}.btn-success:disabled{opacity:.6;cursor:not-allowed}.channels-list{display:grid;gap:16px}.channel-card{background:#fff;padding:20px;border-radius:12px;box-shadow:0 2px 8px #0000001a;display:flex;justify-content:space-between;align-items:center;transition:all .2s}.channel-card:hover{box-shadow:0 4px 12px #00000026}.channel-card.inactive{opacity:.7;background:#f7fafc}.channel-info{flex:1}.channel-title{display:flex;align-items:center;gap:12px;margin-bottom:12px}.channel-title h3{margin:0;font-size:18px;color:#1a202c}.status-badge{padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500}.status-badge.active{background:#d4edda;color:#155724}.status-badge.inactive{background:#f8d7da;color:#721c24}.channel-details{display:flex;flex-direction:column;gap:6px}.channel-details p{margin:0;font-size:14px;color:#4a5568}.channel-details code{background:#edf2f7;padding:2px 6px;border-radius:4px;font-family:monospace;font-size:13px}.channel-actions{display:flex;gap:10px}.btn-toggle,.btn-danger{padding:8px 16px;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s}.btn-toggle{background:#ffc107;color:#000}.btn-toggle:hover:not(:disabled){background:#e0a800}.btn-danger:hover:not(:disabled){background:#c82333}.btn-toggle:disabled,.btn-danger:disabled{opacity:.6;cursor:not-allowed}.no-data{background:#fff;padding:60px 20px;border-radius:12px;text-align:center;box-shadow:0 2px 8px #0000001a}.info-box{background:#fff3cd;border:1px solid #ffeaa7;border-radius:12px;padding:20px;margin-top:24px}.info-box h4{margin:0 0 12px;color:#856404}.info-box ul{margin:0;padding-left:20px;color:#856404}.info-box li{margin-bottom:6px}.prayers-page{padding:20px;max-width:1200px;margin:0 auto}.page-header{margin-bottom:30px}.page-header h1{font-size:28px;color:#1a1a1a;margin-bottom:8px;display:flex;align-items:center;gap:12px}.page-header p{color:#666;font-size:14px}.card{background:#fff;border-radius:12px;padding:24px;margin-bottom:20px;box-shadow:0 2px 8px #0000001a}.setting-header{display:flex;align-items:flex-start;gap:16px;margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid #f0f0f0}.setting-header svg{color:#667eea;flex-shrink:0}.setting-header h3{font-size:20px;margin:0 0 4px;color:#1a1a1a}.setting-header p{margin:0;color:#666;font-size:14px}.prayer-form{display:flex;flex-direction:column;gap:20px}.form-group label{font-weight:600;color:#333;font-size:14px}.form-group input,.form-group textarea{padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;font-family:inherit;transition:border-color .2s}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#667eea}.form-group textarea{resize:vertical;min-height:120px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer}.checkbox-label input[type=checkbox]{width:20px;height:20px;cursor:pointer}.form-actions{display:flex;gap:12px;margin-top:8px}.btn-primary,.btn-secondary{padding:12px 24px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .2s}.btn-primary{background:#667eea;color:#fff}.btn-primary:hover:not(:disabled){background:#5568d3}.btn-secondary{background:#f5f5f5;color:#666}.btn-secondary:hover{background:#e8e8e8}.prayers-list{display:flex;flex-direction:column;gap:16px}.prayer-card{border:2px solid #e0e0e0;border-radius:12px;padding:20px;transition:all .2s}.prayer-card:hover{border-color:#667eea;box-shadow:0 4px 12px #667eea1a}.prayer-card.inactive{opacity:.6;background:#f9f9f9}.prayer-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.prayer-info{display:flex;align-items:center;gap:12px}.prayer-info h4{margin:0;font-size:18px;color:#1a1a1a;display:flex;align-items:center;gap:8px}.order-badge{background:#667eea;color:#fff;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600}.prayer-actions{display:flex;gap:8px}.btn-icon{width:36px;height:36px;border:none;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.btn-edit{background:#e3f2fd;color:#1976d2}.btn-edit:hover{background:#bbdefb}.btn-delete{background:#ffebee;color:#d32f2f}.btn-delete:hover{background:#ffcdd2}.prayer-content{display:flex;flex-direction:column;gap:12px;padding-top:12px;border-top:1px solid #f0f0f0}.prayer-lang{font-size:14px}.prayer-lang strong{color:#666;display:block;margin-bottom:4px}.prayer-lang p{margin:0;color:#333;line-height:1.6}.empty-state{text-align:center;padding:60px 20px;color:#999}.empty-state svg{color:#ccc;margin-bottom:16px}.empty-state p{font-size:16px;font-weight:600;margin:0 0 8px}.empty-state small{font-size:14px;color:#bbb}.icon-success{color:#4caf50}.icon-muted{color:#999}.info-card{background:#f8f9fa;border-radius:12px;padding:20px;border-left:4px solid #667eea}.info-card h4{margin:0 0 16px;color:#333;font-size:16px}.info-card li{margin-bottom:12px;color:#666;line-height:1.6}.info-card li strong{color:#333}.spinner{width:48px;height:48px;border:4px solid #f3f3f3;border-top:4px solid #667eea;border-radius:50%;animation:spin 1s linear infinite}.card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #00000014;margin-bottom:20px}.setting-section{display:flex;flex-direction:column;gap:20px}.setting-header{display:flex;gap:16px;align-items:flex-start;padding-bottom:16px;border-bottom:1px solid #e5e5e5}.setting-header svg{color:#8b5cf6;flex-shrink:0;margin-top:2px}.setting-header h3{font-size:18px;margin:0 0 4px;color:#1a1a1a}.setting-header p{margin:0;font-size:13px;color:#666}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-weight:600;font-size:14px;color:#333}.form-group textarea{padding:12px;border:1px solid #e0e0e0;border-radius:8px;font-size:14px;font-family:inherit;transition:all .2s;resize:vertical;min-height:200px;line-height:1.6}.form-group textarea:focus{outline:none;border-color:#8b5cf6;box-shadow:0 0 0 3px #8b5cf61a}.help-text{font-size:12px;color:#666;margin-top:-4px}.btn-primary{background:#8b5cf6;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:all .2s;align-self:flex-start}.btn-primary:hover{background:#7c3aed;transform:translateY(-1px);box-shadow:0 4px 12px #8b5cf64d}.btn-primary:disabled{background:#d1d5db;cursor:not-allowed;transform:none}.info-card{background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:24px;border-radius:12px;box-shadow:0 4px 12px #10b9814d}.info-card h4{margin:0 0 16px;font-size:18px;display:flex;align-items:center;gap:8px}.info-card ul{margin:0;padding-left:20px}.info-card li{margin-bottom:12px;line-height:1.6}.info-card li:last-child{margin-bottom:0}.info-card strong{color:#fef3c7}.spinner{width:48px;height:48px;border:4px solid #f3f3f3;border-top:4px solid #8b5cf6;border-radius:50%;animation:spin 1s linear infinite}.broadcast-page{padding:20px;max-width:1200px;margin:0 auto}.btn-send{width:100%;font-size:16px;padding:14px}.filters-section{margin:24px 0;padding:20px;background:#f8f9fa;border-radius:8px}.filters-section h4{margin:0 0 16px;color:#333}.filters-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}.stats-card{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.stats-card .setting-header{border-bottom-color:#fff3}.stats-card .setting-header svg,.stats-card .setting-header h3,.stats-card .setting-header p{color:#fff}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:24px 0}.stat-box{background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:20px;display:flex;align-items:center;gap:16px;border:1px solid rgba(255,255,255,.2)}.stat-box.success{background:#4caf5033}.stat-box.danger{background:#f4433633}.stat-box.warning{background:#ffc10733}.stat-icon{color:#ffffffe6;flex-shrink:0}.stat-info{display:flex;flex-direction:column}.stat-label{font-size:13px;opacity:.8;margin-bottom:4px}.stat-value{font-size:28px;font-weight:700}.progress-section{margin:24px 0}.progress-header{display:flex;justify-content:space-between;margin-bottom:8px;font-size:14px;opacity:.9}.progress-bar{height:24px;background:#fff3;border-radius:12px;overflow:hidden;position:relative}.progress-fill{height:100%;background:linear-gradient(90deg,#4caf50,#8bc34a);transition:width .3s ease;display:flex;align-items:center;justify-content:flex-end;padding-right:12px;color:#fff;font-weight:600;font-size:12px}.estimate-section{margin:20px 0;padding:16px;background:#ffffff1a;border-radius:8px;display:flex;flex-direction:column;gap:12px}.estimate-item{display:flex;align-items:center;gap:8px;font-size:14px}.estimate-item svg{opacity:.8}.status-indicator{display:flex;align-items:center;justify-content:center;gap:12px;padding:16px;margin-top:16px;background:#ffffff1a;border-radius:8px}.status-text{font-size:16px;font-weight:600}.status-text.processing{color:gold}.status-text.success,.status-icon-success{color:#4caf50}.spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}select{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;font-family:inherit;background:#fff;cursor:pointer;transition:border-color .2s}select:focus{outline:none;border-color:#667eea}select:disabled{opacity:.6;cursor:not-allowed;background:#f5f5f5}.prayer-defaults{max-width:1000px;margin:0 auto;padding:24px}.prayer-defaults.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px}.spinner{width:40px;height:40px;border:3px solid #e0e0e0;border-top-color:#007bff;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:16px}.page-header{margin-bottom:32px}.page-header h1{font-size:28px;font-weight:600;margin-bottom:8px;color:#1a1a1a}.subtitle{font-size:15px;color:#666}.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-bottom:32px}.setting-card{background:#fff;border:1px solid #e0e0e0;border-radius:12px;padding:20px;transition:all .2s}.setting-card:hover{box-shadow:0 4px 12px #00000014;border-color:#007bff}.setting-label{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:600;margin-bottom:12px;color:#1a1a1a}.setting-label .icon{font-size:20px}.setting-select{width:100%;padding:12px;border:1px solid #d0d0d0;border-radius:8px;font-size:15px;background:#fff;cursor:pointer;transition:all .2s}.setting-select:hover{border-color:#007bff}.setting-select:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 3px #007bff1a}.setting-hint{font-size:13px;color:#666;margin-top:8px;line-height:1.5}.actions{display:flex;justify-content:flex-end;gap:12px;margin-bottom:32px}.btn{padding:12px 24px;border:none;border-radius:8px;font-size:15px;font-weight:500;cursor:pointer;transition:all .2s}.btn-primary{background:#007bff;color:#fff}.btn-primary:hover:not(:disabled){background:#0056b3;box-shadow:0 4px 12px #007bff4d}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.info-box{background:#f8f9fa;border:1px solid #e0e0e0;border-radius:12px;padding:20px}.info-box h3{font-size:16px;font-weight:600;margin-bottom:12px;color:#1a1a1a}.info-box p{font-size:14px;color:#666;line-height:1.6;margin-bottom:8px}.info-box p:last-child{margin-bottom:0}.info-box strong{color:#1a1a1a;font-weight:600}.admins-page{padding:24px;max-width:1400px;margin:0 auto}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.page-header h1{font-size:28px;font-weight:600;color:#1a202c;margin:0}.btn-primary{background:#007bff;color:#fff;padding:10px 20px;border:none;border-radius:8px;font-weight:500;cursor:pointer;transition:background .2s}.btn-primary:hover{background:#0056b3}.add-admin-form{background:#fff;padding:24px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:24px}.add-admin-form h3{margin:0 0 20px;color:#1a202c}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:20px}.form-group label{font-weight:500;margin-bottom:6px;color:#2d3748}.form-group input,.form-group select{padding:10px;border:1px solid #e2e8f0;border-radius:6px;font-size:14px}.permissions-section{margin:20px 0;padding:20px;background:#f7fafc;border-radius:8px}.permissions-section h4{margin:0 0 12px;color:#2d3748}.permissions-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}.permission-item{display:flex;align-items:center;padding:8px 12px;background:#fff;border-radius:6px;cursor:pointer;transition:background .2s}.permission-item:hover{background:#edf2f7}.permission-item input[type=checkbox]{margin-right:8px;width:18px;height:18px;cursor:pointer}.permission-item input[type=checkbox]:disabled{cursor:not-allowed;opacity:.5}.permission-item span{font-size:14px;color:#2d3748}.btn-success{background:#28a745;color:#fff;padding:12px 24px;border:none;border-radius:8px;font-weight:500;cursor:pointer;transition:background .2s}.btn-success:hover{background:#218838}.admins-list{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(350px,1fr))}.admin-card{background:#fff;padding:20px;border-radius:12px;box-shadow:0 2px 8px #0000001a;transition:all .2s}.admin-card:hover{box-shadow:0 4px 12px #00000026}.admin-info{margin-bottom:16px}.admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.admin-header h3{margin:0;font-size:18px;color:#1a202c}.username{font-size:14px;color:#718096;font-weight:400}.role-badge{padding:4px 12px;border-radius:12px;color:#fff;font-size:12px;font-weight:500}.admin-id,.admin-date{margin:4px 0;font-size:14px;color:#4a5568}.admin-actions{display:flex;gap:10px}.btn-edit,.btn-danger{flex:1;padding:8px 16px;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s}.btn-edit{background:#ffc107;color:#000}.btn-edit:hover{background:#e0a800}.btn-danger{background:#dc3545;color:#fff}.btn-danger:hover{background:#c82333}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:#fff;padding:30px;border-radius:12px;max-width:700px;width:90%;max-height:80vh;overflow-y:auto}.modal-content h3{margin:0 0 16px;color:#1a202c}.modal-actions{display:flex;gap:12px;margin-top:20px}.btn-secondary{background:#6c757d;color:#fff;padding:12px 24px;border:none;border-radius:8px;font-weight:500;cursor:pointer;transition:background .2s}.btn-secondary:hover{background:#5a6268}.no-data{background:#fff;padding:60px 20px;border-radius:12px;text-align:center;box-shadow:0 2px 8px #0000001a;grid-column:1 / -1}.no-data p{margin:8px 0;color:#718096}.loading{display:flex;justify-content:center;align-items:center;height:400px;font-size:18px;color:#718096}.locations-page{padding:20px}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.page-header h1{margin:0;color:#2c3e50}.btn-add{background:#28a745;color:#fff;border:none;padding:12px 24px;border-radius:8px;cursor:pointer;font-size:16px;font-weight:600;transition:all .3s}.btn-add:hover{background:#218838;transform:translateY(-2px);box-shadow:0 4px 8px #0003}.locations-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:20px}.location-card{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden;transition:all .3s}.location-card:hover{box-shadow:0 4px 16px #00000026;transform:translateY(-4px)}.location-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:20px}.location-header h3{margin:0;display:flex;align-items:center;gap:10px;font-size:20px}.default-badge{background:#ffc107;color:#000;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:700}.location-body{padding:20px}.location-body p{margin:8px 0;color:#555;line-height:1.6}.manual-times{margin-top:15px;padding:15px;background:#f8f9fa;border-radius:8px;border-left:4px solid #28a745}.manual-times p{margin:0 0 10px;color:#28a745;font-weight:600}.times-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;font-size:14px}.times-grid span{background:#fff;padding:6px 10px;border-radius:4px;color:#333}.location-actions{padding:15px 20px;background:#f8f9fa;display:flex;gap:10px;border-top:1px solid #e9ecef}.btn-calendar{flex:1;background:#17a2b8;color:#fff;border:none;padding:10px;border-radius:6px;cursor:pointer;font-weight:600;transition:all .3s;font-size:14px}.btn-calendar:hover{background:#138496}.btn-edit{flex:1;background:#007bff;color:#fff;border:none;padding:10px;border-radius:6px;cursor:pointer;font-weight:600;transition:all .3s}.btn-edit:hover{background:#0056b3}.btn-delete{flex:1;background:#dc3545;color:#fff;border:none;padding:10px;border-radius:6px;cursor:pointer;font-weight:600;transition:all .3s}.modal-overlay{position:fixed;inset:0;background:#0009;display:flex;justify-content:center;align-items:center;z-index:1000;padding:20px}.modal-content{background:#fff;border-radius:12px;padding:30px;max-width:700px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0000004d}.modal-content h2{margin:0 0 25px;color:#2c3e50;font-size:24px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;color:#555;font-weight:600;font-size:14px}.form-group input[type=text],.form-group input[type=number],.form-group input[type=time]{width:100%;padding:12px;border:2px solid #e1e8ed;border-radius:8px;font-size:14px;transition:all .3s;box-sizing:border-box}.form-group input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}.checkbox-group label{display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:500}.checkbox-group input[type=checkbox]{width:20px;height:20px;cursor:pointer}.manual-times-form{background:#f8f9fa;padding:20px;border-radius:8px;margin-top:15px}.info-text{background:#e3f2fd;color:#1976d2;padding:10px;border-radius:6px;margin-bottom:15px;font-size:13px}.modal-actions{display:flex;gap:15px;margin-top:30px;padding-top:20px;border-top:1px solid #e9ecef}.btn-save{flex:1;background:#28a745;color:#fff;border:none;padding:14px;border-radius:8px;cursor:pointer;font-size:16px;font-weight:600;transition:all .3s}.btn-save:hover{background:#218838}.btn-cancel{flex:1;background:#6c757d;color:#fff;border:none;padding:14px;border-radius:8px;cursor:pointer;font-size:16px;font-weight:600;transition:all .3s}.loading{text-align:center;padding:50px;font-size:18px;color:#666}hr{border:none;border-top:2px solid #e9ecef;margin:25px 0}.monthly-prayer-times-page{padding:24px}.btn-back{background:#6c757d;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;margin-bottom:16px;font-size:14px}.btn-back:hover{background:#5a6268}.date-selector{display:flex;gap:16px;margin-bottom:24px;padding:16px;background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a}.date-selector label{display:flex;align-items:center;gap:8px;font-weight:600}.date-selector select{padding:8px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px}.add-form{margin-bottom:24px}.add-form h3{margin-bottom:16px;color:#333}.form-section{margin-bottom:24px}.form-section h4{margin-bottom:12px;color:#555;font-size:16px;border-bottom:2px solid #e9ecef;padding-bottom:8px}.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:16px}.form-group{display:flex;flex-direction:column}.form-group label{margin-bottom:6px;font-weight:600;color:#555;font-size:14px}.form-group input,.form-group select{padding:10px;border:1px solid #ddd;border-radius:6px;font-size:14px}.form-group input:focus,.form-group select:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 3px #007bff1a}.form-actions{display:flex;gap:12px;margin-top:24px}.btn-primary{padding:12px 24px;background:#28a745;color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:600;font-size:14px}.btn-primary:hover{background:#218838}.btn-cancel{padding:12px 24px;background:#6c757d;color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:600;font-size:14px}.btn-cancel:hover{background:#5a6268}.prayer-times-list h3{margin-bottom:16px;color:#333}.times-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}.time-card{padding:16px}.time-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #e9ecef}.time-header h4{margin:0;color:#333;font-size:16px}.hijri-date{color:#6c757d;font-size:13px;margin-top:4px}.btn-delete{background:#dc3545;color:#fff;border:none;padding:6px 12px;border-radius:6px;cursor:pointer;font-size:16px}.btn-delete:hover{background:#c82333}.timings{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.timing-item{display:flex;justify-content:space-between;align-items:center;padding:8px;background:#f8f9fa;border-radius:6px}.timing-item span{color:#6c757d;font-size:13px}.timing-item strong{color:#333;font-size:15px;font-weight:600}.empty-state{text-align:center;padding:48px;color:#6c757d}.empty-state p{font-size:16px}.loading{text-align:center;padding:48px;color:#6c757d}.layout{display:flex;min-height:100vh;background:var(--gray-50)}.sidebar{width:280px;background:linear-gradient(135deg,#667eea,#764ba2);border-right:none;display:flex;flex-direction:column;position:fixed;height:100vh;left:0;top:0;box-shadow:2px 0 15px #0000001a}.sidebar-header{padding:var(--spacing-xl);border-bottom:1px solid rgba(255,255,255,.15)}.sidebar-header h2{font-size:24px;margin-bottom:4px;color:#fff;font-weight:700;letter-spacing:-.5px}.sidebar-header p{font-size:13px;color:#ffffffb3}.sidebar-nav{flex:1;padding:var(--spacing-lg);overflow-y:auto}.nav-item{display:flex;align-items:center;gap:var(--spacing-md);padding:14px 18px;border-radius:var(--radius-md);color:#ffffffd9;text-decoration:none;transition:var(--transition);margin-bottom:var(--spacing-sm);font-size:15px;font-weight:500;position:relative;overflow:hidden}.nav-item:before{content:"";position:absolute;left:0;top:0;width:4px;height:100%;background:#fff;transform:scaleY(0);transition:var(--transition)}.nav-item:hover{background:#ffffff26;color:#fff;transform:translate(4px)}.nav-item:hover:before{transform:scaleY(1)}.nav-item.active{background:#ffffff40;color:#fff;box-shadow:0 4px 12px #00000026}.nav-item.active:before{transform:scaleY(1)}.nav-item svg{width:20px;height:20px;flex-shrink:0}.logout-btn{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:14px 18px;margin:var(--spacing-lg);border:2px solid rgba(239,68,68,.5);background:#ef444426;color:#fff;border-radius:var(--radius-md);cursor:pointer;font-size:15px;font-weight:600;transition:var(--transition)}.logout-btn:hover{background:var(--danger);border-color:var(--danger);transform:translateY(-2px);box-shadow:0 8px 16px #ef44444d}.logout-btn svg{width:20px;height:20px}.content{flex:1;margin-left:280px;padding:var(--spacing-2xl);background:var(--gray-50);min-height:100vh}@media(max-width:1024px){.sidebar{width:240px}.content{margin-left:240px;padding:var(--spacing-xl)}}@media(max-width:768px){.layout{flex-direction:column}.sidebar{width:100%;height:auto;position:static}.content{margin-left:0;padding:var(--spacing-lg)}}*{margin:0;padding:0;box-sizing:border-box}:root{--primary: #667eea;--primary-dark: #5568d3;--primary-light: #e0e7ff;--success: #10b981;--success-light: #d1fae5;--danger: #ef4444;--danger-light: #fee2e2;--warning: #f59e0b;--warning-light: #fef3c7;--info: #3b82f6;--info-light: #dbeafe;--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-600: #4b5563;--gray-700: #374151;--gray-800: #1f2937;--gray-900: #111827;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 48px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1);--transition: all .2s ease}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--gray-50);color:var(--gray-900);line-height:1.6}#root{min-height:100vh}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2;color:var(--gray-900)}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.25rem}h4{font-size:1.125rem}h5{font-size:1rem}h6{font-size:.875rem}p{line-height:1.6;color:var(--gray-600)}.container{max-width:1400px;margin:0 auto;padding:0 var(--spacing-lg)}.card{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--spacing-lg);margin-bottom:var(--spacing-lg);border:1px solid var(--gray-200);transition:var(--transition)}.card:hover{box-shadow:var(--shadow-md)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:10px 20px;border:none;border-radius:var(--radius-md);font-size:14px;font-weight:500;cursor:pointer;transition:var(--transition);text-decoration:none;white-space:nowrap}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover:not(:disabled){background:#dc2626;transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn-success{background:var(--success);color:#fff}.btn-success:hover:not(:disabled){background:#059669;transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn-warning{background:var(--warning);color:#fff}.btn-warning:hover:not(:disabled){background:#d97706}.btn-icon{padding:var(--spacing-sm);border:none;border-radius:var(--radius-md);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:var(--transition)}.btn-icon.primary{background:var(--info-light);color:var(--info)}.btn-icon.primary:hover{background:var(--info);color:#fff}.btn-icon.danger{background:var(--danger-light);color:var(--danger)}.btn-icon.danger:hover{background:var(--danger);color:#fff}.btn-icon.success{background:var(--success-light);color:var(--success)}.btn-icon.success:hover{background:var(--success);color:#fff}.input,.textarea,.select{width:100%;padding:12px 16px;border:2px solid var(--gray-200);border-radius:var(--radius-md);font-size:14px;transition:var(--transition);font-family:inherit}.input:focus,.textarea:focus,.select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.textarea{min-height:100px;resize:vertical}.form-group{margin-bottom:var(--spacing-lg)}.form-group label{display:block;margin-bottom:var(--spacing-sm);font-size:14px;font-weight:500;color:var(--gray-700)}.table{width:100%;border-collapse:collapse}.table thead{background:var(--gray-50);border-bottom:2px solid var(--gray-200)}.table th{text-align:left;padding:12px 16px;font-weight:600;font-size:13px;color:var(--gray-600);text-transform:uppercase;letter-spacing:.5px}.table td{padding:12px 16px;border-bottom:1px solid var(--gray-100);color:var(--gray-700)}.table tbody tr{transition:var(--transition)}.table tbody tr:hover{background:var(--gray-50)}.table-container{overflow-x:auto;border-radius:var(--radius-lg)}.badge{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:4px 12px;border-radius:var(--radius-full);font-size:12px;font-weight:500;white-space:nowrap}.badge-success{background:var(--success-light);color:var(--success)}.badge-danger{background:var(--danger-light);color:var(--danger)}.badge-warning{background:var(--warning-light);color:var(--warning)}.badge-info{background:var(--info-light);color:var(--info)}.loading{display:flex;justify-content:center;align-items:center;min-height:400px}.spinner{border:3px solid var(--gray-200);border-top-color:var(--primary);border-radius:50%;width:40px;height:40px;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:var(--spacing-2xl) var(--spacing-lg)}.empty-state svg{margin-bottom:var(--spacing-md);opacity:.3}.empty-state p{color:var(--gray-400);font-size:14px}.error-message{padding:12px 16px;background:var(--danger-light);color:var(--danger);border-radius:var(--radius-md);font-size:14px;border-left:4px solid var(--danger)}.success-message{padding:12px 16px;background:var(--success-light);color:var(--success);border-radius:var(--radius-md);font-size:14px;border-left:4px solid var(--success)}.info-message{padding:12px 16px;background:var(--info-light);color:var(--info);border-radius:var(--radius-md);font-size:14px;border-left:4px solid var(--info)}.pagination{display:flex;justify-content:center;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);border-top:1px solid var(--gray-200)}.pagination span{font-size:14px;color:var(--gray-600)}.page-header{margin-bottom:var(--spacing-xl)}.page-header h1{font-size:2rem;margin-bottom:var(--spacing-sm);color:var(--gray-900)}.page-header p{color:var(--gray-500);font-size:14px}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}.mt-xs{margin-top:var(--spacing-xs)}.mt-sm{margin-top:var(--spacing-sm)}.mt-md{margin-top:var(--spacing-md)}.mt-lg{margin-top:var(--spacing-lg)}.mt-xl{margin-top:var(--spacing-xl)}.mb-xs{margin-bottom:var(--spacing-xs)}.mb-sm{margin-bottom:var(--spacing-sm)}.mb-md{margin-bottom:var(--spacing-md)}.mb-lg{margin-bottom:var(--spacing-lg)}.mb-xl{margin-bottom:var(--spacing-xl)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}.gap-lg{gap:var(--spacing-lg)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--gray-100)}::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}@media(max-width:768px){.page-header h1{font-size:1.5rem}.card{padding:var(--spacing-md)}.table th,.table td{padding:8px 12px}}
