body {
            background: #137a8a;
            /* teal background */
            height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            font-family: 'Segoe UI', sans-serif;
        }

        .card{
        border:none;
        border-radius:12px;
        }

        .navbar-brand{
            font-size:20px;
        }

        .table td,
        .table th{
            vertical-align:middle;
        }

        .dataTables_wrapper .dataTables_filter input{
            margin-left:10px;
        }

        .btn{
            border-radius:8px;
        }

        /* CARD */
        .login-card {
            width: 100%;
            max-width: 420px;
            background: #f5f5f5;
            padding: 40px 35px;
            border-radius: 10px;
            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
        }

        /* TITLE */
        .login-title {
            text-align: center;
            font-size: 26px;
            margin-bottom: 25px;
            color: #444;
        }

        /* INPUT */
        .form-control {
            height: 45px;
            border-radius: 3px;
            border: 1px solid #ddd;
        }

        /* LABEL */
        .form-label {
            font-size: 13px;
            color: #555;
        }

        /* BUTTON */
        .btn-login {
            background: #0f6f80;
            color: #fff;
            height: 45px;
            border: none;
            border-radius: 2px;
            font-weight: 500;
        }

        .btn-login:hover {
            background: #0c5c6a;
        }

        /* LINKS */
        .links {
            text-align: center;
            font-size: 13px;
            margin-top: 20px;
        }

        .links a {
            text-decoration: none;
            color: #0f6f80;
        }

        .links a:hover {
            text-decoration: underline;
        }

        /* CHECKBOX */
        .form-check-label {
            font-size: 13px;
            color: #555;
        }