:root {
   --sb-w: 280px;
   --sb-collapsed: 86px;
   --sb-bg: #fff;
   --sb-border: #e5e7eb;
   --sb-volvo: #000e6d;
   --sb-muted: #6b7280;
   --sb-emite: #096cd6;
 }

 /* Card + tabla más moderna */
 .table-card {
   border: 1px solid rgba(0, 0, 0, .075);
   border-radius: 1rem;
   overflow: hidden;
   box-shadow: 0 .25rem 1rem rgba(0, 0, 0, .04);
 }

 .table-card .card-header {
   background: #fff;
   border-bottom: 1px solid rgba(0, 0, 0, .06);
 }

 .table-modern {
   margin-bottom: 0;
 }

 .table-modern thead th {
   font-weight: 600;
   font-size: .85rem;
   color: #495057;
   background: #f8f9fa;
   border-bottom: 1px solid rgba(0, 0, 0, .08) !important;
   white-space: nowrap;
 }

 .table-modern tbody td {
   vertical-align: middle;
   white-space: nowrap;
 }

 .table-modern tbody tr:hover {
   background: rgba(13, 110, 253, .04);
 }

 /* Acciones como botones */
 .action-btn {
   width: 34px;
   height: 34px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   border-radius: .65rem;
   border: 1px solid rgba(0, 0, 0, .08);
   background: #fff;
   margin: 0 .15rem;
   cursor: pointer;
 }

 .action-btn:hover {
   background: #f8f9fa;
 }

 /* DataTables (Bootstrap 5) - spacing bonito */
 .dataTables_wrapper .dataTables_filter input {
   border-radius: .75rem;
   padding: .45rem .75rem;
 }

 .dataTables_wrapper .dataTables_length select {
   border-radius: .75rem;
   padding: .35rem .75rem;
 }

 .dataTables_wrapper .dataTables_info {
   font-size: .85rem;
   color: #6c757d;
 }

 /* Paginación más “pill” */
 .dataTables_wrapper .pagination .page-link {
   border-radius: .65rem !important;
   margin: 0 .15rem;
 }

 /* Alert con lista limpia */
 .filter-list li {
   margin-bottom: .25rem;
 }

 .show .dropdown-menu {
   display: block !important;
 }

 .btn-volvo {
   background: var(--sb-volvo) !important;
   color: #fff !important;
 }

 .btn-emite {
   background: #096cd6 !important;
   color: #fff !important;
 }

 .dataTables_paginate .current {
   background: var(--sb-volvo) !important;
   color: #fff !important;
 }

 .dataTables_paginate .paginate_button:hover {
   background: var(--sb-emite) !important;
   color: #fff !important;
 }

 .login-register {
   background-color: #17324d;
   min-height: 100vh;
   background-position: center center;
   background-size: cover;
   background-repeat: no-repeat;
   position: relative;
 }

 .login-register-bg-1 {
   background-image: url("../images/volvobg/1.jpg");
 }

 .login-register-bg-2 {
   background-image: url("../images/volvobg/2.jpg");
 }

 .login-register-bg-3 {
   background-image: url("../images/volvobg/3.jpg");
 }

 .login-register-bg-4 {
   background-image: url("../images/volvobg/4.jpg");
 }

 .login-register-bg-5 {
   background-image: url("../images/volvobg/5.jpg");
 }

 .login-register-bg-6 {
   background-image: url("../images/volvobg/6.jpg");
 }

 .login-register-bg-7 {
   background-image: url("../images/volvobg/7.jpg");
 }

 .login-register-bg-8 {
   background-image: url("../images/volvobg/8.jpg");
 }

 .login-register-bg-9 {
   background-image: url("../images/volvobg/9.jpg");
 }

 .login-register-bg-10 {
   background-image: url("../images/volvobg/10.jpg");
 }

 .login-register-bg-11 {
   background-image: url("../images/volvobg/11.jpg");
 }

 .login-register-bg-12 {
   background-image: url("../images/volvobg/12.jpg");
 }

 .login-register-bg-13 {
   background-image: url("../images/volvobg/13.jpg");
 }

 .login-register-bg-14 {
   background-image: url("../images/volvobg/14.jpg");
 }

 .login-register::before {
   content: "";
   position: absolute;
   inset: 0;
   background: rgba(0, 0, 0, 0.18);
 }

 .login-register .login-box {
   position: relative;
   z-index: 1;
   background-color: rgba(255, 255, 255, 0.76);
   border-radius: 8px;
   box-shadow: 0 18px 40px rgba(0, 0, 0, 0.18);
   border: 1px solid rgba(255, 255, 255, 0.35);
 }

 .login-register .card-block {
   padding: 32px 30px 28px;
 }

 .login-brand {
   text-align: center;
   margin-bottom: 24px;
 }

 .login-brand img {
   max-width: 190px;
   height: auto;
 }

 .login-box .form-control {
   min-height: 44px;
 }

 .login-divider {
   position: relative;
   text-align: center;
   margin: 18px 0;
   color: #6c757d;
   font-size: 12px;
   text-transform: uppercase;
   letter-spacing: .08em;
 }

 .login-divider::before {
   content: "";
   position: absolute;
   left: 0;
   right: 0;
   top: 50%;
   height: 1px;
   background: rgba(0, 0, 0, 0.12);
 }

 .login-divider span {
   position: relative;
   z-index: 1;
   padding: 0 12px;
   background: rgba(255, 255, 255, 0.76);
 }

 .btn-microsoft {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   width: 100%;
   min-height: 46px;
   border: none;
   border-radius: 6px;
   background: #003057;
   color: #fff;
   font-weight: 600;
   font-size: 15px;
   transition: background-color .2s ease, box-shadow .2s ease;
 }

 .btn-microsoft:hover,
 .btn-microsoft:focus {
   color: #fff;
   background: #004a80;
   box-shadow: 0 4px 14px rgba(0, 48, 87, .35);
   text-decoration: none;
 }

 /* ── Password checklist ────────────────────────────────────────────────── */
 .pwd-checklist {
   list-style: none;
   padding: 8px 2px 0;
   margin: 0;
   font-size: 12px;
 }

 .pwd-rule {
   color: #9aa5b1;
   padding: 3px 0;
   transition: color 0.18s;
 }

 .pwd-rule .pwd-icon {
   display: inline-block;
   width: 14px;
   font-weight: 700;
   color: #dc3545;
   margin-right: 4px;
 }

 .pwd-rule--ok {
   color: #28a745;
 }

 .pwd-rule--ok .pwd-icon {
   color: #28a745;
 }

 .navbar-brand img {
  width: 180px;
 }

 /* ── Split login layout ─────────────────────────────────────────────────── */
 .signin-split {
   display: flex;
   min-height: 100vh;
 }

 .signin-panel-brand {
   flex: 0 0 42%;
   background: #003057;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   padding: 48px 40px;
   position: relative;
   overflow: hidden;
 }

 .signin-panel-brand::before {
   content: '';
   position: absolute;
   top: -60px;
   left: -60px;
   width: 220px;
   height: 220px;
   border-radius: 50%;
   background: rgba(255, 255, 255, .04);
 }

 .signin-panel-brand::after {
   content: '';
   position: absolute;
   bottom: -80px;
   right: -80px;
   width: 280px;
   height: 280px;
   border-radius: 50%;
   background: rgba(255, 255, 255, .04);
 }

 .signin-brand-logo {
   max-width: 160px;
   margin-bottom: 32px;
   position: relative;
   z-index: 1;
 }

 .signin-brand-tagline {
   color: rgba(255, 255, 255, .7);
   font-size: 14px;
   text-align: center;
   line-height: 1.7;
   max-width: 240px;
   position: relative;
   z-index: 1;
 }

 .signin-brand-tagline strong {
   display: block;
   color: #fff;
   font-size: 20px;
   font-weight: 600;
   margin-bottom: 10px;
 }

 .signin-panel-form {
   flex: 1;
   display: flex;
   align-items: center;
   justify-content: center;
   background: #f5f7fa;
   padding: 48px 32px;
 }

 .signin-card {
   background: #fff;
   border-radius: 12px;
   box-shadow: 0 4px 24px rgba(0, 0, 0, .08);
   padding: 48px 40px;
   width: 100%;
   max-width: 400px;
 }

 .signin-card h2 {
   font-size: 22px;
   font-weight: 700;
   color: #1a2b3c;
   margin: 0 0 6px;
 }

 .signin-card .signin-subtitle {
   font-size: 14px;
   color: #6b7280;
   margin: 0 0 32px;
 }

 .signin-divider {
   position: relative;
   text-align: center;
   margin: 24px 0;
   color: #9ca3af;
   font-size: 13px;
 }

 .signin-divider::before {
   content: '';
   position: absolute;
   left: 0;
   right: 0;
   top: 50%;
   height: 1px;
   background: #e5e7eb;
 }

 .signin-divider span {
   position: relative;
   z-index: 1;
   padding: 0 12px;
   background: #fff;
 }

 .btn-signin-submit {
   display: block;
   width: 100%;
   padding: 13px 20px;
   background: #003057;
   border: none;
   border-radius: 8px;
   font-size: 15px;
   font-weight: 600;
   color: #fff;
   cursor: pointer;
   transition: background .2s, box-shadow .2s;
   margin-top: 8px;
 }

 .btn-signin-submit:hover {
   background: #004a80;
   box-shadow: 0 4px 14px rgba(0, 48, 87, .25);
 }

 .btn-signin-secondary {
   display: block;
   width: 100%;
   padding: 13px 20px;
   background: transparent;
   border: 1.5px solid #e5e7eb;
   border-radius: 8px;
   font-size: 14px;
   color: #6b7280;
   text-align: center;
   text-decoration: none;
   transition: color .2s, border-color .2s;
 }

 .btn-signin-secondary:hover {
   color: #003057;
   border-color: #003057;
   text-decoration: none;
 }

 .signin-forgot {
   display: block;
   text-align: right;
   font-size: 12px;
   color: #6b7280;
   text-decoration: none;
   margin-top: 6px;
 }

 .signin-forgot:hover {
   color: #003057;
   text-decoration: underline;
 }

 .password-toggle-field {
   position: relative;
 }

 .password-toggle-field .form-control {
   padding-right: 44px;
 }

 .password-toggle-btn {
   position: absolute;
   top: 50%;
   right: 10px;
   width: 32px;
   height: 32px;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 0;
   border: 0;
   background: transparent;
   color: #6b7280;
   cursor: pointer;
   transform: translateY(-50%);
 }

 .password-toggle-btn:hover,
 .password-toggle-btn:focus {
   color: #003057;
   outline: none;
 }

 .password-toggle-btn i {
   font-size: 20px;
   line-height: 1;
 }

 @media (max-width: 768px) {
   .signin-panel-brand { display: none; }
   .signin-panel-form { background: #fff; padding: 24px 16px; }
   .signin-card { box-shadow: none; padding: 32px 20px; }
 }