*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;padding:20px}.login-page{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:100vh;padding:20px}.login-marketing-header{text-align:center;color:#fff;margin-bottom:40px;max-width:600px}.login-marketing-header h1{font-size:2.8rem;font-weight:700;margin-bottom:15px}.login-marketing-header p{font-size:1.1rem;opacity:.9;line-height:1.5;margin-bottom:20px}.login-marketing-header .cta-button{background-color:#ff6f61;color:#fff;padding:12px 28px;border-radius:50px;text-decoration:none;font-weight:600;display:inline-block;transition:background-color .3s ease,transform .3s ease}.login-marketing-header .cta-button:hover{background-color:#e65a50;transform:translateY(-2px)}.login-form-container{background-color:#fff;padding:0;border-radius:12px;box-shadow:0 10px 30px #0003;width:100%;max-width:400px;text-align:center;overflow:hidden}.login-header-logo{display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(135deg,#2c3e50,#3498db);color:#fff}.login-car-icon{width:35px;height:35px;margin-right:12px}.login-app-name{font-size:1.8rem;font-weight:600}.login-form-container h2{font-size:1.5rem;color:#333;margin-top:20px;margin-bottom:20px;font-weight:600}.login-form-container form{padding:30px}.login-form-container .form-group{text-align:left;margin-bottom:20px}.login-form-container .form-group label{display:block;margin-bottom:8px;font-weight:500;color:#555;font-size:.9rem}.login-form-container .form-group input{width:100%;padding:12px 15px;border:1px solid #ccc;border-radius:8px;font-size:1rem;background-color:#f7f7f7;transition:all .2s ease-in-out}.login-form-container .form-group input:focus{outline:none;border-color:#3498db;background-color:#fff;box-shadow:0 0 0 3px #3498db33}.login-primary-btn{width:100%;padding:15px;font-size:1.1rem;margin-top:10px}.toggle-options{margin-top:10px;padding:0 30px 30px}.login-toggle-btn{width:100%;padding:15px}.btn.btn-secondary.login-toggle-btn{background:#e9ecef;color:#2c3e50;box-shadow:none}.btn.btn-secondary.login-toggle-btn:hover{background:#dce1e5}.container{max-width:1400px;margin:0 auto;background:#fff;border-radius:20px;box-shadow:0 20px 40px #0000001a;overflow:hidden}.header{background:linear-gradient(135deg,#2c3e50,#3498db);color:#fff;padding:0}.header-content{display:flex;justify-content:space-between;align-items:center;padding:20px}.header-title{display:flex;align-items:center}.header-title h1{font-size:2rem;margin-bottom:0;font-weight:300}.header-title p{opacity:.9;margin-left:10px}.header-actions{display:flex;align-items:center}.header-actions .btn-help{margin-right:10px}#settings-cog-icon{cursor:pointer;padding:10px}#settings-cog-icon svg{stroke:#fff}.tabs{display:flex;overflow-x:auto;background:#f8f9fa;border-bottom:2px solid #e9ecef;-webkit-overflow-scrolling:touch}.tabs::-webkit-scrollbar{height:5px}.tabs::-webkit-scrollbar-thumb{background:#ccc;border-radius:5px}.tabs::-webkit-scrollbar-track{background:#f1f1f1}.tab{flex:0 0 auto;padding:15px 20px;background:none;border:none;cursor:pointer;font-size:14px;font-weight:500;color:#6c757d;transition:all .3s ease;white-space:nowrap}.tab.active,.tab:hover{background:#fff;color:#2c3e50}.tab.active{border-bottom:3px solid #3498db}.tab-content{padding:20px}.dashboard{display:flex;flex-direction:column;gap:40px}.dashboard-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px}.card{background:linear-gradient(135deg,#f8f9fa,#e9ecef);padding:15px;border-radius:10px;border-left:4px solid #3498db;box-shadow:0 5px 15px #0000000d}.card h3{color:#2c3e50;margin-bottom:10px;font-size:.8rem}.card .value{font-size:1.4rem;font-weight:700;color:#3498db}.balance-card{grid-column:1 / -1;text-align:center;background:linear-gradient(135deg,#3498db,#2980b9);color:#fff;margin-top:20px}.balance-card h3{color:#fff}.form-section{background:#f8f9fa;padding:25px;border-radius:15px;margin-bottom:30px}.form-section h3{color:#2c3e50;margin-bottom:20px;font-size:1.4rem}.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-bottom:15px}.form-group{display:flex;flex-direction:column;margin-bottom:15px}.form-group label{margin-bottom:5px;font-weight:500;color:#2c3e50}.form-group input,.form-group select{padding:12px;border:2px solid #e9ecef;border-radius:8px;font-size:16px;transition:border-color .3s ease}.form-group input:focus,.form-group select:focus{outline:none;border-color:#3498db}.table-container{background:#fff;border-radius:15px;box-shadow:0 5px 15px #0000001a}table{width:100%;border-collapse:collapse}th{background:linear-gradient(135deg,#2c3e50,#34495e);color:#fff;padding:15px;text-align:left;font-weight:500}td{padding:12px 15px;border-bottom:1px solid #e9ecef}tr:hover{background:#f8f9fa}.edit-btn,.delete-btn{border:none;padding:8px 12px;border-radius:5px;cursor:pointer;font-size:14px;font-weight:500;color:#fff}.edit-btn{background:#3498db}.edit-btn:hover{background:#2980b9}.delete-btn{background:#e74c3c}.delete-btn:hover{background:#c0392b}.btn{background:linear-gradient(135deg,#3498db,#2980b9);color:#fff;padding:12px 30px;border:none;border-radius:8px;cursor:pointer;font-size:16px;font-weight:500;transition:all .3s ease;box-shadow:0 5px 15px #3498db4d}.btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #3498db66}.btn:disabled{background:#bdc3c7;cursor:not-allowed;transform:none;box-shadow:none}.modal-overlay{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#00000080;justify-content:center;align-items:center}.modal-content{background-color:#fefefe;margin:auto;padding:20px;border:1px solid #888;width:90%;max-width:500px;border-radius:10px;position:relative}.modal-close-btn{color:#aaa;position:absolute;top:10px;right:15px;font-size:28px;font-weight:700;cursor:pointer}.removed-user,.card h3.removed-user,tr.removed-user td{color:#888;font-style:italic}.success-message{background-color:#d4edda;color:#155724;border:1px solid #c3e6cb;padding:15px;border-radius:8px;margin-bottom:20px;text-align:center}@media (max-width: 768px){body{padding:10px}.table-container table,.table-container thead,.table-container tbody,.table-container th,.table-container td,.table-container tr{display:block}.table-container thead tr{position:absolute;top:-9999px;left:-9999px}.table-container tr{border:1px solid #ccc;margin-bottom:15px;border-radius:10px;padding:10px;background:#f9f9f9;box-shadow:0 2px 5px #0000000d}.table-container td{border:none;border-bottom:1px solid #eee;position:relative;padding-left:50%;text-align:right;min-height:30px;display:flex;justify-content:flex-end;align-items:center}.table-container td:before{content:attr(data-label);position:absolute;left:10px;width:45%;padding-right:10px;white-space:nowrap;text-align:left;font-weight:700;color:#333}.table-container td[data-label=Action]{padding-top:15px;padding-bottom:15px}.table-container tr.is-draft{background-color:#fffbe6;border-color:#ffe58f}}@media (max-width: 480px){.header-actions{flex-direction:column;align-items:center}.header-actions .btn-help{margin-right:0;margin-bottom:10px;padding:8px 16px;font-size:14px}#settings-cog-icon{padding:0}}.modal-overlay{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#0009;justify-content:center;align-items:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal-overlay.active{display:flex}.modal-content{background-color:#fefefe;margin:auto;padding:30px;border:none;width:90%;max-width:600px;border-radius:15px;box-shadow:0 10px 30px #0003;position:relative;animation:slide-down .3s ease-out}@keyframes slide-down{0%{transform:translateY(-30px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-close-btn{color:#aaa;position:absolute;top:15px;right:20px;font-size:28px;font-weight:700;cursor:pointer;transition:color .2s ease}.modal-close-btn:hover,.modal-close-btn:focus{color:#333}.settings-section{margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid #e9ecef}.settings-section:last-of-type{border-bottom:none;padding-bottom:0}.settings-section h3,.settings-section h4{color:#2c3e50;margin-bottom:15px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.settings-grid-advanced{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px}.btn-advanced{background:none;border:1px solid #3498db;color:#3498db;padding:8px 12px;border-radius:5px;cursor:pointer;font-size:14px;transition:all .3s ease}.btn-advanced:hover{background:#3498db;color:#fff}.advanced-settings{margin-top:15px;padding:15px;background-color:#f8f9fa;border-radius:8px}.toggle-switch{position:relative;display:inline-block;width:50px;height:28px;margin-right:10px;vertical-align:middle}.toggle-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s;border-radius:28px}.slider:before{position:absolute;content:"";height:20px;width:20px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s;border-radius:50%}input:checked+.slider{background-color:#3498db}input:focus+.slider{box-shadow:0 0 1px #3498db}input:checked+.slider:before{-webkit-transform:translateX(22px);-ms-transform:translateX(22px);transform:translate(22px)}@media (max-width: 768px){.modal-content{padding:20px}.settings-grid,.settings-grid-advanced{grid-template-columns:1fr}.settings-section{margin-bottom:15px;padding-bottom:15px}}.error-boundary{padding:20px;background-color:#fdedec;border:1px solid #e74c3c;border-radius:10px;text-align:center;margin:20px}.error-boundary h2{color:#e74c3c;margin-bottom:10px}.error-boundary p{color:#555}
