:root{

    --primary:#2563EB;
    --primary-hover:#1D4ED8;

    --success:#22C55E;
    --warning:#F59E0B;
    --danger:#EF4444;

    --dark:#0F172A;
    --text:#334155;

    --background:#F1F5F9;
    --card:#FFFFFF;

    --border:#E2E8F0;

    --radius:14px;

    --shadow:0 15px 35px rgba(0,0,0,.08);

}

*{

    margin:0;
    padding:0;
    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

body{

    font-family:'Inter',sans-serif;

    background:var(--background);

    color:var(--text);

    font-size:15px;

    min-height:100vh;

}

/* Links */

a{

    text-decoration:none;

}

a:hover{

    text-decoration:none;

}

/* Cards */

.card{

    border:none;

    border-radius:var(--radius);

    box-shadow:var(--shadow);

}

/* Buttons */

.btn{
    border-radius:10px;

    font-weight:600;
    
    transition:.25s;
}

.btn-primary{

    background:var(--primary);

    border:none;

}

.btn-primary:hover{

    background:var(--primary-hover);

}

/* Inputs */

.form-control{

    height:38px;

    border-radius:10px;

    border:1px solid var(--border);

}

.form-control:focus{

    border-color:var(--primary);

    box-shadow:0 0 0 .15rem rgba(37,99,235,.15);

}

.input-group-text{

    background:#fff;

    border:1px solid var(--border);

}

/* Labels */

.form-label{

    font-weight:600;

}

/* Loader */

.page-loader{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    height:100%;

    background:#fff;

    display:flex;

    justify-content:center;

    align-items:center;

    z-index:9999;

}

.page-loader.hide{

    display:none;

}

/* Utilities */

.text-primary{

    color:var(--primary)!important;

}

.bg-primary{

    background:var(--primary)!important;

}

.rounded-xl{

    border-radius:18px;

}

.shadow-soft{

    box-shadow:var(--shadow);

}

.flash-alert{
    transition:opacity .3s ease, transform .3s ease;
}

.flash-alert.fade:not(.show){
    opacity:0;
    transform:translateY(-8px);
}

.subject-cell{

    max-width:280px;
    width:280px;

    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;

    font-weight:500;
}

#ticketTable td:nth-child(2){

    max-width:300px;

    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

#manageTable td:nth-child(3){

    max-width:300px;

    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

#assignmanageTable td:nth-child(2){

    max-width:300px;

    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

#availableTable td:nth-child(3){

    max-width:300px;

    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}