/*!
 * ==========================================================
 * DAP CUSTOM CSS
 * ==========================================================
 * Framework UI personalizado para WordPress, AdminLTE y
 * proyectos Dapozzo.pro
 *
 * Archivo : dapCustom.css
 * Autor   : David Dapozzo
 *
 * ==========================================================
 * HISTORIAL DE VERSIONES
 * ==========================================================
 *
 * v0.0.2 - 2026-05-31
 * ----------------------------------------------------------
 * NUEVO:
 * - btn-dap-group
 * - btn-dap-group-vertical
 * - btn-dap-toolbar
 *
 * MEJORAS:
 * - Compatibilidad visual con btn-app-group de AdminLTE.
 * - Compatibilidad con toolbars de filtros y acciones.
 * - Soporte para agrupación horizontal y vertical.
 *
 * ----------------------------------------------------------
 *
 * v0.0.1 - 2026-05-31
 * ----------------------------------------------------------
 * LANZAMIENTO INICIAL
 *
 * Incluye:
 * - Variables CSS :root
 * - Paleta de colores DAP
 * - Cards personalizadas
 * - Card Outline
 * - Header y Footer personalizados
 * - Wrapper DAP
 * - Navbar DAP
 * - Content Wrapper DAP
 * - Small DAP Box
 * - Botones btn-dap
 * - bg-dap-*
 * - Estados success / warning / danger
 * - Compatibilidad AdminLTE 4
 * - Tipografía Card Title
 * - Form Controls XS
 * - Helpers visuales varios
 *
 * ----------------------------------------------------------
 *
 * Próxima versión:
 * v0.0.3
 *
 * Pendiente:
 * - Dropdown DAP
 * - Input Group DAP
 * - Badge DAP
 * - Alert DAP
 * - Modal DAP
 * - Tabs DAP
 * - Timeline DAP
 *
 * ==========================================================
 */

/* =====================================================
   v0.0.1 - LANZAMIENTO INICIAL
   ===================================================== */


/* ======================
   Paleta de Colores Personalizada - dapCustom
   ====================== */
:root {
  --primary-dap: linear-gradient(90deg, #7F00FF 0%, #007BFF 100%);
  --secondary-dap: linear-gradient(90deg, #868e96 0%, #6c757d 100%);
  --success-dap: linear-gradient(90deg, #00c851 0%, #28a745 100%);
  --info-dap: linear-gradient(90deg, #00c6ff 0%, #17a2b8 100%);
  --warning-dap: linear-gradient(90deg, #ffb347 0%, #ffc107 100%);
  --danger-dap: linear-gradient(90deg, #ff416c 0%, #dc3545 100%);
  --light-dap: linear-gradient(90deg, #ffffff 0%, #f8f9fa 100%);
  --dark-dap: linear-gradient(90deg, #232526 0%, #414345 100%);
  --esperanzaweb1: #00537b;
  --line-dap-success: 2px solid #00c851;
  --fondo-dap-success: #00c85021;
  --line-dap-warning: 2px solid #ffc107;
  --fondo-dap-warning:#ffc10738;
  --line-dap-danger: 2px solid #dc3545;
  --fondo-dap-danger: #dc354642;

  --primary-dap-color: #007BFF;
  --secondary-dap-color: #6c757d;
  --success-dap-color: #28a745;
  --info-dap-color: #17a2b8;
  --warning-dap-color: #ffc107;
  --danger-dap-color: #dc3545;
  --light-dap-color: #f8f9fa;
  --dark-dap-color: #414345;
}

.bg-dap-tertiary {
    --bs-bg-opacity: 1;
    background-color: rgb(248 249 250 / 60%) !important;
}

/* ======================
   Custom Card - dapCustom
   ====================== */
.card-dap {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(10px);
  border-radius: 1rem;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}


.card-dap-outline-primary::before,
.card-dap-outline-secondary::before,
.card-dap-outline-success::before,
.card-dap-outline-info::before,
.card-dap-outline-warning::before,
.card-dap-outline-danger::before,
.card-dap-outline-light::before,
.card-dap-outline-dark::before,
.card-dap-outline-ew1::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 98.5%;
  height: 3px;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  z-index: 1;
}
.card-dap-outline-primary::before { background: var(--primary-dap); }
.card-dap-outline-secondary::before { background: var(--secondary-dap); }
.card-dap-outline-success::before { background: var(--success-dap); }
.card-dap-outline-info::before { background: var(--info-dap); }
.card-dap-outline-warning::before { background: var(--warning-dap); }
.card-dap-outline-danger::before { background: var(--danger-dap); }
.card-dap-outline-light::before { background: var(--light-dap); }
.card-dap-outline-dark::before { background: var(--dark-dap); }
.card-dap-outline-ew1::before{background: var(--esperanzaweb1);}

.card-dap-outline-1-primary { border-top:3px solid var(--primary-dap-color); }
.card-dap-outline-1-secondary { border-top:3px solid var(--secondary-dap-color); }
.card-dap-outline-1-success { border-top:3px solid var(--success-dap-color); }
.card-dap-outline-1-info { border-top:3px solid var(--info-dap-color); }
.card-dap-outline-1-warning { border-top:3px solid var(--warning-dap-color); }
.card-dap-outline-1-danger { border-top:3px solid var(--danger-dap-color); }
.card-dap-outline1-1-light { border-top:3px solid var(--light-dap-color); }
.card-dap-outline-1-dark { border-top:3px solid var(--dark-dap-color); }
.card-dap-outline-1-ew1 { border-top:3px solid var(--esperanzaweb1); }




.card-dap > .card-dap-body {
  flex: 1 1 auto;
  padding: 1.5rem;
}

.card-dap-header {
  border-bottom: 1px solid #0000001c;
}

.card-dap-footer {
  border-top: 1px solid #0000001c;
}
.card-dap-footer-background {
  background-color: rgba(0, 0, 0, 0.03);
}
.card-dap-header,
.card-dap-footer {
  background-color: transparent;
  padding: 1rem 1.5rem;
}

.card-dap-title {
  margin-bottom: 0.5rem;
  font-weight: 600;
  font-size: 1.25rem;
}

.card-dap-subtitle {
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.65);
}

/* ======================
   Modo Oscuro - dapCustom
   ====================== */
.card-dap.card-dap-dark {
  background-color: rgba(0, 0, 0, 0.4);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

.card-dap.card-dap-dark .card-dap-subtitle {
  color: rgba(255, 255, 255, 0.6);
}

.card-dap.card-dap-dark .card-dap-header,
.card-dap.card-dap-dark .card-dap-footer {
  color: #e0e0e0;
  background-color: transparent;
}

.card-dap-header > .card-dap-tools {
  float: right;
  margin-right: -0.625rem;
}

.card-dap-header > .card-dap-tools .input-group,
.card-dap-header > .card-dap-tools .nav,
.card-dap-header > .card-dap-tools .pagination {
  margin-bottom: -0.3rem;
  margin-top: -0.3rem;
}

.card-dap-header > .card-dap-tools [data-toggle="tooltip"] {
  position: relative;
}

.card-dap-body {
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-height: 1px;
  padding: 1.25rem;
}

/* ======================
   Colores aplicados a Cards - dapCustom
   ====================== */
.card-dap-primary { background: var(--primary-dap); color: #fff; }
.card-dap-secondary { background: var(--secondary-dap); color: #fff; }
.card-dap-success { background: var(--success-dap); color: #fff; }
.card-dap-info { background: var(--info-dap); color: #fff; }
.card-dap-warning { background: var(--warning-dap); color: #fff; }
.card-dap-danger { background: var(--danger-dap); color: #fff; }
.card-dap-light { background: var(--light-dap); color: #333; }
.card-dap-dark { background: var(--dark-dap); color: #fff; }

/* ======================
   Botones Personalizados - dapCustom
   ====================== */
.btn-dap {
  color: #fff;
  border: none;
  padding: 0.5rem 1rem;
  font-weight: 400;
  border-radius: 0.25rem;
  transition: all 0.2s ease-in-out;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  position: relative;
  overflow: hidden;
  min-height: 2.5rem;
  line-height: 1.2;
}

.btn-dap:hover {
  filter: brightness(1.1);
  transform: scale(1.02);
}

.btn-dap-primary { background: var(--primary-dap); }
.btn-dap-secondary { background: var(--secondary-dap); }
.btn-dap-success { background: var(--success-dap); }
.btn-dap-info { background: var(--info-dap); }
.btn-dap-warning { background: var(--warning-dap); }
.btn-dap-danger { background: var(--danger-dap); }
.btn-dap-light { background: var(--light-dap); color: #333; }
.btn-dap-dark { background: var(--dark-dap); }

/* Tamaños */
.btn-dap-lg {
  padding: 0.75rem 1.5rem;
  font-size: 1.25rem;
  min-height: 3rem;
}

.btn-dap-sm {
  padding: 0.25rem 0.75rem;
  font-size: 0.875rem;
  min-height: 1.8rem;
}

.btn-dap-xs {
  padding: 0.125rem 0.5rem;
  font-size: 0.75rem;
  min-height: 1.4rem;
}

/* Estado deshabilitado */
.btn-dap.disabled,
.btn-dap:disabled {
  opacity: 0.65;
  pointer-events: none;
  filter: none;
  transform: none;
}

/* Botones planos */
.btn-dap-flat {
  background: none !important;
  color: inherit;
  box-shadow: none;
}

/* Botones con borde */
.btn-dap-outline {
  background: transparent;
  border: 2px solid currentColor;
  color: inherit;
}

/* Grupos de botones */
.btn-dap-group {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
}

.btn-dap-group > .btn-dap:not(:last-child):not(.dropdown-toggle), .btn-dap-group > .btn-dap-group:not(:last-child) > .btn-dap {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.btn-dap-group > .btn-dap:not(:first-child), .btn-dap-group > .btn-dap-group:not(:first-child) > .btn-dap {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.btn-dap-group > .btn-dap, .btn-dap-group-vertical > .btn-dap {
  position: relative;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

.btn-dap-group > .btn-dap:not(:first-child), .btn-dap-group > .btn-dap-group:not(:first-child) {
  margin-left: -1px;
}

.btn-dap-sm, .btn-dap-group-sm > .btn-dap {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.5;
  border-radius: 0.2rem;
  min-height: 1.8rem;
}

/* ======================
   Fondo bg-dap - dapCustom
   ====================== */

.bg-dap-primary { background: var(--primary-dap); }
.bg-dap-secondary { background: var(--secondary-dap); }
.bg-dap-success { background: var(--success-dap); }
.bg-dap-info { background: var(--info-dap); }
.bg-dap-warning { background: var(--warning-dap); }
.bg-dap-danger { background: var(--danger-dap); }
.bg-dap-light { background: var(--light-dap); color: #333; }
.bg-dap-dark { background: var(--dark-dap); }

/* ======================
   Fondo wrapper-dap - dapCustom
   ====================== */

.wrapper-dap {
  position: relative;
  z-index: 1;
}

.wrapper-dap::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
  url('image/fondo-svg-2.svg'),
  linear-gradient(135deg, #2C90C4 0%, #31CCB0 100%);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0.3;
  z-index: -1;
}


/* ======================
   Header personalizado - dapCustom
   ====================== */
.navbar-dap {
  background-color: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  z-index: 1030;
  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;
}

.navbar-dap.navbar-light .navbar-nav .nav-link {
  color: #333;
}

.navbar-dap .nav-link:hover {
  color: #007bff;
}

/* ======================
   Footer personalizado - dapCustom
   ====================== */
.main-footer-dap {
  background-color: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.08);
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  z-index: 1030;
  color: #333;
  padding: 1rem;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}

/* ======================
   Content Wrapper personalizado - dapCustom
   ====================== */
.content-wrapper-dap {
  background-color: transparent;
  backdrop-filter: blur(2px);
  padding: 1rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.content-wrapper-dap-1 {
  background-color: transparent;
}

.content-wrapper-dap-2 {
  background-color: transparent;
  backdrop-filter: blur(2px);
  padding: rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}


.table.table-head-fixed thead tr:nth-child(1) th,
.table.table-head-fixed tfoot tr:nth-child(1) th {
  background-color: #ffffffad;
}

/* ====================== LOGO FIJO - dapCustom ====================== */
.wrapper-dap-logo {
  position: fixed;
  bottom: 5rem;
  right: 2rem;
  z-index: 0;
  opacity: 0.4;
  pointer-events: none;
}

.wrapper-dap-logo img {
  min-width: 140px;
  max-width: 160px;
  height: auto;
}

@media (max-width: 768px) {
  .wrapper-dap-logo img {
    min-width: 80px;
    max-width: 100px;
  }
}

/* ====================== SMALL BOX - dapCustom ====================== */

.small-dap-box {
  border-radius: 1rem;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2);
  display: block;
  margin-bottom: 20px;
  position: relative;
}

.small-dap-box > .inner {
  padding: 10px;
}

.small-dap-box .icon {
  color: rgba(0, 0, 0, 0.15);
  z-index: 0;
}

.small-dap-box > .small-dap-box-footer {
  background-color: rgba(0, 0, 0, 0.1);
  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;
  color: rgba(255, 255, 255, 0.8);
  display: block;
  padding: 3px 0;
  position: relative;
  text-align: center;
  text-decoration: none;
  z-index: 10;
}

@media (min-width: 1200px) {
    .col-xl-3 .small-dap-box h3, .col-lg-3 .small-dap-box h3, .col-md-3 .small-dap-box h3 {
        font-size: 2.2rem;
    }
}

@media (min-width: 992px) {
    .col-xl-3 .small-dap-box h3, .col-lg-3 .small-dap-box h3, .col-md-3 .small-dap-box h3 {
        font-size: 1.6rem;
    }
}

.small-dap-box h3 {
    font-size: 2.2rem;
    font-weight: 700;
    margin: 0 0 10px;
    padding: 0;
    white-space: nowrap;
}

tr.estado-success {
    border: var(--line-dap-success);
    background-color: var(--fondo-dap-success);
}
tr.estado-danger {
    border: var(--line-dap-danger);
    background-color: var(--fondo-dap-danger);
}
tr.estado-warning {
    border: var(--line-dap-warning);
}


/* ====================== Nuevas Clases y ID sobre AdminLTE 4 ====================== */

/* Fondo personalizado */
.app-wrapper::before {
  content: "";
  position: absolute;
  inset: 0;

  background-image:
    url("image/fondo-svg-2.svg"),
    linear-gradient(135deg, #2C90C4 0%, #31CCB0 100%);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  opacity: 0.3;
  z-index: -1;

  /* Muy importante: no bloquear clicks */
  pointer-events: none;
}


table.table.dataTable>:not(caption)>*>* {
    background-color: #ffffff00 !important;
}

.table {
  --bs-table-bg: #ffffff00 !important;
}

.table1 thead tr:nth-child(1) th, .table1 tfoot tr:nth-child(1) th {
    background-color: #ffffffad !important;
}

.table-dap-no-line td, th{
    border: 0px solid !important;
    --bs-table-bg: inherit !important;
}

.aside-dap-1{
  backdrop-filter: blur(10px);
  box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.08);
  border-bottom-right-radius: 1rem;
  border-top-right-radius: 1rem;
  background-color: #00000082;
}

.accordion-item{
  background-color: transparent !important;
}
/* Zebra effect para accordion */ 
#accordionSolicitudes .accordion-item:nth-child(odd) {
    background-color: rgba(0, 0, 0, 0.04) !important;
}

#accordionSolicitudes .accordion-item:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.02) !important;
}

.headfoot{
  background-color: #ffffffad;
}

.card-dap-header.bg-dap-warning,
.card-dap-header.bg-dap-danger,
.card-dap-header.bg-dap-success,
.card-dap-header.bg-dap-info {
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  color: #fff;
}

.nav-treeview .nav-link{
    padding-left: 1.8rem;
}

.nav-treeview .nav-treeview{
    padding-left: 0.8rem;
}

.nav-treeview .nav-treeview .nav-treeview{
    padding-left: 0.8rem;
}

/* =========================
   CARD TITLE
========================= */

.card-dap-title,
.card-dap-title-xs,
.card-dap-title-sm,
.card-dap-title-lg,
.card-dap-title-xl{
    margin: 0;
    font-weight: 600;
    line-height: 1.2;
    color: inherit;
    display: flex;
    align-items: center;
    gap: .35rem;
}

/* =========================
   TAMAÑOS TIPO ADMINLTE
========================= */

.card-dap-title-xs{
    font-size: .85rem !important;
}

.card-dap-title-sm{
    font-size: 1rem !important;
}

.card-dap-title{
    font-size: 1.15rem;
}

.card-dap-title-lg{
    font-size: 1.35rem !important;
}

.card-dap-title-xl{
    font-size: 1.6rem !important;
}

/* =========================
   RESPONSIVE
========================= */

@media (max-width: 768px){

    .card-dap-title{
        font-size: 1rem;
    }

    .card-dap-title-lg{
        font-size: 1.15rem !important;
    }

    .card-dap-title-xl{
        font-size: 1.3rem !important;
    }
}

/* =========================
   HEADER ALIGN FIX
========================= */

.card-dap-header .card-dap-title{
    /* min-height: 32px; */
}

/* =========================
   ICONOS
========================= */

.card-dap-title i,
.card-dap-title svg,
.card-dap-title-xs i,
.card-dap-title-sm i,
.card-dap-title-lg i,
.card-dap-title-xl i{
    font-size: .95em;
    line-height: 1;
}


/* =========================
   TAMAÑOS POR H
========================= */

h1.card-dap-title{font-size:2.2rem;}
h2.card-dap-title{font-size:1.9rem;}
h3.card-dap-title{font-size:1.6rem;}
h4.card-dap-title{font-size:1.35rem;}
h5.card-dap-title{font-size:1.15rem;}
h6.card-dap-title{font-size:1rem;}

.form-control-xs{
    min-height: calc(1.2em + 0.35rem + calc(var(--bs-border-width) * 2));
    max-height: 27px;
    padding: 0.15rem 0.4rem;
    font-size: 0.75rem;
    line-height: 1.2;
    /* border-radius: calc(var(--bs-border-radius-sm) - 1px); */
}

.form-dap-control-xs{
    height: 27px;
    min-height: 27px;
    padding: 0.15rem 0.45rem;
    font-size: 0.75rem;
    line-height: 1.1;
    border-radius: .35rem;
}
select.form-control-xs{
    padding-right: 1.5rem;
}

/* =====================================================
   v0.0.2 - Button Groups & Toolbar
   ===================================================== */

/* =====================================================
   Button Groups - DAP
   ===================================================== */

.btn-dap-group,
.btn-dap-group-vertical {
    position: relative;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: middle;
}

.btn-dap-group > .btn-dap,
.btn-dap-group-vertical > .btn-dap {
    position: relative;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

.btn-dap-group > .btn-dap:hover,
.btn-dap-group-vertical > .btn-dap:hover {
    z-index: 1;
}

.btn-dap-group > .btn-dap:focus,
.btn-dap-group > .btn-dap:active,
.btn-dap-group > .btn-dap.active,
.btn-dap-group-vertical > .btn-dap:focus,
.btn-dap-group-vertical > .btn-dap:active,
.btn-dap-group-vertical > .btn-dap.active {
    z-index: 1;
}

.btn-dap-group > .btn-dap:not(:first-child),
.btn-dap-group > .btn-dap-group:not(:first-child) {
    margin-left: -1px;
}

.btn-dap-group > .btn-dap:not(:last-child):not(.dropdown-toggle),
.btn-dap-group > .btn-dap-group:not(:last-child) > .btn-dap {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-dap-group > .btn-dap:not(:first-child),
.btn-dap-group > .btn-dap-group:not(:first-child) > .btn-dap {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.btn-dap-group.show .dropdown-toggle {
    box-shadow: none;
}

/* =====================================================
   Vertical
   ===================================================== */

.btn-dap-group-vertical {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: center;
    justify-content: center;
}

.btn-dap-group-vertical > .btn-dap,
.btn-dap-group-vertical > .btn-dap-group {
    width: 100%;
}

.btn-dap-group-vertical > .btn-dap:not(:first-child),
.btn-dap-group-vertical > .btn-dap-group:not(:first-child) {
    margin-top: -1px;
}

.btn-dap-group-vertical > .btn-dap:not(:last-child):not(.dropdown-toggle),
.btn-dap-group-vertical > .btn-dap-group:not(:last-child) > .btn-dap {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.btn-dap-group-vertical > .btn-dap:not(:first-child),
.btn-dap-group-vertical > .btn-dap-group:not(:first-child) > .btn-dap {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

/* =====================================================
   Toolbar de botones - DAP
   ===================================================== */

.btn-dap-toolbar {
    display: -ms-flexbox;
    display: flex;

    -ms-flex-wrap: wrap;
    flex-wrap: wrap;

    -ms-flex-pack: start;
    justify-content: flex-start;

    gap: .25rem;
}

.btn-dap-toolbar .input-group {
    width: auto;
}

.btn-dap-toolbar > .btn-dap-group,
.btn-dap-toolbar > .btn-dap-group-vertical {
    margin-right: .25rem;
}

.btn-dap-toolbar > .btn-dap-group:last-child,
.btn-dap-toolbar > .btn-dap-group-vertical:last-child {
    margin-right: 0;
}