/* ════════════════════════════════════════════════════════
   EP Package Selection — Skin v2 — Minimal CSS
   רוב העיצוב מתבצע ב-JS (ps-skin.js) שדורס inline styles
   הקובץ הזה מטפל רק בפונט ובכמה אלמנטים שלא נופלים תחת inline
   ════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Hebrew:wght@400;600;700;800;900&display=swap');

.package-selection-container,
.package-selection-container * {
    font-family: 'IBM Plex Sans Hebrew', system-ui, sans-serif !important;
}

/* רקע גלובלי */
.package-selection-container {
    background: #F1F4F7 !important;
    direction: rtl;
}

/* DISABLE WPEMOJI */
.package-selection-container img.emoji {
    display: inline !important;
    height: 1em !important;
    width: 1em !important;
    margin: 0 .07em !important;
    vertical-align: -0.1em !important;
    background: none !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

/* hover על כפתורים — ה-JS לא יכול להוסיף transitions */
.package-selection-container button:hover {
    transform: translateY(-1px);
    transition: all .15s;
}

/* הכפתורים שלי לא יקבלו transform */
.package-selection-container .ep-ps-toggle button:hover,
.package-selection-container .ep-ps-rep-btn:hover,
.package-selection-container .ep-ps-back-btn:hover {
    transform: none !important;
}

.package-selection-container .ep-ps-rep-btn:hover {
    background: rgba(255,255,255,.15) !important;
    border-color: rgba(255,255,255,.6) !important;
}

.package-selection-container .ep-ps-back-btn:hover {
    border-color: #0D9E5C !important;
    color: #0D9E5C !important;
}

/* MOBILE */
@media (max-width: 768px) {
    .package-interface {
        grid-template-columns: 1fr !important;
    }
}
