/* eSIM vs Local SIM Page Styles - Scoped to #page-content */

/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@600&family=Poppins:wght@400;500;600;700&display=swap');

#page-content body {
    font-family: 'Poppins', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

#page-content .handwritten {
    font-family: 'Caveat', cursive;
}

#page-content .pill {
    border-radius: 999px;
}

#page-content .card {
    border-radius: 1.25rem;
    border: 1px solid rgba(148,163,184,0.35);
    background: #ffffff;
}

#page-content .badge-soft {
    background: rgba(50,169,48,0.09);
    border: 1px solid rgba(50,169,48,0.38);
}

#page-content .faq-item summary::-webkit-details-marker {
    display: none;
}

#page-content .faq-item[open] summary svg {
    transform: rotate(180deg);
}

/* Soft shadows like in Tailwind config */
#page-content .shadow-soft-lg {
    box-shadow: 0 18px 40px rgba(15,23,42,0.12);
}

/* Saily container: subtle frame + "wave" */
#page-content .saily-frame {
    border-radius: 1.75rem;
    border: 1px solid rgba(15,23,42,0.9);
    box-shadow:
        0 18px 40px rgba(15,23,42,0.18),
        0 0 0 2px rgba(250,204,21,0.8);
    position: relative;
    overflow: hidden;
}

#page-content .saily-wave {
    position: relative;
    background:
        radial-gradient(circle at -10% 20%, rgba(250,204,21,0.18), transparent 55%),
        radial-gradient(circle at 110% 80%, rgba(250,204,21,0.14), transparent 55%),
        linear-gradient(120deg, rgba(15,23,42,0.02), rgba(15,23,42,0.06));
}

#page-content .saily-wave::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(135deg,
            transparent 0%,
            rgba(250,204,21,0.15) 35%,
            rgba(250,204,21,0.08) 55%,
            transparent 85%);
    opacity: 0.9;
    pointer-events: none;
}