/* Custom styles for user dashboard */
:root{
    --brand:#0d6efd;
    --muted:#6c757d;
    --bg:#f8f9fa;
    --card-bg: #ffffff;
    --glass: rgba(255,255,255,0.6);
    font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
}

body{
    background: linear-gradient(180deg, #f4f7fb 0%, var(--bg) 100%);
    color: #212529;
}

.navbar-brand{font-weight:700}

.card{
    border: none;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(20,30,50,0.06);
}

.table thead th{
    background: linear-gradient(90deg, rgba(13,110,253,0.06), rgba(13,110,253,0.02));
    border-bottom: none;
    font-weight:600;
}

.table tbody tr{
    background: var(--card-bg);
}

.btn-primary{
    background: linear-gradient(90deg,var(--brand), #3a8bff);
    border: none;
}

#callLogTable td, #callLogTable th{vertical-align:middle}

#rowInfo{color:var(--muted); margin-bottom:8px}

#filterFrom, #filterToName{border-radius:8px}

/* Modal tweaks */
.modal-content{
    border: none;
    border-radius: 12px;
}

/* Filters card */
.filters-card{
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(255,255,255,0.9), rgba(250,250,250,0.9));
    box-shadow: 0 6px 20px rgba(15,20,30,0.04);
}
.filter-input{border-radius:8px}

/* Modern table */
.modern-table{
    border-collapse: separate;
    border-spacing: 0 8px;
}
.modern-table thead th{
    background: transparent;
    color: #495057;
}
.modern-table tbody tr{
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(10,20,40,0.04);
}
.modern-table tbody tr td{
    border: none;
}
.modern-table tbody tr:hover{
    transform: translateY(-2px);
    transition: all 0.12s ease-out;
}

/* Badges for status and type */
.badge-status-completed{background:#e6f4ea;color:#1f8a3b}
.badge-status-missed{background:#fff3cd;color:#8a6d00}
.badge-status-rejected{background:#fdecea;color:#a12b2b}
.badge-type-incoming{background:#e8f0ff;color:#0b5fff}
.badge-type-outgoing{background:#fff0f6;color:#d63384}

@media (max-width:767px){
    .modern-table thead{display:none}
    .modern-table tbody tr{display:block;margin-bottom:12px}
    .modern-table tbody tr td{display:flex;justify-content:space-between;padding:8px 12px}
}

/* User list tweaks */
.table-responsive .modern-table td:first-child{font-weight:600}
.btn-outline-primary{border-color:rgba(13,110,253,0.14);color:var(--brand)}
.btn-outline-danger{border-color:rgba(220,53,69,0.12);color:#d63333}

/* Create/Edit user modern tweaks */
.card-header-modern{background:linear-gradient(90deg, rgba(13,110,253,0.04), rgba(13,110,253,0.02));border-bottom:none}
.modern-form .form-control{box-shadow:none;border:1px solid rgba(33,37,41,0.06);}
.modern-form .form-select{box-shadow:none;border:1px solid rgba(33,37,41,0.06);}

/* Two-column create form styles */
.bg-gradient{background:linear-gradient(180deg, rgba(37,99,235,0.95), rgba(56,189,248,0.85));}
.bg-gradient p, .bg-gradient h5{color:rgba(255,255,255,0.95)}
.form-floating > label{left:16px}
.form-floating .form-control, .form-floating .form-select{height:54px;padding:18px 12px}

@media (max-width:767px){
    .bg-gradient{display:none}
}

/* Responsive tweaks */
@media (max-width:767px){
    .row.g-3 .col-md-4, .row.mb-3 .col-md-3{margin-bottom:12px}
}

/* Disabled control visuals */
.btn[disabled],
.btn.disabled,
button[disabled]{
    opacity: 0.6 !important;
    cursor: not-allowed !important;
    pointer-events: none;
}

.form-control[disabled], .form-select[disabled]{
    background-color: #f5f6f7;
    cursor: not-allowed;
}