/* ===== RPCB Financial Calculator — Isolated Typography (RTL) =====
       All font-sizes use explicit px to prevent TheGem/Elementor
       html font-size from shrinking the calculator via rem units.
       ===== */

    /* ── Root isolation ─────────────────────────────────────────── */
    #z-score-app {
        direction: rtl !important;
        text-align: right !important;
        font-family: 'Tajawal', 'Cairo', sans-serif !important;
        font-size: 18px !important;
        line-height: 1.6 !important;
        letter-spacing: normal !important;
        zoom: normal !important;
        transform: none !important;
        -webkit-text-size-adjust: 100% !important;
        text-size-adjust: 100% !important;
        max-width: 1200px !important;
        margin: 30px auto !important;
        color: #16052F !important;
        padding: 20px 0 !important;
        background: linear-gradient(135deg, #F4F6FE 0%, #E3E9FC 100%) !important;
    }

    #z-score-app * {
        box-sizing: border-box !important;
        direction: rtl !important;
        text-align: right !important;
        font-family: 'Tajawal', 'Cairo', sans-serif !important;
        letter-spacing: normal !important;
    }

    /* Block ancestor zoom/transform from visually shrinking the widget */
    #z-score-app .container,
    #z-score-app #financialForm {
        zoom: normal !important;
        transform: none !important;
        -webkit-transform: none !important;
    }

    /* إصلاح خط الأيقونات */
    #z-score-app i.fas,
    #z-score-app i.far,
    #z-score-app i.fab {
        font-family: "Font Awesome 6 Free" !important;
        direction: ltr !important;
        display: inline-block !important;
    }

    #z-score-app .container {
        max-width: 1200px !important;
        background: linear-gradient(135deg, #FFFFFF 0%, #F4F6FE 100%) !important;
        margin: 30px auto !important;
        padding: 40px !important;
        border-radius: 10px !important;
        box-shadow: 0 4px 15px rgba(22, 5, 47, 0.1) !important;
        position: relative !important;
        overflow: hidden !important;
    }

    #z-score-app .container::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        width: 200px !important;
        height: 200px !important;
        background: linear-gradient(45deg, #16052F, transparent) !important;
        border-radius: 0 0 0 100% !important;
        opacity: 0.1 !important;
        z-index: 0 !important;
    }

    #z-score-app .container::after {
        content: '' !important;
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 150px !important;
        height: 150px !important;
        background: linear-gradient(225deg, #7E89DB, transparent) !important;
        border-radius: 0 100% 0 0 !important;
        opacity: 0.1 !important;
        z-index: 0 !important;
    }

    /* ── Headings ──────────────────────────────────────────────── */

    #z-score-app h1 {
        text-align: center !important;
        margin-bottom: 30px !important;
        color: #16052F !important;
        font-size: 36px !important;
        font-weight: 700 !important;
        line-height: 1.3 !important;
        letter-spacing: normal !important;
        position: relative !important;
        z-index: 1 !important;
    }

    #z-score-app h1::after {
        content: '' !important;
        display: block !important;
        width: 100px !important;
        height: 4px !important;
        background: #7E89DB !important;
        margin: 15px auto !important;
        border-radius: 2px !important;
    }

    #z-score-app h2 {
        color: #16052F !important;
        margin: 25px 0 15px !important;
        font-size: 22px !important;
        font-weight: 600 !important;
        line-height: 1.4 !important;
        letter-spacing: normal !important;
        padding-bottom: 8px !important;
        border-bottom: 2px solid #7E89DB !important;
        display: inline-block !important;
    }

    /* ── Sections & form groups ───────────────────────────────── */

    #z-score-app .section {
        margin-bottom: 30px !important;
        background: #F4F6FE !important;
        padding: 20px !important;
        border-radius: 10px !important;
        box-shadow: 0 2px 8px rgba(22, 5, 47, 0.05) !important;
        position: relative !important;
        z-index: 1 !important;
    }

    #z-score-app .form-group {
        position: relative !important;
        margin-bottom: 25px !important;
    }

    #z-score-app .form-group input {
        width: 100% !important;
        padding: 15px !important;
        border-radius: 8px !important;
        border: 1px solid #C1CEEF !important;
        background-color: #FFFFFF !important;
        color: #16052F !important;
        font-size: 18px !important;
        line-height: 1.5 !important;
        letter-spacing: normal !important;
        transition: all 0.3s ease !important;
    }

    #z-score-app .form-group input:focus {
        border-color: #7E89DB !important;
        box-shadow: 0 0 0 3px rgba(126, 137, 219, 0.2) !important;
        outline: none !important;
    }

    #z-score-app .form-group label {
        position: absolute !important;
        right: 15px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        background-color: #FFFFFF !important;
        padding: 0 5px !important;
        color: #4B557A !important;
        font-weight: 500 !important;
        font-size: 18px !important;
        line-height: 1.4 !important;
        letter-spacing: normal !important;
        transition: all 0.3s ease !important;
        pointer-events: none !important;
        z-index: 1 !important;
    }

    #z-score-app .form-group input:focus + label,
    #z-score-app .form-group input:not(:placeholder-shown) + label {
        top: 0 !important;
        font-size: 13px !important;
        line-height: 1.3 !important;
        color: #7E89DB !important;
        font-weight: 600 !important;
    }

    #z-score-app .form-group .icon {
        position: absolute !important;
        left: 15px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        color: #7E89DB !important;
        font-size: 19px !important;
        line-height: 1 !important;
        z-index: 2 !important;
    }

    /* ── Output placeholder ───────────────────────────────────── */

    #z-score-app #output {
        display: none !important;
        font-size: 17px !important;
    }

    /* ── Results container ────────────────────────────────────── */

    #z-score-app .results-container {
        display: none;
        margin-top: 30px !important;
        position: relative !important;
        z-index: 1 !important;
    }

    #z-score-app .results-header {
        text-align: center !important;
        margin-bottom: 30px !important;
        padding: 20px !important;
        background: linear-gradient(135deg, #16052F 0%, #7E89DB 100%) !important;
        color: #FFFFFF !important;
        border-radius: 10px !important;
        box-shadow: 0 4px 15px rgba(22, 5, 47, 0.1) !important;
    }

    #z-score-app .results-header h2 {
        color: #FFFFFF !important;
        border-bottom: none !important;
        font-size: 28px !important;
        line-height: 1.3 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #z-score-app .results-header p {
        margin: 10px 0 0 !important;
        font-size: 17px !important;
        line-height: 1.5 !important;
        color: #C1CEEF !important;
        opacity: 0.9 !important;
    }

    #z-score-app .results-grid {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
        gap: 20px !important;
        margin-bottom: 30px !important;
    }

    #z-score-app .result-card {
        background: #FFFFFF !important;
        border-radius: 10px !important;
        box-shadow: 0 4px 15px rgba(22, 5, 47, 0.1) !important;
        padding: 20px !important;
        transition: all 0.3s ease !important;
        border-top: 4px solid #7E89DB !important;
    }

    #z-score-app .result-card:hover {
        transform: translateY(-5px) !important;
        box-shadow: 0 8px 20px rgba(22, 5, 47, 0.15) !important;
    }

    #z-score-app .result-card h3 {
        color: #16052F !important;
        margin-bottom: 15px !important;
        font-size: 20px !important;
        line-height: 1.4 !important;
        letter-spacing: normal !important;
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
    }

    #z-score-app .result-card h3 i {
        color: #7E89DB !important;
        font-size: 20px !important;
    }

    #z-score-app .result-item {
        display: flex !important;
        justify-content: space-between !important;
        padding: 8px 0 !important;
        border-bottom: 1px solid #C1CEEF !important;
    }

    #z-score-app .result-item:last-child {
        border-bottom: none !important;
    }

    #z-score-app .result-item .label {
        font-weight: 500 !important;
        color: #4B557A !important;
        font-size: 16px !important;
        line-height: 1.5 !important;
    }

    #z-score-app .result-item .value {
        font-weight: 700 !important;
        color: #16052F !important;
        font-size: 16px !important;
        line-height: 1.5 !important;
    }

    /* ── Z-Score display ──────────────────────────────────────── */

    #z-score-app .z-score-container {
        text-align: center !important;
        margin: 20px 0 !important;
    }

    #z-score-app .z-score-value {
        font-size: 42px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        letter-spacing: normal !important;
        margin: 10px 0 !important;
        color: #16052F !important;
    }

    #z-score-app .z-score-label {
        font-size: 18px !important;
        font-weight: 600 !important;
        line-height: 1.4 !important;
        color: #7E89DB !important;
    }

    #z-score-app .recommendation-text {
        font-size: 17px !important;
        line-height: 1.8 !important;
        text-align: center !important;
        padding: 15px !important;
        border-radius: 10px !important;
        background: #F4F6FE !important;
        margin-top: 15px !important;
        position: relative !important;
        padding-right: 50px !important;
    }

    /* ── Z-Score category bars ────────────────────────────────── */

    #z-score-app .z-score-categories {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        margin: 20px 0 !important;
    }

    #z-score-app .z-score-category {
        display: flex !important;
        align-items: center !important;
        padding: 18px !important;
        border-radius: 10px !important;
        color: #FFFFFF !important;
        font-weight: 700 !important;
        transition: all 0.3s ease !important;
        position: relative !important;
        opacity: 0.6 !important;
    }

    #z-score-app .z-score-category.active {
        transform: scale(1.03) !important;
        box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2) !important;
        opacity: 1 !important;
    }

    #z-score-app .z-score-category.active::before {
        content: '\f00c' !important;
        font-family: 'Font Awesome 6 Free' !important;
        font-weight: 900 !important;
        position: absolute !important;
        right: 15px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        font-size: 22px !important;
        color: #FFFFFF !important;
        z-index: 2 !important;
    }

    #z-score-app .z-score-category.danger { background-color: #9B2226 !important; }
    #z-score-app .z-score-category.grey { background-color: #6C757D !important; }
    #z-score-app .z-score-category.safe { background-color: #2A9D8F !important; }

    #z-score-app .category-info { flex: 1 !important; text-align: center !important; }
    #z-score-app .category-name { font-size: 20px !important; margin-bottom: 8px !important; color: #FFFFFF !important; text-shadow: 0 1px 2px rgba(0,0,0,0.3) !important; line-height: 1.3 !important; }
    #z-score-app .category-condition { font-size: 16px !important; color: #FFFFFF !important; text-shadow: 0 1px 2px rgba(0,0,0,0.3) !important; line-height: 1.4 !important; }

    #z-score-app .ltr-math { direction: ltr !important; unicode-bidi: plaintext !important; display: inline-block !important; }

    /* ── Buttons ──────────────────────────────────────────────── */

    #z-score-app button {
        cursor: pointer !important;
        background: #16052F !important;
        color: #FFFFFF !important;
        border: none !important;
        border-radius: 8px !important;
        padding: 12px 20px !important;
        margin-top: 10px !important;
        font-size: 17px !important;
        font-weight: 600 !important;
        line-height: 1.4 !important;
        letter-spacing: normal !important;
        transition: all 0.3s ease !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
    }

    #z-score-app button i {
        font-size: 18px !important;
    }

    #z-score-app button:hover {
        background: #7E89DB !important;
        transform: translateY(-2px) !important;
        box-shadow: 0 4px 12px rgba(22, 5, 47, 0.3) !important;
    }

    #z-score-app .export-buttons {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 15px !important;
        margin-top: 25px !important;
        justify-content: center !important;
    }

    #z-score-app .export-buttons button { flex: 1 !important; min-width: 180px !important; }

    /* ── Canvas (chart) ───────────────────────────────────────── */

    #z-score-app canvas {
        display: none;
        margin-top: 40px !important;
        max-width: 100% !important;
        border-radius: 10px !important;
        box-shadow: 0 4px 15px rgba(22, 5, 47, 0.1) !important;
        background-color: #FFFFFF !important;
        padding: 20px !important;
    }

    /* ── Form layout ──────────────────────────────────────────── */

    #z-score-app .form-row {
        display: flex !important;
        gap: 20px !important;
        flex-wrap: wrap !important;
    }

    #z-score-app .form-row .section { flex: 1 !important; min-width: 280px !important; }

    /* ── Info section ─────────────────────────────────────────── */

    #z-score-app .info-section {
        margin-top: 50px !important;
        background: linear-gradient(135deg, #F4F6FE 0%, #FFFFFF 100%) !important;
        padding: 30px !important;
        border-radius: 10px !important;
        box-shadow: 0 4px 15px rgba(22, 5, 47, 0.1) !important;
        position: relative !important;
        z-index: 1 !important;
        border-right: 5px solid #7E89DB !important;
    }

    #z-score-app .info-section h2 {
        color: #16052F !important;
        font-size: 22px !important;
        line-height: 1.4 !important;
        margin-bottom: 20px !important;
        display: flex !important;
        align-items: center !important;
        gap: 15px !important;
    }

    #z-score-app .info-section h2 i { color: #7E89DB !important; font-size: 22px !important; }
    #z-score-app .info-section p { margin-bottom: 15px !important; line-height: 1.8 !important; font-size: 17px !important; color: #16052F !important; }

    #z-score-app .info-section .source {
        margin-top: 25px !important;
        padding-top: 15px !important;
        border-top: 1px solid #C1CEEF !important;
        font-size: 15px !important;
        line-height: 1.5 !important;
        color: #4B557A !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }

    #z-score-app .info-section .source a { color: #7E89DB !important; text-decoration: none !important; font-weight: 500 !important; font-size: 15px !important; }
    #z-score-app .info-section .source a:hover { text-decoration: underline !important; }

    /* ── Disclaimer ──────────────────────────────────────────── */

    #z-score-app .disclaimer {
        background-color: #F4F6FE !important;
        border-right: 4px solid #7E89DB !important;
        padding: 15px 20px !important;
        margin: 30px 0 !important;
        border-radius: 10px !important;
        box-shadow: 0 2px 8px rgba(22, 5, 47, 0.05) !important;
        font-size: 15px !important;
        line-height: 1.7 !important;
        color: #16052F !important;
        display: none !important;
    }

    #z-score-app .disclaimer-title {
        font-weight: 700 !important;
        color: #16052F !important;
        font-size: 16px !important;
        line-height: 1.4 !important;
        margin-bottom: 8px !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }

    #z-score-app .disclaimer-title i { color: #7E89DB !important; }

    /* إخفاء منطقة التقرير للطباعة حتى لا تظهر في الصفحة */
    #z-score-app #printReport {
        display: none;
    }

    /* ── Contact button ───────────────────────────────────────── */

    #z-score-app .contact-section {
        margin-top: 30px;
        text-align: center;
    }
    #z-score-app .rpcb-contact-button {
        width: 100% !important;
        display: flex !important;
        background-color: #16052F !important;
        color: #FFFFFF !important;
        border-radius: 8px !important;
        font-size: 17px !important;
        font-weight: 600 !important;
    }
    #z-score-app .rpcb-contact-button:hover {
        background-color: #7E89DB !important;
        color: #FFFFFF !important;
    }
    #z-score-app .rpcb-contact-button:focus {
        background-color: #16052F !important;
        color: #FFFFFF !important;
        outline: 3px solid rgba(126, 137, 219, 0.55) !important;
        outline-offset: 3px !important;
    }
    #z-score-app .rpcb-contact-button:active {
        background-color: #16052F !important;
        color: #FFFFFF !important;
    }

    /* ── Mobile ───────────────────────────────────────────────── */

    @media (max-width: 768px) {
        #z-score-app { font-size: 16px !important; }
        #z-score-app .container { padding: 25px !important; margin: 15px !important; }
        #z-score-app h1 { font-size: 30px !important; line-height: 1.3 !important; }
        #z-score-app h2 { font-size: 20px !important; }
        #z-score-app .form-row { flex-direction: column !important; gap: 0 !important; }
        #z-score-app .form-group input { font-size: 16px !important; }
        #z-score-app .form-group label { font-size: 16px !important; }
        #z-score-app .form-group input:focus + label,
        #z-score-app .form-group input:not(:placeholder-shown) + label { font-size: 12px !important; }
        #z-score-app .form-group .icon { font-size: 17px !important; }
        #z-score-app .export-buttons { flex-direction: column !important; }
        #z-score-app .export-buttons button { min-width: 100% !important; }
        #z-score-app button { font-size: 16px !important; }
        #z-score-app .results-grid { grid-template-columns: 1fr !important; }
        #z-score-app .results-header h2 { font-size: 24px !important; }
        #z-score-app .results-header p { font-size: 15px !important; }
        #z-score-app .result-card h3 { font-size: 18px !important; }
        #z-score-app .result-card h3 i { font-size: 18px !important; }
        #z-score-app .result-item .label,
        #z-score-app .result-item .value { font-size: 15px !important; }
        #z-score-app .z-score-value { font-size: 38px !important; }
        #z-score-app .z-score-label { font-size: 16px !important; }
        #z-score-app .z-score-category { padding: 15px !important; }
        #z-score-app .category-name { font-size: 18px !important; }
        #z-score-app .category-condition { font-size: 15px !important; }
        #z-score-app .recommendation-text { font-size: 15px !important; }
        #z-score-app .info-section { padding: 20px !important; }
        #z-score-app .info-section h2 { font-size: 20px !important; }
        #z-score-app .info-section h2 i { font-size: 20px !important; }
        #z-score-app .info-section p { font-size: 15px !important; }
        #z-score-app .info-section .source { font-size: 14px !important; }
        #z-score-app .info-section .source a { font-size: 14px !important; }
        #z-score-app .disclaimer { font-size: 14px !important; }
        #z-score-app .disclaimer-title { font-size: 15px !important; }
    }