/* ============================================================================
   TEMA DE LA VERSION 2 PARA MULTIPASTE V3
   ----------------------------------------------------------------------------
   Se carga DESPUES del style.css de la v3, asi que solo cambia lo que hacia
   falta para que la v3 se vea como tu sitio de siempre:

     - los enlaces de los pastes con su icono y su recuadro (mlink)
     - los titulos, los cuadros de texto y los botones con los colores viejos
     - el ancho fijo de 980 px (cabecera 960, menu 950, contenido 970)
     - los recuadros de contenido VIP y los botones de los BBcodes
   ========================================================================== */

/* ---------- ancho y tipografia general (igual que la v2) ---------- */
body {
    min-width: 980px;
    background: #fff;
    color: #575757;
    font: 0.75em/1.5 "Arial", "Helvetica", sans-serif;
}

h1 { margin: 0 0 10px; color: #ff7200; font: normal 2.5em "Arial", sans-serif; }
h2 { margin: 1em 0; padding-bottom: 5px; color: #000; font: normal 2em "Arial", sans-serif; }
h3 { margin: 1em 0 0; font: normal 1.75em "Arial", sans-serif; }
h4 { margin: 1em 0 0; font: normal 1.5em "Arial", sans-serif; }
h5 { margin: 1em 0 0; font: normal 1.25em "Arial", sans-serif; }
h6 { margin: 1em 0 0; font: normal 1.167em "Arial", sans-serif; }
p  { margin: 1em 0; }

a { color: #ff7200; text-decoration: none; }
a:hover { color: #000; text-decoration: underline; }

blockquote {
    margin: 1.5em 0;
    padding: 10px 20px 10px 70px;
    border: 1px solid #dbdbdb;
    border-radius: 5px;
    background: #f6f6f6 url("../img/quotes.png") 15px 15px no-repeat;
    font-style: italic;
}

/* ---------- cabecera y menu ---------- */
header .brand-container { width: 960px; max-width: none; margin: 0 auto; padding: 15px 0; }
header .brand-container .title { color: #fff; font: normal 3em/1em "Arial", sans-serif; text-shadow: #000 0 0 2px; }
header .brand-container .description { margin: 0 0 10px; color: #fff; font: normal 1.5em "Arial", sans-serif; text-shadow: #000 0 0 2px; }
header nav { width: 950px; max-width: none; margin: 0 auto 12px; background: none; box-shadow: none; border: 0; }
header nav > ul { display: flex; width: 940px; margin: 0 auto; padding: 0 10px; border-radius: 5px; background: #4a4a4a url("../img/menu-bg.png") top repeat-x; }
header nav > ul > li { border-left: 1px solid #444; border-right: 1px solid #151515; padding: 0; }
header nav > ul > li > a { display: block; height: 30px; padding: 0 15px; background: url("../img/mm-link.png") left -50px repeat-x; color: #fff; font-size: 1.167em; line-height: 30px; text-decoration: none; text-shadow: 1px 1px 1px rgba(0, 0, 0, .30); }
header nav > ul > li > a:hover { color: #fff; background-position: left center; text-decoration: none; }

/* ---------- contenido ---------- */
.content-wrapper { width: 970px; max-width: none; margin: 0 auto; padding: 20px 0; }
.ad-container { margin: 0 0 15px; text-align: center; }
.ad-wrapper { display: inline-block; max-width: 100%; }
.show_container, .center-box { background: none; }
.bottom-badge { background: #f3f3f3; border: 1px solid #dbdbdb; border-radius: 5px; }

/* ---------- pastes: enlaces, titulos y recuadros ---------- */
.tab_container { width: 100%; padding: 15px; background: #fff; border: 1px solid #999; border-radius: 0 0 5px 5px; }
.tab_content { font-size: 1.1em; color: #5b6672; line-height: 1.5; }
.tab_content strong { font-weight: 700; font-size: 1.12em; }
.tab_content a > img { max-width: 100%; border: 0; }

/* la cadena de enlaces: recuadro con el icono del sitio */
.mlink {
    display: inline-flex; align-items: center; vertical-align: middle;
    width: auto; min-width: 145px; max-width: 100%; height: 31px; min-height: 31px;
    box-sizing: border-box; padding: 1px 7px; margin: 0;
    border: 1px solid #eceff2; border-radius: 9px; background: #fff;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
    white-space: nowrap; font-weight: bold; font-size: 1.05em; line-height: 1.2;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.mlink:hover { border-color: #ffcf72; box-shadow: 0 5px 14px rgba(255, 175, 3, .18); transform: translateY(-1px); }
.mlink-ico { width: 20px; height: 20px; min-width: 20px; margin-right: 8px; flex: 0 0 20px; vertical-align: middle; border: 0; }
.mlink-a { color: #b3402c; font-weight: bold; text-decoration: none; word-break: break-word; }
.mlink-a:hover { color: #8d3222; text-decoration: none; }
.mlink-img { width: auto; padding: 5px 9px; }
.mlink-img a { display: block; min-width: 0; }
.mlink-img img { max-width: 100%; height: auto; display: block; border: 0; }

/* separadores y avisos dentro de los pastes */
.tab_content table[style*="height:10px"] { border: 0 !important; margin: 16px 0 0 !important; width: 100%; background: none; border-radius: 0; font-weight: normal; }
.tab_content table[style*="height:10px"] td { border: 0 !important; padding: 0 8px 0 0 !important; vertical-align: middle; background: none; font-size: 0; }
.tab_content table[style*="height:10px"] td:last-child { color: #9aa7b4; text-align: right !important; font-size: 13px; }

/* contenido solo para VIP  —  CLON V2 (style.css:174 + 308, medidas en el lab)
   El recuadro de V2 es: borde DISCONTINUO #ffd08a, radio 8, fondo #fffaf3,
   relleno 12 y texto centrado; el <strong> no cambia de color y el enlace va
   con el rojo de V2 (#b3402c). Aqui estaba una caja distinta (borde liso
   #ffd9a8, relleno 15/18, fondo #fff8ef, <strong> naranja y enlace naranja) y
   ademas el .vip del nucleo (static/css/style.css:456) la pinta con
   display:grid, que era el motivo del <div> interior: por eso se pasa a block
   y el marcado vuelve al de V2. */
.vip {
    display: block;
    border: 1px dashed #ffd08a;
    border-radius: 8px;
    background: #fffaf3;
    padding: 12px;
    text-align: center;
    clear: none; margin: 0;
    color: inherit; font-size: inherit;
}
.vip strong { color: inherit; font-weight: 700; font-size: 1.12em; }
.vip a { color: #b3402c; font-weight: normal; }
.vip img { vertical-align: middle; margin: 0; border: 0; height: auto; max-width: 630px; }

/* boton [jd] (no se toca, solo se pinta como antes) */
.jd, .jdbtn {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 8px 15px; border-radius: 5px; border: 0;
    background: #ff8518; color: #fff; font-weight: bold; cursor: pointer;
}
.jd:hover, .jdbtn:hover { background: #e8740c; color: #fff; }

/* ---------- campos y botones ---------- */
input, select, textarea {
    padding: 5px 10px; border: 1px solid #333; border-radius: 3px;
    background: #fff url("../img/input.gif") top repeat-x; color: #575757;
}
input:focus, select:focus, textarea:focus { border-color: #9cc7e8; background: #fff; outline: 0; }

/* botones de accion (los del panel y los formularios): gris oscuro, como antes */
button, .btn {
    height: auto; padding: 8px 14px; border: 0; border-radius: 5px;
    background: #545454; color: #fff; font: normal 1em "Arial", sans-serif;
    line-height: 1.2; box-shadow: none; cursor: pointer;
}
button:hover, .btn:hover { background: #3f3f3f; color: #fff; }

/* el boton principal (enviar/enviar paste): naranja */
input[type="submit"], button[type="submit"] {
    height: auto; padding: 11px 26px; border: 0; border-radius: 6px;
    background: #ff8518; color: #fff; font-size: 1.05em; font-weight: bold;
    line-height: 1.2; box-shadow: 0 2px 8px rgba(255, 133, 24, .3); cursor: pointer;
}
input[type="submit"]:hover, button[type="submit"]:hover { background: #e8740c; color: #fff; }

/* ---------- pie ---------- */
footer { width: 960px; margin: 0 auto; padding: 0 0 20px; }
footer nav { height: 13px; border: 0; background: url("../img/footer-shadow.png") center bottom no-repeat; box-shadow: none; }
footer p { margin: 0; color: #666; font-size: .917em; line-height: 1.5em; text-align: center; }
footer p a { color: #666; }
footer p a:hover { color: #333; }
