/**
 * Stylesheet for mcashop.mx
 *
 * Defines the visual presentation of the mcashop.mx platform,
 * including layout, typography, color schemes, and components.
 *
 * @property  mcashop.mx
 * @author    Gabino Sarmiento
 * @version   3.0
 * @updated   2025-08-27
 */

@import url(../fonts/roboto/roboto.css);
body, html {
   height: 100%
}
loader, process {
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
   position: fixed;
   z-index: 9999;
   bottom: 0;
   right: 0
}
.h1, .h2, .h3, .h4, .h5, .h6, p:last-child {
   margin-bottom: 0
}
.h1, h1 {
   font-size: 2.25rem
}
.h2, h2 {
   font-size: 2rem
}
.h3, .list-payment i, h3 {
   font-size: 1.75rem
}
.h4, h4 {
   font-size: 1.5rem
}
.h5, h5 {
   font-size: 1.25rem
}
.h6, h6 {
   font-size: 1rem
}
.avatar, .avatar-button, .btn-modules {
   text-align: center
}
.avatar-button, .img-loading, .showme {
   opacity: 0
}
.avatar-button, .img-loading, .showme {
   transition: .3s
}
html {
   position: relative
}
body {
   font-family: Roboto, sans-serif
}
loader {
   background: url('assets/radar.svg') center no-repeat rgba(255, 255, 255, .8)
}
process {
   background: url('assets/radar.svg') center no-repeat
}
.btn-modules {
   margin: 30px
}
.btn-modules .btn {
   margin: 4px 2px
}
.logo {
   width: 200px
}
.logo-sm {
   width: 126px
}
.wrapper {
   width: 100%;
   position: relative;
   padding-bottom: 60px;
   transition: 0.3s
}
.dashboard {
   width: 100%;
   position: relative;
   padding-bottom: 70px;
   min-width: 100%;
   min-height: 100vh;
}
.img-container {
   width: 100%;
   max-height: 100%;
   position: relative;
   display: block;
   overflow: hidden;
}
.img-loading {
   filter: blur(10px)
}
.img-loading.loaded {
   opacity: 1;
   filter: blur(0)
}
.version {
   bottom: 0;
   width: 100%;
   height: 50px;
   color: #212529;
   display: flex;
   position: absolute;
   align-items: center;
   justify-content: center
}
.media-banner {
   width: 100%;
   min-height: 172px;
   border-radius: 10px;
   margin-bottom: 16px;
   overflow: hidden;
   position: relative
}
.avatar, .media-logo {
   width: 100px;
   height: 100px;
   overflow: hidden
}
.media-logo {
   top: -30%;
   left: 30px;
   position: absolute;
   border-radius: 50%;
   border: 4px solid #fff
}
.avatar {
   position: relative;
   margin-bottom: 10px
}
.avatar-button, .showme, .showname {
   position: absolute
}
.avatar-circle {
   border-radius: 50%
}
.avatar-square {
   border-radius: 10px
}
.avatar-border {
   border: 1px solid #dee2e6
}
.avatar-button {
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   width: 100%;
   height: 100%
}
.avatar-input {
   display: none
}
.avatar-input+label {
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   margin: 0;
   color: #054f9d;
   display: flex;
   justify-content: center;
   align-items: center;
   cursor: pointer;
   position: absolute;
   background: rgba(255, 255, 255, .6)
}
.box .table-header, .table-sticky thead {
   background-color: #f6f6f6;
}
.avatar:hover .avatar-button, .media:hover .avatar-button, .showhim:hover .showme {
   opacity: 1
}
.showname {
   bottom: 0;
   width: 100%;
   padding: 6px 8px;
   font-size: 12px;
   line-height: 1;
   background-color: #e9ecef;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis
}
.showme {
   right: 0;
   padding: 4px 8px;
   border-radius: 0 0 0 8px;
   background-color: rgba(255, 255, 255, .9)
}
.required {
   color: #dc3545;
   font-size: 26px;
   vertical-align: middle
}
.required::before {
   content: "•"
}
.bg-image-administrative {
   background: url('assets/administrative.jpg') center/cover no-repeat
}
.bg-image-customer {
   background: url('assets/customer.jpg') center/cover no-repeat
}
.bg-image-reset {
   background: url('assets/reset.jpg') center/cover no-repeat
}
.section-message {
   color: #054f9d;
   font-weight: 300;
   font-size: 18px
}
.box {
   width: 100%;
   background: #fff;
   position: relative;
   border: 1px solid #dee2e6;
   border-radius: .625rem;
   margin-bottom: 1rem;
   overflow: hidden;
}
.box-header {
   padding: .75rem;
   display: block;
   background-color: #f6f6f6
}
.box-body {
   padding: 0
}
.box-body-padding {
   padding: 0 .75rem
}
.box-footer {
   padding: .75rem
}
.box-title {
   margin: 0;
   font-size: 1.125rem;
   line-height: 1;
   font-weight: 500
}
.box .pagination, .box .table {
   margin-bottom: 0
}
.sidebar-nav {
   padding-left: 0;
   list-style: none;
   position: relative;
   border-radius: 0.625rem;
   border: 1px solid #ebebeb;
   background-color: #ffffff;
   background-clip: border-box;
   margin-bottom: 20px;
}
.sidebar-link {
   display: block;
   padding: 8px 16px;
   cursor: pointer;
   position: relative
}
.sidebar-sublink {
   font-size: 14px;
   padding: 6px 16px
}
.sidebar-link:hover {
   color: #343a40;
   background-color: #f8f8f8
}
.sidebar-caret[aria-expanded=true]::after, .sidebar-close:hover {
   transform: rotate(90deg)
}
.sidebar-caret::after {
   content: "";
   width: 16px;
   height: 16px;
   right: 16px;
   top: calc(50% - 8px);
   position: absolute;
   background-image: url('assets/caret.svg');
   background-size: 16px 16px;
   background-repeat: no-repeat;
   transition: transform .3s
}
.sidebar-link, .sidebar-sublink {
   width: 100%;
   color: #343a40;
   display: block;
}
.sidebar-nav li:first-child .sidebar-link {
   border-top-left-radius: .625rem;
   border-top-right-radius: .625rem
}
.sidebar-nav li:last-child .sidebar-link {
   border-bottom-left-radius: .625rem;
   border-bottom-right-radius: .625rem
}
.navbar-bottom .dropdown-menu li:not(:last-child), .sidebar-item:not(:last-child) {
   border-bottom: 1px solid #ebebeb
}
.dropdown-menu .dropdown-item:first-child, .dropdown-menu li:first-child {
   border-top-left-radius: .625rem;
   border-top-right-radius: .625rem
}
.dropdown-menu .dropdown-item:last-child, .dropdown-menu li:last-child {
   border-bottom-left-radius: .625rem;
   border-bottom-right-radius: .625rem
}
.dashboard-title {
   font-size: 1.5rem
}
.mp-mercadopago-checkout-wrapper {
   background: rgba(0, 0, 0, .5)!important
}
#wallet_container button {
   font-weight: 300;
   font-family: inherit
}
#paypal_container {
   padding: 8px 0;
   line-height: 1
}
.text-Cancelado {
   color: #dc3545 !important
}
.progress-title {
   margin-bottom: 6px;
}
.progress-Cancelado {
   color: #dc3545;
}
.progress-Cancelado .progress-bar {
   background-color: #c7c7c7
}
.Bloqueado, .Cancelado, .Inactivo, .Revocado, .Vencido {
   color: #dc3545!important
}
.Pagado {
   color: #28a745!important
}
.Borrador {
   color: #ff5733!important
}
.Pausado {
   color: #17a2b8!important
}
.table-sticky thead {
   position: sticky;
   top: 0;
   z-index: 999
}
.table-container {
   overflow: auto;
   height: 524px
}
.table-container-small {
   overflow: auto;
   height: 350px
}
.list-inline {
   margin-bottom: 0.5rem;
}
@media (min-width:390px) {
   .card-columns {
      column-count: 3;
   }
}
@media (min-width:576px) {
   .card-columns {
      column-count: 4;
   }
}
@media (min-width:768px) {
   .card-columns {
      column-count: 5;
   }
}
@media (min-width:992px) {
   .card-columns {
      column-count: 6;
   }
}
@media (min-width: 1200px) {
   .card-columns {
      column-count: 7;
   }
}
@media (min-width: 1400px) {
   .card-columns {
      column-count: 8;
   }
}
@media (max-width:991.98px) {
   .logo {
      width: 120px
   }
}