/* Barra de promociones (Tu Tienda Experta). Todo cuelga de #tte-promobar para no heredar
   ni pisar estilos del tema Panda ni de otros módulos. Diseños: .tte-d-azul (por defecto),
   .tte-d-amarillo, .tte-d-fina y .tte-d-naranja. */
#tte-promobar {
    position: relative;
    display: block;
    margin: 0;
    padding: 0 44px;
    background: #0060C4;
    background: linear-gradient(100deg, #0060C4 0%, #003F9E 55%, #002268 100%);
    color: #fff;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    line-height: 1.2;
    text-align: center;
    box-sizing: border-box;
    border-bottom: 3px solid #FFD600;
}
#tte-promobar * { box-sizing: border-box; }
#tte-promobar .tte-pb-in {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 1200px;
    min-height: 48px;
    margin: 0 auto;
    padding: 4px 0;
}
/* margen en vez de «gap»: Safari antiguo no lo entiende en flex */
#tte-promobar .tte-pb-in > * { margin: 3px 9px; }
#tte-promobar .tte-pb-fecha {
    display: inline-block;
    background: #FFD600;
    color: #00348C;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .5px;
    text-transform: uppercase;
    padding: 5px 12px;
    border-radius: 20px;
    white-space: nowrap;
}
#tte-promobar .tte-pb-txt { font-size: 18px; font-weight: 800; text-transform: uppercase; }
#tte-promobar .tte-pb-a { color: #fff; }
#tte-promobar .tte-pb-b { color: #FFD600; text-shadow: 2px 2px 0 #001648; white-space: nowrap; }
#tte-promobar a.tte-pb-btn,
#tte-promobar a.tte-pb-btn:visited {
    display: inline-block;
    background: #fff;
    color: #00348C;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    text-transform: uppercase;
    padding: 7px 18px;
    border: 0;
    border-radius: 20px;
    white-space: nowrap;
    transition: background .15s;
}
#tte-promobar a.tte-pb-btn:hover,
#tte-promobar a.tte-pb-btn:focus { background: #FFD600; color: #00348C; text-decoration: none; }
#tte-promobar button.tte-pb-x {
    position: absolute;
    top: 50%;
    right: 10px;
    width: 28px;
    height: 28px;
    margin: -14px 0 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .15);
    color: #fff;
    font: 700 20px/28px Arial, sans-serif;
    text-shadow: none;
    cursor: pointer;
    box-shadow: none;
}
#tte-promobar button.tte-pb-x:hover { background: rgba(255, 255, 255, .3); }

/* ── Amarillo con letra azul ── */
#tte-promobar.tte-d-amarillo { background: #FFD600; color: #00348C; border-bottom-color: #0060C4; }
#tte-promobar.tte-d-amarillo .tte-pb-fecha { background: #0060C4; color: #fff; }
#tte-promobar.tte-d-amarillo .tte-pb-a { color: #00348C; }
#tte-promobar.tte-d-amarillo .tte-pb-b { color: #C81E1E; text-shadow: none; }
#tte-promobar.tte-d-amarillo a.tte-pb-btn,
#tte-promobar.tte-d-amarillo a.tte-pb-btn:visited { background: #0060C4; color: #fff; }
#tte-promobar.tte-d-amarillo a.tte-pb-btn:hover,
#tte-promobar.tte-d-amarillo a.tte-pb-btn:focus { background: #00348C; color: #fff; }
#tte-promobar.tte-d-amarillo button.tte-pb-x { background: rgba(0, 52, 140, .12); color: #00348C; }

/* ── Fina: una línea, más baja ── */
#tte-promobar.tte-d-fina { border-bottom-width: 2px; }
#tte-promobar.tte-d-fina .tte-pb-in { min-height: 34px; padding: 2px 0; }
#tte-promobar.tte-d-fina .tte-pb-in > * { margin: 2px 7px; }
#tte-promobar.tte-d-fina .tte-pb-fecha { font-size: 11px; padding: 3px 10px; }
#tte-promobar.tte-d-fina .tte-pb-txt { font-size: 14px; }
#tte-promobar.tte-d-fina .tte-pb-b { text-shadow: none; }
#tte-promobar.tte-d-fina a.tte-pb-btn { font-size: 12px; padding: 4px 14px; }
#tte-promobar.tte-d-fina button.tte-pb-x { width: 22px; height: 22px; margin-top: -11px; font-size: 16px; line-height: 22px; }

/* ── Negro y naranja (Chollos / Black Friday) ── */
#tte-promobar.tte-d-naranja { background: #111; border-bottom-color: #FF6900; }
#tte-promobar.tte-d-naranja .tte-pb-fecha { background: #FF6900; color: #fff; }
#tte-promobar.tte-d-naranja .tte-pb-b { color: #FF6900; text-shadow: none; }
#tte-promobar.tte-d-naranja a.tte-pb-btn,
#tte-promobar.tte-d-naranja a.tte-pb-btn:visited { background: #FF6900; color: #fff; }
#tte-promobar.tte-d-naranja a.tte-pb-btn:hover,
#tte-promobar.tte-d-naranja a.tte-pb-btn:focus { background: #fff; color: #111; }

@media (max-width: 767px) {
    #tte-promobar { padding: 0 38px 0 12px; }
    #tte-promobar .tte-pb-in { min-height: 0; padding: 3px 0; }
    #tte-promobar .tte-pb-in > * { margin: 2px 5px; }
    #tte-promobar .tte-pb-fecha { display: none; }
    #tte-promobar .tte-pb-txt { font-size: 13px; }
    #tte-promobar .tte-pb-a,
    #tte-promobar .tte-pb-b { display: block; }
    #tte-promobar .tte-pb-b { font-size: 15px; }
    #tte-promobar a.tte-pb-btn { font-size: 12px; padding: 6px 12px; }
    /* la fina sigue siendo fina en el móvil: todo en una línea si cabe */
    #tte-promobar.tte-d-fina .tte-pb-a,
    #tte-promobar.tte-d-fina .tte-pb-b { display: inline; }
    #tte-promobar.tte-d-fina .tte-pb-txt { font-size: 12px; }
    #tte-promobar.tte-d-fina .tte-pb-b { font-size: 12px; }
    #tte-promobar.tte-d-fina a.tte-pb-btn { font-size: 11px; padding: 3px 10px; }
}
@media print { #tte-promobar { display: none; } }