.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:#f4f4f9;padding:20px}.login-content{display:flex;justify-content:center;align-items:center;width:100%;max-width:1200px}.login-card{background-color:#fff;padding:40px;border-radius:12px;box-shadow:0 6px 20px #0000001a;width:100%;max-width:500px}.login-header{text-align:center;margin-bottom:30px}.login-title{font-size:28px;font-weight:700;color:#1f2937;margin-bottom:10px}.login-description{font-size:16px;color:#4b5563;text-align:center;margin-bottom:30px}.login-form{margin-bottom:20px}.input-group{margin-bottom:15px;position:relative}.input-group label{display:block;font-size:14px;font-weight:500;margin-bottom:5px}.input-group input{width:100%;padding:12px 12px 12px 40px;border:1px solid #d1d5db;border-radius:8px;font-size:14px;box-sizing:border-box}.input-group .input-icon{position:absolute;left:12px;top:70%;transform:translateY(-50%);width:24px;height:24px;color:#6b7280}.login-button{width:100%;padding:14px;font-size:18px;font-weight:600;background-color:#121d30;color:#fff;border:none;border-radius:8px;cursor:pointer;margin-top:10px;transition:background-color .3s ease}.login-button:hover{background-color:#374151}.google-button{display:flex;align-items:center;justify-content:center;background-color:#fff;color:#444;font-size:16px;border:1px solid #d1d5db;padding:14px;border-radius:8px;cursor:pointer;transition:background-color .3s ease}.google-button:hover{background-color:#f1f1f1}.google-button .icon{margin-right:10px;font-size:20px}.error-message{color:#d9534f;font-size:14px;margin:5px 0;padding:0;text-align:left}.divider{text-align:center;color:#6b7280;margin:30px 0;position:relative;width:100%}.divider:before,.divider:after{content:"";display:block;height:1px;background-color:#d1d5db;position:absolute;top:50%;width:45%}.divider:before{left:0}.divider:after{right:0}.divider span{background-color:#fff;padding:0 15px;position:relative;z-index:1}@media (max-width: 768px){.login-card{padding:20px;max-width:100%}.login-title{font-size:24px}.login-description{font-size:14px}.input-group{margin-bottom:10px}.input-group label{font-size:12px}.input-group input{font-size:12px;padding:10px 10px 10px 36px}.login-button,.google-button{font-size:16px;padding:12px}.google-button .icon{font-size:18px}}@media (max-width: 480px){.login-title{font-size:20px}.login-description{font-size:12px}.input-group{margin-bottom:8px}.input-group label{font-size:11px}.input-group input{font-size:11px;padding:10px 10px 10px 32px}.login-button,.google-button{font-size:14px;padding:10px}.google-button .icon{font-size:16px}}.hero{text-align:center;padding:4rem 2rem;background:linear-gradient(135deg,#fff,#f7f7f7);color:#333;border-radius:12px;box-shadow:0 10px 20px #0000001a;transition:transform .3s ease,box-shadow .3s ease}.hero:hover{transform:scale(1.02);box-shadow:0 15px 30px #0003}.hero h1{font-size:4rem;margin-bottom:1rem;color:#0073e6;background:linear-gradient(135deg,#0073e6,#4caf50);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:700;text-transform:uppercase;letter-spacing:.05em;animation:fadeInDown 1s ease-in-out}.hero p{font-size:1.5rem;margin:.75rem 0;color:#666;line-height:1.6;max-width:800px;margin-left:auto;margin-right:auto;animation:fadeInUp 1.2s ease-in-out}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.apps-section{padding:3rem;background-color:#f9f9f9;border-radius:12px;box-shadow:0 10px 20px #0000001a;transition:background-color .3s ease}.apps-section h2{margin-bottom:2rem;color:#333;text-align:center;font-size:2.5rem;text-transform:uppercase;letter-spacing:.05em;transition:color .3s ease}.apps-section h2:hover{color:#0073e6}.apps-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.5rem}.app-card{background-color:#fff;padding:1.5rem;border-radius:12px;text-align:center;color:#444;box-shadow:0 4px 8px #0000001a;transition:transform .3s ease,box-shadow .3s ease}.app-card:hover{transform:translateY(-10px);box-shadow:0 8px 16px #00000026}.app-card h3{font-size:1.75rem;margin-bottom:1rem;color:#0073e6;transition:color .3s ease}.app-card p{font-size:1rem;color:#666}.app-card:hover h3{color:#005bb5}.about-section{padding:2rem;background-color:#f9f9f9}.about-section h2{margin-bottom:1.5rem;color:#333;font-weight:700;font-size:1.8rem}.quotes-grid{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}.quote-card{background-color:#fff;padding:1.5rem;border:1px solid #dddddd;border-radius:8px;width:180px;text-align:center;color:#555;box-shadow:0 4px 8px #0000001a;transition:transform .3s ease,box-shadow .3s ease}.quote-card:hover{transform:translateY(-5px);box-shadow:0 6px 12px #00000026}.aplicaciones-container{padding:40px;max-width:1200px;margin:0 auto;background-color:#f9f9f9;color:#333;font-family:Inter,Arial,sans-serif;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:30px}.app-card{background:#fff;padding:25px;border-radius:10px;box-shadow:0 4px 8px #0000001a;transition:transform .3s ease,box-shadow .3s ease;text-align:center;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.app-card:hover{transform:translateY(-5px);box-shadow:0 8px 16px #0003}.app-title{font-size:1.5rem;color:#0073e6;margin-bottom:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em}.app-description{font-size:1rem;color:#555;line-height:1.5;margin-top:10px}.buttons-container{display:flex;justify-content:center;gap:10px;width:100%;margin-top:20px}button{padding:10px 20px;color:#fff;border:none;border-radius:6px;cursor:pointer;transition:background-color .3s ease,transform .3s ease;box-shadow:0 2px 4px #0000001a}.edit-button{background-color:#0073e6}.edit-button:hover{background-color:#005bb5}.delete-button{background-color:#ff4d4d}.delete-button:hover{background-color:#e03e3e}.add-button{background-color:#4caf50}.add-button:hover{background-color:#388e3c}.add-new{background-color:#fff;padding:20px;border-radius:10px;box-shadow:0 4px 8px #0000001a;display:flex;flex-direction:column;align-items:center}.add-new input{width:100%;padding:12px;margin:10px 0;border:1px solid #cccccc;border-radius:4px;transition:border-color .3s ease}.add-new input:focus{border-color:#0073e6}.add-new button{background-color:#00acc1;color:#fff;padding:12px;border-radius:6px}.add-new button:hover{background-color:#00796b}.about-project{padding:40px;max-width:1200px;margin:0 auto;background-color:#f9f9f9;color:#333;font-family:Inter,Arial,sans-serif}.about-project-header{text-align:center;margin-bottom:40px;animation:fadeIn 1s ease-in-out}.about-project-header h1{font-size:2.5rem;color:#0073e6;margin-bottom:10px}.about-project-header p{font-size:1.2rem;color:#555;line-height:1.6}.features{display:flex;justify-content:space-between;gap:20px;margin-bottom:40px}.feature-card{flex:1;background:#fff;padding:20px;border-radius:10px;box-shadow:0 4px 8px #0000001a;transition:transform .3s ease,box-shadow .3s ease;animation:slideInUp 1s ease-in-out}.feature-card h2{font-size:1.5rem;color:#0073e6;margin-bottom:10px}.feature-card p{color:#666;line-height:1.5}.feature-card:hover{transform:translateY(-5px);box-shadow:0 8px 16px #0003}.call-to-action{text-align:center;padding:20px;background-color:#e0f7fa;border-radius:10px;animation:fadeIn 1.5s ease-in-out}.call-to-action h2{font-size:2rem;color:#0073e6;margin-bottom:10px}.call-to-action p{font-size:1.2rem;color:#555;margin-bottom:20px}.cta-button{padding:10px 20px;font-size:1rem;color:#fff;background-color:#0073e6;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s ease,transform .3s ease}.cta-button:hover{background-color:#005bb5;transform:scale(1.05)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.header{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background-color:#fff;box-shadow:0 4px 6px #0000001a;transition:background-color .3s ease,box-shadow .3s ease}.header:hover{background-color:#f0f0f0;box-shadow:0 6px 12px #00000026}.header .logo{flex:1;display:flex;align-items:center}.header .logo img{height:80px;transition:transform .3s ease,box-shadow .3s ease;cursor:pointer}.header .logo img:hover{transform:scale(1.1);box-shadow:0 4px 8px #0003}.header nav{flex:2;display:flex;justify-content:center}.header nav ul{display:flex;gap:1.5rem;list-style:none;padding:0;margin:0}.header nav ul li{display:flex;align-items:center}.header nav ul li a{text-decoration:none;color:#333;font-weight:500;font-size:1.3rem;padding:.5rem;border-radius:5px;transition:color .3s ease,background-color .3s ease,transform .3s ease;cursor:pointer}.header nav ul li a:hover{color:#0073e6;background-color:#e6f7ff;transform:translateY(-2px)}.header .auth-buttons{display:flex;align-items:center;flex:1;justify-content:flex-end}.header .auth-buttons button{margin-left:1rem;padding:.5rem 1.5rem;border-radius:25px;border:none;cursor:pointer;font-weight:500;transition:background-color .3s ease,transform .3s ease,box-shadow .3s ease}.header .auth-buttons .sign-in{background-color:transparent;border:1px solid #0073e6;color:#0073e6}.header .auth-buttons .sign-in:hover{background-color:#0073e6;color:#fff;transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.header .auth-buttons .register{background-color:#4caf50;color:#fff}.header .auth-buttons .register:hover{background-color:#388e3c;transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.header .auth-buttons .logout{background-color:#f44336;color:#fff}.header .auth-buttons .logout:hover{background-color:#d32f2f;transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.auth-buttons .logout{padding:10px 20px;background-color:#f43f5e;color:#fff;border:none;border-radius:5px;cursor:pointer;font-size:16px}.auth-buttons .logout:hover{background-color:#e11d48}footer{margin-top:auto;background-color:#1b263b;color:#fff;padding:30px 0;font-family:Roboto,sans-serif}footer .container{display:flex;justify-content:space-between;align-items:center}footer .space-x-4{display:flex;gap:20px}footer a{transition:color .3s ease;text-decoration:none}footer a:hover{color:#9ca3af}footer svg{margin-left:10px;width:24px;height:24px;fill:currentColor;transition:transform .3s ease;color:#fff}footer a:hover svg{transform:scale(1.2)}footer .text-sm{margin-right:20px;font-size:14px;text-align:center}@media (max-width: 768px){footer .container{flex-direction:column;gap:20px}footer .text-sm{margin-top:20px}}.app-container{display:flex;height:100vh;background-color:#f4f4f4}.sidebar{position:relative;width:250px;background-color:#2f4b8f;color:#fff;padding:20px;display:flex;flex-direction:column;transition:width .3s,background-color .3s}.toggle-button{position:absolute;top:10px;right:10px;background-color:#fff;color:#2f4b8f;border:none;border-radius:50%;width:40px;height:40px;display:flex;justify-content:center;align-items:center;cursor:pointer;box-shadow:0 4px 8px #0003;transition:background-color .3s,color .3s}.toggle-button:hover{background-color:#ddd;color:#2f4b8f}.sidebar-logo{display:flex;justify-content:center;align-items:center;margin-top:25px;margin-bottom:15px}.sidebar-logo img{width:60px;transition:width .3s}.sidebar.collapsed .sidebar-logo img{width:40px}.sidebar-header{display:flex;justify-content:center;align-items:center;width:100%;height:auto;padding:10px 0}.sidebar-logo{width:90px;text-align:center}.sidebar-logo img{max-width:100%;height:auto}.sidebar.collapsed{width:80px;background-color:#1e2a44}.sidebar-logo img{width:60px;margin-bottom:20px}.sidebar-menu{list-style:none;padding:0;margin:0;flex-grow:1}.sidebar-menu li{margin:15px 0}.sidebar-menu li a{color:#fff;text-decoration:none;display:flex;align-items:center;padding:10px 15px;border-radius:6px;transition:background-color .3s,padding-left .3s}.sidebar-menu li a:hover,.sidebar-menu li a.active{background-color:#1a2c5c;padding-left:25px}.menu-icon{width:24px;height:24px;margin-right:15px;transition:filter .3s}.sidebar-menu li a:hover .menu-icon,.sidebar-menu li a.active .menu-icon{filter:brightness(1.2)}.logout-button{background-color:#e74c3c;color:#fff;border:none;padding:10px 20px;font-size:16px;cursor:pointer;border-radius:6px;transition:background-color .3s,transform .3s}.user-table{flex:1;padding:20px;overflow-y:auto;background-color:#fff;border-radius:8px;box-shadow:0 4px 8px #0000001a}.user-table-header{display:flex;justify-content:space-between;margin-bottom:20px}table{width:100%;border-collapse:collapse}table th,table td{padding:12px;text-align:left;border-bottom:1px solid #ddd}table th{background-color:#f4f4f4;color:#333}.status-active{color:#27ae60}.status-inactive{color:#e74c3c}.sidebar-footer{margin-top:auto;display:flex;justify-content:center;align-items:center}.logout-button{display:flex;align-items:center;background-color:#e74c3c;color:#fff;border:none;padding:12px 24px;font-size:16px;cursor:pointer;border-radius:8px;transition:background-color .3s,transform .3s}.logout-button img{width:24px;height:24px;margin-right:10px}.logout-button span{display:block}.logout-button:hover{background-color:#c0392b;transform:scale(1.05)}.user-section{width:100%;height:100%;padding:20px;background-color:#f9f9f9;border-radius:8px;box-shadow:0 4px 12px #0000001a;box-sizing:border-box}.user-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.search-container{position:relative;display:flex;align-items:center}.search-input{padding:10px 15px 10px 40px;border:1px solid #ddd;border-radius:4px 0 0 4px;width:250px;font-size:16px;outline:none;transition:all .3s}.search-input:focus{border-color:#2f4b8f}.search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:20px;height:20px}.search-button{padding:10px 15px;border:none;background-color:#2f4b8f;color:#fff;font-size:16px;cursor:pointer;border-radius:0 4px 4px 0;transition:background-color .3s ease}.search-button:hover{background-color:#243b6d}.add-user-button{background-color:#2f4b8f;color:#fff;border:none;padding:10px 20px;border-radius:6px;display:flex;align-items:center;font-size:14px;cursor:pointer;transition:background-color .3s ease}.add-user-button img{margin-right:8px;width:20px}.add-user-button:hover{background-color:#243b6d}.user-table-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;background-color:#fff;padding:10px;border-radius:8px;box-shadow:0 2px 8px #0000001a}.user-table-header,.user-table-row{display:contents}.user-table-header span,.user-table-row span{padding:12px 10px;font-weight:700;color:#333;border-bottom:2px solid #e0e0e0}.user-table-row span{padding:10px;font-weight:400;color:#555;border-bottom:1px solid #eee;display:flex;align-items:center}.user-table-row .status-active{color:#27ae60;font-weight:700}.user-table-row .status-inactive{color:#e74c3c;font-weight:700}.user-table-row .status-suspended{color:#f39c12}.user-actions img{width:24px;height:24px;margin-left:10px;cursor:pointer;transition:transform .2s}.user-actions img:hover{transform:scale(1.1)}@media screen and (max-width: 768px){.user-table-grid{grid-template-columns:repeat(2,1fr)}}.app-container{display:flex}.apps-management-container{display:flex;height:100vh}.sidebar{width:250px;min-height:100vh}.apps-content{flex-grow:1;padding:20px;overflow-y:auto}.create-account-container{background-color:#fff;border-radius:8px;padding:30px;width:350px;margin:0 auto;box-shadow:0 10px 30px #0000001a;text-align:center;color:#333}.create-account-container h2{font-size:24px;margin-bottom:20px;color:#333}.create-account-container input{display:block;width:100%;padding:10px;margin:10px 0;border-radius:5px;border:1px solid #ddd;font-size:14px;box-sizing:border-box}.create-account-container button{width:100%;padding:10px;background-color:#3b82f6;color:#fff;border:none;border-radius:5px;cursor:pointer;font-size:16px}.create-account-container button:hover{background-color:#2563eb}.create-account-container p{margin-top:15px;color:#71f87c;font-size:14px}.success-message{display:flex;align-items:center;justify-content:center;margin-top:15px;color:#4ade80;font-size:16px}.success-message i{margin-right:10px;font-size:20px}.back-button{width:100%;padding:10px;margin-top:10px;background-color:#f43f5e;color:#fff;border:none;border-radius:5px;cursor:pointer;font-size:16px}.back-button:hover{background-color:#e11d48}.role-management{display:flex;flex-direction:column;font-family:Arial,sans-serif;color:#333;background-color:#f8f9fa;padding:20px}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.search-box{display:flex;align-items:center;background-color:#fff;padding:10px;border-radius:5px;box-shadow:0 2px 4px #0000001a;width:300px}.search-box input{border:none;outline:none;margin-left:10px;font-size:16px;width:100%}.search-icon{color:#2c3e50;font-size:18px}.add-role-btn{background-color:#3498db;color:#fff;border:none;padding:10px 20px;border-radius:5px;font-size:16px;display:flex;align-items:center;cursor:pointer;transition:background .3s}.add-role-btn:hover{background-color:#2980b9}.add-role-btn svg{margin-right:5px}.roles-table{background-color:#fff;padding:20px;border-radius:10px;box-shadow:0 4px 8px #0000001a}.roles-table table{width:100%;border-collapse:collapse}.roles-table th,.roles-table td{padding:15px;text-align:left;border-bottom:1px solid #ECF0F1}.roles-table th{color:#34495e;font-size:16px}.action-btn{padding:5px 10px;border:none;border-radius:3px;font-size:14px;cursor:pointer;display:flex;align-items:center}.edit-btn{background-color:#2ecc71;color:#fff;margin-right:5px;display:flex;align-items:center;gap:5px}.edit-btn:hover{background-color:#27ae60}.delete-btn{background-color:#e74c3c;color:#fff;display:flex;align-items:center;gap:5px}.delete-btn:hover{background-color:#c0392b}.modal-content{background:#fff;padding:20px;border-radius:8px;width:400px;box-shadow:0 4px 8px #0000004d;text-align:center}.modal-content h3{margin-bottom:20px}.form-group{margin-bottom:15px;text-align:left}.form-group label{display:block;font-weight:700;margin-bottom:5px}.form-group input,.form-group textarea{width:100%;padding:8px;font-size:14px;border-radius:4px;border:1px solid #ddd}.submit-btn{background-color:#2ecc71;color:#fff;border:none;padding:10px 20px;border-radius:5px;font-size:16px;cursor:pointer;transition:background .3s;margin-right:10px}.submit-btn:hover{background-color:#27ae60}.cancel-btn{background-color:#e74c3c;color:#fff;border:none;padding:10px 20px;border-radius:5px;font-size:16px;cursor:pointer;transition:background .3s}.cancel-btn:hover{background-color:#c0392b}.no-results{text-align:center;color:#7f8c8d;margin-top:10px;font-size:16px}.role-management-container{display:flex}.role-management-content{flex-grow:1;padding:20px;background-color:#f8f9fa}:root{--background-color: #f7f9fc;--sidebar-blue: #2c3e50;--accent-red: #e74c3c;--accent-yellow: #f1c40f;--text-color: #333;--text-light: #ffffff}.apps-management-container{display:flex;height:100vh;background:var(--background-color)}.apps-content{flex-grow:1;padding:20px}.apps-title{font-size:2rem;font-weight:700;color:var(--text-color);text-align:center;margin-bottom:20px}.apps-search-create{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.apps-search{padding:10px 15px;width:65%;font-size:1rem;border:1px solid #cbd5e0;border-radius:8px;transition:border-color .3s ease,box-shadow .3s ease}.apps-search:focus{border-color:var(--sidebar-blue);outline:none;box-shadow:0 4px 8px #0000001a}.apps-create-button{background-color:var(--sidebar-blue);color:var(--text-light);padding:10px 20px;font-size:1rem;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s ease}.apps-create-button:hover{background-color:#1f2a3a}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:#fff;padding:25px;width:100%;max-width:500px;border-radius:10px;box-shadow:0 6px 20px #00000026;text-align:center}.modal-content h3{font-size:1.5rem;margin-bottom:15px;color:var(--text-color)}.modal-content input{width:100%;padding:10px;margin:10px 0;font-size:1rem;border:1px solid #cbd5e0;border-radius:8px;transition:border-color .3s ease}.modal-content input:focus{border-color:var(--sidebar-blue);outline:none;box-shadow:0 4px 8px #0000001a}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.save-button{background-color:var(--accent-yellow);color:var(--sidebar-blue);padding:10px 20px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:background-color .3s ease}.save-button:hover{background-color:#d4ac0d}.cancel-button{background-color:var(--accent-red);color:var(--text-light);padding:10px 20px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:background-color .3s ease}.cancel-button:hover{background-color:#c0392b}.apps-table{width:100%;border-collapse:collapse;margin-top:20px;border-radius:8px;overflow:hidden;box-shadow:0 4px 8px #0000000d}.apps-table th,.apps-table td{padding:15px;text-align:left;border-bottom:1px solid #edf2f7}.apps-table th{background-color:var(--sidebar-blue);color:var(--text-light);font-weight:700;font-size:1rem;text-transform:uppercase}.apps-table tr:nth-child(2n){background-color:#f9fafb}.apps-table tr:hover{background-color:#e9ecef}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#333;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}
