﻿:root {
    --color-fondo: #123524; /* verde oscuro de fondo */
    --color-acento: #f2b632; /* dorado PTS */
    --color-texto: #ffffff;
    --color-texto-sec: #d0d7d5;
    --color-borde-top: #c8a64a; /* línea superior del layout */
    --max-ancho: 1280px;
    --font-base: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

body {
    background-image: url('/BienesRaices/Content/Images/Fondo.png') !important;
    font-family: var(--font-base);
    color: var(--color-texto);
    background-color: var(--color-fondo);
    display: flex;
    flex-direction: column;
}

.body-content {
    flex: 1;
}

/* HERO DE INICIO (PORTADA) */
.hero-pts {
    width: 100%;
    height: 880px;
    background-image: url("/BienesRaices/Content/Images/BienesRaices.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


.app-wrapper {
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

main {
    flex: 1;
}

/* ===========================
   NAVBAR
   =========================== */

.navbar-wrapper {
    display: flex;
    justify-content: center;
    border-bottom: 2px solid var(--color-borde-top);
}

.navbar-pts {
    max-width: var(--max-ancho);
    width: 100%;
    display: flex;
    align-items: center;
    padding: 8px 40px 4px 40px;
    font-size: 0.95rem;
}

.nav-toggle {
    display: none;
    margin-left: auto;
    background: none;
    border: none;
    color: var(--color-texto-sec);
    font-size: 1.6rem;
    cursor: pointer;
}

.nav-main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.navbar-pts .brand {
    margin-right: auto;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-texto-sec);
}

.nav-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 32px;
}

    .nav-menu li a {
        text-decoration: none;
        color: var(--color-texto-sec);
        padding-bottom: 4px;
        border-bottom: 2px solid transparent;
        transition: color 0.2s ease, border-color 0.2s ease;
    }

        .nav-menu li a:hover {
            color: var(--color-texto);
        }

        .nav-menu li a.active {
            color: var(--color-texto);
            border-color: var(--color-acento);
        }

    .nav-menu .dropdown {
        position: relative;
    }

    .nav-menu .dropdown-menu {
        position: absolute;
        display: none;
        background-color: var(--color-fondo);
        padding: 8px 0;
        margin-top: 8px;
        border-radius: 4px;
        min-width: 180px;
        list-style: none;
        box-shadow: 0 8px 18px rgba(0,0,0,0.35);
    }

    .nav-menu .dropdown:hover .dropdown-menu {
        display: block;
    }

    .nav-menu .dropdown-item {
        display: block;
        padding: 6px 18px;
        color: var(--color-texto-sec);
        text-decoration: none;
    }

        .nav-menu .dropdown-item:hover {
            background-color: rgba(255, 255, 255, 0.06);
            color: var(--color-texto);
        }

/* LOGIN NAVBAR */

.login-admin {
    position: relative;
}

    .login-admin .dropdown-menu {
        background-color: var(--color-fondo); /* igual que el menú Cotización */
        padding: 8px 0;
        margin-top: 8px;
        border-radius: 4px;
        min-width: 180px;
        list-style: none;
        box-shadow: 0 8px 18px rgba(0,0,0,0.35);
        border: none;
    }

    .login-admin .dropdown-item {
        color: var(--color-texto-sec);
    }

        .login-admin .dropdown-item:hover {
            background-color: rgba(255, 255, 255, 0.06);
            color: var(--color-texto);
        }




.login-box {
    display: flex;
    align-items: center;
}

.login-inline {
    display: flex;
    align-items: center;
    gap: 18px;
}

.login-user {
    font-size: 0.85rem;
    color: var(--color-texto-sec);
}

.login-link {
    font-size: 0.9rem;
    color: var(--color-texto-sec);
    text-decoration: none;
}

    .login-link:hover {
        color: var(--color-texto);
    }

/* ===========================
   LOGIN GENERAL
   =========================== */

.login-body {
    margin: 0;
    min-height: 100vh;
    background: #f2eee6 !important;
    background-image: none !important;
    color: #263634;
    display: block;
}

/* ===========================================================
   Responsive global refinements
   =========================================================== */
body:not(.login-body) * {
    box-sizing: border-box;
}

body:not(.login-body) img,
body:not(.login-body) iframe,
body:not(.login-body) canvas,
body:not(.login-body) video {
    max-width: 100%;
}

body:not(.login-body) .app-shell,
body:not(.login-body) .content-stage,
body:not(.login-body) .content-panel,
body:not(.login-body) .page-wrapper,
body:not(.login-body) .card-pts,
body:not(.login-body) .card-pts-body {
    min-width: 0;
}

body:not(.login-body) .row {
    min-width: 0;
}

body:not(.login-body) [class^="col-"],
body:not(.login-body) [class*=" col-"] {
    min-width: 0;
}

body:not(.login-body) .form-control,
body:not(.login-body) .form-select,
body:not(.login-body) select,
body:not(.login-body) textarea,
body:not(.login-body) input {
    max-width: 100%;
}

body:not(.login-body) .card-pts .d-flex,
body:not(.login-body) .card-pts .btn-group,
body:not(.login-body) .table-pts td:last-child,
body:not(.login-body) .table-pts .acciones,
body:not(.login-body) .table-pts .text-center > .d-flex {
    flex-wrap: wrap;
    gap: 8px;
}

body:not(.login-body) .table-responsive,
body:not(.login-body) .dataTables_wrapper {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

body:not(.login-body) .modal-dialog {
    max-width: min(960px, calc(100vw - 24px));
    margin-left: auto;
    margin-right: auto;
}

body:not(.login-body) .modal-body {
    max-height: calc(100vh - 180px);
    overflow-y: auto;
}

body:not(.login-body) .modal-body iframe,
body:not(.login-body) .modal-body .mapa,
body:not(.login-body) .modal-body #map,
body:not(.login-body) .card-pts iframe,
body:not(.login-body) .card-pts #map,
body:not(.login-body) .card-pts .mapa {
    width: 100%;
    min-height: 320px;
}

@media (max-width: 1200px) {
    body:not(.login-body) .app-frame {
        grid-template-columns: 260px minmax(0, 1fr);
        margin: 8px;
        border-radius: 24px;
    }

    body:not(.login-body) .topbar {
        grid-template-columns: max-content minmax(220px, 1fr) max-content;
        gap: 16px;
        padding: 0 18px;
    }

    body:not(.login-body) .card-pts-header,
    body:not(.login-body) .card-pts-body {
        padding-left: 24px;
        padding-right: 24px;
    }
}

@media (max-width: 992px) {
    body:not(.login-body) {
        background: #f7f8f6 !important;
    }

    body:not(.login-body) .app-frame {
        display: block;
        min-height: 100vh;
        margin: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        overflow: visible;
    }

    body:not(.login-body) .app-frame::before {
        content: "";
        position: fixed;
        inset: 0;
        z-index: 19;
        background: rgba(17, 24, 39, .42);
        opacity: 0;
        pointer-events: none;
        transition: opacity .2s ease;
    }

    body:not(.login-body) .app-frame.sidebar-open::before {
        opacity: 1;
        pointer-events: auto;
    }

    body:not(.login-body) .app-sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 20;
        width: min(86vw, 320px);
        height: 100vh;
        max-height: 100vh;
        overflow-y: auto;
        transform: translateX(-105%);
        transition: transform .22s ease;
        border-radius: 0;
        box-shadow: 18px 0 42px rgba(17, 24, 39, .24);
    }

    body:not(.login-body) .app-frame.sidebar-open .app-sidebar {
        transform: translateX(0);
    }

    body:not(.login-body) .app-shell {
        display: block;
        min-height: 100vh;
    }

    body:not(.login-body) .topbar {
        position: sticky;
        top: 0;
        z-index: 15;
        min-height: 64px;
        grid-template-columns: 44px minmax(0, 1fr) auto;
        gap: 10px;
        padding: 8px 12px;
        background: #fff;
    }

    body:not(.login-body) .menu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
    }

    body:not(.login-body) .topbar-title {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 24px;
    }

    body:not(.login-body) .topbar-search {
        display: none;
    }

    body:not(.login-body) .topbar-actions {
        justify-self: end;
        gap: 8px;
        flex-wrap: nowrap;
    }

    body:not(.login-body) .theme-toggle {
        width: 42px;
        min-width: 42px;
        padding: 0;
    }

    body:not(.login-body) .theme-toggle-text {
        display: none;
    }

    body:not(.login-body) .topbar-actions .login-user {
        max-width: 44vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        padding: 8px 12px;
    }

    body:not(.login-body) .content-stage {
        padding: 12px;
    }

    body:not(.login-body) .content-panel {
        min-height: calc(100vh - 88px);
        padding: 0;
        border-radius: 0;
        background: transparent;
    }

    body:not(.login-body) .page-wrapper {
        padding: 0;
        display: block;
    }

    body:not(.login-body) .card-pts {
        width: 100% !important;
        max-width: none !important;
        border-radius: 14px;
    }

    body:not(.login-body) .card-pts-header {
        align-items: flex-start;
        flex-direction: column;
        padding: 18px;
        border-radius: 14px 14px 0 0;
    }

    body:not(.login-body) .card-pts-header h2,
    body:not(.login-body) .card-pts-header h3 {
        font-size: 1.35rem;
        line-height: 1.2;
    }

    body:not(.login-body) .card-pts-body {
        padding: 16px;
    }
}

@media (max-width: 768px) {
    body:not(.login-body) .row {
        --bs-gutter-x: .85rem;
        --bs-gutter-y: .85rem;
    }

    body:not(.login-body) .form-horizontal .form-group.row,
    body:not(.login-body) .form-group.row {
        margin-left: 0;
        margin-right: 0;
    }

    body:not(.login-body) .form-horizontal .form-group.row > [class^="col-"],
    body:not(.login-body) .form-horizontal .form-group.row > [class*=" col-"] {
        width: 100%;
        flex: 0 0 100%;
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 12px;
    }

    body:not(.login-body) .card-pts .btn,
    body:not(.login-body) .card-pts .btn-pts,
    body:not(.login-body) .card-pts input[type="submit"],
    body:not(.login-body) .card-pts input[type="button"] {
        min-height: 42px;
        white-space: normal;
    }

    body:not(.login-body) .card-pts .btn-group {
        display: flex;
        width: 100%;
    }

    body:not(.login-body) .card-pts .btn-group > .btn,
    body:not(.login-body) .card-pts .btn-group > .btn-pts {
        flex: 1 1 auto;
    }

    body:not(.login-body) .dataTables_wrapper > .row,
    body:not(.login-body) .dataTables_wrapper > .row:last-child {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        flex-wrap: nowrap !important;
        gap: 12px !important;
    }

    body:not(.login-body) .dataTables_wrapper > .row > [class^="col-"],
    body:not(.login-body) .dataTables_wrapper > .row > [class*=" col-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body:not(.login-body) .dataTables_wrapper .dataTables_paginate,
    body:not(.login-body) .dataTables_wrapper .pagination {
        justify-content: flex-start !important;
        overflow-x: auto;
        flex-wrap: nowrap !important;
        padding-bottom: 4px;
    }

    body:not(.login-body) .dataTables_wrapper .dt-info,
    body:not(.login-body) .dataTables_wrapper .dataTables_info {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    body:not(.login-body) .table-pts,
    body:not(.login-body) .dashboard-table,
    body:not(.login-body) .dataTable {
        min-width: 760px;
    }

    body:not(.login-body) .modal-dialog {
        max-width: calc(100vw - 16px);
        margin: 8px auto;
    }

    body:not(.login-body) .modal-header,
    body:not(.login-body) .modal-body,
    body:not(.login-body) .modal-footer {
        padding-left: 16px;
        padding-right: 16px;
    }

    body:not(.login-body) .modal-footer {
        justify-content: stretch;
    }

    body:not(.login-body) .modal-footer .btn {
        flex: 1 1 auto;
    }
}

@media (max-width: 576px) {
    body:not(.login-body) .content-stage {
        padding: 8px;
    }

    body:not(.login-body) .topbar {
        grid-template-columns: 40px minmax(0, 1fr) auto;
        min-height: 58px;
    }

    body:not(.login-body) .topbar-title {
        font-size: 20px;
    }

    body:not(.login-body) .topbar-actions .login-user {
        max-width: 38vw;
        font-size: 0;
        padding: 8px 10px;
    }

    body:not(.login-body) .topbar-actions .login-user::before {
        margin: 0;
    }

    body:not(.login-body) .card-pts-header,
    body:not(.login-body) .card-pts-body {
        padding: 14px;
    }

    body:not(.login-body) .card-pts-subtitle {
        font-size: .85rem;
    }

    body:not(.login-body) .form-control,
    body:not(.login-body) .form-select,
    body:not(.login-body) select,
    body:not(.login-body) textarea,
    body:not(.login-body) input {
        min-height: 42px;
        font-size: 16px;
    }

    body:not(.login-body) .card-pts .d-flex,
    body:not(.login-body) .card-pts .btn-group {
        align-items: stretch;
    }

    body:not(.login-body) .card-pts .d-flex > .btn,
    body:not(.login-body) .card-pts .d-flex > .btn-pts,
    body:not(.login-body) .card-pts .d-flex > input[type="submit"],
    body:not(.login-body) .card-pts .d-flex > input[type="button"] {
        flex: 1 1 100%;
    }

    body:not(.login-body) .table-pts,
    body:not(.login-body) .dashboard-table,
    body:not(.login-body) .dataTable {
        min-width: 680px;
        font-size: 13px;
    }

    body:not(.login-body) .table-pts th,
    body:not(.login-body) .table-pts td,
    body:not(.login-body) .dashboard-table th,
    body:not(.login-body) .dashboard-table td {
        padding: 8px 10px;
    }

    body:not(.login-body) .modal-body {
        max-height: calc(100vh - 140px);
    }

    body:not(.login-body) .modal-body iframe,
    body:not(.login-body) .modal-body .mapa,
    body:not(.login-body) .modal-body #map,
    body:not(.login-body) .card-pts iframe,
    body:not(.login-body) .card-pts #map,
    body:not(.login-body) .card-pts .mapa {
        min-height: 260px;
    }
}

.login-stage {
    display: flex;
    min-height: 100vh;
}

.login-page {
    display: flex;
    width: 100%;
    min-height: 100vh;
}

.login-panel {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
}

.login-panel-brand {
    position: relative;
    flex: 0 0 45%;
    overflow: hidden;
    background: linear-gradient(160deg, #2d5a3f 0%, #3f7a55 40%, #4b865f 100%);
}

.login-panel-brand::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 20% 80%, rgba(255,255,255,.06) 0%, transparent 50%), radial-gradient(ellipse at 80% 20%, rgba(255,255,255,.04) 0%, transparent 40%);
    pointer-events: none;
}

.login-panel-brand::after {
    content: "";
    position: absolute;
    inset: -40% -40%;
    background: repeating-linear-gradient(45deg, transparent, transparent 40px, rgba(255,255,255,.015) 40px, rgba(255,255,255,.015) 41px);
    pointer-events: none;
}

.login-brand-content {
    position: relative;
    z-index: 1;
    max-width: 440px;
    padding: 3rem 3.5rem;
    text-align: center;
}

.login-logo {
    display: inline-flex;
    margin-bottom: 1.5rem;
}

.login-logo svg {
    width: 56px;
    height: 56px;
}

.login-brand-title {
    margin: 0 0 0.5rem;
    color: #fff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 2.2rem;
    font-weight: 700;
    letter-spacing: -.01em;
}

.login-program-title {
    font-size: 1.85rem;
    line-height: 1.12;
    letter-spacing: .025em;
    text-transform: uppercase;
}

.login-program-title span {
    display: block;
}

.login-brand-sub {
    margin: 0 0 2.5rem;
    color: rgba(255,255,255,.72);
    font-size: 1rem;
    font-weight: 400;
}

.login-brand-features {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 2rem;
    text-align: left;
}

.login-feature {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: rgba(255,255,255,.86);
    font-size: 0.9rem;
    font-weight: 500;
}

.login-feature svg {
    width: 20px;
    height: 20px;
    fill: rgba(255,255,255,.62);
    flex: 0 0 auto;
}

.login-brand-footer {
    margin: 0;
    color: rgba(255,255,255,.45);
    font-size: 0.75rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.login-panel-form {
    flex: 0 0 55%;
    padding: 2rem;
    background: #f2eee6;
}

.login-card {
    width: 100%;
    max-width: 420px;
    color: #263634;
    background: #fff;
    border: 1px solid #e3dfd4;
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(40,60,45,.08);
}

.login-header {
    padding: 1.75rem 2rem 0.5rem;
    text-align: center;
}

.login-header h2 {
    margin: 0 0 0.35rem;
    color: #3a4a42;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.5rem;
    font-weight: 700;
}

.login-header p {
    margin: 0;
    color: #718477;
    font-size: 0.87rem;
}

.login-form {
    padding: 1.25rem 2rem 1.75rem;
}

.login-field {
    margin-bottom: 1.25rem;
}

.login-label {
    display: block;
    margin-bottom: 0.4rem;
    color: #3a4a42;
    font-size: 0.83rem;
    font-weight: 600;
}

.login-input-wrap {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0 1rem;
    background: #fbfbf9;
    border: 1px solid #dedbd2;
    border-radius: 10px;
    transition: border-color .15s, box-shadow .15s;
}

.login-input-wrap:focus-within {
    border-color: #4b865f;
    box-shadow: 0 0 0 3px rgba(75,134,95,.12);
}

.login-input-wrap svg {
    width: 20px;
    height: 20px;
    fill: #8c9a91;
    flex: 0 0 auto;
}

.login-input {
    width: 100%;
    min-height: 46px;
    padding: 0;
    color: #263634;
    background: transparent;
    border: 0;
    outline: 0;
    font-size: 0.95rem;
}

.login-input::placeholder {
    color: #aeb7b0;
}

.login-remember {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 1.5rem;
    color: #4a5d53;
    font-size: 0.9rem;
    cursor: pointer;
}

.login-check {
    width: 18px;
    height: 18px;
    accent-color: #4b865f;
}

.login-btn {
    width: 100%;
    min-height: 48px;
    color: #fff;
    background: linear-gradient(135deg, #4b865f 0%, #3f7a55 100%);
    border: 0;
    border-radius: 10px;
    box-shadow: 0 4px 16px rgba(60,130,80,.3);
    cursor: pointer;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: .03em;
    transition: transform .15s, box-shadow .15s;
}

.login-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(60,130,80,.35);
}

.login-btn:active {
    transform: translateY(0);
}

.alert-login {
    margin: 1rem 2rem 0;
    padding: 10px 12px;
    color: #7d1f1f;
    background: #fdeaea;
    border: 1px solid #f2c2c2;
    border-radius: 10px;
    font-size: 0.9rem;
}

.login-card .text-danger {
    display: block;
    margin-top: 0.35rem;
    color: #b42318 !important;
    font-size: 0.84rem;
}

@media (max-width: 800px) {
    .login-page {
        flex-direction: column;
    }

    .login-panel-brand {
        flex: 0 0 auto;
        padding: 2rem 1.5rem;
    }

    .login-brand-content {
        padding: 1rem 0;
    }

    .login-brand-title {
        font-size: 1.7rem;
    }

    .login-program-title {
        font-size: 1.45rem;
    }

    .login-brand-features,
    .login-brand-footer {
        display: none;
    }

    .login-panel-form {
        flex: 1;
        padding: 1.5rem 1rem;
    }
}

/* ===========================
   RESPONSIVE
   =========================== */

@media (max-width: 768px) {

    .navbar-pts {
        padding: 8px 16px 4px 16px;
    }

    .nav-toggle {
        display: block;
    }

    .nav-main {
        display: none;
        width: 100%;
        flex-direction: column;
        gap: 8px;
        margin-top: 6px;
    }

        .nav-main.is-open {
            display: flex;
        }

    .nav-menu {
        flex-direction: column;
        gap: 8px;
        font-size: 0.95rem;
    }

    .login-box {
        align-self: flex-end;
        font-size: 0.85rem;
    }

    .login-inline {
        gap: 10px;
        flex-wrap: wrap;
        justify-content: flex-end;
    }
}



/* ===========================================================
   SISTEMA DE DISEÑO GLOBAL PTS (AGREGADO)
   =========================================================== */

/* Contenedor general */
.page-wrapper {
    padding: 32px 16px 40px;
}

    .page-wrapper .content-limiter {
        max-width: 1280px;
        margin: 0 auto;
    }

/* Tarjeta genérica */
.pts-card {
    background: rgba(31, 70, 53, 0.85);
    border-radius: 22px;
    padding: 26px 28px;
    color: white;
    border: 1px solid rgba(255,255,255,0.12);
    box-shadow: 0 18px 40px rgba(0,0,0,0.55);
    backdrop-filter: blur(8px);
    margin-bottom: 25px;
}

.pts-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px;
    margin-bottom: 18px;
}

    .pts-header h2 {
        margin: 0;
        font-size: 1.8rem;
    }

    .pts-header p {
        margin: 4px 0 0;
        font-size: 0.9rem;
        color: var(--color-texto-sec);
    }

/* Botón PTS */
.btn-pts {
    background-color: #E6B01C !important;
    color: #083d2d !important;
    font-weight: 700;
    border-radius: 12px;
    padding: 8px 20px;
    border: none;
}

    .btn-pts:hover {
        background-color: #ffca32 !important;
        color: #083d2d !important;
    }

/* Botón pequeño */
.btn-pts-sm {
    padding: 4px 12px;
    font-size: 0.8rem;
    margin: 2px;
    background-color: #E6B01C;
    color: #083d2d;
    border-radius: 999px;
    border: none;
}

/* Tablas */
table-pts {
    color: #e8f5f1 !important; /* texto verde claro */
    background-color: transparent !important;
}






    /* El botón Imprimir ocupa todo el ancho abajo */
    .table-pts td:last-child .btn-imprimir-contrato,
    .table-pts td:last-child a[href*="Contrato"] {
        grid-column: 1 / -1;
        justify-self: center;
    }

/* Botones */
.table-pts .btn {
    background-color: #E6B01C !important;
    color: #083d2d !important;
    border: none !important;
    font-weight: 600;
    margin-right: 4px;
}


/* Solo separar Imprimir del resto */
.table-pts .btn-imprimir-contrato,
.table-pts td:last-child a[href*="Contrato"] {
    margin-top: 8px; /* espacio extra arriba */
    display: inline-block;
}









    .table-pts thead tr:first-child {
        background: rgba(0, 0, 0, 0.35);
        color: var(--color-texto);
    }

    .table-pts tbody tr:hover {
        background: rgba(255, 255, 255, 0.03);
    }

    /* Inputs de filtros */
    .table-pts .form-control-sm,
    .table-pts .form-select-sm {
        background-color: rgba(0, 0, 0, 0.35);
        border: 1px solid rgba(255, 255, 255, 0.15);
        color: var(--color-texto-sec);
    }

/* Inputs de filtros */
.table-pts input,
.table-pts select {
    background: rgba(0, 0, 0, 0.25) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    border-radius: 6px;
}


    .table-pts input::placeholder {
        color: rgba(255,255,255,0.35);
    }


/* Botones de acción */
.table-pts .btn {
    background-color: #E6B01C !important;
    color: #083d2d !important;
    border: none !important;
    font-weight: 600;
}


    .table-pts .btn:hover {
        background-color: #ffca32 !important;
    }



/* Contenedor general para páginas internas */
.content-limiter {
    max-width: var(--max-ancho);
    margin: 24px auto;
    padding: 0 16px;
}

/* Para Cartografía, Zonas, Prospectos, etc. */
.page-card {
    width: 100%; /* a diferencia del login, aquí ocupa todo el ancho útil */
}

/* Encabezado dentro de la tarjeta */
.page-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px;
    margin-bottom: 16px;
}

.page-title {
    margin: 0;
    font-size: 1.6rem;
}

.page-subtitle {
    margin: 2px 0 0;
    font-size: 0.9rem;
    color: var(--color-texto-sec);
}

/* Tabla con look PTS */
.tabla-pts thead th {
    background-color: rgba(255, 255, 255, 0.06);
    color: var(--color-texto-sec);
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.tabla-pts tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.03);
}

.tabla-pts .filters th {
    background-color: transparent;
}



/* ========= LAYOUT GENERAL DE PÁGINAS (como login) ========= */

.page-wrapper {
    padding: 32px 16px 40px 16px;
    display: flex;
    justify-content: center;
}

.card-pts {
    background: rgba(0, 40, 30, 0.75); /* verde translúcido */
    border-radius: 22px;
    padding: 40px;
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: 0 18px 40px rgba(0,0,0,0.55);
    }


.card-pts-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 12px;
}

    .card-pts-header h2 {
        margin: 0;
        font-size: 1.6rem;
    }

.card-pts-subtitle {
    margin: 2px 0 0;
    font-size: 0.9rem;
    color: var(--color-texto-sec);
}

.card-pts-body {
    margin-top: 8px;
}

/* ========= TABLA (misma línea visual que login) ========= */

.table-pts thead th {
    background-color: #f2b632 !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255,255,255,0.15);
}

.table-pts tbody tr:nth-child(even) {
    background: rgba(0, 0, 0, 0.18);
}

.table-pts tbody tr {
    background-color: rgba(255, 255, 255, 0.03) !important;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

/*.table-pts tbody tr:nth-child(odd) {
    background: rgba(0, 0, 0, 0.10);
}*/

    .table-pts tbody tr:hover {
        background-color: rgba(255, 255, 255, 0.08) !important;
    }

/* Botones de acciones en tabla (Editar / Fraccionar) */
.table-pts .btn-primary {
    background-color: var(--color-acento);
    border-color: var(--color-acento);
    color: #083d2d;
    font-weight: 600;
}

    .table-pts .btn-primary:hover {
        background-color: #ffd35b;
        border-color: #ffd35b;
    }

/* ========= DataTables: texto superior + paginación ========= */

.dataTables_wrapper .dataTables_length label,
.dataTables_wrapper .dataTables_filter label,
.dataTables_wrapper .dataTables_info {
    color: var(--color-texto-sec);
    font-size: 0.85rem;
}

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    background-color: rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.25);
    color: var(--color-texto);
    border-radius: 8px;
    padding: 2px 6px;
}

    .dataTables_wrapper .dataTables_filter input:focus,
    .dataTables_wrapper .dataTables_length select:focus {
        outline: none;
        border-color: var(--color-acento);
    }

/* Paginador */

.dataTables_wrapper .dataTables_paginate {
    margin-top: 8px;
}

    /* PAGINACIÓN TEMA PTS */
    .dataTables_wrapper .dataTables_paginate .paginate_button {
        background: rgba(0, 60, 45, 0.8) !important;
        color: #fff !important;
        border-radius: 6px !important;
        border: none !important;
        margin: 2px;
    }

        .dataTables_wrapper .dataTables_paginate .paginate_button.current {
            background: #E6B01C !important;
            color: #083d2d !important;
            font-weight: 700;
        }

        .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
            background: #ffca32 !important;
            color: #083d2d !important;
        }

        .dataTables_wrapper .dataTables_paginate .paginate_button.current,
        .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
            background: var(--color-acento) !important;
            color: var(--color-fondo) !important;
            border-color: var(--color-acento) !important;
        }




    /* Fondo y estilo general de los botones de paginación */
    .dataTables_wrapper .dataTables_paginate .page-link {
        background: rgba(0, 60, 45, 0.8) !important;
        color: #ffffff !important;
        border-radius: 6px !important;
        border: none !important;
        margin: 2px;
        padding: 4px 10px;
    }

    /* Página seleccionada */
    .dataTables_wrapper .dataTables_paginate .page-item.active .page-link {
        background: #E6B01C !important;
        color: #083d2d !important;
        font-weight: 700;
    }

    /* Hover */
    .dataTables_wrapper .dataTables_paginate .page-link:hover {
        background: #ffca32 !important;
        color: #083d2d !important;
    }


/* PAGINACIÓN MANUAL (Bootstrap) – MISMO LOOK QUE CARTOGRAFÍA */
.pagination {
    margin-top: 8px;
}

    .pagination .page-link {
        background: rgba(0, 60, 45, 0.8) !important;
        color: #ffffff !important;
        border-radius: 6px !important;
        border: none !important;
        margin: 2px;
        padding: 4px 10px;
    }

    .pagination .page-item.active .page-link {
        background: #E6B01C !important;
        color: #083d2d !important;
        font-weight: 700;
    }

    .pagination .page-link:hover {
        background: #ffca32 !important;
        color: #083d2d !important;
    }


/* Opciones del combo IdSolar (lista desplegable nativa) */
#IdSolar option {
    color: #000 !important; /* texto negro */
    background-color: #ffffff !important;
}

/* Lista desplegable de Select2 */
.select2-container--default .select2-results__option {
    color: #000 !important; /* texto negro en el panel de resultados */
}

/* Cuadro “cerrado” de Select2 */
.select2-container--default .select2-selection--single {
    background-color: #ffffff;
    color: #000000;
}











/* Modal */
.modal-content {
    border-radius: 10px;
    border: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Modal Header */
.modal-header {
    background-color: #E6B01C; /* Cambia a tu color primario */
    color: white;
    border-bottom: 2px solid #ddd;
    font-weight: bold;
}

.modal-title {
    font-size: 1.2rem;
    font-weight: bold;
}

/* Modal Body */
.modal-body {
    background-color: #3A7450; /* Fondo más claro */
    color: #333;
    padding: 20px;
}

    .modal-body p {
        font-size: 1rem;
        line-height: 1.6;
    }

    .modal-body textarea {
        width: 100%;
        height: 100px;
        border-radius: 5px;
        font-size: 1rem;
        border: 1px solid #ddd;
        padding: 10px;
        box-sizing: border-box;
    }

/* Modal Footer */
.modal-footer {
    border-top: 2px solid #E6B01C !important; /* Asegúrate de que el color dorado se aplique */
    background-color: #3A7450 !important; /* Fondo verde */
    color: #fff; /* Color del texto blanco */
    padding: 10px;
}

    .modal-footer button {
        padding: 10px 20px;
        border-radius: 5px;
        font-weight: bold;
    }

/* Custom Button Styles */
.btn-primary {
    background-color: #007bff; /* Cambia a tu color primario */
    border: none;
}

    .btn-primary:hover {
        background-color: #0056b3;
    }

.btn-danger {
    background-color: #E6B01C;
    border: none;
}

    .btn-danger:hover {
        background-color: #c82333;
    }

.btn-secondary {
    background-color: #E6B01C;
    border: none;
}

    .btn-secondary:hover {
        background-color: #5a6268;
    }


/* FILA CON DIFERENCIA (requiere abono) */
.fila-diferencia {
    background-color: rgba(0, 100, 70, 0.35) !important;
    color: #ffffff !important;
}

    /* Fila de abonos debajo cuando hay diferencia */
    .fila-diferencia + .fila-abono {
        background-color: rgba(0, 100, 70, 0.20) !important;
    }



/* FILA CON DIFERENCIA (requiere abono) */

  

    /* Fila de abonos debajo */
    .fila-diferencia + .fila-abono {
        background-color: rgba(0, 100, 70, 0.20) !important;
        border-left: 6px solid #E6B01C !important;
    }

/* Shell UI imported from BienesServicios.Web */
.app-frame {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    min-height: calc(100vh - 28px);
    margin: 14px;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(255,255,255,.75);
    border-radius: 34px;
    box-shadow: 0 0 0 12px rgba(20,27,35,.35), 0 24px 55px rgba(17,24,39,.28);
}

.app-sidebar {
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: #fbfbf9;
    border-right: 1px solid #d8dbd2;
}

.brand {
    display: flex;
    align-items: center;
    padding: 44px 24px 30px;
    color: #21302d;
    text-decoration: none;
}

.brand strong {
    color: #2f7548;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 17px;
    line-height: 1.18;
    letter-spacing: .035em;
}

.side-nav {
    display: grid;
    gap: 8px;
    padding: 0 16px;
}

.side-link,
.side-group {
    display: block;
    padding: 16px 24px;
    color: #253331;
    border-radius: 14px;
    text-decoration: none;
}

.side-group > div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.side-link strong,
.side-group-title strong {
    color: #263634;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.25;
}

.side-group-title {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    text-decoration: none;
    color: inherit;
}

.side-link {
    display: flex;
    align-items: center;
    gap: 10px;
}

.side-link svg,
.side-group-title svg,
.support-links svg {
    width: 18px;
    height: 18px;
    fill: #65756b;
    flex: 0 0 auto;
}

.side-link.active svg,
.side-group.active .side-group-title svg,
.support-links a:hover svg {
    fill: #2f7548;
}

.side-group a:not(.side-group-title) {
    display: block;
    margin-top: 6px;
    margin-left: 30px;
    color: #263634;
    font-size: 14px;
    text-decoration: none;
}

.side-link.active,
.side-group.active {
    background: #f2eee6;
    box-shadow: inset -4px 0 0 #4b865f;
}

.sidebar-footer {
    margin-top: auto;
    border-top: 1px solid #e5e2d9;
    padding: 24px 28px 36px;
}

.support-links {
    display: grid;
    gap: 12px;
    margin-top: 16px;
}

.support-links a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #263634;
    text-decoration: none;
    font-size: 14px;
}

.new-sale {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 15px 18px;
    color: #fff;
    background: #4b865f;
    border-radius: 13px;
    box-shadow: 0 6px 14px rgba(30,75,49,.25);
    font-weight: 700;
    text-decoration: none;
}

.app-shell {
    display: grid;
    grid-template-rows: 88px minmax(0, 1fr);
    min-width: 0;
    background: #fff;
}

.topbar {
    display: grid;
    grid-template-columns: max-content minmax(280px, 480px) 1fr;
    align-items: center;
    gap: 28px;
    padding: 0 28px;
    border-bottom: 1px solid #e0ded6;
}

.topbar-title {
    display: block;
    color: #3f7a55;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: .025em;
    text-decoration: none;
    white-space: nowrap;
}

.topbar-actions {
    justify-self: end;
    color: #1f2c2b;
}

.topbar-search {
    display: flex;
    align-items: center;
    min-width: 0;
    padding: 11px 18px;
    background: #f2eee8;
    border-radius: 14px;
}

.topbar-search input {
    width: 100%;
    min-width: 0;
    color: #4b4b45;
    background: transparent;
    border: 0;
    outline: 0;
}

.topbar-actions .login-inline,
.topbar-actions .login-box {
    display: flex;
    align-items: center;
    gap: 12px;
}

.topbar-actions .login-user,
.topbar-actions .login-link {
    color: #1f2c2b;
}

.topbar-actions .login-user {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: #e2ece4;
    border: 1px solid #c9dbcc;
    border-radius: 999px;
    font-weight: 600;
}

.topbar-actions .login-user::before {
    content: "";
    width: 18px;
    height: 18px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm0 2c-4.4 0-8 2.2-8 5v1h16v-1c0-2.8-3.6-5-8-5Z'/%3E%3C/svg%3E") center/contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm0 2c-4.4 0-8 2.2-8 5v1h16v-1c0-2.8-3.6-5-8-5Z'/%3E%3C/svg%3E") center/contain no-repeat;
    color: #4b865f;
}

.content-stage {
    padding: 20px;
    background: #f7f8f6;
}

.content-panel {
    min-height: calc(100vh - 160px);
    background: #fff;
    border-radius: 16px;
    padding: 16px;
}

.menu-toggle {
    display: none;
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 10px;
    color: #3f7a55;
    background: transparent;
}

@media (max-width: 992px) {
    .app-frame {
        grid-template-columns: 1fr;
        margin: 0;
        border-radius: 0;
        min-height: 100vh;
    }

    .app-sidebar {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 20;
        width: min(88vw, 320px);
        height: 100vh;
        transform: translateX(-101%);
        transition: transform .25s ease;
    }

    .app-frame.sidebar-open .app-sidebar {
        transform: translateX(0);
    }

    .menu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .topbar {
        grid-template-columns: max-content 1fr;
        padding: 0 14px;
    }

    .topbar-search {
        display: none;
    }

    .topbar-title {
        font-size: 17px;
    }
}

/* Force modern shell overrides over legacy styles */
body:not(.login-body) {
    min-height: 100vh;
    margin: 0;
    background: #535b66 !important;
    background-image: none !important;
    color: #1f2c2b;
    font-family: "Segoe UI", Arial, sans-serif;
    display: block;
}

body:not(.login-body) .app-wrapper,
body:not(.login-body) .body-content,
body:not(.login-body) .content-limiter,
body:not(.login-body) .footer-wrapper,
body:not(.login-body) .navbar-wrapper {
    all: unset;
}

body:not(.login-body) .side-nav,
body:not(.login-body) .topbar,
body:not(.login-body) .content-panel {
    font-size: 16px;
}

body:not(.login-body) .topbar-actions .login-inline {
    gap: 10px;
    font-size: 13px;
}

body:not(.login-body) .topbar-actions .login-link {
    text-decoration: none;
}

body:not(.login-body) .content-panel hr {
    display: none;
}

body:not(.login-body) .page-wrapper {
    width: 100%;
}

body:not(.login-body) .card-pts {
    background: #f6f6f6;
    border: 1px solid #d7ddd9;
    border-radius: 18px;
    padding: 0;
    box-shadow: none;
    color: #1f2c2b;
    overflow: hidden;
}

body:not(.login-body) .card-pts-header h2,
body:not(.login-body) .card-pts-header h3 {
    color: #2d7a52;
    font-weight: 700;
}

body:not(.login-body) .card-pts-subtitle {
    color: #3f5566;
}

body:not(.login-body) .card-pts-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 26px 38px;
    background: #e8e6de;
    border-bottom: 1px solid #d0d8d5;
    border-radius: 18px 18px 0 0;
}

body:not(.login-body) .card-pts-body {
    padding: 20px 38px 28px;
}

body:not(.login-body) .table-pts {
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
}

body:not(.login-body) .table-pts thead th {
    background: #e8e6de;
    color: #17303a;
    border-bottom: 0;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .02em;
}

body:not(.login-body) table.dataTable.table-pts thead th,
body:not(.login-body) table.dataTable.table-pts thead td,
body:not(.login-body) .table-pts thead tr,
body:not(.login-body) .table-pts thead .filters th {
    background-color: #e8e6de !important;
    color: #17303a !important;
}

body:not(.login-body) .table-pts thead .filters input,
body:not(.login-body) .table-pts thead .filters select {
    background: #ffffff !important;
    color: #1b2c35 !important;
    border: 1px solid #c8d0cd !important;
}

body:not(.login-body) .table-pts thead .filters input::placeholder {
    color: #5a6f7c !important;
    opacity: 1;
}

body:not(.login-body) .dataTables_wrapper .dataTables_info,
body:not(.login-body) .dataTables_wrapper .dataTables_length,
body:not(.login-body) .dataTables_wrapper .dataTables_filter,
body:not(.login-body) .dataTables_wrapper .dataTables_filter label,
body:not(.login-body) .dataTables_wrapper .dataTables_length label {
    color: #21343f !important;
    font-weight: 500;
}

body:not(.login-body) .table-pts tbody td {
    color: #1f2c33 !important;
}

body:not(.login-body) .table-pts thead th a {
    color: #17303a !important;
    text-decoration: none;
    font-weight: 700;
}

body:not(.login-body) .table-pts tbody tr:nth-child(odd) {
    background: #cfd8d3;
}

body:not(.login-body) .table-pts tbody tr:nth-child(even) {
    background: #ffffff;
}

body:not(.login-body) .table-pts tbody td {
    color: #1b2930;
}

body:not(.login-body) .btn,
body:not(.login-body) .btn-pts,
body:not(.login-body) .btn-primary,
body:not(.login-body) .btn-success {
    border-radius: 12px;
    font-weight: 700;
}

body:not(.login-body) .btn-primary,
body:not(.login-body) .btn-success,
body:not(.login-body) .btn-pts {
    background: #4a8e61;
    border-color: #4a8e61;
    color: #fff;
}

body:not(.login-body) .btn-primary:hover,
body:not(.login-body) .btn-success:hover,
body:not(.login-body) .btn-pts:hover {
    background: #3d7b53;
    border-color: #3d7b53;
}

body:not(.login-body) .table-pts .btn,
body:not(.login-body) .table-pts .btn-primary,
body:not(.login-body) .table-pts .btn-sm,
body:not(.login-body) .card-pts .btn,
body:not(.login-body) .card-pts .btn-primary,
body:not(.login-body) .card-pts .btn-success,
body:not(.login-body) .card-pts .btn-pts {
    background: #4a8e61 !important;
    border: 1px solid #4a8e61 !important;
    color: #fff !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

body:not(.login-body) .table-pts .btn:hover,
body:not(.login-body) .table-pts .btn-primary:hover,
body:not(.login-body) .table-pts .btn-sm:hover,
body:not(.login-body) .card-pts .btn:hover,
body:not(.login-body) .card-pts .btn-primary:hover,
body:not(.login-body) .card-pts .btn-success:hover,
body:not(.login-body) .card-pts .btn-pts:hover {
    background: #3d7b53 !important;
    border-color: #3d7b53 !important;
}

body:not(.login-body) .form-control,
body:not(.login-body) .form-select {
    border-radius: 12px;
    border: 1px solid #d8ddd8;
    box-shadow: none;
}

body:not(.login-body) .modal-content {
    background: #f6f6f6;
    border: 1px solid #d7ddd9;
    border-radius: 18px;
    box-shadow: 0 24px 60px rgba(17, 24, 39, .28);
    color: #1f2c2b;
    overflow: hidden;
}

body:not(.login-body) .modal-header {
    background: #e8e6de;
    border-bottom: 1px solid #d0d8d5;
    color: #2d7a52;
    padding: 20px 28px;
}

body:not(.login-body) .modal-title {
    color: #2d7a52;
    font-size: 1.25rem;
    font-weight: 700;
}

body:not(.login-body) .modal-header .close {
    color: #2f3f3d;
    opacity: .8;
    text-shadow: none;
}

body:not(.login-body) .modal-header .close:hover {
    opacity: 1;
}

body:not(.login-body) .modal-body {
    background: #f6f6f6;
    color: #1f2c2b;
    padding: 24px 28px;
}

body:not(.login-body) .modal-body .form-label {
    color: #2f3f3d;
    font-weight: 600;
}

body:not(.login-body) .modal-footer {
    background: #f6f6f6 !important;
    border-top: 1px solid #d7ddd9 !important;
    gap: 10px;
    padding: 18px 28px 22px;
}

body:not(.login-body) .modal-footer .btn-secondary {
    background: #e9b327 !important;
    border-color: #e9b327 !important;
    color: #1f2c2b !important;
}

body:not(.login-body) .modal-footer .btn-secondary:hover {
    background: #d6a31f !important;
    border-color: #d6a31f !important;
}

body:not(.login-body) .modal-footer .btn-danger {
    background: #c9514a !important;
    border-color: #c9514a !important;
    color: #fff !important;
}

body:not(.login-body) .modal-footer .btn-danger:hover {
    background: #b9443e !important;
    border-color: #b9443e !important;
}

body:not(.login-body) .pagination .page-link {
    border-radius: 10px;
    margin: 0 3px;
    color: #1b2930;
}

body:not(.login-body) .pagination .page-item.active .page-link {
    background: #e9b327;
    border-color: #e9b327;
    color: #17303a;
}

/* DataTables pagination + controls in new theme */
body:not(.login-body) .dataTables_wrapper .dataTables_length,
body:not(.login-body) .dataTables_wrapper .dataTables_filter {
    margin-bottom: 10px;
}

body:not(.login-body) .dataTables_wrapper .dataTables_filter input,
body:not(.login-body) .dataTables_wrapper .dataTables_length select {
    border: 1px solid #d2d8d3;
    border-radius: 12px;
    padding: 8px 12px;
    background: #fff;
    color: #24343a;
}

body:not(.login-body) .dataTables_wrapper .dataTables_info {
    display: inline-block;
    margin-top: 14px;
    padding: 12px 20px;
    border: 1px solid #d3d9d4;
    border-radius: 999px;
    background: #f1efe9;
    color: #45626a;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate {
    margin-top: 10px;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .paginate_button {
    min-width: 54px;
    padding: 10px 16px !important;
    margin: 0 4px;
    border: 1px solid #d3d9d4 !important;
    border-radius: 16px !important;
    background: #fff !important;
    color: #2f6e53 !important;
    box-shadow: none !important;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .paginate_button.current,
body:not(.login-body) .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    border-color: #4b8b61 !important;
    background: #4b8b61 !important;
    color: #fff !important;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
body:not(.login-body) .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    background: #f1efe9 !important;
    color: #9aa7a0 !important;
    border-color: #ddd !important;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .ellipsis {
    display: inline-block;
    min-width: 54px;
    text-align: center;
    padding: 10px 0;
    margin: 0 4px;
    border: 1px solid #d3d9d4;
    border-radius: 16px;
    background: #f1efe9;
    color: #7f8e86;
}

/* Fallback when DataTables is not rendering Bootstrap page-link markup */
body:not(.login-body) .dataTables_wrapper .dataTables_paginate {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .paginate_button,
body:not(.login-body) .dataTables_wrapper .dataTables_paginate > span > .paginate_button {
    min-width: 54px;
    height: 46px;
    padding: 10px 16px !important;
    margin: 0 !important;
    border: 1px solid #d3d9d4 !important;
    border-radius: 16px !important;
    background: #fff !important;
    color: #2f6e53 !important;
    line-height: 24px !important;
    font-weight: 500;
    text-align: center;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .paginate_button.current,
body:not(.login-body) .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: #4b8b61 !important;
    border-color: #4b8b61 !important;
    color: #fff !important;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #f4f7f4 !important;
    border-color: #bfd0c5 !important;
    color: #2e6a50 !important;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
body:not(.login-body) .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    background: #f1efe9 !important;
    border-color: #ddd !important;
    color: #9aa7a0 !important;
    cursor: default !important;
}

/* Bootstrap 5 integration used by DataTables */
body:not(.login-body) .dataTables_wrapper .dataTables_paginate .pagination {
    gap: 8px;
    margin-top: 10px;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .page-item .page-link {
    min-width: 54px;
    padding: 10px 16px;
    border: 1px solid #d3d9d4;
    border-radius: 16px;
    background: #fff;
    color: #2f6e53;
    box-shadow: none;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .page-item.active .page-link {
    border-color: #4b8b61;
    background: #4b8b61;
    color: #fff;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .page-item.disabled .page-link {
    border-color: #ddd;
    background: #f1efe9;
    color: #9aa7a0;
}

body:not(.login-body) .dataTables_wrapper .row:last-child {
    align-items: center;
}

body:not(.login-body) .dataTables_wrapper .row:last-child .col-sm-12.col-md-5,
body:not(.login-body) .dataTables_wrapper .row:last-child .col-sm-12.col-md-7 {
    margin-top: 10px;
}

/* DataTables v2 / Bootstrap mixed pagination exact pill style */
body:not(.login-body) .dataTables_wrapper .dt-info,
body:not(.login-body) .dataTables_wrapper .dataTables_info {
    display: inline-flex !important;
    align-items: center;
    min-height: 56px;
    padding: 0 28px !important;
    border: 1px solid #d3d9d4 !important;
    border-radius: 999px !important;
    background: #f1efe9 !important;
    color: #335a63 !important;
    font-size: 18px;
    line-height: 1.2;
}

body:not(.login-body) .dataTables_wrapper .dt-paging,
body:not(.login-body) .dataTables_wrapper .dataTables_paginate {
    display: inline-flex !important;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
    white-space: normal !important;
    max-width: 100%;
    width: 100%;
}

body:not(.login-body) .dataTables_wrapper .dt-paging-button,
body:not(.login-body) .dataTables_wrapper .paginate_button,
body:not(.login-body) .dataTables_wrapper .page-item .page-link {
    min-width: 58px !important;
    height: 58px !important;
    padding: 0 20px !important;
    margin: 0 !important;
    border: 1px solid #d3d9d4 !important;
    border-radius: 18px !important;
    background: #fff !important;
    color: #2f6e53 !important;
    font-size: 18px;
    line-height: 56px !important;
    font-weight: 500;
    text-align: center;
    box-shadow: none !important;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    margin: 0;
    max-width: 100%;
    width: 100%;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .pagination .page-item.paginate_button {
    min-width: 0 !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: inherit !important;
    line-height: normal !important;
    box-shadow: none !important;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .pagination .page-item .page-link {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    line-height: 1 !important;
}

body:not(.login-body) .dataTables_wrapper .row:has(.dataTables_info),
body:not(.login-body) .dataTables_wrapper .row:has(.dt-info) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

body:not(.login-body) .dataTables_wrapper .row:last-child .col-sm-12.col-md-7 {
    display: flex;
    justify-content: flex-end;
}

body:not(.login-body) .dataTables_wrapper .dt-paging-button.current,
body:not(.login-body) .dataTables_wrapper .paginate_button.current,
body:not(.login-body) .dataTables_wrapper .page-item.active .page-link {
    border-color: #4b8b61 !important;
    background: #4b8b61 !important;
    color: #fff !important;
}

body:not(.login-body) .dataTables_wrapper .dt-paging-button.disabled,
body:not(.login-body) .dataTables_wrapper .paginate_button.disabled,
body:not(.login-body) .dataTables_wrapper .page-item.disabled .page-link {
    border-color: #ddd !important;
    background: #f1efe9 !important;
    color: #97a39e !important;
    cursor: default !important;
}

body:not(.login-body) .dataTables_wrapper .dt-paging-button.ellipsis,
body:not(.login-body) .dataTables_wrapper .paginate_button.ellipsis,
body:not(.login-body) .dataTables_wrapper .ellipsis {
    background: #f1efe9 !important;
    color: #8b9892 !important;
}

body:not(.login-body) .dataTables_wrapper .dataTables_paginate .pagination .page-item.paginate_button,
body:not(.login-body) .dataTables_wrapper .dataTables_paginate .pagination .page-item.paginate_button.disabled,
body:not(.login-body) .dataTables_wrapper .dataTables_paginate .pagination .page-item.paginate_button.active {
    min-width: 0 !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    line-height: normal !important;
    box-shadow: none !important;
}

body:not(.login-body) .dataTables_wrapper > .row:last-child {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 18px !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

body:not(.login-body) .dataTables_wrapper > .row:last-child > .col-sm-12.col-md-5 {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body:not(.login-body) .dataTables_wrapper > .row:last-child > .col-sm-12.col-md-7 {
    display: flex !important;
    justify-content: flex-end !important;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body:not(.login-body) .dataTables_wrapper > .row:last-child .dataTables_paginate {
    float: none !important;
    width: 100% !important;
    text-align: right !important;
}

body:not(.login-body) .dataTables_wrapper > .row:last-child .pagination {
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
}

/* Shared table/list styling for non-DataTables views */
body:not(.login-body) .card-pts .table-responsive {
    border-radius: 14px;
}

body:not(.login-body) .card-pts .custom-table,
body:not(.login-body) .card-pts .table-pts {
    width: 100%;
    margin-bottom: 0;
    overflow: hidden;
}

body:not(.login-body) .card-pts .custom-table thead th,
body:not(.login-body) .card-pts .table-pts thead th {
    background: #e8e6de !important;
    color: #315b52 !important;
    border-bottom: 1px solid #d0d8d5 !important;
    font-weight: 700;
}

body:not(.login-body) .card-pts .custom-table tbody td,
body:not(.login-body) .card-pts .table-pts tbody td {
    color: #082032;
    border-color: #e3e7e5;
    vertical-align: middle;
}

body:not(.login-body) .card-pts .custom-table tbody tr:nth-child(even),
body:not(.login-body) .card-pts .table-pts tbody tr:nth-child(even) {
    background: #f7f8f7;
}

body:not(.login-body) .card-pts .table-total-row > td,
body:not(.login-body) .card-pts .table-total-row > th {
    background: #e8e6de !important;
    color: #315b52 !important;
    font-weight: 700;
}

body:not(.login-body) .card-pts nav[aria-label="Page navigation"] {
    display: flex;
    justify-content: flex-end;
    margin-top: 28px;
}

body:not(.login-body) .card-pts nav[aria-label="Page navigation"]:has(.pagination .page-item:only-child) {
    display: none !important;
}

body:not(.login-body) .card-pts nav[aria-label="Page navigation"] .pagination {
    justify-content: flex-end !important;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 0;
}

body:not(.login-body) .card-pts nav[aria-label="Page navigation"] .page-item .page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    min-height: 58px;
    padding: 0 20px;
    border: 1px solid #d3d9d4;
    border-radius: 18px;
    background: #fff;
    color: #2f6e53;
    font-size: 18px;
    font-weight: 500;
    box-shadow: none;
}

body:not(.login-body) .card-pts nav[aria-label="Page navigation"] .page-item.active .page-link {
    border-color: #f2b632 !important;
    background: #f2b632 !important;
    color: #113a32 !important;
}

body:not(.login-body) .card-pts nav[aria-label="Page navigation"] .page-item.disabled .page-link {
    border-color: #ddd;
    background: #f1efe9;
    color: #97a39e;
}

/* Home dashboard */
body:not(.login-body) .dashboard-page {
    width: 100%;
    padding: 28px 4px 40px;
}

body:not(.login-body) .dashboard-heading {
    margin-bottom: 24px;
}

body:not(.login-body) .dashboard-heading h1 {
    margin: 0;
    color: #24342f;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(32px, 3vw, 44px);
    font-weight: 700;
}

body:not(.login-body) .dashboard-heading h1 span {
    color: #2d7a52;
}

body:not(.login-body) .dashboard-heading p {
    margin: 6px 0 0;
    color: #758b80;
    font-size: 18px;
}

body:not(.login-body) .dashboard-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(180px, 1fr));
    gap: 20px;
    align-items: stretch;
    margin-bottom: 28px;
}

body:not(.login-body) .dashboard-stat {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 16px;
    align-items: center;
    min-height: 130px;
    padding: 26px 28px;
    border: 1px solid #dfded7;
    border-top: 4px solid #4b8b61;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(17, 58, 50, 0.05);
}

body:not(.login-body) .dashboard-stat .stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 14px;
    background: #e7f3ec;
    color: #3f8a57;
}

body:not(.login-body) .dashboard-stat .stat-icon svg {
    width: 28px;
    height: 28px;
    fill: currentColor;
}

body:not(.login-body) .dashboard-stat strong {
    display: block;
    color: #1f2f2e;
    font-size: clamp(24px, 1.7vw, 30px);
    font-weight: 800;
    line-height: 1;
    overflow-wrap: anywhere;
}

body:not(.login-body) .dashboard-stat span {
    display: block;
    margin-top: 7px;
    color: #73877e;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

body:not(.login-body) .dashboard-stat small {
    grid-column: 1 / -1;
    color: #2f7c51;
    font-size: 16px;
}

body:not(.login-body) .dashboard-stat.stat-blue {
    border-top-color: #2f7fc5;
}

body:not(.login-body) .dashboard-stat.stat-blue .stat-icon {
    background: #e6f0fa;
    color: #3e7db7;
}

body:not(.login-body) .dashboard-stat.stat-purple {
    border-top-color: #8d61b5;
}

body:not(.login-body) .dashboard-stat.stat-purple .stat-icon {
    background: #efe5f5;
    color: #8d61b5;
}

body:not(.login-body) .dashboard-stat.stat-gold {
    border-top-color: #d9a23a;
}

body:not(.login-body) .dashboard-stat.stat-gold .stat-icon {
    background: #f6eddc;
    color: #d9a23a;
}

body:not(.login-body) .dashboard-stat.stat-red {
    border-top-color: #c74336;
}

body:not(.login-body) .dashboard-stat.stat-red .stat-icon {
    background: #f5d9d5;
    color: #c74336;
}

body:not(.login-body) .dashboard-stat.stat-gray {
    border-top-color: #6f7d86;
}

body:not(.login-body) .dashboard-stat.stat-gray .stat-icon {
    background: #e9ecef;
    color: #6f7d86;
}

body:not(.login-body) .dashboard-table-card {
    overflow: hidden;
    border: 1px solid #d7ddd9;
    border-radius: 16px;
    background: #f6f6f6;
}

body:not(.login-body) .dashboard-table-header {
    padding: 24px 30px;
    background: #e8e6de;
    border-bottom: 1px solid #d0d8d5;
}

body:not(.login-body) .dashboard-table-header h2 {
    margin: 0;
    color: #24342f;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 28px;
    font-weight: 700;
}

body:not(.login-body) .dashboard-table {
    margin-bottom: 0;
}

body:not(.login-body) .dashboard-table thead th {
    background: #e8e6de !important;
    color: #315b52 !important;
    border-bottom: 1px solid #d0d8d5 !important;
}

body:not(.login-body) .dashboard-table tbody td {
    border-color: #e3e7e5 !important;
}

body:not(.login-body) .dashboard-table tbody tr:nth-child(odd) {
    background: #fff !important;
}

body:not(.login-body) .dashboard-table tbody tr:nth-child(even) {
    background: #f7f8f7 !important;
}

body:not(.login-body) .dashboard-table th,
body:not(.login-body) .dashboard-table td {
    padding: 14px 18px;
}

body:not(.login-body) .dashboard-table .btn-pts {
    min-width: 82px;
}

@media (max-width: 1400px) {
    body:not(.login-body) .dashboard-grid {
        grid-template-columns: repeat(3, minmax(180px, 1fr));
    }
}

@media (max-width: 900px) {
    body:not(.login-body) .dashboard-grid {
        grid-template-columns: repeat(2, minmax(160px, 1fr));
    }
}

@media (max-width: 640px) {
    body:not(.login-body) .dashboard-grid {
        grid-template-columns: 1fr;
    }

    body:not(.login-body) .dashboard-stat {
        padding: 22px;
    }
}

/* User-selectable dark theme */
.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 18px;
    border: 1px solid #c9dbcc;
    border-radius: 999px;
    background: #e2ece4;
    color: #244b34;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

body:not(.login-body) .topbar-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
}

.theme-toggle:hover {
    transform: translateY(-1px);
}

.theme-toggle-icon {
    width: 18px;
    height: 18px;
    background: currentColor;
    flex: 0 0 auto;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.7 14.4A8.5 8.5 0 0 1 9.6 3.3 8.5 8.5 0 1 0 20.7 14.4ZM17 4l.7 1.6L19.3 6l-1.6.7L17 8.3l-.7-1.6L14.7 6l1.6-.4L17 4Zm3 4 .5 1.1 1.1.4-1.1.5L20 11l-.5-1-1.1-.5 1.1-.4L20 8Z'/%3E%3C/svg%3E") center/contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.7 14.4A8.5 8.5 0 0 1 9.6 3.3 8.5 8.5 0 1 0 20.7 14.4ZM17 4l.7 1.6L19.3 6l-1.6.7L17 8.3l-.7-1.6L14.7 6l1.6-.4L17 4Zm3 4 .5 1.1 1.1.4-1.1.5L20 11l-.5-1-1.1-.5 1.1-.4L20 8Z'/%3E%3C/svg%3E") center/contain no-repeat;
}

html.theme-dark body:not(.login-body) {
    --dark-accent: #78c28a;
    --dark-accent-strong: #8fd39d;
    --dark-accent-bg: #1f3428;
    --dark-accent-border: #42664e;
    --dark-button-bg: #4f9668;
    --dark-button-hover: #62aa78;
    background: #111827 !important;
    color: #e5e7eb;
}

.theme-toggle.is-dark {
    background: #203529;
    border-color: #5f966c;
    color: #c7ecd1;
}

html.theme-dark body:not(.login-body) .app-frame {
    background: #111827;
    border-color: rgba(148, 163, 184, .18);
    box-shadow: 0 0 0 12px rgba(2, 6, 23, .55), 0 24px 55px rgba(0, 0, 0, .45);
}

html.theme-dark body:not(.login-body) .app-sidebar {
    background: #17211d;
    border-right-color: #26362f;
}

html.theme-dark body:not(.login-body) .brand,
html.theme-dark body:not(.login-body) .side-link,
html.theme-dark body:not(.login-body) .side-group,
html.theme-dark body:not(.login-body) .side-group a:not(.side-group-title),
html.theme-dark body:not(.login-body) .support-links a {
    color: #d7e2dc;
}

html.theme-dark body:not(.login-body) .brand strong,
html.theme-dark body:not(.login-body) .topbar-title,
html.theme-dark body:not(.login-body) .card-pts-header h2,
html.theme-dark body:not(.login-body) .card-pts-header h3 {
    color: var(--dark-accent-strong);
}

html.theme-dark body:not(.login-body) .side-link strong,
html.theme-dark body:not(.login-body) .side-group-title strong {
    color: var(--dark-accent);
}

html.theme-dark body:not(.login-body) .side-link svg,
html.theme-dark body:not(.login-body) .side-group-title svg,
html.theme-dark body:not(.login-body) .support-links svg {
    fill: var(--dark-accent);
}

html.theme-dark body:not(.login-body) .side-group a:not(.side-group-title),
html.theme-dark body:not(.login-body) .support-links a {
    color: var(--dark-accent);
}

html.theme-dark body:not(.login-body) .new-sale {
    background: var(--dark-button-bg) !important;
    color: #f4fff7 !important;
    box-shadow: 0 8px 18px rgba(79, 150, 104, .24);
}

html.theme-dark body:not(.login-body) .new-sale:hover {
    background: var(--dark-button-hover) !important;
    color: #f4fff7 !important;
}

html.theme-dark body:not(.login-body) .side-link.active,
html.theme-dark body:not(.login-body) .side-group.active {
    background: var(--dark-accent-bg);
    box-shadow: inset -4px 0 0 var(--dark-accent);
}

html.theme-dark body:not(.login-body) .sidebar-footer {
    border-top-color: #26362f;
}

html.theme-dark body:not(.login-body) .app-shell,
html.theme-dark body:not(.login-body) .content-panel {
    background: #0f172a;
}

html.theme-dark body:not(.login-body) .topbar {
    background: #111827;
    border-bottom-color: #243244;
}

html.theme-dark body:not(.login-body) .topbar-search {
    background: #1f2937;
}

html.theme-dark body:not(.login-body) .topbar-search input {
    color: #e5e7eb;
}

html.theme-dark body:not(.login-body) .topbar-search input::placeholder {
    color: #94a3b8;
}

html.theme-dark body:not(.login-body) .topbar-actions,
html.theme-dark body:not(.login-body) .topbar-actions .login-user,
html.theme-dark body:not(.login-body) .topbar-actions .login-link {
    color: #dbe7df;
}

html.theme-dark body:not(.login-body) .topbar-actions .login-user {
    background: #203529;
    border-color: #385542;
    color: #eef6f0;
}

html.theme-dark body:not(.login-body) .content-stage {
    background: #111827;
}

html.theme-dark body:not(.login-body) .dashboard-heading h1 {
    color: #d8f3dc;
}

html.theme-dark body:not(.login-body) .dashboard-heading h1 span {
    color: var(--dark-accent-strong);
}

html.theme-dark body:not(.login-body) .dashboard-heading p {
    color: #a7b7c4;
}

html.theme-dark body:not(.login-body) .card-pts,
html.theme-dark body:not(.login-body) .dashboard-stat,
html.theme-dark body:not(.login-body) .dashboard-table-card,
html.theme-dark body:not(.login-body) .modal-content {
    background: #17212f;
    border-color: #2c3a4d;
    color: #e5e7eb;
}

html.theme-dark body:not(.login-body) .dashboard-stat {
    box-shadow: 0 14px 30px rgba(0, 0, 0, .22);
}

html.theme-dark body:not(.login-body) .dashboard-stat strong {
    color: #f8fafc;
}

html.theme-dark body:not(.login-body) .dashboard-stat span {
    color: #b7c7bf;
}

html.theme-dark body:not(.login-body) .dashboard-stat small {
    color: var(--dark-accent-strong);
}

html.theme-dark body:not(.login-body) .dashboard-stat .stat-icon {
    background: var(--dark-accent-bg);
    color: var(--dark-accent);
}

html.theme-dark body:not(.login-body) .dashboard-stat.stat-blue .stat-icon {
    background: #193049;
    color: #74b9ff;
}

html.theme-dark body:not(.login-body) .dashboard-stat.stat-purple .stat-icon {
    background: #322543;
    color: #c69af4;
}

html.theme-dark body:not(.login-body) .dashboard-stat.stat-gold .stat-icon {
    background: #3b301c;
    color: #f5c76b;
}

html.theme-dark body:not(.login-body) .dashboard-stat.stat-red .stat-icon {
    background: #432521;
    color: #f08a7f;
}

html.theme-dark body:not(.login-body) .dashboard-stat.stat-gray .stat-icon {
    background: #28313b;
    color: #b3c0c8;
}

html.theme-dark body:not(.login-body) .card-pts-header,
html.theme-dark body:not(.login-body) .dashboard-table-header,
html.theme-dark body:not(.login-body) .modal-header,
html.theme-dark body:not(.login-body) .table-pts thead th,
html.theme-dark body:not(.login-body) .card-pts .table-pts thead th,
html.theme-dark body:not(.login-body) table.dataTable.table-pts thead th,
html.theme-dark body:not(.login-body) table.dataTable.table-pts thead td,
html.theme-dark body:not(.login-body) .table-pts thead tr,
html.theme-dark body:not(.login-body) .table-pts thead .filters th,
html.theme-dark body:not(.login-body) .dashboard-table thead th {
    background: #263244 !important;
    border-color: #334155 !important;
    color: #d8f3dc !important;
}

html.theme-dark body:not(.login-body) .card-pts-subtitle {
    color: #a7b7c4;
}

html.theme-dark body:not(.login-body) .card-pts-body,
html.theme-dark body:not(.login-body) .modal-body,
html.theme-dark body:not(.login-body) .modal-footer {
    background: #17212f !important;
    color: #e5e7eb;
}

html.theme-dark body:not(.login-body) .modal-footer {
    border-top-color: #2c3a4d !important;
}

html.theme-dark body:not(.login-body) .modal-title,
html.theme-dark body:not(.login-body) .modal-body .form-label,
html.theme-dark body:not(.login-body) label,
html.theme-dark body:not(.login-body) .control-label,
html.theme-dark body:not(.login-body) .dashboard-table-header h2 {
    color: var(--dark-accent);
}

html.theme-dark body:not(.login-body) .modal-header .close {
    color: #d8f3dc;
}

html.theme-dark body:not(.login-body) .form-control,
html.theme-dark body:not(.login-body) .form-select,
html.theme-dark body:not(.login-body) select,
html.theme-dark body:not(.login-body) input[type="date"],
html.theme-dark body:not(.login-body) input[type="text"],
html.theme-dark body:not(.login-body) input[type="number"],
html.theme-dark body:not(.login-body) input[type="search"] {
    background: #0f172a;
    border-color: #334155;
    color: #e5e7eb;
}

html.theme-dark body:not(.login-body) input[type="date"],
html.theme-dark body:not(.login-body) input[type="datetime-local"],
html.theme-dark body:not(.login-body) input[type="month"],
html.theme-dark body:not(.login-body) input[type="time"] {
    color-scheme: dark;
}

html.theme-dark body:not(.login-body) input[type="date"]::-webkit-calendar-picker-indicator,
html.theme-dark body:not(.login-body) input[type="datetime-local"]::-webkit-calendar-picker-indicator,
html.theme-dark body:not(.login-body) input[type="month"]::-webkit-calendar-picker-indicator,
html.theme-dark body:not(.login-body) input[type="time"]::-webkit-calendar-picker-indicator {
    background-color: rgba(120, 194, 138, .16);
    border-radius: 7px;
    cursor: pointer;
    filter: invert(92%) sepia(14%) saturate(236%) hue-rotate(169deg) brightness(102%) contrast(92%);
    opacity: 1;
    padding: 4px;
}

html.theme-dark body:not(.login-body) input[type="date"]::-webkit-calendar-picker-indicator:hover,
html.theme-dark body:not(.login-body) input[type="datetime-local"]::-webkit-calendar-picker-indicator:hover,
html.theme-dark body:not(.login-body) input[type="month"]::-webkit-calendar-picker-indicator:hover,
html.theme-dark body:not(.login-body) input[type="time"]::-webkit-calendar-picker-indicator:hover {
    background-color: rgba(120, 194, 138, .26);
    filter: invert(67%) sepia(98%) saturate(1186%) hue-rotate(53deg) brightness(96%) contrast(112%);
    opacity: 1;
}

html.theme-dark body:not(.login-body) input[type="date"]::-webkit-datetime-edit,
html.theme-dark body:not(.login-body) input[type="datetime-local"]::-webkit-datetime-edit,
html.theme-dark body:not(.login-body) input[type="month"]::-webkit-datetime-edit,
html.theme-dark body:not(.login-body) input[type="time"]::-webkit-datetime-edit {
    color: #e5e7eb;
}

html.theme-dark body:not(.login-body) input[type="date"]::-webkit-datetime-edit-fields-wrapper,
html.theme-dark body:not(.login-body) input[type="datetime-local"]::-webkit-datetime-edit-fields-wrapper,
html.theme-dark body:not(.login-body) input[type="month"]::-webkit-datetime-edit-fields-wrapper,
html.theme-dark body:not(.login-body) input[type="time"]::-webkit-datetime-edit-fields-wrapper {
    color: #e5e7eb;
}

html.theme-dark body:not(.login-body) .form-control:focus,
html.theme-dark body:not(.login-body) .form-select:focus {
    background: #111827;
    border-color: var(--dark-accent-border);
    color: #fff;
    box-shadow: 0 0 0 .2rem rgba(120, 194, 138, .16);
}

html.theme-dark body:not(.login-body) .table-pts,
html.theme-dark body:not(.login-body) .card-pts .table-responsive,
html.theme-dark body:not(.login-body) .dashboard-table-card .table-responsive {
    background: #17212f;
}

html.theme-dark body:not(.login-body) .table,
html.theme-dark body:not(.login-body) .table-pts,
html.theme-dark body:not(.login-body) .dashboard-table {
    --bs-table-bg: #17212f;
    --bs-table-color: #e5e7eb;
    --bs-table-striped-bg: #111827;
    --bs-table-striped-color: #e5e7eb;
    --bs-table-hover-bg: #203044;
    --bs-table-hover-color: #fff;
    color: #e5e7eb !important;
}

html.theme-dark body:not(.login-body) .table-pts tbody tr,
html.theme-dark body:not(.login-body) .table-pts tbody tr:nth-child(odd),
html.theme-dark body:not(.login-body) .card-pts .table-pts tbody tr:nth-child(odd),
html.theme-dark body:not(.login-body) .dashboard-table tbody tr:nth-child(odd) {
    background: #17212f !important;
}

html.theme-dark body:not(.login-body) .table-pts tbody tr:nth-child(even),
html.theme-dark body:not(.login-body) .card-pts .table-pts tbody tr:nth-child(even),
html.theme-dark body:not(.login-body) .dashboard-table tbody tr:nth-child(even) {
    background: #111827 !important;
}

html.theme-dark body:not(.login-body) .table-pts tbody td,
html.theme-dark body:not(.login-body) .card-pts .table-pts tbody td,
html.theme-dark body:not(.login-body) .dashboard-table tbody td {
    background-color: transparent !important;
    border-color: #2c3a4d !important;
    color: #e5e7eb !important;
}

html.theme-dark body:not(.login-body) .dashboard-table tbody tr:nth-child(odd) > *,
html.theme-dark body:not(.login-body) .table-pts tbody tr:nth-child(odd) > * {
    background-color: #17212f !important;
    color: #e5e7eb !important;
}

html.theme-dark body:not(.login-body) .dashboard-table tbody tr:nth-child(even) > *,
html.theme-dark body:not(.login-body) .table-pts tbody tr:nth-child(even) > * {
    background-color: #111827 !important;
    color: #e5e7eb !important;
}

html.theme-dark body:not(.login-body) .fila-abono td {
    background: #111827 !important;
}

html.theme-dark body:not(.login-body) .dataTables_wrapper .dataTables_filter input,
html.theme-dark body:not(.login-body) .dataTables_wrapper .dataTables_length select,
html.theme-dark body:not(.login-body) .dataTables_wrapper .dt-info,
html.theme-dark body:not(.login-body) .dataTables_wrapper .dataTables_info {
    background: #1f2937 !important;
    border-color: #334155 !important;
    color: #dbe7df !important;
}

html.theme-dark body:not(.login-body) .dataTables_wrapper .dataTables_length,
html.theme-dark body:not(.login-body) .dataTables_wrapper .dataTables_filter,
html.theme-dark body:not(.login-body) .dataTables_wrapper .dt-length,
html.theme-dark body:not(.login-body) .dataTables_wrapper .dt-search,
html.theme-dark body:not(.login-body) .dataTables_wrapper label {
    color: var(--dark-accent) !important;
}

html.theme-dark body:not(.login-body) .dataTables_wrapper .dataTables_length select,
html.theme-dark body:not(.login-body) .dataTables_wrapper .dt-length select {
    background: #1f2937 !important;
    border-color: #3f536b !important;
    color: #d8f3dc !important;
}

html.theme-dark body:not(.login-body) .dataTables_wrapper .dt-paging-button,
html.theme-dark body:not(.login-body) .dataTables_wrapper .paginate_button,
html.theme-dark body:not(.login-body) .dataTables_wrapper .page-item .page-link {
    background: #1f2937 !important;
    border-color: #334155 !important;
    color: #d8f3dc !important;
}

html.theme-dark body:not(.login-body) .dataTables_wrapper .dt-paging-button.current,
html.theme-dark body:not(.login-body) .dataTables_wrapper .paginate_button.current,
html.theme-dark body:not(.login-body) .dataTables_wrapper .page-item.active .page-link {
    background: var(--dark-button-bg) !important;
    border-color: var(--dark-accent-border) !important;
    color: #fff !important;
}

html.theme-dark body:not(.login-body) .dashboard-table-header h2,
html.theme-dark body:not(.login-body) .dashboard-table thead th,
html.theme-dark body:not(.login-body) .table-pts thead th,
html.theme-dark body:not(.login-body) .card-pts .table-pts thead th {
    color: var(--dark-accent-strong) !important;
}

html.theme-dark body:not(.login-body) .btn,
html.theme-dark body:not(.login-body) .btn-pts,
html.theme-dark body:not(.login-body) .btn-primary,
html.theme-dark body:not(.login-body) .btn-success,
html.theme-dark body:not(.login-body) .table-pts .btn,
html.theme-dark body:not(.login-body) .card-pts .btn,
html.theme-dark body:not(.login-body) .dashboard-table .btn-pts {
    background: var(--dark-button-bg) !important;
    border-color: var(--dark-button-bg) !important;
    color: #f4fff7 !important;
}

html.theme-dark body:not(.login-body) .btn:hover,
html.theme-dark body:not(.login-body) .btn-pts:hover,
html.theme-dark body:not(.login-body) .btn-primary:hover,
html.theme-dark body:not(.login-body) .btn-success:hover,
html.theme-dark body:not(.login-body) .table-pts .btn:hover,
html.theme-dark body:not(.login-body) .card-pts .btn:hover,
html.theme-dark body:not(.login-body) .dashboard-table .btn-pts:hover {
    background: var(--dark-button-hover) !important;
    border-color: var(--dark-button-hover) !important;
    color: #f4fff7 !important;
}

/* Responsive tables */
body:not(.login-body) .table-responsive,
body:not(.login-body) .tabla-con-header-fijo,
body:not(.login-body) .dataTables_wrapper {
    max-width: 100%;
}

body:not(.login-body) .table-responsive,
body:not(.login-body) .tabla-con-header-fijo {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

html.theme-dark body:not(.login-body) {
    scrollbar-color: #526274 #111827;
}

html.theme-dark body:not(.login-body) .table-responsive,
html.theme-dark body:not(.login-body) .tabla-con-header-fijo,
html.theme-dark body:not(.login-body) .dataTables_wrapper,
html.theme-dark body:not(.login-body) .modal-body,
html.theme-dark body:not(.login-body) .app-sidebar {
    scrollbar-color: #526274 #111827;
}

html.theme-dark body:not(.login-body) ::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

html.theme-dark body:not(.login-body) ::-webkit-scrollbar-track {
    background: #111827;
    border: 1px solid #263244;
    border-radius: 999px;
}

html.theme-dark body:not(.login-body) ::-webkit-scrollbar-thumb {
    background: #526274;
    border: 2px solid #111827;
    border-radius: 999px;
}

html.theme-dark body:not(.login-body) ::-webkit-scrollbar-thumb:hover {
    background: #6b7f93;
}

html.theme-dark body:not(.login-body) ::-webkit-scrollbar-corner {
    background: #111827;
}

body:not(.login-body) .table-responsive::after,
body:not(.login-body) .tabla-con-header-fijo::after {
    content: "";
    display: block;
    height: 1px;
}

body:not(.login-body) .table-pts,
body:not(.login-body) .dashboard-table,
body:not(.login-body) .dataTable {
    min-width: 760px;
}

body:not(.login-body) .table-pts th,
body:not(.login-body) .table-pts td,
body:not(.login-body) .dashboard-table th,
body:not(.login-body) .dashboard-table td {
    vertical-align: middle;
    white-space: nowrap;
}

body:not(.login-body) .table-pts td .btn,
body:not(.login-body) .dashboard-table td .btn {
    white-space: nowrap;
}

body:not(.login-body) .tabla-cartografia,
body:not(.login-body) .tabla-contratos {
    font-size: 14px;
    width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed;
}

body:not(.login-body) .tabla-cartografia th,
body:not(.login-body) .tabla-cartografia td,
body:not(.login-body) .tabla-contratos th,
body:not(.login-body) .tabla-contratos td {
    padding: 10px 9px;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: normal;
}

body:not(.login-body) .tabla-cartografia .acciones-cell,
body:not(.login-body) .tabla-contratos .acciones-cell {
    text-align: center;
    white-space: normal !important;
}

body:not(.login-body) .tabla-cartografia .acciones-header,
body:not(.login-body) .tabla-contratos .acciones-header {
    text-align: center;
}

body:not(.login-body) .tabla-cartografia th:nth-child(1) { width: 14%; }
body:not(.login-body) .tabla-cartografia th:nth-child(2) { width: 9%; }
body:not(.login-body) .tabla-cartografia th:nth-child(3) { width: 8%; }
body:not(.login-body) .tabla-cartografia th:nth-child(4) { width: 10%; }
body:not(.login-body) .tabla-cartografia th:nth-child(5) { width: 13%; }
body:not(.login-body) .tabla-cartografia th:nth-child(6) { width: 8%; }
body:not(.login-body) .tabla-cartografia th:nth-child(7) { width: 11%; }
body:not(.login-body) .tabla-cartografia th:nth-child(8) { width: 10%; }
body:not(.login-body) .tabla-cartografia th:nth-child(9) { width: 17%; }

body:not(.login-body) .tabla-contratos th:nth-child(1) { width: 10%; }
body:not(.login-body) .tabla-contratos th:nth-child(2) { width: 17%; }
body:not(.login-body) .tabla-contratos th:nth-child(3) { width: 13%; }
body:not(.login-body) .tabla-contratos th:nth-child(4) { width: 12%; }
body:not(.login-body) .tabla-contratos th:nth-child(5) { width: 9%; }
body:not(.login-body) .tabla-contratos th:nth-child(6) { width: 10%; }
body:not(.login-body) .tabla-contratos th:nth-child(7) { width: 13%; }
body:not(.login-body) .tabla-contratos th:nth-child(8) { width: 16%; }

body:not(.login-body) .tabla-cartografia .acciones-cell .btn,
body:not(.login-body) .tabla-contratos .acciones-cell .btn,
body:not(.login-body) .tabla-contratos .acciones-cell .btn-pts {
    width: auto !important;
    min-width: 0;
    margin: 2px;
    padding: 7px 10px;
    font-size: 13px;
    line-height: 1.2;
}

body:not(.login-body) .tabla-cartografia thead .filters input,
body:not(.login-body) .tabla-cartografia thead .filters select {
    width: 100%;
    min-width: 76px;
    padding-left: 8px;
    padding-right: 8px;
}

body:not(.login-body) .btn-action,
body:not(.login-body) .table-pts .btn-action,
body:not(.login-body) .card-pts .btn-action {
    align-items: center;
    border-radius: 8px !important;
    display: inline-flex;
    font-size: 13px;
    font-weight: 800;
    justify-content: center;
    line-height: 1.15;
    min-height: 34px;
    padding: 7px 10px !important;
    text-decoration: none;
    width: auto !important;
}

body:not(.login-body) .btn-action-secondary {
    background: #eef2f0 !important;
    border-color: #d6ded9 !important;
    color: #264139 !important;
}

body:not(.login-body) .btn-action-secondary:hover {
    background: #dde7e1 !important;
    border-color: #c5d2ca !important;
    color: #183028 !important;
}

body:not(.login-body) .btn-action-warning {
    background: #e4b02b !important;
    border-color: #e4b02b !important;
    color: #231d0a !important;
}

body:not(.login-body) .btn-action-warning:hover {
    background: #f1c048 !important;
    border-color: #f1c048 !important;
    color: #231d0a !important;
}

body:not(.login-body) .status-badge {
    border: 1px solid transparent;
    border-radius: 999px;
    display: inline-flex;
    font-size: 12px;
    font-weight: 900;
    justify-content: center;
    letter-spacing: .02em;
    min-width: 42px;
    padding: 5px 9px;
    text-transform: uppercase;
    white-space: nowrap;
}

body:not(.login-body) .status-badge-ok {
    background: #dff4e7;
    border-color: #b9e2c8;
    color: #1f6b3f;
}

body:not(.login-body) .status-badge-no {
    background: #f6e4df;
    border-color: #e8c5ba;
    color: #954735;
}

body:not(.login-body) .status-badge-neutral {
    background: #eceff3;
    border-color: #d9dee7;
    color: #415064;
}

.braices-toast-host {
    bottom: 22px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: min(420px, calc(100vw - 28px));
    position: fixed;
    right: 22px;
    z-index: 2147483000;
}

.braices-toast {
    animation: braicesToastIn .18s ease-out;
    background: #f8fafc;
    border: 1px solid #d6dee8;
    border-left: 5px solid #4a8e61;
    border-radius: 8px;
    box-shadow: 0 18px 35px rgba(15, 23, 42, .22);
    color: #1f2937;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    padding: 13px 16px;
}

.braices-toast-success {
    border-left-color: #4a8e61;
}

.braices-toast-warning {
    border-left-color: #d59b18;
}

.braices-toast-error {
    border-left-color: #c24132;
}

.braices-toast.is-hiding {
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .2s ease, transform .2s ease;
}

@keyframes braicesToastIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

html.theme-dark body:not(.login-body) .btn-action-secondary {
    background: #243244 !important;
    border-color: #3a4b61 !important;
    color: #d8f3dc !important;
}

html.theme-dark body:not(.login-body) .btn-action-secondary:hover {
    background: #2d4058 !important;
    border-color: #506783 !important;
    color: #fff !important;
}

html.theme-dark body:not(.login-body) .btn-action-warning {
    background: #d59b18 !important;
    border-color: #d59b18 !important;
    color: #171103 !important;
}

html.theme-dark body:not(.login-body) .status-badge-ok {
    background: rgba(74, 142, 97, .18);
    border-color: rgba(143, 224, 168, .45);
    color: #8fe0a8;
}

html.theme-dark body:not(.login-body) .status-badge-no {
    background: rgba(194, 65, 50, .16);
    border-color: rgba(240, 138, 127, .42);
    color: #f08a7f;
}

html.theme-dark body:not(.login-body) .status-badge-neutral {
    background: rgba(148, 163, 184, .14);
    border-color: rgba(148, 163, 184, .35);
    color: #b7c7d8;
}

html.theme-dark .braices-toast {
    background: #17212f;
    border-color: #2c3a4d;
    color: #e5e7eb;
    box-shadow: 0 18px 35px rgba(0, 0, 0, .4);
}

@media (max-width: 576px) {
    .braices-toast-host {
        bottom: 14px;
        left: 14px;
        right: 14px;
        max-width: none;
    }
}

@media (max-width: 768px) {
    body:not(.login-body) .content-stage {
        padding: 10px;
    }

    body:not(.login-body) .content-panel {
        padding: 10px;
    }

    body:not(.login-body) .card-pts-header {
        padding: 18px 20px;
    }

    body:not(.login-body) .card-pts-body {
        padding: 16px 18px 22px;
    }

    body:not(.login-body) .table-pts,
    body:not(.login-body) .dashboard-table,
    body:not(.login-body) .dataTable {
        min-width: 900px;
        font-size: 14px;
    }

    body:not(.login-body) .table-pts th,
    body:not(.login-body) .table-pts td,
    body:not(.login-body) .dashboard-table th,
    body:not(.login-body) .dashboard-table td {
        padding: 10px 12px;
    }

    body:not(.login-body) .table-pts .btn,
    body:not(.login-body) .dashboard-table .btn,
    body:not(.login-body) .table-pts .btn-pts,
    body:not(.login-body) .dashboard-table .btn-pts {
        min-width: auto;
        padding: 8px 12px;
        border-radius: 9px !important;
        font-size: 14px;
    }

    body:not(.login-body) .dataTables_wrapper .row,
    body:not(.login-body) .dataTables_wrapper .row:has(.dataTables_info),
    body:not(.login-body) .dataTables_wrapper .row:has(.dt-info) {
        gap: 10px;
    }

    body:not(.login-body) .dataTables_wrapper .dataTables_length,
    body:not(.login-body) .dataTables_wrapper .dataTables_filter,
    body:not(.login-body) .dataTables_wrapper .dt-length,
    body:not(.login-body) .dataTables_wrapper .dt-search {
        width: 100%;
        text-align: left;
    }

    body:not(.login-body) .dataTables_wrapper .dataTables_filter input,
    body:not(.login-body) .dataTables_wrapper .dt-search input {
        width: 100%;
        margin-left: 0;
        margin-top: 6px;
    }

    body:not(.login-body) .dataTables_wrapper .dt-info,
    body:not(.login-body) .dataTables_wrapper .dataTables_info {
        min-height: 44px;
        padding: 0 16px !important;
        font-size: 14px;
    }

    body:not(.login-body) .dataTables_wrapper .dt-paging-button,
    body:not(.login-body) .dataTables_wrapper .paginate_button,
    body:not(.login-body) .dataTables_wrapper .page-item .page-link {
        min-width: 42px !important;
        height: 42px !important;
        padding: 0 12px !important;
        border-radius: 12px !important;
        font-size: 14px;
        line-height: 40px !important;
    }
}

