:root {
    --spacing-min:.25rem;
    --spacing-half:.5rem;
    --spacing-1x: 1rem;
    --spacing-2x: 2rem;

    --font-size-small:0.875rem;
    --font-size-base:1rem;

    --color-karaokemaestro-1f:white;
    --color-karaokemaestro-1b:#26398c;
    --color-karaokemaestro-yellow: #edf300;
    --color-karaokemaestro-2b:#fff;
    --color-karaokemaestro-2f:#333;
    --color-karaokemaestro-2g:#777;
    --color-karaokemaestro-3l:white;
    --color-karaokemaestro-3h:#c9d2f7;
    --color-karaokemaestro-degrade:#3d5bdf;

    --color-transparent-min:rgba(0,0,0,0.05);
    --color-transparent-med:rgba(0,0,0,0.1);

    --radius-small: 0.3125rem;
    --radius-1:0.5rem;
    --radius-input:.5rem;

    --header-height:86px;

    --shadow-xs:0 0 5px rgba(0,0,0,0.5);
    --shadow-xl:4px 5px 16px -4px rgba(0,0,0,0.1);
    --shadow-normal:0px 0rem 0.3125rem rgba(0, 0, 0, 0.8);

    --contents-padding:4rem;
    --contents-width:1440px;
    --contents-width-aside-0:1110px;
    --contents-width-aside-1:1296px;

    --aside-width:30rem;
}

body.web                                { position:relative; }
body.web #objContents > .breadcrumb,
body.web .LocalMenu                     { display:none; }

/* Ajustes a assets */
body.web .section,
body.web .main-wrapper                          { float:none; }
body.web .single-blog .blog-image a.bg-image    { width:416px; height:247px; background-size:cover; background-position:center; background-repeat:no-repeat; }
body.web .dropdown-cart .cart-btns              { justify-content:center; }


/* Menú Principal */
div.header-menu > ul.main-menu                                                      { height:var(--header-height); }
div.header-menu > ul.main-menu li.item                                              { padding:0; display:flex; align-items:center; }
div.header-menu > ul.main-menu li.item.current-branch > a                           { background-color:var(--color-transparent-min); }
div.header-menu > ul.main-menu li.item.current > a                                  { background-color:var(--color-transparent-med); }
div.header-menu > ul.main-menu li.item > .menu-icon                                 { display:none; }
div.header-menu > ul.main-menu li.item > a                                          { display:none; }
div.header-menu > ul.main-menu li.item > a.link                                     { padding:var(--spacing-half) var(--spacing-1x); text-transform:none; border-radius:var(--radius-1); flex-grow:1; display:flex; justify-content:space-between; }
div.header-menu > ul.main-menu li.item > a:hover                                    { background-color:var(--color-karaokemaestro-1b); color:var(--color-karaokemaestro-1f); }
div.header-menu > ul.main-menu li.item.hasChilds > a::after                         { content:"\f078"; font-family:FontAwesome; font-size:var(--font-size-small); color:var(--color-karaokemaestro-1b); transition:all 0.3s linear; margin-left:var(--spacing-half); }
div.header-menu > ul.main-menu li.item.hasChilds > a:hover::after                   { color:var(--color-karaokemaestro-1f); }
div.header-menu > ul.main-menu > li.item                                            { margin-right:var(--spacing-min); }
div.header-menu > ul.main-menu > li.item:last-child                                 { margin-right:0; }
div.header-menu > ul.main-menu > li.item ul.sub-menu                                { top:var(--header-height); padding:var(--spacing-half) 0; box-shadow:var(--shadow-xs); }
div.header-menu > ul.main-menu > li.item ul.sub-menu > li.item                      { margin-bottom:var(--spacing-min); padding:0 var(--spacing-half); justify-content:space-between; }
div.header-menu > ul.main-menu > li.item ul.sub-menu > li.item:last-child           { margin-bottom:0; }
div.header-menu > ul.main-menu > li.item ul.sub-menu > li.item > a                  { padding:var(--spacing-half) var(--spacing-1x); }
div.header-menu > ul.main-menu > li.item ul.sub-menu > li.item.hasChilds > a::after { content:"\f054"; }
div.header-menu > ul.main-menu > li.item ul.sub-menu > li.item > ul.sub-menu        { position:absolute; top:0; left:100%; margin-top:calc(-1 * (var(--spacing-half) + var(--spacing-min))); }

/* modGalleries: */
/*      background */
.vis-slides                                 { opacity:0; transition:opacity 0.5s ease-in-out; }
.vis-slides > .vis-slide                    { position:absolute; top:0; left:0; width:100%; height:100%; }
.vis-slides > .vis-slide > figure           { position:absolute; top:0; left:0; width:100%; height:100%; background-size:cover; background-position:center; background-repeat:no-repeat; z-index:-1; margin:0; }
.vis-slides > .vis-slide.with-text > figure { filter:brightness(.75); }
.vis-slides > .vis-slide .container h2      { color:var(--color-karaokemaestro-2b); }
.vis-slides > .vis-slide .container a       { color:var(--color-karaokemaestro-3l); }
.vis-slides > .vis-slide .container a:hover { color:var(--color-karaokemaestro-3h); }
.vis-slides .container .btn                 { box-shadow:var(--shadow-xs); }
.vis-slides .container .slide-content > *   { text-shadow:var(--shadow-xs); }
.vis-slides.ready                           { opacity:1; }
.vis-slides.ready > .vis-slide              { display:flex!important; }
.vis-slides.home                            { height:930px; }
.vis-slides.home > .vis-slide > .container  { z-index:5; margin-top:var(--contents-padding); }
.vis-slides.internal                        { height:584px; min-height:0; }
.vis-slides.internal > .vis-slide           { align-items:center; }
.vis-slides-control                         { list-style-type:none; position:absolute; display:flex; flex-direction:row; bottom:var(--spacing-1x); left:0; width:100%; justify-content:center; box-sizing:border-box; }
.vis-slides-control > li                    { margin:0; }
.vis-slides-control > li:last-child         { margin:0; }
.vis-slides-control > li::before            { font-family:fontawesome; content:"\f111"; display:block; width:var(--spacing-1x); text-align:center; color:var(--color-karaokemaestro-1f); text-shadow:var(--shadow-xs); cursor:pointer; }
.vis-slides-control > li.active::before     { color:var(--color-karaokemaestro-1b); }
.vis-slides-control > li > span             { display:none; }
body.home .vis-slides-control               { bottom:140px; }

.shape-n { animation-name:floatShape; animation-timing-function:ease-in-out; animation-iteration-count:infinite; animation-direction:alternate; will-change:transform; }
.shape-1 { animation-duration: 20s; animation-delay: 0s; }
.shape-2 { animation-duration: 24s; animation-delay: 1.5s; }
.shape-3 { animation-duration: 18s; animation-delay: 3s; }
.shape-4 { animation-duration: 22s; animation-delay: 2.2s; }
@keyframes floatShape {
	0%   { transform: translate(0px, 0px); }
	20%  { transform: translate(12px, -18px); }
	40%  { transform: translate(-24px, 12px); }
	60%  { transform: translate(18px, 24px); }
	80%  { transform: translate(-12px, -12px); }
	100% { transform: translate(0px, 6px); }
}


/* Pagination styling */
.PageControl.lite                               { display:flex; justify-content:space-between; align-items:center; padding:10px 0; margin-top:var(--spacing-1x); background-color:#ffffff; border-top:1px solid #dee2e6; font-size:14px; color:#343a40; flex-wrap:wrap; }
.PageControl .ItemsCounter                      { color:#6c757d; order:1; }
.PageControl .page-number-control               { display:flex; align-items:center; order:2; }
.PageControl .page-number-control .label        { margin-right:10px; color:#6c757d; }
.PageControl .page-number-control .label::after { content:':'; }
.PageControl .page-number-control a             { display:inline-block; padding:5px 10px; color:#343a40; text-decoration:none; margin-right:5px; font-size:14px; }
.PageControl .page-number-control a:last-child  { margin-left:5px; margin-right:0; }
.PageControl .page-number-control a.current     { background-color:#26398c; color:#ffffff; border-radius:50%; padding:5px 10px; line-height:1; }
.PageControl .page-size-control                 { display:flex; align-items:center; order:0; }
.PageControl .page-size-control .label          { margin-right:10px; color:#6c757d; }
.PageControl .page-size-control select          { padding:5px 10px; background-color:#e9ecef; border:1px solid #ced4da; border-radius:5px; color:#333; cursor:pointer; }
.PageControl .page-size-control select:hover    { background-color:#26398c; color:#ffffff; border-color:#26398c; transition:background-color 0.3s; }

#objVIS             { font-size:.75em; color:#bbb; position:absolute; bottom:0; right:1rem; margin-top:-2rem; }
#objVIS a           { color:inherit; text-decoration:none; opacity:0.3; }
#objVIS a:hover     { color:orange; opacity:1; }
body.if0 #objVIS    { display:none; }


body.web #objContents h2                   { font-size:43px; line-height:54px; font-family:"Barlow",sans-serif; font-weight:600; color:var(--color-corpac-1b); }
body.web .vis-content-block                { font-size:var(--font-size-base); }
body.web .vis-content-block > div:nth-child(2) { padding-left:15px; }
body.web .vis-content-block p              { font-size:var(--font-size-base); }
body.web .vis-content-block h2             { margin-bottom:var(--spacing-2x); text-align:center; }
body.web .vis-content-block h3             { margin-top:var(--spacing-1x); }
body.web .vis-content-block h2:last-child  { margin-bottom:0; }
body.web .vis-content-block.margin-bottom  { margin-bottom:var(--spacing-2x); }
body.web .vis-content-block h2 img         { border-radius:12px; display:block; }

body.web .vis-content-block h2 strong      { color:#001f8f; display:block; }

body.web .vis-content-block ul             { list-style:none; padding-left:0; margin-top:2rem; }
body.web .vis-content-block ul li          { display:flex; align-items:flex-start; gap:10px; font-size:18px; margin-bottom:10px; transition:transform 0.2s ease; }
body.web .vis-content-block ul li:hover    { transform:translateX(6px); }
body.web .vis-content-block ul li::before  { content:'✔'; color:#001f8f; font-weight:bold; font-size:16px; line-height:1.2; flex-shrink:0; margin-top:2px; }


/* ----- Versión: 20250823.1838 — VIS CSS horizontal (ajustes según feedback KM) ----- */

/* ===== Reset de “cajas dentro de cajas” ===== */
.ListManager                                     { border:0; padding:0; background:transparent; box-shadow:none; }

/* 1) Caja SOLO para filtros */
.ListManager > .frmSearch .filters               { display:flex; flex-wrap:wrap; align-items:center; gap:var(--spacing-half) var(--spacing-1x); margin:0 0 var(--spacing-1x); padding:var(--spacing-half) var(--spacing-1x); background:var(--color-karaokemaestro-3l); border:1px solid var(--color-transparent-med); border-radius:var(--radius-1); box-shadow:var(--shadow-xl); }
.ListManager .filters .filter                    { display:flex; align-items:center; gap:var(--spacing-half); }
.ListManager .filters .label                     { font:600 var(--font-size-small)/1.2 system-ui; color:var(--color-karaokemaestro-2g); }
.ListManager .filters .field                     { display:flex; align-items:center; gap:.4rem; }
.ListManager .filters .fieldText                 { height:2.25rem; padding:0 .6rem; border:1px solid var(--color-transparent-med); border-radius:var(--radius-input); background:#fff; outline:none; }
.ListManager .filters .fieldText:focus           { border-color:var(--color-karaokemaestro-1b); box-shadow:0 0 0 3px rgba(38,57,140,.15); }
.ListManager .filters .cmd.submit                { height:2.25rem; width:2.25rem; display:inline-grid; place-items:center; border:1px solid var(--color-transparent-med); background:#fff; border-radius:var(--radius-input); cursor:pointer; }
.ListManager .filters .cmd.submit:hover          { background:var(--color-karaokemaestro-3h); border-color:var(--color-karaokemaestro-1b); }

/* 2) Caja SOLO para el listado */
.ListManager .Main                               { background:var(--color-karaokemaestro-2b); border:1px solid var(--color-transparent-med); border-radius:var(--radius-1); box-shadow:var(--shadow-xl); overflow:auto; }
.ListManager .Main > table.Main                  { width:100%; border-collapse:separate; border-spacing:0; background:#fff; border-radius:var(--radius-1); }

/* ===== Encabezados pegándose / “se montan” =====
   Causa: sticky con top inadecuado + wrapper con overflow.
   Solución: sticky con top:0 dentro del wrapper scrollable (.Main). */
.ListManager .Main thead .Headers                { background:var(--color-karaokemaestro-1b); color:#fff; }
.ListManager .Main thead th                      { position:sticky; top:0; z-index:2; background:var(--color-karaokemaestro-1b); color:#fff; font:700 .78rem/1.2 system-ui; letter-spacing:.02em; text-transform:uppercase; padding:.65rem .6rem; border-bottom:1px solid var(--color-karaokemaestro-1b); white-space:nowrap; }
.ListManager .Main thead th .caption             { color:inherit; opacity:1; }
.ListManager .Main thead th a                    { color:#fff; text-decoration:none; display:inline-flex; align-items:center; gap:.35rem; }
.ListManager .Main thead th a:hover              { text-decoration:underline; }

/* ===== Filas y celdas ===== */
.ListManager .Main tbody td                      { font:var(--font-size-base)/1.55 ui-sans-serif,system-ui; color:var(--color-karaokemaestro-2f); padding:.55rem .6rem; border-bottom:1px solid var(--color-transparent-med); vertical-align:middle; }
.ListManager .Main tbody tr:nth-child(even)      { background:var(--color-karaokemaestro-3l); }
.ListManager .Main tbody tr:hover                { background:rgba(61,91,223,.06); }
.ListManager .Main tbody .ColNUMERIC             { text-align:right; font-variant-numeric:tabular-nums lining-nums; }
.ListManager .Main tbody .ColCENTERED            { text-align:center; }
.ListManager .Main tbody .ColDATETIME            { white-space:nowrap; color:var(--color-karaokemaestro-2g); }
.ListManager .Main tbody .fld_1031               { font-weight:700; }

/* ===== Estados (badges) ===== */
.ListManager .Main tbody tr.status-1             { --badge-bg:#e8edff; --badge-fg:#24378c; }  /* Envío */
.ListManager .Main tbody tr.status-3             { --badge-bg:#e6f9ec; --badge-fg:#166534; }  /* Pago */
.ListManager .Main tbody tr.status-4

/* ----- Fin Versión: 20250823.1838 — VIS CSS horizontal (ajustes según feedback KM) ----- */


/* ----- Carrito ----- */
.cart-btn					{ position:relative; transition:transform 0.2s ease; }
.cart-btn.is-adding			{ animation:cartPulse 0.6s ease-in-out 0s 5, cartGlow 0.8s ease-in-out 0s 4; }
.cart-btn.is-adding i		{ animation:cartBlink 0.8s ease-in-out 0s 4; }
.cart-btn.is-adding .count	{ animation:cartBump 0.5s ease-out 0s 3; background:#ff1744!important; color:#fff!important; }

/* Keyframes */
@keyframes cartPulse {
    0%   { transform: scale(1); }
    25%  { transform: scale(1.08); }
    50%  { transform: scale(0.95); }
    75%  { transform: scale(1.06); }
    100% { transform: scale(1); }
}

@keyframes cartGlow {
    0%, 100% { box-shadow: none; }
    50%      { box-shadow: 0 0 0 0.35rem rgba(255, 23, 68, 0.25); }
}

@keyframes cartBlink {
    0%, 100% { color: inherit; }
    50%      { color: #ff1744; }
}

@keyframes cartBump {
    0%   { transform: translateY(0) scale(1); }
    50%  { transform: translateY(-2px) scale(1.2); }
    100% { transform: translateY(0) scale(1); }
}

/* Accesibilidad: respeta la preferencia de reducir movimiento */
@media (prefers-reduced-motion: reduce) {
    .cart-btn.is-adding,
    .cart-btn.is-adding i,
    .cart-btn.is-adding .count { animation:none !important; }
}