:root {
  --c-text-primary: #282a32;
  --c-text-secondary: #686b87;
  --c-text-action: #404089;
  --c-accent-primary: #434ce8;
  --c-border-primary: #eff1f6;
  --c-border-secondary: rgba(0,0,0,.125);
  --c-background-primary: #fff;
  --c-background-secondary: #fff;
  --c-background-tertiary: #ecf3fe;
  --c-background-quaternary: #fff;
  --c-background-quinary: #fff;
  --c-background-senary: #e9ecf4;
  --image-brightness: 1;
  --image-invert: 0;
  --image-brightness-sec: 1;
  --miniature-brightness: 1;
  --miniature-invert: 0;
  --miniature-saturate: 1;
  --b-pay-box: #c5c5c514;
  --b-pay-box-border: #ebebeb;
}

  
:root.dark {
  --c-text-primary: #fff ;
  --c-text-secondary: rgba(255,255,255,0.8);
  --c-text-action: #8c8cd6 ;
  --c-accent-primary: #b0b5f9;
  --c-border-primary: #eff1f654;
  --c-border-secondary: #eff1f654;
  --c-background-primary: #111827;
  --c-background-secondary: #1E2835;
  --c-background-tertiary: #1f2937 ;
  --c-background-quaternary: #283041;
  --c-background-quinary: #1f2937 ;
  --c-background-senary: #3a445b;
  --image-brightness: 0;
  --image-invert: 1;
  --image-brightness-sec: 0.8;
  --miniature-brightness: 0.7;
  --miniature-invert: 1;
  --miniature-saturate: 0;
  --b-pay-box: #171d2b;
  --b-pay-box-border: #ebebeb42;
}

  
@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-moz-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-webkit-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-o-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-ms-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

* {
    font-family: 'Be Vietnam Pro', sans-serif;
}

a {
	text-decoration:none !important;
}

p, h1, h2, h3, h4 {
    margin: 0px;
}

img.platform-type {
    filter: brightness(var(--miniature-brightness)) invert(var(--miniature-invert)) saturate(var(--miniature-saturate));
}

#carga {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.7);
    display: none; /* Inicialmente oculto */
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.uf-free-badge {
    display: none !important;
}


#loading-content {
    max-width: 100%; /* Asegura que la imagen no sea más grande que el contenedor */
    max-height: 100%; /* Evita que la imagen se salga del contenedor */
    display: block; /* Cambio de flex a block; flex en el contenedor es suficiente */
}

.container.menu {
    position: relative;
}

/*SETTINGS PANEL*/
.settings-panel {
    display: block;
    position: absolute;
    top: 95px;
    right: auto;
    overflow: auto;
    max-width: 280px;
    width: 280px;
    cursor: auto;
    z-index: 1000;
    background-color: var(--c-background-quinary);
    box-shadow: 0 3px 3px 0 rgba(0,0,0,.05), 0 5px 15px 0 rgba(0,0,0,.05);
    border-radius: 8px;
    border: 1px solid rgba(0,0,0,.125);
}

#settings-panel-header {
    padding: 15px;
    font-size: 16px;
    margin-bottom: 0;
    color: var(--c-text-primary);
    font-weight: 500;
    border-bottom: 1px solid var(--c-border-primary);
    background-color: rgba(0,0,0,.03);
}

#settings-panel-body {
    padding: 30px 30px 10px 30px;
}

.text-c2.sp {
    font-size: 13px;
    margin-bottom: 25px;
    font-weight: 600;
}

.sp-icon {
    margin-right: 10px;
	color: var(--c-text-action);
	font-size:15px;
}

span.text-sp {
    transition: 0.3s;
}

span.text-sp:hover {
    color: var(--c-accent-primary);
	margin-left: 3px;
}

a.settings-link {
    color: var(--c-text-primary);
}

p.title-sp {
    color: var(--c-text-primary);
	    margin: 0px;
}

.logout-link-s{
	position: absolute;
	right: 20px;
	top: 20px;
	font-size: 16px;
}

i.fa-solid.fa-right-from-bracket.logout{
	color: #fff;
	transition: .15s ease;
}

i.fa-solid.fa-right-from-bracket.logout:hover{
	opacity:0.5;
}

/*AVATAR PANEL*/
.account-info-panel {
    display: block;
    position: absolute;
    top: 95px;
    right: 45px;
    overflow: auto;
    max-width: 280px;
    width: 280px;
    cursor: auto;
    z-index: 999;
    background-color: var(--c-background-quinary);
    box-shadow: 0 3px 3px 0 rgba(0,0,0,.05), 0 5px 15px 0 rgba(0,0,0,.05);
    border-radius: 8px;
    border: 1px solid rgba(0,0,0,.125);
}

div#account-info-header {
    padding: 30px 30px;
    background-color: #404089;
}

div#avatar-info-body {
	padding: 30px 30px 15px 30px;
}

p.h-u-plan {
    background-color: #f2f2f2;
    display: inline-block;
    padding: 8px 15px 8px;
    margin-bottom: 15px;
    border-radius: 5px;
    font-weight: 600;
    margin-top: 5px;
    color: #374cd1;
    font-size: 13px;
}

span.text-ap {
    font-size: 13px;
    font-weight: 600;
    transition: 0.3s;
    margin-bottom: 20px;
    display: inline-flex;
    gap: 7px;
}

span.text-ap:hover {
    color: var(--c-accent-primary);
	margin-left: 3px;
}

p.h-u-name {
    color: #fff;
    font-size: 16px;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 245px;
	font-weight: 500;
	margin-bottom: 15px;
}

p.h-u-email {
    color: #fff;
    font-size: 12px;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 245px;
}

/*AVATAR PANEL- popup*/
p.title-avatar-h {
    font-size: 18px;
    text-align: center;
    margin-bottom: 20px;
	margin-top: 10px;
}

img.avatar-image-e {
    margin-left: auto;
    margin-right: auto;
    border-radius: 50px;
}

.avatar-image-container {
    margin-bottom: 10px;
}

.avatar-restore-container, .avatar-upload-container, .avatar-file-container {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.avatar-file-container {
    border-bottom: 1px solid var(--c-border-primary);
    padding: 20px 0px 30px 0px;
    max-width: 90%;
}

.avatar-file-container-inner {
    max-width: 70%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: auto;
}

#restore_avatar{
	background-color:transparent;
	border-style:none;
	font-size:11px;
	color: var(--c-text-action);
	font-weight:500;
	cursor: pointer;
}

.avatar-upload-container {
    margin-top: 25px;
    margin-bottom: 20px;
}

input.button.upload-av {
    cursor: pointer;
}

input.button.upload-av:hover {
    border-color: var(--c-accent-primary) !important;
    color: var(--c-accent-primary) !important;
}

.avatar-file-container-text {
    padding-left: 25px;
    padding-right: 25px;
    margin-bottom: 15px;
    margin-top: 30px;
}

p.file-container-text {
    font-size: 12px;
    line-height: 1.7em;
}

span#file-chosen {
    font-size: 12px;
}

#frontend-avatar-form .upload-btn {
    font-size: 12px;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: 15px;
    cursor: pointer;
	height: 35px;
}

.popup-med-avatar .upload-btn i{
	font-size:12px;
}

/*START ICON HAMBURGER CSS*/
.hamburguer {
  transition: 300ms ease-in-out;
  cursor: pointer;
}

.hamburguer span {
  position: absolute;
  background: var(--c-text-action);
  left: 0;
  transition: 300ms ease-in-out;
}

.hamburguer span:nth-child(1) {
    top: 12px;
    width: 20px;
    margin-left: 10px;
    height: 3px;
}

.hamburguer span:nth-child(2) {
    top: 19px;
    width: 20px;
    margin-left: 10px;
    height: 3px;
}

.hamburguer span:nth-child(3) {
    top: 26px;
    width: 20px;
    margin-left: 10px;
    height: 3px;
}

.hamburguer.open span:nth-child(1) {
    top: 12px;
    width: 14px;
    margin-left: 10px;
    height: 3px;
}

.hamburguer.open span:nth-child(2) {
    top: 19px;
    width: 10px;
    margin-left: 10px;
    height: 3px;
}

.hamburguer.open span:nth-child(3) {
    top: 26px;
    width: 18px;
    margin-left: 10px;
    height: 3px;
}
/*END ICON HAMBURGER CSS*/

/*START BREADCRUMB CSS*/


.main .breadcrumb-navigation{
	margin-bottom:30px;
	margin-top:5px;
}


.main .breadcrumb-navigation span{
	font-size:16px;
	margin-left:20px;
	color: var(--c-text-action);
}


.breadcrumb-navigation .breadcrumb i{
	font-size:12px;
}


.current-site{
	color: var(--c-text-action);
	display:inline-block;
}


.main h2 i{
	margin-left:10px!important;
	font-size:16px !important;
}

.main h2 span{
	margin-left:10px;
}

.main p .br-separator{
	display:inline-block;
	margin-left:5px;
	margin-right:5px;
}

.main p a{
	color: var(--c-text-secondary);
}

/*END BREADCRUMB CSS*/


  
/* Mode switch */
.header-navigation-actions .icon-button .mode-switch-icon{
	background-color:transparent;
	border-style:none;
    cursor:pointer;
}
  
/* Button */
.header-navigation-actions .button, .header-navigation-actions .icon-button, .main .button{
	text-decoration:none;
}

#sidebar-wrapper {
    top: 30px;
    position: sticky;
	margin-right: 1.5em;
}

p.subtitle-website.small{
	width: 100%;
}

label.toggle-check{
	margin-right: 10px;
}

.card-grid div h3{
	font-size:15px;
}

.tab-content{
	display: none;
	opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s, transform 0.5s;
}

.tab-content.active{
	display: block;
	opacity: 1;
    transform: translateY(0);
}

span.icon-vt {
    margin-left: 3px;
}

/* Link */
.main .vertical-tabs a{
	margin-top:0px;
	margin-bottom: 20px;
	font-size:16px;
	height:25px;
	max-width: 175px;
}

/* Header menu nav */
.header .header-logo .header-menu-nav{
	display:inline-block;
	margin-right:25px;
}

/* Image */
.header-logo a img{
	display:inline-block;
	    margin-top: 5px;
}

/* Header logo */
.header .header-logo{
	display:inline-flex;
}

/* Image */
.header-logo a img{
	filter: brightness(var(--image-brightness)) invert(var(--image-invert));
	transition-duration:0.3s;
}
  
.moon {
  stroke: var(--c-text-action);
  margin-top: 4px;
}
  
.moon:hover {
  stroke: var(--c-accent-primary);
}

.icon-button.active .moon {
    fill: var(--c-text-action);
}
  
input#is-search-input-789 {
    background: transparent;
}

body {
  min-height: 100vh;
  font-family: "Be Vietnam Pro", sans-serif;
  background-color: var(--c-background-primary);
  color: var(--c-text-primary);
  margin: 0px;
}

p {
  color: var(--c-text-secondary);
}
  
img {
  display: block;
  max-width: 100%;
}

:focus {
  outline: 0;
}

.responsive-wrapper {
  width: 95%;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.text-se.toggled{
	font-size:0px;
	transition: all 0.3s ease;
	margin-left: 0px;
}

.content-panel.toggled{
	width: 55px;
	margin-right: 2rem;
	transition: all 0.3s ease;
}

.content-panel {
  display: none;
  max-width: 280px;
  width: 15%;
  padding: 2rem 0rem;
  transition: all 0.3s ease;
}

@media (min-width: 800px) {
  .content-panel {
    display: block;
  }
}

.text-se{
	transition: all 0.3s ease;
	margin-left: 15px;
}

.header {
  display: flex;
  align-items: center;
  height: 100px;
  border-bottom: 1px solid var(--c-border-primary);
  background-color: var(--c-background-primary);
  animation: fadeIn 0.5s;
  -webkit-animation: fadeIn 0.5s;
  -moz-animation: fadeIn 0.5s;
  -o-animation: fadeIn 0.5s;
  -ms-animation: fadeIn 0.5s;
  transition: 0.3s;
}

.header-content {
  display: flex;
  align-items: center;
}

.header-logo {
  margin-right: 2.5rem;
}
.header-logo a {
  display: flex;
  align-items: center;
}
.header-logo a div {
  flex-shrink: 0;
  position: relative;
}
.header-logo a div:after {
  display: block;
  content: "";
  position: absolute;
  left: 0;
  top: auto;
  right: 0;
  bottom: 0;
  overflow: hidden;
  height: 50%;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  background-color: rgba(255, 255, 255, 0.2);
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
}

.header-navigation {
  display: flex;
  flex-grow: 1;
  align-items: center;
  justify-content: space-between;
}

.header-navigation-actions {
  display: flex;
  align-items: center;
}
.header-navigation-actions > .avatar {
  margin-left: 0.75rem;
}
.header-navigation-actions > .icon-button + .icon-button {
  margin-left: 0.25rem;
}
.header-navigation-actions > .button + .icon-button {
  margin-left: 1rem;
}

.button {
  font: inherit;
  color: inherit;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 1em;
  height: 36px;
  border-radius: 8px;
  line-height: 1;
  border: 2px solid var(--c-border-primary);
  color: var(--c-text-action);
  font-size: 0.875rem;
  transition: 0.15s ease;
  background-color: transparent;
  font-weight: 500;
}
.button i {
  margin-right: 0.5rem;
  font-size: 1.25em;
}
.button span {
  font-weight: 500;
}
.button:hover, .button:focus {
  border-color: var(--c-accent-primary);
  color: var(--c-accent-primary);
}

.icon-button {
  font: inherit;
  color: inherit;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  color: var(--c-text-action);
  transition: 0.15s ease;
  font-size: 1.25em;
}
.icon-button i {
  font-size: 1em;
}
.icon-button:focus, .icon-button:hover {
  background-color: var(--c-background-tertiary);
  color: var(--c-accent-primary);
}

.avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  overflow: hidden;
}

.main {
  background: var(--c-background-primary);
  animation: fadeIn 0.5s;
  -webkit-animation: fadeIn 0.5s;
  -moz-animation: fadeIn 0.5s;
  -o-animation: fadeIn 0.5s;
  -ms-animation: fadeIn 0.5s;
  transition: 0.3s;
  border-bottom: 1px solid var(--c-border-primary);
  min-height:85vh;
}

.main .card-grid article{
	position:relative;
}

.main-header h1 {
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 1.25;
}
@media (max-width: 550px) {
  .main-header h1 {
    margin-bottom: 1rem;
  }
}

.search {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
	justify-content: flex-end;
}
.search input {
  font: inherit;
  color: inherit;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 1em 0 36px;
  height: 40px;
  border-radius: 8px;
  border: 2px solid var(--c-border-primary);
  color: var(--c-text-action);
  font-size: 0.875rem;
  transition: 0.15s ease;
  width: 100%;
  line-height: 1;
}
.search input::-moz-placeholder {
  color: var(--c-text-action);
}
.search input:-ms-input-placeholder {
  color: var(--c-text-action);
}
.search input::placeholder {
  color: var(--c-text-action);
}
.search input:focus, .search input:hover {
  border-color: var(--c-accent-primary);
}
.search button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background-color: transparent;
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.25em;
  color: var(--c-text-action);
  padding: 0;
  height: 40px;
}

.horizontal-tabs {
  margin-top: 0.1rem;
  margin-bottom: 2.5rem;
  display: flex;
  align-items: center;
  overflow-x: auto;
  border-bottom: 1px solid var(--c-border-primary);
}
@media (max-width: 1000px) {
  .horizontal-tabs {
    scrollbar-width: none;
    position: relative;
  }
  .horizontal-tabs::-webkit-scrollbar {
    display: none;
  }
}
.horizontal-tabs a {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  height: 48px;
  padding: 0 0.25rem;
  font-weight: 500;
  color: inherit;
  border-bottom: 3px solid transparent;
  text-decoration: none;
  transition: 0.15s ease;
  color: var(--c-text-primary);
  margin-right:20px;
  font-size:16px;
}
.horizontal-tabs a:hover, .horizontal-tabs a:focus, .horizontal-tabs a.active {
  color: var(--c-accent-primary);
  border-bottom-color: var(--c-accent-primary);
}
.horizontal-tabs a + * {
  margin-left: 1rem;
}

.main .content-header {
    margin-bottom: 35px;
}

.content-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.content-header-intro {
	display:inline-block;
	width:50% !important;
}

.content-header-intro h2 {
  color: var(--c-text-primary);
  font-size: 1.25rem;
  font-weight: 600;
	margin-top: 1.25rem;
	    margin-bottom: 15px;
}

.content-header-intro p {
  color: var(--c-text-secondary);
  margin-top: 0.25rem;
  font-size: 0.875rem;
  margin-bottom: 1rem;
}

.main .content-header-actions{
	display:inline-block;
	float:right;
}

@media (min-width: 800px) {
  .content-header-actions a:first-child {
    display: none;
  }
}

.content {
  display: flex;
  align-items: flex-start;
}

.vertical-tabs {
  display: flex;
  flex-direction: column;
}
.vertical-tabs a {
  display: flex;
  align-items: center;
  padding: 0.75em 1em;
  background-color: transparent;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 500;
  color: var(--c-text-action);
  transition: 0.15s ease;
}
.vertical-tabs a:hover, .vertical-tabs a:focus, .vertical-tabs a.active {
  background-color: var(--c-background-tertiary);
  color: var(--c-accent-primary);
}
.vertical-tabs a + * {
  margin-top: 0.25rem;
}

.content-main {
    padding-top: 2rem;
    padding-bottom: 4rem;
    padding-left: 3rem;
    flex-grow: 1;
    width: 1475px;
    border-left: 1px solid var(--c-border-primary);
	min-height: 75vh;
}

.card-grid article{
	background: var(--c-background-quaternary);
}

.card-grid.one-column {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
  row-gap: 1.5rem;
  margin-bottom: 2.5rem;
}

.card-grid.two-columns {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
  row-gap: 1.5rem;
  margin-bottom: 2.5rem;
}

.card-grid.three-columns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
  row-gap: 1.5rem;
  margin-bottom: 2.5rem;
}

.card-grid.four-columns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
  row-gap: 1.5rem;
  margin-bottom: 2.5rem;
}

.card-grid div h3{
	margin-top:3px;
}

@media (min-width: 600px) {
  .card-grid.four-columns {
    grid-template-columns: repeat(2, 1fr);
  }
  .card-grid.three-columns {
    grid-template-columns: repeat(2, 1fr);
  }
  .card-grid.two-columns {
    grid-template-columns: repeat(2, 1fr);
  }
  .card-grid.one-column {
    grid-template-columns: repeat(1, 1fr);
  }
}
@media (min-width: 1200px) {
  .card-grid.four-columns {
    grid-template-columns: repeat(4, 1fr);
  }
  .card-grid.three-columns {
    grid-template-columns: repeat(3, 1fr);
  }
  .card-grid.two-columns {
    grid-template-columns: repeat(2, 1fr);
  }
  .card-grid.one-column {
    grid-template-columns: repeat(1, 1fr);
  }
}

.card {
  background-color: var(--c-background-quinary);
  box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.05), 0 5px 15px 0 rgba(0, 0, 0, 0.05);
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(0,0,0,.125);
  background-clip: border-box;
}

.card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 1.5rem;
  background-color: var(--c-background-secondary);
  border-bottom: 1px solid rgba(0,0,0,.125);
}
.card-header div {
  display: flex;
  align-items: center;
}

.card-header div h3 {
  margin-left: 0.75rem;
  font-weight: 500;
  color: var(--c-text-primary);
}

.toggle-check{
	position: relative;
	display: inline-block;
	width: 65px;
	height: 24px;
	display:flex;
	margin-top:5px;
	justify-content:flex-end;
}

.toggle-check .switch{
	display: block;
	width: 40px;
	height: 100%;
	background-color: var(--c-background-senary);
	border-radius: 99em;
	transition: 0.4s;
	cursor:pointer;
	box-shadow: inset 1px 1px 1px 0 rgba(0, 0, 0, 0.05);
}

.toggle-check .slider{
	position: absolute;
	top: 3px;
	right: 19px;
	width: 18px;
	height: 18px;
	background-color: var(--c-background-primary);
	border-radius: 50%;
	transition: 0.2s;
	cursor:pointer;
}

.toggle-check .slider.hotlink {
    left: 24px;
}

.toggle-check input:checked + .switch{
	background-color: var(--c-accent-primary);
}

.toggle-check input:checked + .switch + .slider{
	right: 3px;
}

.toggle-check input:focus + .switch{
	box-shadow: 0 0 0 4px var(--c-background-tertiary);
}

.card-grid p input[type=checkbox]{
	visibility:hidden;
}

.toggle-check .switch.active{
	background-color: var(--c-accent-primary);
}

.toggle-check .slider.active{
	left:28px;
}

.card-body {
  padding: 1rem 1.5rem;
  font-size: 0.875rem;
  background: var(--c-background-quaternary);
	height: 95px;
}

.card-footer {
  margin-top: auto;
  padding: 1rem 1.25rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  border-top: 1px solid var(--c-border-primary) !important;
  background-color: var(--c-background-secondary) !important;
}
.card-footer a {
  color: var(--c-text-action);
  text-decoration: none;
  font-weight: 500;
  font-size: 0.875rem;
}

.card-footer.websites {
    justify-content: flex-start;
}

html::-webkit-scrollbar {
  width: 12px;
}
html::-webkit-scrollbar-thumb {
  background-color: var(--c-text-primary);
  border: 4px solid var(--c-background-primary);
  border-radius: 99em;
}


/* CSS CUSTOMIZED BY ME - MOSTLY MAIN DASHBOARD PAGE */

i.fa-solid.fa-caret-up,
span.text-c1 {
    margin-right: 5px;
}
.card-header.blank {
    border-style: none;
    background: var(--c-background-quaternary) !important;
}
.card-header.dash {
    border-bottom: 0;
}
span.text-c1 {
    font-size: 20px;
    font-weight: 800;
}
span.icon-c1 {
    position: relative;
    display: inline-block;
    width: 65px;
    height: 24px;
    display: flex;
    margin-top: 5px;
    justify-content: flex-end;
    font-size: 25px;
    margin-right: 15px;
    color: var(--c-text-secondary);
}
p.text-c2,
p.uptime-status {
    color: var(--c-text-primary);
    font-size: 16px;
    font-weight: 700;
}
p.text-c2.stats {
    margin-bottom: 25px;
	margin-top: 10px;
}
p.text-c3 {
    color: var(--c-accent-primary);
}

p.text-c2.plan {
    margin-top: 10px;
}
span.text-c1-5 {
    display: inline-flex;
    justify-content: flex-start !important;
    width: 100px !important;
    align-items: center;
    font-size: 18px;
    color: var(--c-text-secondary);
	margin-top: 10px;
	margin-left: -2.5rem;
}

p.text-c4 {
    font-weight: 700;
    color: var(--c-text-primary);
}
p.text-c4 {
    font-size: 17px;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    vertical-align: baseline;
}
span.icon-c2 {
    font-size: 20px;
    margin-right: 10px;
    color: var(--c-text-secondary);
}
span.text-c3 {
    color: var(--c-accent-primary);
    font-size: 15px;
    width: 75px;
    line-height: 2;
}
.title-domain,
p.stats-site {
    color: var(--c-text-primary);
}
i.fa-solid.fa-caret-right {
    font-size: 10px;
    margin-left: 5px;
	margin-right: 5px;
}
.card-body.blank.no-padding {
    padding: 0;
    height: auto;
}
img.image-site.small {
    top: 0;
    max-height: 100px;
	min-height: 100px;
}
.domain-row,
.site-row {
    position: relative;
    border-top: 1px solid var(--c-border-primary) !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    clear: both;
    height: auto;
}
.column-three,
.column-two {
    padding-right: 15px;
    display: inline-flex;
}
.column-one {
    float: left;
    width: 25%;
    align-self: stretch;
    align-items: center;
}
.column-two {
    width: 60%;
    padding-left: 15px;
    align-items: center;
    flex-wrap: wrap;
    align-self: center;
}
.column-three {
    width: 15%;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    float: left;
    flex-wrap: nowrap;
    display: flex;
    flex-direction: row;
}
.title-website.small,
span.icon-button.small {
    justify-content: center;
    align-self: center;
    display: inline-flex;
    font-size: 13px;
}
span.icon-button.small {
    float: left;
    width: 25px;
    padding-right: 7px;
    padding-left: 7px;
}
.title-website.small {
    margin-top: 0 !important;
    font-weight: 600;
}
.subtitle-domain,
.subtitle-website {
    padding-bottom: 0;
    font-size: 12px;
    font-weight: 400;
}
.domain-row {
    padding: 26.5px;
}
.column-one.domains {
    width: 90%;
}
.column-two.domains {
    width: 10%;
}
.title-domain {
    font-size: 17px;
    display: inline-flex;
    align-self: center;
    justify-content: center;
    margin-top: 0 !important;
    font-weight: 600;
    padding-bottom: 10px;
}
.card-body.blank {
    height: auto;
}
.card-body.blank.stats {
    padding: 0 1rem 2rem;
    display: inline-flex;
}
.stats-container {
    width: 50%;
    padding: 1.5rem;
    border: 1px solid var(--c-border-secondary);
    border-radius: 10px;
    margin: 1rem;
}
.storage-used {
    padding-bottom: 10px;
	font-weight: 500;
}
.stats-graph-container {
    display: flex;
}
.stats-graph-container-column-one {
    width: 20%;
    align-items: center;
    display: inline-flex;
    flex-wrap: wrap;
    height: 30px;
}
.stats-graph-container-column-two {
    width: 80%;
    align-items: center;
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    height: 30px;
}
.stats-intro {
    display: inline-block !important;
}
.card-header.stats.blank,
.card-header.status.blank {
    padding: 2.5rem 2.25rem 0 !important;
}
p.subtext-c4 {
    margin-top: 10px;
    margin-bottom: 20px;
    font-size: 0.875rem;
}
.user-greetings {
    font-size: 25px !important;
}
.status-container {
    width: 33.33%;
    padding: 1.5rem;
    border: 1px solid var(--c-border-secondary);
    border-radius: 10px;
    margin: 1rem;
}
a.button.status-page {
    background-color: transparent;
    width: 100%;
}
.card-body.blank.stats.storage {
    padding-bottom: 0.5rem;
}
.uptime-percentage {
    background-color: #eff6ff;
    display: inline-block;
    padding: 7px 15px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    border: 1px solid #3b82f6;
    color: #3b82f6;
    margin-top: 10px;
}
.status-intro.column-one {
    width: 80%;
    display: inline-block;
}
.status-intro.column-two {
    width: 20%;
    justify-content: flex-end;
    padding: 0;
}
.status-page > span {
    width: 100% !important;
}
.stats-sites-container-column-one {
    width: 65%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: inline-flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 30px;
}
.stats-sites-container-column-two {
    width: 35%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: inline-flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 30px;
    justify-content: flex-end;
}
.stats-sites-container {
    display: flex;
    margin-bottom: 0;
}
p.stats-site {
    font-size: 13px;
    font-weight: 500;
}
i.fa-solid.fa-sliders.icon-sites-s {
    font-size: 15px;
    margin-left: 0;
}
i.fa-solid.fa-arrow-up-right-from-square.icon-sites-s {
    font-size: 13px;
    margin-left: 0;
}

p.uptime-status{
	margin-bottom: 15px;
}

p.uptime-component {
    margin-bottom: 20px;
}

.add-new-btn{
	padding-top:5px;
	padding-bottom:5px;
	padding-left:20px;
	padding-right:20px;
	height:30px;
	margin-top: 30px;
	gap: 8px;
}

p.upgrade-plan-feature {
    font-size: 14px;
    margin-bottom: 15px;
}

/* CSS CUSTOMIZED BY ME - NOTIFICATIONS PANEL */

.woocommerce-error::before, 
.woocommerce-info::before, 
.woocommerce-message::before {
    display: inline-block;
    position: absolute;
    top: 1em;
    left: 1.5em;
    width: 1.3em; /* Tamaño del icono */
    height: 1.3em; /* Tamaño del icono */
    background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"%3E%3Cpath fill="%236971e0" d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z"/%3E%3C/svg%3E') no-repeat center center;
    background-size: contain; /* Ajusta el tamaño del SVG */
    content: ''; /* Limpia el contenido */
}


.woocommerce .woocommerce-error, .woocommerce .woocommerce-info, .woocommerce .woocommerce-message{
	background: var(--c-background-secondary);
    border: 1px solid rgba(0, 0, 0, .125);
    border-radius: 8px;
    font-size: 14px !important;
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, .05), 0 5px 15px 0 rgba(0, 0, 0, .05) !important;
    font-weight: 500;
    font-family: 'Be Vietnam Pro', sans-serif;
	color: var(--c-text-primary) !important;
	margin: 0 0 2em !important;
}

.woocommerce-info{
	background: #6971e01c !important;
}

.woocommerce-error{
	background: #ff4b4b1c !important;
}

i.fa-solid.fa-circle-info.notices, i.fa-solid.fa-circle-xmark.notices{
	margin-right: 5px;
}

img.image-no-data-yet-latest{
	max-width: 25px;
	margin-right: 8px;
}

span.text-no-data-yet-latest{
	color: var(--c-text-secondary);
	line-height: 2em;
}

.popup-full .popup-full-content-header.add-platform{
	margin-top: 20%;
}

a.button.upb {
    width: 100%;
    max-width: 500px;
    height: 50px;
    font-size: 17px;
}

/* 404 */

article.card.\34 04{
	max-width: 800px;
	margin: 100px auto;
}

.card-body.blank.\34 04{
	padding: 3rem;
	text-align: center;
}

h1.\34 04.head {
	font-size:85px;
}

h2.\34 04.body-first {
	margin-bottom:30px;
}

h2.\34 04.body-second {
	margin-bottom:30px;
}

p.\34 04.text {
	margin-bottom:30px;
}


/* Styles for warning boxes */

.whatsnext {
	padding: 25px;
	border-radius: 8px;
	border: 1px solid var(--c-border-secondary);
	margin-bottom: 50px;
}

p.text-c4.whatsnext-title {
	margin-bottom: 20px;
	font-size: 15px;
}

p.subtext-c4.whatsnext-body {
	margin: 0px;
    font-weight: 400;
    font-size: 13px;
    line-height: 2em;
    padding-bottom: 5px;
    padding-top: 5px;
}

.whatsnext.warning {
    margin-bottom: 30px;
    background-color: rgba(252, 195, 145, 0.1);
	padding: 20px;
	overflow: hidden;
}

.text-c4.whatsnext-title.warning {
    color: #cb700f;
	margin-bottom:0px;
	cursor: pointer;
}

.whatsnext-body-container{
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.5s ease-in-out;
}

.whatsnext-body-container.expanded{
	max-height: 500px;
}

p.subtext-c4.whatsnext-body.first{
	margin-top:20px;
}

span.cte {
	font-size:10px;
	font-weight:300;
	color: var(--c-text-secondary);
	font-style:italic;
	display:inline-block;
	margin-left:7px;
}

.rotate-icon{
	transform: rotate-y(180deg);
}

i.fa-solid.fa-chevron-down.acc-i{
	font-size:18px;
	float:right;
	transition: transform 0.5s ease-in-out;
}

i.fa-solid.fa-triangle-exclamation {
    font-size: 18px;
    margin-right: 5px;
}

.rotate-icon{
	transform: rotateX(180deg);
	transition: transform 0.5s ease;
}

.nd-content{
	filter:blur(2px);
}

.bgtextnc {
	 font-weight: 300 !important;
    font-size: 13px !important;
    color: var(--c-text-secondary) !important;
    margin-top: 12px !important;
    margin-bottom: 27px !important;
}

img.p-m-m-image {
    display: inline-block;
}


/* Estilos módulo de empresa */

#empresa-overlay {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.5);
  z-index: 9999;
  align-items: center;
  justify-content: center;
}

.empresa-loader {
  border: 8px solid #f3f3f3;
  border-top: 8px solid #3498db;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

select#empresa-select {
    width: 300px;
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 16px;
	font-weight: 600;
	margin-right: 15px;
}

a.button.gestionar-empresas {
    padding: 0em;
    height: 40px;
    width: 45px;
    border-radius: 5px;
    margin: 5px;
}


/* Estilos a mayores para sidebar childs and parents */

a.sidebar-element.child{
	margin-left: 10px;
	font-size: 15px;
	margin-bottom: 10px;
}

.sidebar-container-childs{
	border-left: 3px solid #eaeaea;
	margin-left: 25px;
	margin-bottom: 10px;
	max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}

a.sidebar-element.parent {
    margin-bottom: 8px;
}

a.sidebar-element.child.last {
    margin-bottom: 0px;
}

.sidebar-container-childs.active {
  max-height: 110px;
}

a.active.sidebar-element.child {
    background: transparent;
}

a.sidebar-element.child:hover {
    background: transparent;
}

.unav {
    opacity: 0.3;
    pointer-events: none;
    cursor: not-allowed;
}

div#swal2-html-container{
	font-size: 16px;
	line-height: 1.7em;
	max-width: 350px;
	margin: auto;
}

h2#swal2-title{
	font-size: 25px;
}

ul.page-numbers{
	display: inline-flex;
	width: -webkit-fill-available;
	gap: 15px;
	padding-left:10px;
	margin-top:40px;
	margin-bottom:30px;
	justify-content: flex-end;
	padding-right:10px;
}

li .page-numbers{
	min-height:20px;
	min-width:20px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding: 0 1em;
	height: 40px;
	border-radius: 8px;
	line-height: 1;
	border: 2px solid var(--c-border-primary);
	color: var(--c-text-action);
	font-size: 0.875rem;
	transition: 0.15s ease;
	background-color: transparent;
	font-weight: 500;
}

li .page-numbers:hover{
	color: var(--c-accent-primary);
	border-color: var(--c-accent-primary);
}

.page-numbers li{
	list-style-type:none;
}

span.page-numbers.current{
	background: #ECF3FE;
	border-color: var(--c-accent-primary);
}

.no-data-container{
	margin: 3rem auto;
	max-width: 500px;
	text-align: center;
}

img.no-data-image{
	margin: auto;
	margin-bottom: 2rem;
	filter: brightness(98%) saturate(3) hue-rotate(12deg);
}

img.attachment-full.size-full.wp-post-image{
	border: 1px solid #ccc;
	padding: 8px;
	border-radius: 5px;
	background: #fff;
}


@media (max-width: 1370px){

	span.text-se{
		font-size: 14px;
	}
	
}

@media (max-width:1000px){

	span.text-se{
		font-size: 14px;
	}
	
}