/* ============================================================
   TABLÓN DE ANUNCIOS — market.css
   ============================================================ */

.mkt-module {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 16px 60px;
    font-size: 16px;
}

/* ── Hero ── */
.mkt-hero { padding: 28px 0 20px; text-align: center; }
.mkt-hero__title {
    font-size: 2.2rem; font-weight: 700; color: #e8e8e8;
    margin: 0 0 8px; text-transform: uppercase; letter-spacing: 0.04em;
}
.mkt-hero__sub { font-size: 1.05rem; color: rgba(255,255,255,0.45); margin: 0; }

/* ── Alert ── */
.mkt-alert {
    padding: 14px 20px; border-radius: 6px;
    font-size: 1.05rem; margin-bottom: 18px; font-weight: 600;
}
.mkt-alert--success { background: rgba(40,180,100,0.15); border: 1px solid rgba(40,180,100,0.4); color: #4de0a0; }
.mkt-alert--error   { background: rgba(220,60,60,0.15);  border: 1px solid rgba(220,60,60,0.4);  color: #f07070; }

/* ── Layout ── */
.mkt-layout { display: flex; gap: 22px; align-items: flex-start; }
.mkt-sidebar { flex: 0 0 290px; display: flex; flex-direction: column; gap: 14px; }
.mkt-board   { flex: 1; min-width: 0; }

/* ── Panel ── */
.mkt-panel {
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 10px; overflow: hidden;
}
.mkt-panel__title {
    padding: 12px 16px; font-size: 0.95rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.08em;
    color: #3ab4c8; background: rgba(58,180,200,0.07);
    border-bottom: 1px solid rgba(58,180,200,0.12);
}
.mkt-panel--login-cta {
    padding: 28px 20px; text-align: center;
    color: rgba(255,255,255,0.55); font-size: 1.05rem;
}
.mkt-panel--login-cta .mkt-panel__icon { display: block; font-size: 2.2rem; margin-bottom: 10px; }
.mkt-panel--login-cta a { color: #3ab4c8; text-decoration: none; }
.mkt-panel--login-cta a:hover { text-decoration: underline; }

/* ── Form elements ── */
.mkt-filter-form, .mkt-post-form {
    padding: 16px 18px; display: flex; flex-direction: column; gap: 12px;
}
.mkt-label {
    font-size: 0.95rem; font-weight: 700; color: rgba(255,255,255,0.65);
    text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: -4px;
}
.mkt-hint { font-size: 0.85rem; font-weight: 400; color: rgba(255,255,255,0.3); text-transform: none; letter-spacing: 0; }
.mkt-select, .mkt-input {
    width: 100%; background: rgba(0,0,0,0.3);
    border: 1px solid rgba(255,255,255,0.12); border-radius: 6px;
    color: #d8d8d8; font-size: 1rem; padding: 9px 12px;
    outline: none; transition: border-color 0.2s; box-sizing: border-box; -webkit-appearance: none;
}
.mkt-select:focus, .mkt-input:focus { border-color: #3ab4c8; }
.mkt-select option { background: #1a1a2e; }
.mkt-select--xs { width: auto; flex: 0 1 70px; }

/* ── Radios ── */
.mkt-radio-group { display: flex; gap: 10px; }
.mkt-radio {
    display: flex; align-items: center; gap: 7px; font-size: 1rem; color: #c8c8c8;
    cursor: pointer; padding: 9px 14px; border-radius: 6px;
    border: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.2);
    transition: border-color 0.2s, background 0.2s; flex: 1; justify-content: center;
}
.mkt-radio:has(input:checked)       { border-color: #3ab4c8; background: rgba(58,180,200,0.1); }
.mkt-radio--sell:has(input:checked) { border-color: #c9a84c; background: rgba(201,168,76,0.12); }
.mkt-radio input { accent-color: #3ab4c8; cursor: pointer; width: 15px; height: 15px; }

/* ── Level row ── */
.mkt-level-row { display: flex; align-items: center; gap: 8px; }
.mkt-level-lbl { font-size: 1rem; color: rgba(255,255,255,0.45); white-space: nowrap; }

/* ── Checkboxes ── */
.mkt-checks { display: flex; flex-wrap: wrap; gap: 7px; }
.mkt-check {
    display: flex; align-items: center; gap: 6px; font-size: 0.95rem; color: #c0c0c0;
    cursor: pointer; padding: 6px 13px; border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.1); background: rgba(0,0,0,0.2);
    transition: border-color 0.2s, background 0.2s, color 0.2s;
}
.mkt-check:has(input:checked) { border-color: #c9a84c; background: rgba(201,168,76,0.12); color: #c9a84c; }
.mkt-check input { accent-color: #c9a84c; cursor: pointer; width: 14px; height: 14px; }

/* ── Buttons ── */
.mkt-btn {
    display: inline-block; padding: 9px 18px; border-radius: 6px; font-size: 0.98rem;
    font-weight: 600; text-align: center; cursor: pointer; border: 1px solid transparent;
    text-decoration: none; transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.mkt-btn--primary { background: #3ab4c8; color: #0a0a14; border-color: #3ab4c8; }
.mkt-btn--primary:hover { background: #2fa0b2; }
.mkt-btn--ghost { background: transparent; color: rgba(255,255,255,0.5); border-color: rgba(255,255,255,0.15); }
.mkt-btn--ghost:hover { color: #fff; border-color: rgba(255,255,255,0.35); }
.mkt-btn--submit {
    background: linear-gradient(135deg, #3ab4c8, #2a90a8);
    color: #fff; border: none; padding: 12px; font-size: 1.05rem; letter-spacing: 0.04em;
}
.mkt-btn--submit:hover { background: linear-gradient(135deg, #2fa0b2, #228090); }
.mkt-btn--print {
    background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.6);
    border-color: rgba(255,255,255,0.15); font-size: 0.9rem; padding: 6px 14px;
}
.mkt-btn--print:hover { background: rgba(255,255,255,0.14); color: #fff; }
.mkt-filter-btns { display: flex; gap: 8px; }
.mkt-filter-btns .mkt-btn { flex: 1; }

/* ── Board meta ── */
.mkt-board__meta {
    display: flex; align-items: center; justify-content: space-between;
    font-size: 0.95rem; color: rgba(255,255,255,0.35);
    margin-bottom: 14px; padding: 0 2px;
}

/* ── Post LIST (renglones) ── */
.mkt-list { display: flex; flex-direction: column; gap: 3px; }

.mkt-row {
    display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px;
    padding: 8px 14px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.09);
    border-left: 3px solid transparent;
    border-radius: 6px;
    font-size: 1.18rem;
    transition: background 0.15s;
}
.mkt-row--buy  { border-left-color: #3ab4c8; }
.mkt-row--sell { border-left-color: #c9a84c; }
.mkt-row:hover { background: rgba(255,255,255,0.10); }

/* Badge */
.mkt-badge {
    font-size: 0.78rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.07em; padding: 2px 9px; border-radius: 20px; white-space: nowrap;
}
.mkt-badge--buy  { background: rgba(58,180,200,0.18); color: #3ab4c8; border: 1px solid rgba(58,180,200,0.35); }
.mkt-badge--sell { background: rgba(201,168,76,0.18); color: #c9a84c; border: 1px solid rgba(201,168,76,0.35); }

/* Char */
.mkt-row__char a { color: rgba(255,255,255,0.9) !important; font-weight: 700; text-decoration: none; white-space: nowrap; }
.mkt-row__char a:hover { color: #fff !important; }

/* Verb */
.mkt-row__verb { font-weight: 700; font-size: 0.95rem; white-space: nowrap; }
.mkt-row__verb--buy  { color: #3ab4c8; }
.mkt-row__verb--sell { color: #c9a84c; }

/* Item */
.mkt-row__item { font-weight: 600; color: #e0e0e0; display: flex; align-items: center; gap: 5px; }
.mkt-row__lvl {
    font-size: 0.85rem; font-weight: 700; color: #c9a84c;
    background: rgba(201,168,76,0.12); padding: 1px 6px; border-radius: 4px; white-space: nowrap;
}

/* Tags */
.mkt-row__tags { display: flex; gap: 4px; flex-wrap: wrap; }
.mkt-opt-tag {
    font-size: 0.80rem; font-weight: 600; color: #c9a84c;
    background: rgba(201,168,76,0.1); border: 1px solid rgba(201,168,76,0.28);
    padding: 1px 7px; border-radius: 20px; white-space: nowrap;
}
.mkt-opt-tag--socket {
    color: #7ec8e3; background: rgba(126,200,227,0.1); border-color: rgba(126,200,227,0.28);
}

/* Price */
.mkt-row__price { font-weight: 700; color: #eee; white-space: nowrap; margin-left: auto; }
.mkt-row__pide  { font-size: 0.82rem; font-weight: 400; color: rgba(255,255,255,0.4); }

/* Note */
.mkt-row__note {
    font-size: 0.88rem; color: rgba(255,255,255,0.38); font-style: italic;
    max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Expiry */
.mkt-row__exp { font-size: 0.78rem; color: rgba(255,255,255,0.22); white-space: nowrap; }

/* Delete */
.mkt-del-form { margin: 0; padding: 0; display: inline; }
.mkt-del-btn {
    background: transparent; border: 1px solid rgba(220,60,60,0.3);
    color: rgba(220,100,100,0.6); border-radius: 4px; width: 20px; height: 20px;
    font-size: 0.72rem; cursor: pointer; padding: 0; line-height: 1;
    transition: background 0.2s, color 0.2s;
}
.mkt-del-btn:hover { background: rgba(220,60,60,0.2); color: #f07070; }

/* ── Empty ── */
.mkt-empty { text-align: center; padding: 60px 20px; color: rgba(255,255,255,0.35); }
.mkt-empty__icon { font-size: 2.8rem; display: block; margin-bottom: 14px; }
.mkt-empty__text { font-size: 1.05rem; margin-bottom: 18px; }

/* ── Pagination ── */
.mkt-pagination {
    display: flex; align-items: center; justify-content: center;
    gap: 6px; margin-top: 28px; flex-wrap: wrap;
}
.mkt-page-btn {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 36px; height: 36px; padding: 0 10px;
    border-radius: 6px; font-size: 0.95rem; font-weight: 600;
    background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.12);
    color: rgba(255,255,255,0.65); text-decoration: none;
    transition: background 0.2s, color 0.2s;
}
.mkt-page-btn:hover { background: rgba(255,255,255,0.14); color: #fff; }
.mkt-page-btn--active {
    background: #3ab4c8; color: #0a0a14; border-color: #3ab4c8; cursor: default;
}
.mkt-page-btn--disabled { opacity: 0.3; cursor: default; pointer-events: none; }
.mkt-page-ellipsis { color: rgba(255,255,255,0.35); font-size: 0.95rem; padding: 0 4px; }

/* ── Responsive ── */
@media (max-width: 900px) {
    .mkt-layout { flex-direction: column; }
    .mkt-sidebar { flex: none; width: 100%; }
    .mkt-row__note { max-width: 120px; }
}
@media (max-width: 500px) {
    .mkt-row { font-size: 0.9rem; }
    .mkt-row__note { display: none; }
}

/* ================================================================
   PRINT / PDF
   Oculta navegación, corrige colores, elimina URLs después de links
   ================================================================ */
@media print {
    /* Eliminar URLs que el browser agrega automáticamente después de <a> */
    a[href]:after { content: none !important; }
    a { text-decoration: none !important; }

    /* Ocultar navegación, sidebar y elementos no imprimibles */
    .mkt-sidebar,
    .mkt-hero,
    .mkt-btn--print,
    .mkt-del-form,
    .mkt-pagination,
    .mkt-row__exp,
    header,
    .site-header,
    .header,
    footer,
    .footer-block,
    .social-block,
    #overlay { display: none !important; }

    /* Quitar estilos de la caja de contenido */
    .contentBlock {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
        box-shadow: none !important;
    }

    body { background: #fff !important; }

    .mkt-module { padding: 0 !important; max-width: 100% !important; }
    .mkt-board  { width: 100% !important; }

    .mkt-board__meta {
        color: #333 !important; border-bottom: 1px solid #ccc;
        padding-bottom: 8px; margin-bottom: 10px;
    }

    .mkt-list { gap: 2px; }

    .mkt-row {
        background: #f7f8fa !important;
        border: 1px solid #d8d8d8 !important;
        border-left: 3px solid #aaa !important;
        break-inside: avoid; page-break-inside: avoid;
    }
    .mkt-row--buy  { border-left-color: #2a90b0 !important; }
    .mkt-row--sell { border-left-color: #a07010 !important; }

    .mkt-badge--buy  { background: #d0eef7 !important; color: #135570 !important; border-color: #90cce0 !important; }
    .mkt-badge--sell { background: #fdf0cc !important; color: #7a5500 !important; border-color: #d4b04a !important; }

    .mkt-row__char a     { color: #111 !important; }
    .mkt-row__verb--buy  { color: #135570 !important; }
    .mkt-row__verb--sell { color: #a07010 !important; }
    .mkt-row__item       { color: #111 !important; }
    .mkt-row__lvl        { color: #7a5500 !important; background: #fdf0cc !important; }
    .mkt-opt-tag         { color: #7a5500 !important; background: #fdf0cc !important; border-color: #d4b04a !important; }
    .mkt-opt-tag--socket { color: #0a4a60 !important; background: #d0eef8 !important; border-color: #4fa8c8 !important; }
    .mkt-row__price      { color: #111 !important; }
    .mkt-row__pide       { color: #555 !important; }
    .mkt-row__note       { color: #555 !important; max-width: none !important; white-space: normal !important; }
}
