#notificaciones .dashboard-deuda-card {
    margin-bottom: 18px;
}

#notificaciones .dashboard-deuda-card .tile-stats {
    min-height: 204px;
    margin-bottom: 0;
    overflow: hidden;
    border: 1px solid #e6ebf1;
    border-top: 4px solid #d9534f;
    border-radius: 8px;
    box-shadow: 0 8px 22px rgba(42, 63, 84, 0.12);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#notificaciones .dashboard-deuda-card .tile-stats:hover {
    transform: translateY(-3px);
    box-shadow: 0 13px 28px rgba(42, 63, 84, 0.18);
}

#notificaciones .dashboard-deuda-card .icon {
    top: 14px;
    right: 16px;
    color: rgba(42, 63, 84, 0.12);
}

#notificaciones .dashboard-deuda-card .icon i {
    font-size: 58px;
}

#notificaciones .dashboard-deuda-card .count {
    margin-top: 6px;
    color: #c0392b;
    font-size: 31px;
    font-weight: 700;
    line-height: 1.2;
}

#notificaciones .dashboard-deuda-card h3 {
    margin-top: 10px;
    color: #2a3f54;
    font-size: 17px;
    font-weight: 700;
}

#notificaciones .dashboard-deuda-card p {
    margin: 8px 0 0;
    font-size: 13px;
}

#notificaciones .dashboard-deuda-detail {
    display: inline-block;
    margin-top: 5px;
    color: #337ab7;
    font-size: 13px;
    font-weight: 600;
}

#notificaciones .dashboard-deuda-detail:hover,
#notificaciones .dashboard-deuda-card p a:hover {
    color: #23527c;
    text-decoration: underline;
}

#notificaciones .dashboard-deuda-agua .tile-stats {
    border-top-color: #2a9fd6;
}

#notificaciones .dashboard-deuda-agua .count {
    color: #2384b3;
}

#notificaciones .dashboard-deuda-vial .tile-stats {
    border-top-color: #f0ad4e;
}

#notificaciones .dashboard-deuda-vial .count {
    color: #d48620;
}

@media (max-width: 767px) {
    #notificaciones .dashboard-deuda-card .tile-stats {
        min-height: 184px;
    }

    #notificaciones .dashboard-deuda-card .count {
        font-size: 29px;
    }

    #notificaciones .dashboard-deuda-card .icon i {
        font-size: 48px;
    }
}

#notificaciones .dashboard-deudas-summary {
    margin-bottom: 4px;
}

#notificaciones .dashboard-deudas-summary .x_panel {
    margin-bottom: 12px;
    border: 0;
    box-shadow: none;
}

#notificaciones .dashboard-deudas-summary .x_title {
    margin-bottom: 0;
    border-bottom-color: #e6ebf1;
}

#notificaciones .dashboard-deudas-summary h2 {
    color: #2a3f54;
    font-weight: 600;
}

#notificaciones .dashboard-deudas-summary h2 i {
    color: #d9534f;
}

#notificaciones .dashboard-deuda-card .tile-stats {
    min-height: 168px;
    padding: 16px 18px;
}

#notificaciones .dashboard-deuda-card .icon {
    display: none;
}

#notificaciones .dashboard-deuda-card .tile-stats::before {
    position: absolute;
    top: 15px;
    right: 17px;
    font-family: FontAwesome;
    font-size: 34px;
    line-height: 1;
    color: #d9534f;
    content: '\f19c';
}

#notificaciones .dashboard-deuda-agua .tile-stats::before {
    color: #2a9fd6;
    content: '\f043';
}

#notificaciones .dashboard-deuda-vial .tile-stats::before {
    color: #f0ad4e;
    content: '\f018';
}

#notificaciones .dashboard-deuda-card .count {
    padding-right: 45px;
}

#notificaciones .dashboard-deuda-card h3 {
    margin-bottom: 5px;
}

#notificaciones .dashboard-deuda-detail,
#notificaciones .dashboard-deuda-card p a {
    display: inline-block;
    padding: 5px 9px;
    border: 1px solid #337ab7;
    border-radius: 3px;
    background: #fff;
    color: #337ab7;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    text-decoration: none;
}

#notificaciones .dashboard-deuda-card p {
    display: inline-block;
    margin: 0 0 0 5px;
    font-size: 0;
}

#notificaciones .dashboard-deuda-card p a {
    border-color: #5cb85c;
    background: #5cb85c;
    color: #fff;
}

#notificaciones .dashboard-deuda-card p a b {
    font-size: 0;
}

#notificaciones .dashboard-deuda-card p a b::after {
    content: 'Pagar';
    font-size: 12px;
}

#notificaciones .dashboard-deuda-detail:hover {
    border-color: #23527c;
    background: #337ab7;
    color: #fff;
    text-decoration: none;
}

#notificaciones .dashboard-deuda-card p a:hover {
    border-color: #449d44;
    background: #449d44;
    color: #fff;
    text-decoration: none;
}

@media (max-width: 767px) {
    #notificaciones .dashboard-deudas-summary h2 {
        font-size: 16px;
    }

    #notificaciones .dashboard-deudas-summary h2 small {
        display: block;
        margin: 5px 0 0 22px;
        font-size: 12px;
    }

    #notificaciones .dashboard-deuda-card .tile-stats {
        min-height: 154px;
    }
}
