/**
 * Honorarios Relacionados — Servicios Profesionales (diseño v3)
 *
 * Tarjeta oscura tipo "carta protocolar" para sidebar:
 * - Verde profundo (#0e3d2e → #16523e) con detalles dorados (#c9a449)
 * - Tipografía: Cormorant Garamond (serif italic) + Manrope (sans 13-14px)
 * - Listas con scroll vertical custom (max-height 220px)
 * - Numerales romanos por sección
 * - Divider con asterisco (✦)
 * - Hover animado: dash dorado se expande
 *
 * Namespace: .bcr-sv-* (Servicios = sv) — namespace propio para no chocar con bfcr-*.
 */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Manrope:wght@300;400;500;600;700&display=swap');

/* ============================================================
   DEFENSIVE RESET — neutralizar herencia del tema Avante
   El tema parent (y plugins varios) aplican estilos a h1-h6, p, ul, li,
   a, etc. dentro de .widget. Estos resets garantizan que NADA del cascade
   externo afecte el render del widget. Aplicado SOLO dentro de .bcr-sv.
   ============================================================ */

.bcr-sv,
.bcr-sv * {
    box-sizing: border-box;
}

.bcr-sv h1, .bcr-sv h2, .bcr-sv h3, .bcr-sv h4, .bcr-sv h5, .bcr-sv h6,
.bcr-sv [role="heading"],
.bcr-sv p,
.bcr-sv div,
.bcr-sv span,
.bcr-sv ul, .bcr-sv ol, .bcr-sv li,
.bcr-sv a {
    background: transparent !important;
    background-image: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    text-shadow: none !important;
    border: 0;
    border-radius: 0;
    margin: 0;
    padding: 0;
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
    font-style: normal;
    text-decoration: none;
    color: inherit;
    line-height: inherit;
    list-style: none;
    text-align: left;
    width: auto;
    height: auto;
    min-height: 0;
    max-height: none;
    position: static;
    transform: none;
    filter: none;
    opacity: 1;
}

.bcr-sv a:hover,
.bcr-sv a:focus,
.bcr-sv a:active,
.bcr-sv a:visited {
    background: transparent !important;
    text-decoration: none !important;
}

.bcr-sv ul::before,
.bcr-sv ol::before,
.bcr-sv li::before,
.bcr-sv li::after {
    content: none !important;
    display: none !important;
}

/* Avante envuelve cada widget en .widget con un .widgettitle automático.
   Lo ocultamos porque el card ya tiene su propio header. */
.widget_bfcr_honorarios_widget > .widgettitle,
.widget_bfcr_honorarios_widget > .widget-title,
.widget_bfcr_honorarios_widget > h2:first-child,
.widget_bfcr_honorarios_widget > h3:first-child {
    display: none !important;
}

/* ============================================================
   Container card
   ============================================================ */

.bcr-sv {
    --bcr-green-deep: #0e3d2e;
    --bcr-green: #16523e;
    --bcr-gold: #c9a449;
    --bcr-gold-soft: #e0c373;
    --bcr-cream: #fbf9f3;
    --bcr-line: rgba(201, 164, 73, 0.28);
    --bcr-list-max: 240px;
    --bcr-list-min: 80px;

    display: block;
    width: 100%;
    max-width: 340px;
    margin: 0 auto 24px auto !important;
    padding: 0 !important;
    background: linear-gradient(180deg, #0e3d2e 0%, #16523e 100%) !important;
    background-color: #0e3d2e !important;
    color: #fbf9f3 !important;
    font-family: 'Manrope', 'Segoe UI', sans-serif !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    border: 1px solid rgba(201, 164, 73, 0.35) !important;
    border-radius: 4px !important;
    position: relative;
    overflow: hidden;
}

.bcr-sv *,
.bcr-sv *::before,
.bcr-sv *::after {
    box-sizing: border-box;
}

.bcr-sv::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(circle at 20% 0%, rgba(201, 164, 73, 0.08), transparent 45%),
        radial-gradient(circle at 80% 100%, rgba(201, 164, 73, 0.06), transparent 50%);
    pointer-events: none;
    z-index: 0;
}

.bcr-sv > * {
    position: relative;
    z-index: 1;
}

/* ============================================================
   Header
   ============================================================ */

.bcr-sv__head {
    text-align: center !important;
    padding: 22px 20px 16px !important;
    border-bottom: 1px solid var(--bcr-line) !important;
    background: transparent !important;
}

.bcr-sv__crest {
    width: 34px !important;
    height: 34px !important;
    margin: 0 auto 8px !important;
    color: var(--bcr-gold) !important;
    display: block !important;
    opacity: 0.95 !important;
}

.bcr-sv__eyebrow {
    display: block !important;
    font-family: 'Manrope', 'Segoe UI', sans-serif !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 0.32em !important;
    text-transform: uppercase !important;
    color: var(--bcr-gold-soft) !important;
    margin: 0 0 6px !important;
    text-align: center !important;
}

.bcr-sv__title {
    display: block !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-weight: 500 !important;
    font-size: 24px !important;
    line-height: 1.1 !important;
    color: var(--bcr-cream) !important;
    margin: 0 0 6px !important;
    text-align: center !important;
    background: transparent !important;
    background-image: none !important;
    padding: 0 !important;
    border: 0 !important;
}

.bcr-sv__title em {
    font-style: italic !important;
    color: var(--bcr-gold) !important;
    background: transparent !important;
    font-weight: inherit !important;
}

.bcr-sv__sub {
    display: block !important;
    font-family: 'Manrope', 'Segoe UI', sans-serif !important;
    font-size: 11px !important;
    color: rgba(251, 249, 243, 0.7) !important;
    margin: 0 !important;
    text-align: center !important;
}

/* Línea contextual entre título y subtítulo: "a la Ley N.° 8634", etc. */
.bcr-sv__context {
    display: block !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-style: italic !important;
    font-weight: 500 !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    color: var(--bcr-gold) !important;
    margin: 4px 0 8px !important;
    padding: 0 !important;
    text-align: center !important;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    letter-spacing: 0.01em !important;
}

/* ============================================================
   Sections
   ============================================================ */

.bcr-sv__section {
    padding: 0 !important;
    background: transparent !important;
}

.bcr-sv__section-head {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 16px 22px 12px !important;
    border-bottom: 1px dashed var(--bcr-line) !important;
    background: transparent !important;
}

.bcr-sv__numeral {
    display: inline-block !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-style: italic !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    color: var(--bcr-gold) !important;
    line-height: 1 !important;
    background: transparent !important;
}

.bcr-sv__section-title {
    display: block !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-weight: 600 !important;
    font-size: 18px !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    color: var(--bcr-cream) !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    flex: 1 !important;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    text-align: left !important;
}

.bcr-sv__count {
    display: inline-block !important;
    font-family: 'Manrope', 'Segoe UI', sans-serif !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 0.18em !important;
    color: rgba(201, 164, 73, 0.65) !important;
    background: transparent !important;
}

/* ============================================================
   Lists with custom scrollbar
   ============================================================ */

.bcr-sv__list-wrap {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: var(--bcr-list-max);
    min-height: var(--bcr-list-min);
    padding: 4px 18px 14px 22px;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(201, 164, 73, 0.5) rgba(0, 0, 0, 0.18);
}

.bcr-sv__list-wrap::-webkit-scrollbar {
    width: 6px;
}

.bcr-sv__list-wrap::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.18);
    margin: 6px 0;
    border-radius: 3px;
}

.bcr-sv__list-wrap::-webkit-scrollbar-thumb {
    background: rgba(201, 164, 73, 0.45);
    border-radius: 3px;
}

.bcr-sv__list-wrap::-webkit-scrollbar-thumb:hover {
    background: rgba(201, 164, 73, 0.75);
}

.bcr-sv__list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.bcr-sv__list li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.bcr-sv__list a {
    display: block !important;
    position: relative !important;
    padding: 9px 0 9px 16px !important;
    color: rgba(251, 249, 243, 0.88) !important;
    text-decoration: none !important;
    font-family: 'Manrope', 'Segoe UI', sans-serif !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    border-bottom: 1px solid rgba(201, 164, 73, 0.1) !important;
    transition: color 0.25s, padding 0.25s, background 0.25s !important;
    background: transparent !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

.bcr-sv__list li:last-child a {
    border-bottom: 0 !important;
}

.bcr-sv__list a::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    width: 6px !important;
    height: 1px !important;
    background: var(--bcr-gold) !important;
    opacity: 0.55 !important;
    transform: translateY(-50%) !important;
    transition: width 0.25s, opacity 0.25s !important;
    display: block !important;
}

.bcr-sv__list a:hover,
.bcr-sv__list a:focus {
    color: var(--bcr-gold-soft) !important;
    padding-left: 22px !important;
    background: rgba(201, 164, 73, 0.04) !important;
    text-decoration: none !important;
}

.bcr-sv__list a:hover::before,
.bcr-sv__list a:focus::before {
    width: 12px !important;
    opacity: 1 !important;
}

/* ============================================================
   Divider entre secciones
   ============================================================ */

.bcr-sv__divider {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 14px !important;
    padding: 12px 22px !important;
    background: transparent !important;
}

.bcr-sv__divider::before,
.bcr-sv__divider::after {
    content: '' !important;
    flex: 1 !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, var(--bcr-gold), transparent) !important;
    opacity: 0.55 !important;
    display: block !important;
}

.bcr-sv__divider span {
    display: inline-block !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-style: italic !important;
    color: var(--bcr-gold) !important;
    font-size: 16px !important;
    letter-spacing: 0.3em !important;
    line-height: 1 !important;
    background: transparent !important;
}

.bcr-sv__section:last-of-type .bcr-sv__list-wrap {
    padding-bottom: 18px;
}

/* ============================================================
   Footer CTA "Ver tabla completa"
   ============================================================ */

.bcr-sv__see-all {
    display: block !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 14px 22px !important;
    border-top: 1px solid var(--bcr-line) !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
    background: rgba(0, 0, 0, 0.18) !important;
    color: var(--bcr-gold-soft) !important;
    font-family: 'Manrope', 'Segoe UI', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: background 0.25s, color 0.25s !important;
    box-shadow: none !important;
}

.bcr-sv__see-all:hover,
.bcr-sv__see-all:focus {
    background: rgba(201, 164, 73, 0.08) !important;
    color: var(--bcr-cream) !important;
    text-decoration: none !important;
}

/* ============================================================
   Sidebar wrapper neutralization
   El tema Avante envuelve cada widget con .widget — neutralizamos paddings
   extras para que el card lleve su propio espaciado.
   ============================================================ */

.widget .bcr-sv {
    margin-top: 0;
}

/* Algunos sidebar styles del parent ponen un title automático "Honorarios
 * Relacionados" via .widgettitle — lo ocultamos porque el card ya tiene su
 * propio header. */
.widget_bfcr_honorarios_widget .widgettitle,
.widget_bfcr_honorarios_widget .widget-title,
.widget_bfcr_honorarios_widget > h2:first-child:not(.bcr-sv__title) {
    display: none;
}

/* ============================================================
   Mobile fine-tuning
   ============================================================ */

@media (max-width: 480px) {
    .bcr-sv {
        max-width: 100%;
        --bcr-list-max: 200px;
    }
    .bcr-sv__title {
        font-size: 22px;
    }
    .bcr-sv__section-title {
        font-size: 16px;
    }
}