@import url(https://db.onlinewebfonts.com/c/1400431b11f857f178a0c49a03977fbf?family=Aktiv+Grotesk+Ex+Trial);
@import url(https://db.onlinewebfonts.com/c/41814d7872ce69c1ff0e2a22c24092d2?family=Aktiv+Grotesk+Ex+Trial+SemiBold);
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap');
@import url(https://db.onlinewebfonts.com/c/14792084dfffdbe3116c33b3a8c5c5f9?family=Futura+Std+Medium);
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&display=swap');

@font-face {
    font-family: 'Proxima Nova';
    src: url('/fonts/Fuentes%20Café/Proxima%20Nova/Mark%20Simonson%20-%20Proxima%20Nova.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('/fonts/Fuentes%20Café/Proxima%20Nova/Mark%20Simonson%20-%20Proxima%20Nova%20Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('/fonts/Fuentes%20Café/Proxima%20Nova/Mark%20Simonson%20-%20Proxima%20Nova%20Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Adobe Garamond';
    src: url('/fonts/Fuentes%20Café/Adobe%20Garamond/Adobe%20-%20AGaramondPro-Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Adobe Garamond';
    src: url('/fonts/Fuentes%20Café/Adobe%20Garamond/Adobe%20-%20AGaramondPro-Italic.otf') format('opentype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Adobe Garamond';
    src: url('/fonts/Fuentes%20Café/Adobe%20Garamond/Adobe%20-%20AGaramondPro-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

/* Neue Frutiger World (FrutigerNext) Font Family */
@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-LightItalic.otf') format('opentype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-RegularItalic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-MediumItalic.otf') format('opentype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-BoldItalic.otf') format('opentype');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-Heavy.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-HeavyItalic.otf') format('opentype');
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-Black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Neue Frutiger World';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-BlackItalic.otf') format('opentype');
    font-weight: 900;
    font-style: italic;
}

/* Neue Frutiger World Condensed variants */
@font-face {
    font-family: 'Neue Frutiger World Condensed';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-LightCond.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Neue Frutiger World Condensed';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-RegularCond.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Neue Frutiger World Condensed';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-MediumCond.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Neue Frutiger World Condensed';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-BoldCond.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Neue Frutiger World Condensed';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-HeavyCond.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Neue Frutiger World Condensed';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerNextLT-BlackCond.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
}

/* Frutiger Font Family */
@font-face {
    font-family: 'Frutiger';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Frutiger';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-LightItalic.otf') format('opentype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Frutiger';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-Roman.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Frutiger';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-Italic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Frutiger';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Frutiger';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-BoldItalic.otf') format('opentype');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'Frutiger';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-Black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Frutiger';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-BlackItalic.otf') format('opentype');
    font-weight: 900;
    font-style: italic;
}

/* Frutiger Condensed variants */
@font-face {
    font-family: 'Frutiger Condensed';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-LightCn.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Frutiger Condensed';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-Cn.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Frutiger Condensed';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-BoldCn.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Frutiger Condensed';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-BlackCn.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Frutiger Condensed';
    src: url('/fonts/Fuentes%20Mabe/Frutiger/FrutigerLTStd-ExtraBlackCn.otf') format('opentype');
    font-weight: 950;
    font-style: normal;
}

/* Acta Font Family (MDC) */
@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-LightItalic.otf') format('opentype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-Book.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-BookItalic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-MediumItalic.otf') format('opentype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-BoldItalic.otf') format('opentype');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-ExtraBold.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-ExtraBoldItalic.otf') format('opentype');
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-Black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Acta';
    src: url('/fonts/Fuentes%20MDC/Acta_Font_Family/Acta_Font_Family/Acta-BlackItalic.otf') format('opentype');
    font-weight: 900;
    font-style: italic;
}

/* Klarheit Kurrent Font Family (MDC) */
@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-Extralight.otf') format('opentype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-ExtralightItalic.otf') format('opentype');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-LightItalic.otf') format('opentype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-RegularItalic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-Book.otf') format('opentype');
    font-weight: 450;
    font-style: normal;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-BookItalic.otf') format('opentype');
    font-weight: 450;
    font-style: italic;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-MediumItalic.otf') format('opentype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-Semibold.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-SemiboldItalic.otf') format('opentype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-BoldItalic.otf') format('opentype');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-Extrabold.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Klarheit Kurrent';
    src: url('/fonts/Fuentes%20MDC/Klarheit_Kurrent_Font_Family/Klarheit_Kurrent_Font_Family/KlarheitKurrent-ExtraboldItalic.otf') format('opentype');
    font-weight: 800;
    font-style: italic;
}

/* Fuentes GE Profile */

@font-face {
    font-family: 'Nudista TRIAL';
    src: url('/fonts/Fuentes-Geprofile/Nudista-TRIAL/NudistaTRIAL-Light.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Nudista TRIAL';
    src: url('/fonts/Fuentes-Geprofile/Nudista-TRIAL/NudistaTRIAL-SemiBold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

/* Fuentes IOMabe */

@font-face {
    font-family: 'Futura Std Book';
    font-style: normal;
    font-weight: normal;
    src: local('Futura Std Book'), url('/fonts/Fuentes-IOMabe/FuturaStdBook.woff') format('woff');
}

@font-face {
    font-family: 'Futura Std Book';
    font-style: normal;
    font-weight: 700;
    src: local('Futura Std Bold'), url('/fonts/Fuentes-IOMabe/FuturaStdBold.woff') format('woff');
}

:root {
    /* Colores principales de Café*/
    --cafe-font-primary: #004B3D;
    --cafe-selected:#B65328;
    
    /* Colores principales de Mabe*/
    --mabe-font-primary: #003876;
    --mabe-selected:#0066CC;
    
    /* Colores principales de MDC */
    --mdc-primary: #121110; /* MDC Granite Black */
    --mdc-primary-90: #2A2928; /* 90% del PANTONE BLACK 3 C */
    --mdc-primary-75: rgba(18, 17, 16, 0.75); /* 75% del color primario */
    --mdc-primary-10: rgba(18, 17, 16, 0.1); /* 10% del color primario */
    --mdc-secondary: #2C4051; /* MDC Graphite Blue */
    --mdc-tertiary: #5A5142; /* MDC Mute Caoba */
    --mdc-tertiary-50: rgba(90, 81, 66, 0.5); /* Tinte 50% MDC Mute Caoba */
    --mdc-tertiary-30: rgba(90, 81, 66, 0.3); /* Tinte 30% MDC Mute Caoba */
    --mdc-font-primary: #2A2928; /* Color para textos */
    --mdc-selected: #2C4051; /* Color seleccionado */
    /* Botones de acción en producto */
    --btn-producto-width: 360px;
    --btn-producto-height: 48px;
}
html, body {
    font-family: 'Proxima Nova', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}


a, .btn-link {
    color: #006bb7;
}
.producto-topbar{
    border-bottom: none;
}
.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: none;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA9NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.cafe-font {
    color: var(--cafe-font-primary);
    font-family: "Adobe Garamond", Diot, serif;
}
.cafe-font-2 {
    color: var(--cafe-font-primary);
    font-family: 'Proxima Nova', Arial, Helvetica, sans-serif;
    font-size: 17px;
}
.cafe-font-3 {
    color: #6C6158;
    font-family: 'Proxima Nova', Arial, Helvetica, sans-serif;
    font-size: 14px;
}

/* Mabe Font utility classes */
.mabe-font {
    color: var(--mabe-font-primary);
    font-family: 'Neue Frutiger World', 'Frutiger', Arial, Helvetica, sans-serif;
}

.mabe-font-2 {
    color: var(--mabe-font-primary);
    font-family: 'Neue Frutiger World', 'Frutiger', Arial, Helvetica, sans-serif;
    font-size: 16px;
}

.mabe-font-3 {
    color: var(--mabe-font-primary);
    font-family: 'Neue Frutiger World', 'Frutiger', Arial, Helvetica, sans-serif;
    font-size: 14px;
}

/* Neue Frutiger World utility classes */
.neue-frutiger-font {
    font-family: 'Neue Frutiger World', 'Frutiger', Arial, Helvetica, sans-serif;
}

.neue-frutiger-light {
    font-family: 'Neue Frutiger World', 'Frutiger', Arial, Helvetica, sans-serif;
    font-weight: 300;
}

.neue-frutiger-regular {
    font-family: 'Neue Frutiger World', 'Frutiger', Arial, Helvetica, sans-serif;
    font-weight: 400;
}

.neue-frutiger-medium {
    font-family: 'Neue Frutiger World', 'Frutiger', Arial, Helvetica, sans-serif;
    font-weight: 500;
}

.neue-frutiger-bold {
    font-family: 'Neue Frutiger World', 'Frutiger', Arial, Helvetica, sans-serif;
    font-weight: 700;
}

.neue-frutiger-heavy {
    font-family: 'Neue Frutiger World', 'Frutiger', Arial, Helvetica, sans-serif;
    font-weight: 800;
}

.neue-frutiger-black {
    font-family: 'Neue Frutiger World', 'Frutiger', Arial, Helvetica, sans-serif;
    font-weight: 900;
}

.neue-frutiger-condensed {
    font-family: 'Neue Frutiger World Condensed', 'Frutiger Condensed', Arial, Helvetica, sans-serif;
}

.neue-frutiger-condensed-light {
    font-family: 'Neue Frutiger World Condensed', 'Frutiger Condensed', Arial, Helvetica, sans-serif;
    font-weight: 300;
}

.neue-frutiger-condensed-regular {
    font-family: 'Neue Frutiger World Condensed', 'Frutiger Condensed', Arial, Helvetica, sans-serif;
    font-weight: 400;
}

.neue-frutiger-condensed-medium {
    font-family: 'Neue Frutiger World Condensed', 'Frutiger Condensed', Arial, Helvetica, sans-serif;
    font-weight: 500;
}

.neue-frutiger-condensed-bold {
    font-family: 'Neue Frutiger World Condensed', 'Frutiger Condensed', Arial, Helvetica, sans-serif;
    font-weight: 700;
}

.neue-frutiger-condensed-heavy {
    font-family: 'Neue Frutiger World Condensed', 'Frutiger Condensed', Arial, Helvetica, sans-serif;
    font-weight: 800;
}

.neue-frutiger-condensed-black {
    font-family: 'Neue Frutiger World Condensed', 'Frutiger Condensed', Arial, Helvetica, sans-serif;
    font-weight: 900;
}

/* Frutiger utility classes */
.frutiger-font {
    font-family: 'Frutiger', Arial, Helvetica, sans-serif;
}

.frutiger-light {
    font-family: 'Frutiger', Arial, Helvetica, sans-serif;
    font-weight: 300;
}

.frutiger-regular {
    font-family: 'Frutiger', Arial, Helvetica, sans-serif;
    font-weight: 400;
}

.frutiger-bold {
    font-family: 'Frutiger', Arial, Helvetica, sans-serif;
    font-weight: 700;
}

.frutiger-black {
    font-family: 'Frutiger', Arial, Helvetica, sans-serif;
    font-weight: 900;
}

.frutiger-condensed {
    font-family: 'Frutiger Condensed', Arial, Helvetica, sans-serif;
}

.frutiger-condensed-light {
    font-family: 'Frutiger Condensed', Arial, Helvetica, sans-serif;
    font-weight: 300;
}

.frutiger-condensed-regular {
    font-family: 'Frutiger Condensed', Arial, Helvetica, sans-serif;
    font-weight: 400;
}

.frutiger-condensed-bold {
    font-family: 'Frutiger Condensed', Arial, Helvetica, sans-serif;
    font-weight: 700;
}

.frutiger-condensed-black {
    font-family: 'Frutiger Condensed', Arial, Helvetica, sans-serif;
    font-weight: 900;
}

.btn-producto {
    width: var(--btn-producto-width);
    height: var(--btn-producto-height);
    font-size: 1rem;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

.btn-producto-comparar {
    background-color: var(--cafe-font-primary) !important;
    color: #fff !important;
    border: 1.5px solid var(--cafe-font-primary) !important;
}

.btn-producto-deseos {
    background-color: #fff !important;
    color: var(--cafe-font-primary) !important;
    border: 1.5px solid var(--cafe-font-primary) !important;
}

/* MDC Font utility classes */
.mdc-font {
    color: var(--mdc-font-primary);
    font-family: 'Acta', Arial, Helvetica, sans-serif;
}

.mdc-font-2 {
    color: var(--mdc-font-primary);
    font-family: 'Klarheit Kurrent', Arial, Helvetica, sans-serif;
    font-size: 17px;
}

.mdc-font-3 {
    color: var(--mdc-primary-75);
    font-family: 'Klarheit Kurrent', Arial, Helvetica, sans-serif;
    font-size: 14px;
}

/* Acta utility classes */
.acta-font {
    font-family: 'Acta', Arial, Helvetica, sans-serif;
}

.acta-light {
    font-family: 'Acta', Arial, Helvetica, sans-serif;
    font-weight: 300;
}

.acta-book {
    font-family: 'Acta', Arial, Helvetica, sans-serif;
    font-weight: 400;
}

.acta-medium {
    font-family: 'Acta', Arial, Helvetica, sans-serif;
    font-weight: 500;
}

.acta-bold {
    font-family: 'Acta', Arial, Helvetica, sans-serif;
    font-weight: 700;
}

.acta-extrabold {
    font-family: 'Acta', Arial, Helvetica, sans-serif;
    font-weight: 800;
}

.acta-black {
    font-family: 'Acta', Arial, Helvetica, sans-serif;
    font-weight: 900;
}

/* Klarheit Kurrent utility classes */
.klarheit-font {
    font-family: 'Klarheit Kurrent', Arial, Helvetica, sans-serif;
}

.klarheit-extralight {
    font-family: 'Klarheit Kurrent', Arial, Helvetica, sans-serif;
    font-weight: 200;
}

.klarheit-light {
    font-family: 'Klarheit Kurrent', Arial, Helvetica, sans-serif;
    font-weight: 300;
}

.klarheit-regular {
    font-family: 'Klarheit Kurrent', Arial, Helvetica, sans-serif;
    font-weight: 400;
}

.klarheit-book {
    font-family: 'Klarheit Kurrent', Arial, Helvetica, sans-serif;
    font-weight: 450;
}

.klarheit-medium {
    font-family: 'Klarheit Kurrent', Arial, Helvetica, sans-serif;
    font-weight: 500;
}

.klarheit-semibold {
    font-family: 'Klarheit Kurrent', Arial, Helvetica, sans-serif;
    font-weight: 600;
}

.klarheit-bold {
    font-family: 'Klarheit Kurrent', Arial, Helvetica, sans-serif;
    font-weight: 700;
}

.klarheit-extrabold {
    font-family: 'Klarheit Kurrent', Arial, Helvetica, sans-serif;
    font-weight: 800;
}

.modal-backdrop {
  position: fixed; inset: 0; background: rgba(0,0,0,.45);
  display: grid; place-items: center; z-index: 1040;
}
.modal-card {
background: #fff; 
width: 100vw;
 height: 100vh;
  overflow: auto;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
  padding: 0 80px 0 80px; position: relative;
}
.close-btn {
  position: absolute;
   top: 10px; 
   right: 12px;
    border: 0; 
    background: transparent;
  font-size: 24px; cursor: pointer;
}
/* Reglas para controlar z-index de tabs vs modal - ELIMINADAS */
/* Se eliminaron las reglas que aplicaban z-index a elementos de pestañas para solucionar 
   el problema de superposición con modales */

.content-comparador{
        margin: 20px 80px 20px 80px;
}

/* Spinner de Font Awesome */
.fa-spinner.fa-spin {
    animation: fa-spin 1s infinite linear;
}

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

/* Asegurar que los iconos de Font Awesome se muestren correctamente */
.fas, .far, .fab {
    font-family: "Font Awesome 6 Free", "Font Awesome 6 Brands";
    font-weight: 900;
}

.far {
    font-weight: 400;
}

/* Estilos para el BackOffice - Ajustes Showroom */
.icon-circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}

.icon-circle i {
    font-size: 16px;
}

/* Mejoras para las cards del formulario */
.card {
    border: 1px solid #e3e6f0;
    transition: all 0.3s ease;
}


/* Estilos para los badges de estado */
.badge {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.025em;
}