:root {
    --blue: #072357;
    --red: #da141c;
    --tw-gradient-from: var(--blue);
    --tw-gradient-to: var(--red);

}

aside {
    z-index: 1;
}

.detailModal,
.createOrderModal {
    z-index: 9;

}

.from-purple-700 {
    --tw-gradient-from: var(--blue);
    --tw-gradient-to: white;
    --tw-gradient-stops: var(--blue), var(--red);
}

.bg-red-alert {
    background: #ff000061;
    color: white;
      -webkit-animation: random-red 1.5s infinite;
     animation: random-red 1.5s infinite;
}
.bg-red-alert .text-slate-400,
.bg-red-alert h6.mb-0.text-sm.leading-normal,
.bg-yellow-alert  .text-slate-400,
.bg-yellow-alert  h6.mb-0.text-sm.leading-normal
{
    color: white;
}
.bg-yellow-alert {
    background-color: #ffa50061;
    color: white;
         -webkit-animation: random-yellow 3s infinite;
     animation: random-yellow 3s infinite;
}
.bg-green-alert {

}
.detailModal__cont {
    min-width: 50%;
}
.detailModal__img {
    width: 20vw;
}

span.bg-gradient-to-tl.from-purple-700.to-pink-500.shadow-soft-2xl.mr-2.flex.h-\[15px\].w-\[15px\].items-center.justify-center.rounded-\[100\%\].bg-center.stroke-0.text-\[0\.6rem\].text-center.xl\:p-2\.5.notifications,
.notifications {
    border-radius: 100%;
    width: 15px;
    height: 15px;
    color: white;
    font-size: 0.6rem;
    font-weight: bold;
}

.main_logo {
    width: 140px;
}

.createForm {

}
.bidForm__close,
.editBidForm__close,
.createForm__close {
    background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1));

}
.createForm__save {
    background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1));

}

svg.m-2 {
    margin: 0 1rem;
}
.btn-new-order {
    width: 300px;
}


/* Estilos base para la tabla */
.orders-table {
  width: 100%;
  border-collapse: collapse;
  background: white;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  overflow: hidden;
}

/* Cabecera de la tabla */
.table-header {
  background-color: #f8f9fa;
  display: none; /* Ocultamos la cabecera en móviles */
}

.table-header-cell {
  padding: 12px 15px;
  text-align: left;
  font-weight: 600;
  color: #495057;
}

/* Filas de la tabla */
.table-row {
  display: block;
  border-bottom: 1px solid #e9ecef;
  padding: 15px 0;
}

.table-row:hover {
  background-color: #f8f9fa;
}

/* Celdas de la tabla */
.table-cell {
  display: block;
  padding: 8px 15px;
  text-align: right;
  position: relative;
}

.table-cell::before {
  content: attr(data-label);
  position: absolute;
  left: 15px;
  top: 8px;
  font-weight: 600;
  color: #495057;
  text-align: left;
}

/* Acciones especiales para la columna de acciones */
.table-actions {
  text-align: center;
}

.table-actions::before {
  display: none;
}

.actions-container {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

.action-link {
  color: #fff;
  padding: 5px 10px;
  border-radius: 4px;
  text-decoration: none;
  font-size: 0.85rem;
  white-space: nowrap;
}

.action-link.edit {
  background-color: #4299e1;
}

.action-link.delete {
  background-color: #f56565;
}

.action-link.view {
  background-color: #48bb78;
}

/* Mensaje cuando no hay órdenes */
.no-orders {
  text-align: center !important;
  color: #6c757d;
}

.no-orders::before {
  display: none;
}

.cont {
    padding-bottom: 3rem;
}

.logo-login {

}
.bg-login {
  border-radius: 0 0 .75rem .75rem;
  position: relative;
  margin: 0 auto;
  width: 100%;
}
.bg-login:before
 {
    content: ' ';
    background: white;
    height: 100%;
    position: absolute;
    top: 0;
    opacity: .6;
    width: 100%;
}
.main-guest {
  overflow: hidden;
}
.order-content {
  margin: 1rem auto;
}

.action-link .edit {
  
}


.content-form{
  height: 80vh;
}
.formu-cont{
margin-top: 4rem;
}
.image-register{
/* background: content-box; */
background-repeat: no-repeat;
}
.absolute.inset-x-0.top-0.z-0.h-\[80vh\].-ml-16.bg-cover.skew-x-10.image-register {
  background-size: cover;
  background: content-box;
  background: no-repeat;
}
.action-link {
  border-radius: 4px !important;
  padding: 0.7em !important;
  color: white !important;
  cursor: pointer;
  width: 80px;
  text-align: center;
  vertical-align: middle;
}
.action-link .ni {
  color: white;
  margin: 0 .1em;
}
.action-link.edit {
  background-color: #4299e1 !important;
}
.action-link.delete {
  background-color: #f56565 !important;
}
.action-link.view {
  background-color: #17ad37 !important;
}
.action-link.no-bid {
  background-color: grey !important;
}
.action-link.with-bid {
  background-color: grey !important;
}
/* Estilos para pantallas medianas/grandes (768px+) */
@media (min-width: 768px) {
  .orders-table {
    display: table;
  }
  
  .table-header {
    display: table-header-group;
  }
  
  .table-row {
    display: table-row;
    border-bottom-width: 1px;
    padding: 0;
  }
  
  .table-cell {
    display: table-cell;
    text-align: left;
    padding: 12px 15px;
  }
  
  .table-cell::before {
    display: none;
  }
  
  .table-actions {
    text-align: left;
  }
  
  .actions-container {
    justify-content: flex-start;
  }
  
  .action-link {
    color: inherit;
    background: none !important;
    padding: 0;
    border-radius: 0;
  }
  
  .action-link.edit {
    color: #4299e1;
  }
  
  .action-link.delete {
    color: #f56565;
  }
  
  .action-link.view {
    color: #48bb78;
  }
  
  .action-form {
    display: inline;
  }
}


@keyframes  random-red {
    from {
        background: white;
    }
    to {
            background: #ff000061;
    }
}
@keyframes  random-yellow {
    from {
        background: white;
    }
    to {
            background: #ffa50061;
    }
}
