/* ── EcomNinja Plataformas — Amber Palette ─────────────────────── */

/* ── Rating bar (reseñas por dimensión) ──────────────────────────── */
.plat-rating-bar {
    height: 8px;
    border-radius: 9999px;
    background: #FEF3C7; /* amber-100 */
    overflow: hidden;
}
.plat-rating-bar__fill {
    height: 100%;
    border-radius: 9999px;
    background: linear-gradient(90deg, #F59E0B, #FBBF24); /* amber-500 → amber-400 */
    transition: width .6s ease;
}

/* ── Market share bar (single page) ──────────────────────────────── */
.plat-market-bar {
    position: relative;
    height: 22px;
    border-radius: 9999px;
    background: #FEF3C7; /* amber-100 */
    overflow: hidden;
    margin: .5rem 0;
}
.plat-market-bar__fill {
    height: 100%;
    border-radius: 9999px;
    background: linear-gradient(90deg, #B45309 0%, #D97706 60%, #FBBF24 100%); /* amber-700 → 600 → 400 */
    transition: width .8s cubic-bezier(.25,.8,.25,1);
    position: relative;
}
.plat-market-bar__fill::after {
    content: attr(data-pct);
    position: absolute;
    right: .6rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: .7rem;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
    line-height: 1;
}
.plat-market-bar__label {
    font-size: .75rem;
    font-weight: 700;
    color: #92400E; /* amber-800 */
    margin-top: .25rem;
    display: block;
}

/* ── Features table ───────────────────────────────────────────────── */
.plat-features-table {
    border-collapse: collapse;
    width: 100%;
}
.plat-features-table th {
    background: #FEF3C7; /* amber-100 */
    color: #78350F;       /* amber-900 */
    padding: .625rem .875rem;
    font-size: .875rem;
    text-align: left;
    border-bottom: 2px solid #FDE68A; /* amber-200 */
}
.plat-features-table td {
    padding: .5rem .875rem;
    font-size: .875rem;
    border-bottom: 1px solid #FEF3C7;
}
.plat-features-table tr:nth-child(even) td { background: #FFFBEB; } /* amber-50 */
.plat-features-table tr:nth-child(odd)  td { background: #fff; }
.plat-features-table .feat-yes { color: #059669; font-weight: 600; }
.plat-features-table .feat-no  { color: #DC2626; }

/* ── Speed badge ──────────────────────────────────────────────────── */
.plat-speed-badge {
    background: #FEF3C7; /* amber-100 */
    color: #78350F;       /* amber-900 */
    padding: .2rem .6rem;
    border-radius: 9999px;
    font-size: .75rem;
    font-weight: 700;
    white-space: nowrap;
}
.plat-speed-badge::before {
    content: '⚡ ';
}

/* ── Tech tags ────────────────────────────────────────────────────── */
.plat-tech-tag {
    display: inline-flex;
    align-items: center;
    background: #FDE68A; /* amber-200 */
    color: #78350F;       /* amber-900 */
    padding: .1rem .45rem;
    border-radius: 9999px;
    font-size: .7rem;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
    margin: .125rem;
}

/* ── Pros / Cons ──────────────────────────────────────────────────── */
.plat-pros-cons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}
@media (max-width: 640px) {
    .plat-pros-cons { grid-template-columns: 1fr; }
}

.plat-pros-cons__pros,
.plat-pros-cons__cons {
    border-radius: .75rem;
    padding: 1rem 1.25rem;
}

/* Pros column */
.plat-pros-cons__pros {
    border: 1px solid #A7F3D0; /* green-200 */
    background: #F0FDF4;
}
.plat-pros-cons__pros-title {
    font-weight: 700;
    font-size: .875rem;
    color: #065F46;
    margin-bottom: .75rem;
    display: flex;
    align-items: center;
    gap: .4rem;
}
.plat-pros-cons__pros-title::before {
    content: '✓';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 9999px;
    background: #059669;
    color: #fff;
    font-size: .7rem;
    font-weight: 700;
    flex-shrink: 0;
}

/* Cons column */
.plat-pros-cons__cons {
    border: 1px solid #FECACA; /* red-200 */
    background: #FFF5F5;
}
.plat-pros-cons__cons-title {
    font-weight: 700;
    font-size: .875rem;
    color: #991B1B;
    margin-bottom: .75rem;
    display: flex;
    align-items: center;
    gap: .4rem;
}
.plat-pros-cons__cons-title::before {
    content: '✕';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 9999px;
    background: #DC2626;
    color: #fff;
    font-size: .7rem;
    font-weight: 700;
    flex-shrink: 0;
}

/* Pro/Con list items */
.plat-pros-cons__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.plat-pros-cons__pros .plat-pros-cons__list li::before {
    content: '✓  ';
    color: #059669;
    font-weight: 700;
}
.plat-pros-cons__cons .plat-pros-cons__list li::before {
    content: '✕  ';
    color: #DC2626;
    font-weight: 700;
}
.plat-pros-cons__list li {
    font-size: .875rem;
    color: #374151;
    line-height: 1.5;
}

/* ── Responsive tweaks ────────────────────────────────────────────── */
@media (max-width: 768px) {
    .plat-market-bar { height: 18px; }
    .plat-features-table th,
    .plat-features-table td {
        padding: .4rem .6rem;
        font-size: .8rem;
    }
}