Urduflix

<!DOCTYPE html> <html lang="en"> <head> <title>Urduflix</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="shortcut icon" href="https://urduflix.com/images/favicontypes/81456/new-project-1.1721877814.png"> <meta name="csrf-param" content="authenticity_token" /> <meta name="csrf-token" content="SADYjJ8192kho0_CSkgPtwdWadawrwQHMOeOu3ARbo68zSEDPOao_5uO4T7bigZpLpETLUeQk7F15tZbhZuloQ" /> <link rel="stylesheet" href="https://assets-gke.uscreencdn.com/vite/assets/tailwind-DXMvPnF3.css" media="all" /> <link rel="stylesheet" href="https://assets-gke.uscreencdn.com/vite/assets/vue_storefront-BGuMSFYY.css" media="all" /> <script src="https://assets-gke.uscreencdn.com/vite/assets/web-components-BBF6VBAw.js" crossorigin="anonymous" type="module"></script><link rel="modulepreload" href="https://assets-gke.uscreencdn.com/vite/assets/preload-helper-B8hUOznO.js" as="script" crossorigin="anonymous"> <script src="https://assets-gke.uscreencdn.com/vite/assets/storefront_hotwire-DxsFyolh.js" crossorigin="anonymous" type="module"></script><link rel="modulepreload" href="https://assets-gke.uscreencdn.com/vite/assets/preload-helper-B8hUOznO.js" as="script" crossorigin="anonymous"> <link rel="modulepreload" href="https://assets-gke.uscreencdn.com/vite/assets/stream_actions-BobdLDYC.js" as="script" crossorigin="anonymous"><link rel="stylesheet" href="https://assets-gke.uscreencdn.com/vite/assets/storefront_hotwire-CxdIV11C.css" media="screen" />  <script async src="https://www.googletagmanager.com/gtag/js?id=G-KKG8H9LZF7"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-KKG8H9LZF7'); </script>   <script> (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-KHXT3Q4'); </script>  <script> var sentryDsn = 'https://a7a5d334e15546e5908bf92cc68c8833@o282387.ingest.sentry.io/5277605' var sentryStorefrontActive = true var sentryStorefrontSampleRate = 1.0 var railsEnv = 'production' var analyticsHost = 'https://stats.uscreen.io' var analyticsConfig = {"debug": false, "mode": "batch","maxIntervalMs": 20000, "maxEventsInStorage": 10, "allowedEvents": ["abort", "emptied", "ended", "error", "interruptbegin","interruptend", "loadstart", "pause", "canplay","play", "progress", "stalled", "waiting", "seeking", "seeked"],"alwaysClearSession": true,"maxSendingAttempts": 5} </script> <script> //<![CDATA[ window.gon={};gon.global={"uppy_companion_url":"https://uppy.uscreen.io/","assets_cdn_url":"https://alpha.uscreencdn.com","mixpanel_token":"44e8d04b49529b306bd4a1c79afcc56e"};gon.pixel_user=null;gon.pixel_store=81257;gon.pixel_session="13a01feb-fa05-46c1-baba-b334776b582e";gon.impersonated=null;gon.request_referer=null;gon.ga_id=null;gon.pixel_email=null;gon.environment="production";gon.analytics={"user_id":null,"store_id":81257,"pixel_session":"13a01feb-fa05-46c1-baba-b334776b582e","impersonated":null,"request_referer":null,"ga_id":null,"email":null,"environment":"production"};gon.env="production";gon.session=false;gon.currency="USD";gon.country="SG";gon.locale="en";gon.title="Urduflix";gon.terms_url="http://urduflix.com/pages/terms-of-service";gon.stripe="pk_live_DImPqz7QOOyx70XCA9DSifxb";gon.captcha=true;gon.has_gift_card_enabled=true;gon.feature_flags=["show_captcha","show_captcha_v3","live_events_feed","google_play_subscriptionsv2","allow_invite_people","hotwire_catalog","community_without_header","sign_in_with_hotwire","allow_new_prices_to_existing_members","improved_go_live_ex","zapier_and_webhooks","remove_uscreen_branding","mobile_calendar","calendar_push_notifications","apps_update_requests","live_chat_with_sse","studio_beta","overage_billing_for_live_streaming","banner_with_live_stream_overage","automate_billing_for_ott_svod","go_live_from_mobile","paypal_beta","client_emails_footer","themeless","omni_analytics","community_notifications_v1","force_shortened_checkout","force_new_join_page","new_video_get_access_page","on_hold_hotwire","real_time_apple_notifications","real_time_android_notifications","tailwind_latest","new_subscription_flow","rewind_live_event","subscription_management_on_people_page","passwordless_sign_in","invoices_based_subscriber_analytics_chart","postmark_transactional_delivery","rich_user_profile","pause_subscriptions","vertical_video_thumbnails","stripe_tax_collection_manual_enable","postmark_simplified","stripe_subscriptions","account_creation_required","new_gifts"];gon.referral_program_tab_enabled=false;gon.recaptcha_v3_pub_key="6LenX-EZAAAAAAITxgGIXKB3S2OVKsM5r5tg0wKL";gon.store_id=81257;gon.primary_color="#B32931";gon.color_scheme="dark";gon.banner_image=null;gon.logo="https://alpha.uscreencdn.com/nullx100/images/logotypes/81456/new-project.1718930283.png";gon.integrations={"facebook_pixel":false,"google_tag_manager":true,"google_analytics":true,"refersion":false}; //]]> </script> <script> window.apiUrl = "https://api.uscreencdn.com" window.apiOrigin = "urduflix" </script> <script> window.hotwireCatalog = true window.addEventListener('turbo:before-fetch-request', function (event) { event.detail.fetchOptions.headers['X-Fastly-Origin'] = "urduflix" }) </script> <title>Urduflix</title> <meta name="description" content="">  <meta name="twitter:card" content="summary" /> <meta name="twitter:title" content="Urduflix" /> <meta name="twitter:description" content="" /> <meta name="twitter:image" content="https://alpha.uscreencdn.com/450xnull/images/logotypes/81456/new-project.1718930283.png?auto=webp" />  <meta property="og:title" content="Urduflix" > <meta property="og:type" content="website" /> <meta property="og:url" content="https://urduflix.com" > <meta property="og:image" content="https://alpha.uscreencdn.com/1110xnull/images/logotypes/81456/new-project.1718930283.png?auto=webp" > <meta property="og:image:width" content="740" > <meta property="og:image:height" content="420" > <meta property="og:description" content="" > <meta property="og:site_name" content="Urduflix" /> <link rel="canonical" href="https://urduflix.com" /> <script type = 'application/ld+json' > { "@context": "https://schema.org", "@type": "Organization", "url": "https://urduflix.com", "@id": "https://urduflix.com/#organization", "name": "Urduflix", "logo": "https://alpha.uscreencdn.com/450xnull/images/logotypes/81456/new-project.1718930283.png?auto=webp" } </script> </head> <body class="dark" dir="ltr" >  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-KHXT3Q4" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>  <style> html { height: 100%; } body { height: 100%; min-height: 100vh; } a { color: #B32931; } .active-color { color: #B32931 !important; } .active-background-color { background-color: #B32931 !important; } .active-fill { fill: #B32931 !important; } .active-border-color { border-color: #B32931 !important; } .link, .link:hover, .link:active, .link:focus, .link:visited { color: #B32931 !important; text-decoration: none; } .stripe-card-element .StripeElement { border-radius: 4px; background-color: #ffffff; border: solid 2px #d6dde5; padding: 10px 15px; } .stripe-card-element .field-with-error .StripeElement { border: solid 2px #ff2322; } .stripe-card-element .StripeElement--focus { border-color: #B32931 !important; } .stripe-card-element .StripeElement--invalid { border-color: #ff2322 !important; } .active { fill: #B32931 !important; } input[type=text]:active, input[type=password]:active, input[type=text]:focus, input[type=password]:focus { border-color: #B32931 !important; } .open { border-color: #B32931 !important; } .options { border-color: #B32931 !important; } .logo-url { text-decoration: none; } .bg-ds-default { background-color: #000; } </style> <style> :root { --primary: #B32931; --primary-rgb: 179, 41, 49; --contrast-text-color: #FFFFFF; --contrast-to-primary-color: #fff; } </style> <style id="custom-theme-styles" media="none"> body.light { --main-color-h: 0; --main-color-s: 100; --main-color-l: 100; --ds-bg-main: hsl(0, 100%, 100%); --ds-bg-default: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 96%); --ds-bg-inset: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 91%); --ds-bg-overlay: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 98%); --ds-bg-subtle: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 91%); --ds-border-default: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 85%); --ds-fg-default: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 8%); --ds-fg-muted: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 25%); --ds-fg-subtle: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 50%); } body.dark { --main-color-h: 0; --main-color-s: 100; --main-color-l: 0; --ds-bg-main: hsl(0, 100%, 0%); --ds-bg-default: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 10%); --ds-bg-overlay: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 2%); --ds-bg-inset: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 6%); --ds-bg-subtle: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 15%); --ds-border-default: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 20%); --ds-fg-default: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 98%); --ds-fg-muted: hsl(var(--main-color-h), calc(var(--main-color-s) * 1%), 70%); --ds-fg-subtle: hsl(var(--main-color-h), clamp(7%, calc(calc(var(--main-color-s) - 10) * 1%), 100%), 60%); } </style> <script> function toggleAccountForm() { const registration = document.getElementById('registration-form') const signIn = document.getElementById('sign-in-form') if (registration.classList.contains('hidden')) { signIn.classList.add('hidden') registration.classList.remove('hidden') } else { registration.classList.add('hidden') signIn.classList.remove('hidden') } } function toggleCreditCardForm() { const paymentMethodForm = document.getElementById('credit-card-form') const showButton = document.getElementById('show-credit-card-form') const hideButton = document.getElementById('hide-credit-card-form') if (paymentMethodForm.classList.contains('hidden')) { paymentMethodForm.classList.remove('hidden') showButton.classList.add('hidden') hideButton.classList.remove('hidden') } else { paymentMethodForm.classList.add('hidden') showButton.classList.remove('hidden') hideButton.classList.add('hidden') } } function removeSignInError() { const signInError = document.getElementById('sign-in-error') if (signInError) { signInError.remove() } } // like hideOrShowButton() function togglePurchaseButton() { const paymentType = document.getElementById('payment_tabs') const toggleButtonController = document.getElementById('purchase-button-controller-div') if (paymentType && paymentType.value === 'paypal' && toggleButtonController && toggleButtonController.getAttribute('data-checkout--paypal-button-display-paypal-show-value') === 'false') { document.getElementById('order_purchase_form_submit').classList.add('hidden') } else { document.getElementById('order_purchase_form_submit').classList.remove('hidden') } } </script> <script src="https://www.google.com/recaptcha/api.js" async defer></script> <script src="https://www.paypal.com/sdk/js?client-id=AXq_i7ACJhNiUKmTYWNFEUZTQX_-NPib7uiVSCQqOngD0AnPBgE1DZPTiXxJVxML1tbf65LkZELDlI4x&merchant-id=YGN5UBLBYHJUA&currency=USD&vault=true&disable-funding=card,credit,bancontact" data-partner-attribution-id="USCREEN_SP_PPCP" data-user-id-token="" async defer></script> <style> @media (max-width: 381px) { #native-paypal-overlay { --height: 20px; } } @media (min-width: 382px) and (max-width: 581px) { #native-paypal-overlay { --height: 30px; } } @media (min-width: 582px) { #native-paypal-overlay { --height: 40px; } } @media screen and (max-width: 1024px) { .user-actions { grid-row: 2; } } </style> <style> .truncate-overflow { --max-lines: 2; --lh: 1.25rem; max-height: calc(var(--lh) * var(--max-lines)); overflow: hidden; } @media screen and (min-width: 650px) { .truncate-overflow { --max-lines: 20; --lh: 1.5rem; max-height: calc(var(--lh) * var(--max-lines)); overflow: hidden; } } @media screen and (max-width: 1024px) { .user-actions { grid-row: 2; } } .normalized { } .normalized > h3 { font-weight: bold; } .normalized > a { text-decoration: underline; } .normalized > blockquote { font-size: 90%; border-left: 4px solid; padding-left: 0.8em; margin: 1em 0; opacity: 0.8; } .normalized > p { margin-bottom: 1em; } .normalized > ul { list-style-type: disc; } .normalized > ol { list-style-type: decimal; } ul, ol { margin-bottom: 1em; padding-left: 16px; } ul p, ol p { margin-bottom: 0; } ul:last-child, ol:last-child, p:last-child { margin-bottom: 0; } .program-description-text { color: rgb(75 85 99); } .dark .program-description-text { color: rgb(156 163 175); } .program-description-text > a { text-decoration: underline; color: var(--primary); } .program-description-text > h3 { font-size: 1.25rem; line-height: 1.75rem; } .program-description-text > blockquote { border-color: var(--gray-500); border-left-width: 4px; margin-bottom: 0.5rem; margin-top: 0.5rem; padding-left: 1rem; } .program-description-text > ul { list-style-type: none; } .program-description-text > ul li::before { content: "•"; font-size: 16px; margin-right: 0.5rem; padding-left: 0.5rem; vertical-align: top; } .program-description-text > ol { padding-left: 1.5rem; list-style-type: decimal; } .program-description-text > p { margin: 0 0 1rem; text-indent: 0; } .dark .program-description-text > p { color: rgb(209 213 219); } </style> <div id="flash_messages"> </div> <div class="flex flex-col lg:flex-row min-h-screen" data-controller="integrations" data-integrations-facebook-pixel-enabled-value="false" data-integrations-google-tag-manager-enabled-value="true" data-integrations-google-analytics-enabled-value="true" data-action="order-payment:fbp->integrations#fbpEvent order-payment:gtag->integrations#gtagEvent order-payment:gan->integrations#ganEvent paypal:fbp->integrations#fbpEvent paypal:gtag->integrations#gtagEvent paypal:gan->integrations#ganEvent" >  <div class="user-actions w-full lg:w-1/2 order-last lg:order-first sm:py-8 sm:px-12 lg:px-18 xl:px-24 2xl:px-32 bg-white dark:bg-black"> <div class="hidden lg:!block mb-10"> <div data-test="branding"> <div class="flex mb-4 max-w-full overflow-hidden sm:justify-start"> <div class="flex sm:justify-start max-w-3xl max-h-12"> <div> <img src="https://alpha.uscreencdn.com/images/logotypes/81456/new-project.1718930283.png" alt="Urduflix" class="object-contain max-w-full max-h-full" > </div> </div> </div> </div> </div> <turbo-frame id="registration_form" target="_top"> <div id="registration-form" class=" sm:my-6 p-6 border border-ds-default lg:rounded-lg"> <div class="flex flex-col w-full mb-4"> <div class="flex flex-row justify-between w-full mb-2 lg:mb-1"> <span class="text-ds-large-semi-bold text-ds-default"> 1. Account details </span> </div> <div> <span class="text-ds-small-regular text-ds-muted">Already have an account? <a onclick="toggleAccountForm()" href="#">Log in</a></span> </div> <div class="flex flex-row w-full gap-2 mt-4 flex-wrap"> </div> </div> <form data-turbo-frame="registration_form" data-controller="simple-form captcha" data-captcha-action="checkout_registration" data-captcha-turbo-frame="registration_form" action="/checkout/submit_form_sign_up?gift=true" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="irtnBQeLT7AzBwI_toN8Yfy8NNPrmkwpfCKf1IGJhIgXRFCuVcNJcem-Xxg0wdnzNvRoI5uY0kz_bpxLxj2SoQ" autocomplete="off" /> <input type="hidden" name="checkout_referrer" id="checkout_referrer" autocomplete="off" /> <div class="flex flex-col gap-6 w-full"> <div class="w-full"> <p class="text-ds-small-medium text-ds-default mb-2">Email</p> <ds-input id="form[email]" placeholder="example@mail.com" value="" type="email" not-disable-real-input="true"><input name="form[email]" type="email" placeholder="example@mail.com" autocomplete="off" slot="input" value=""></input></ds-input> </div> <div class="w-full"> <p class="text-ds-small-medium text-ds-default mb-2">Full Name</p> <ds-input id="form[name]" placeholder="First and last name" type="text" not-disable-real-input="true"><input name="form[name]" type="text" placeholder="First and last name" slot="input"></input></ds-input> </div> <div class="w-full"> <p class="text-ds-small-medium text-ds-default mb-2"> Password <ds-tooltip id="password-hint"> <ds-icon name="question" class="text-ds-subtle inline-block align-[-2px]" size="16px"></ds-icon> <span slot="content">Minimum 8 characters</span> </ds-tooltip> </p> <div class="w-full mt-2 relative"> <ds-input id="form[password]" placeholder="Enter a password" type="password" not-disable-real-input="true"><input name="form[password]" type="password" placeholder="Enter a password" autocomplete="off" slot="input"></input></ds-input> </div> </div> <div> <div class="w-full dark:text-gray-200"> <ds-checkbox id="terms-and-conditions-checkbox" name="form[terms_and_conditions]" error="" > Yes, I agree to the <a href="http://urduflix.com/pages/terms-of-service" target="_blank">Terms & Conditions</a> <input type="checkbox" name="form[terms_and_conditions]" class="hidden"> </ds-checkbox> </div> </div> <script src="https://www.recaptcha.net/recaptcha/api.js?render=6LenX-EZAAAAAAITxgGIXKB3S2OVKsM5r5tg0wKL" ></script> <script> // Define function so that we can call it again later if we need to reset it // This executes reCAPTCHA and then calls our callback. function executeRecaptchaForCheckoutRegistration() { grecaptcha.ready(function() { grecaptcha.execute('6LenX-EZAAAAAAITxgGIXKB3S2OVKsM5r5tg0wKL', {action: 'checkout_registration'}).then(function(token) { setInputWithRecaptchaResponseTokenForCheckoutRegistration('g-recaptcha-response-data-checkout-registration', token) }); }); }; // Invoke immediately executeRecaptchaForCheckoutRegistration() // Async variant so you can await this function from another async function (no need for // an explicit callback function then!) // Returns a Promise that resolves with the response token. async function executeRecaptchaForCheckoutRegistrationAsync() { return new Promise((resolve, reject) => { grecaptcha.ready(async function() { resolve(await grecaptcha.execute('6LenX-EZAAAAAAITxgGIXKB3S2OVKsM5r5tg0wKL', {action: 'checkout_registration'})) }); }) }; var setInputWithRecaptchaResponseTokenForCheckoutRegistration = function(id, token) { var element = document.getElementById(id); element.value = token; } </script> <input type="hidden" name="g-recaptcha-response-data[checkout_registration]" id="g-recaptcha-response-data-checkout-registration" data-sitekey="6LenX-EZAAAAAAITxgGIXKB3S2OVKsM5r5tg0wKL" class="g-recaptcha g-recaptcha-response "/> <ds-button id="submit-button" name="button" type="submit" variant="primary" size="big" data-simple-form-target="submit"> <span class="text-lg">Continue</span> </ds-button> </div> </form> </div> </turbo-frame> <turbo-frame id="log_in_form" target="_top"> <div id="sign-in-form" class="hidden sm:my-12 p-6 border border-ds-default rounded-lg"> <div class="flex flex-col w-full mb-4"> <div class="flex flex-row justify-between w-full mb-2 lg:mb-1"> <span class="text-ds-large-semi-bold text-ds-default"> 1. Account details </span> </div> <div> <span class="text-ds-small-regular text-ds-muted">Don't have an account? <a onclick="toggleAccountForm()" href="#">Sign up</a></span> </div> <div class="flex flex-row w-full gap-2 mt-4 flex-wrap"> </div> </div> <form data-turbo-frame="log_in_form" data-controller="simple-form captcha" data-captcha-action="checkout_log_in" data-captcha-turbo-frame="log_in_form" action="/checkout/submit_form_log_in?gift=true" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="V50VIODEAHaB2kWmdHgW0iI0ZzQH9KQX7lWeW3Li7ctZTxFYxhnOqKFdUHMJ-C6XmCNbuNLh5kBiELfc8TDeSQ" autocomplete="off" /> <div class="flex flex-col gap-6 w-full"> <div class="w-full"> <p class="text-ds-small-medium text-ds-default mb-2">Email</p> <ds-input id="form[email]" placeholder="example@mail.com" type="email" error="" not-disable-real-input="true"><input name="form[email]" type="email" placeholder="example@mail.com" slot="input"></input></ds-input> </div> <div class="w-full"> <p class="text-ds-small-medium text-ds-default mb-2">Password</p> <div class="w-full mt-2 relative"> <ds-input id="sign-in-password" placeholder="Your password" type="password" not-disable-real-input="true"><input name="form[password]" type="password" placeholder="Your password" slot="input"></input></ds-input> </div> <div class="w-full mt-1 text-sm" id="sign-in-error"> <a href="/forgot_password">Forgot Password?</a> </div> </div> <div class="w-full dark:text-gray-200"> <ds-checkbox name="form[remember_me_checkbox]"> Remember Me <input type="checkbox" id="remember-me-checkbox" name="form[remember_me_checkbox]" class="hidden"> </ds-checkbox> </div> <script src="https://www.recaptcha.net/recaptcha/api.js?render=6LenX-EZAAAAAAITxgGIXKB3S2OVKsM5r5tg0wKL" ></script> <script> // Define function so that we can call it again later if we need to reset it // This executes reCAPTCHA and then calls our callback. function executeRecaptchaForCheckoutLogIn() { grecaptcha.ready(function() { grecaptcha.execute('6LenX-EZAAAAAAITxgGIXKB3S2OVKsM5r5tg0wKL', {action: 'checkout_log_in'}).then(function(token) { setInputWithRecaptchaResponseTokenForCheckoutLogIn('g-recaptcha-response-data-checkout-log-in', token) }); }); }; // Invoke immediately executeRecaptchaForCheckoutLogIn() // Async variant so you can await this function from another async function (no need for // an explicit callback function then!) // Returns a Promise that resolves with the response token. async function executeRecaptchaForCheckoutLogInAsync() { return new Promise((resolve, reject) => { grecaptcha.ready(async function() { resolve(await grecaptcha.execute('6LenX-EZAAAAAAITxgGIXKB3S2OVKsM5r5tg0wKL', {action: 'checkout_log_in'})) }); }) }; var setInputWithRecaptchaResponseTokenForCheckoutLogIn = function(id, token) { var element = document.getElementById(id); element.value = token; } </script> <input type="hidden" name="g-recaptcha-response-data[checkout_log_in]" id="g-recaptcha-response-data-checkout-log-in" data-sitekey="6LenX-EZAAAAAAITxgGIXKB3S2OVKsM5r5tg0wKL" class="g-recaptcha g-recaptcha-response "/> <ds-button id="log-in-submit-button" name="button" type="submit" variant="primary" data-simple-form-target="submit"> <span class="text-lg">Continue</span> </ds-button> </div> </form> </div> </turbo-frame> <turbo-frame id="gift_details"> <div class="sm:mt-8 p-6 border sm:rounded-lg border-ds-default"> <div class="flex flex-col w-full"> <div class="flex flex-row justify-between w-full"> <span class="text-ds-large-semi-bold text-ds-default">2. Gift details</span> </div> </div> </div> </turbo-frame> <turbo-frame id="billing_and_order_details"> <div class="sm:mt-8 p-6 border sm:rounded-lg border-ds-default"> <div class="flex flex-col w-full"> <div class="flex flex-row justify-between w-full"> <span class="text-ds-large-semi-bold text-ds-default">3. Payment details</span> </div> </div> </div> </turbo-frame> </div>  <div class="w-full lg:w-1/2 bg-ds-subtle"> <turbo-frame id="offer_details"> <div class="bg-ds-subtle sm:pt-12 sm:pb-6 sm:px-12 lg:px-18 xl:px-24 2xl:px-32"> <div data-test="product-info"> <div class="mx-auto w-full sm:max-w-lg xl:max-w-xl"> <div class="bg-primary sm:rounded-t-lg" style="height: 300px; display: grid;"> <div class="rounded-3xl self-center justify-self-center h-52 w-[90%] md:w-[70%] shadow-xl bg-gradient-to-l from-neutral-200 dark:from-neutral-900 to-stone-100 dark:to-neutral-950"> <div class="pt-8 pl-6 rtl:pr-6 rtl:pl-0 flex flex-col justify-between h-full"> <div data-test="branding"> <div class="flex mb-4 max-w-full overflow-hidden sm:justify-start"> <div class="flex sm:justify-start max-w-3xl max-h-12"> <div> <img src="https://alpha.uscreencdn.com/images/logotypes/81456/new-project.1718930283.png" alt="Urduflix" class="object-contain max-w-full max-h-full" > </div> </div> </div> </div> <div class="flex flex-col pb-6"> <span class="text-ds-large-semi-bold">Gift</span> <span class="text-ds-small-regular text-ds-muted dark:text-ds-default">Access to premium content</span> </div> </div> </div> </div> <div class="p-6 bg-ds-subtle lg:bg-ds-default sm:rounded-b-lg"> <div class="flex flex-col w-full min-w-0 gap-4"> <span class="text-ds-large-medium text-ds-default">How gifts work</span> <div class="flex flex-col gap-y-2"> <div class="flex flex-col"> <div class="flex flex-row items-center mb-1"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="mr-2 rtl:ml-2 rtl:mr-0"> <rect width="24" height="24" rx="4" fill="#BBF7D0"></rect> <path fill-rule="evenodd" clip-rule="evenodd" d="M12.6666 6.00016C12.6666 5.63197 12.3681 5.3335 11.9999 5.3335C11.6317 5.3335 11.3333 5.63197 11.3333 6.00016V6.66683H10.1785C8.60711 6.66683 7.33325 7.94068 7.33325 9.51206C7.33325 10.9146 8.35529 12.1079 9.74115 12.3235L11.3333 12.5711L11.3333 16.0002H10.3661C9.42749 16.0002 8.66659 15.2393 8.66659 14.3006V13.8668C8.66659 13.4986 8.36811 13.2002 7.99992 13.2002C7.63173 13.2002 7.33325 13.4986 7.33325 13.8668V14.3006C7.33325 15.9756 8.69111 17.3335 10.3661 17.3335H11.3333V17.6668C11.3333 18.035 11.6317 18.3335 11.9999 18.3335C12.3681 18.3335 12.6666 18.035 12.6666 17.6668V17.3335H13.8214C15.3927 17.3335 16.6666 16.0596 16.6666 14.4883C16.6666 13.0857 15.6445 11.8924 14.2587 11.6768L12.6666 11.4292V8.00016H13.8221C14.6567 8.00016 15.3333 8.67671 15.3333 9.51127C15.3333 9.87946 15.6317 10.1779 15.9999 10.1779C16.3681 10.1779 16.6666 9.87946 16.6666 9.51127C16.6666 7.94033 15.3931 6.66683 13.8221 6.66683H12.6666V6.00016ZM11.3333 8.00016H10.1785C9.34349 8.00016 8.66659 8.67706 8.66659 9.51206C8.66659 10.2573 9.20968 10.8914 9.94609 11.006L11.3333 11.2218V8.00016ZM12.6666 12.7786V16.0002H13.8214C14.6564 16.0002 15.3333 15.3233 15.3333 14.4883C15.3333 13.743 14.7902 13.1089 14.0537 12.9943L12.6666 12.7786Z" fill="#16A34A"></path> </svg> <span class="text-ds-small-medium text-ds-default">Buy a gift</span> </div> <span class="text-ds-small-regular text-ds-muted">Pick a gift to share with family and friends</span> </div> <div class="flex flex-col"> <div class="flex flex-row items-center mb-1"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="mr-2 rtl:ml-2 rtl:mr-0"> <rect width="24" height="24" rx="4" fill="#BBF7D0"></rect> <path fill-rule="evenodd" clip-rule="evenodd" d="M9.17245 6H14.8275C15.3642 5.99999 15.8071 5.99998 16.1679 6.02946C16.5426 6.06008 16.8871 6.12579 17.2106 6.29065C17.7124 6.54631 18.1203 6.95426 18.376 7.45603C18.5409 7.77958 18.6066 8.12405 18.6372 8.49878C18.6667 8.85958 18.6667 9.30248 18.6667 9.83912V12.8276C18.6667 13.3642 18.6667 13.8071 18.6372 14.1679C18.6066 14.5426 18.5409 14.8871 18.376 15.2106C18.1203 15.7124 17.7124 16.1204 17.2106 16.376C16.8871 16.5409 16.5426 16.6066 16.1679 16.6372C15.8071 16.6667 15.3642 16.6667 14.8275 16.6667H13.1225C12.6797 16.6667 12.5508 16.6698 12.4335 16.6939C12.3158 16.718 12.2019 16.758 12.0949 16.8126C11.9883 16.8671 11.8856 16.9452 11.5399 17.2218L9.93117 18.5088C9.80872 18.6068 9.6839 18.7067 9.57416 18.7792C9.46921 18.8486 9.26572 18.9728 9.00106 18.9731C8.69652 18.9735 8.40843 18.835 8.21844 18.597C8.05333 18.3901 8.0232 18.1536 8.01182 18.0283C7.99992 17.8973 7.99995 17.7375 7.99998 17.5806L7.99998 16.6612C7.73878 16.6526 7.51478 16.6307 7.3098 16.5758C6.38955 16.3292 5.67076 15.6104 5.42418 14.6902C5.33278 14.3491 5.333 13.9553 5.33328 13.4251C5.3333 13.3949 5.33332 13.3644 5.33332 13.3333L5.33332 9.83913C5.33331 9.30249 5.3333 8.85958 5.36278 8.49878C5.3934 8.12405 5.45911 7.77958 5.62397 7.45603C5.87963 6.95426 6.28758 6.54631 6.78934 6.29065C7.1129 6.12579 7.45737 6.06008 7.8321 6.02946C8.1929 5.99998 8.6358 5.99999 9.17245 6ZM7.94068 7.35837C7.6484 7.38225 7.49893 7.42553 7.39466 7.47866C7.14378 7.60649 6.93981 7.81046 6.81197 8.06135C6.75885 8.16561 6.71556 8.31508 6.69168 8.60736C6.66717 8.90742 6.66665 9.29561 6.66665 9.86667V13.3333C6.66665 13.9962 6.67238 14.1969 6.71208 14.3451C6.83537 14.8052 7.19477 15.1646 7.65489 15.2879C7.80308 15.3276 8.00375 15.3333 8.66665 15.3333C9.03484 15.3333 9.33332 15.6318 9.33332 16V17.2796L10.707 16.1806C10.7222 16.1685 10.7371 16.1565 10.7519 16.1447C11.0333 15.9194 11.246 15.7491 11.4883 15.6253C11.7023 15.516 11.9301 15.4361 12.1654 15.3878C12.4321 15.3331 12.7045 15.3332 13.065 15.3333C13.0839 15.3333 13.1031 15.3333 13.1225 15.3333H14.8C15.371 15.3333 15.7592 15.3328 16.0593 15.3083C16.3516 15.2844 16.501 15.2411 16.6053 15.188C16.8562 15.0602 17.0602 14.8562 17.188 14.6053C17.2411 14.5011 17.2844 14.3516 17.3083 14.0593C17.3328 13.7592 17.3333 13.3711 17.3333 12.8V9.86667C17.3333 9.29561 17.3328 8.90742 17.3083 8.60736C17.2844 8.31508 17.2411 8.16561 17.188 8.06135C17.0602 7.81046 16.8562 7.60649 16.6053 7.47866C16.501 7.42553 16.3516 7.38225 16.0593 7.35837C15.7592 7.33385 15.371 7.33333 14.8 7.33333H9.19998C8.62893 7.33333 8.24073 7.33385 7.94068 7.35837ZM7.99998 10.3333C7.99998 9.96514 8.29846 9.66667 8.66665 9.66667H12C12.3682 9.66667 12.6666 9.96514 12.6666 10.3333C12.6666 10.7015 12.3682 11 12 11H8.66665C8.29846 11 7.99998 10.7015 7.99998 10.3333ZM7.99998 12.6667C7.99998 12.2985 8.29846 12 8.66665 12H14C14.3682 12 14.6666 12.2985 14.6666 12.6667C14.6666 13.0349 14.3682 13.3333 14 13.3333H8.66665C8.29846 13.3333 7.99998 13.0349 7.99998 12.6667Z" fill="#16A34A"></path> </svg> <span class="text-ds-small-medium text-ds-default">Share details</span> </div> <span class="text-ds-small-regular text-ds-muted">Send gift details to recipient however you like</span> </div> <div class="flex flex-col"> <div class="flex flex-row items-center mb-1"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="mr-2 rtl:ml-2 rtl:mr-0"> <rect width="24" height="24" rx="4" fill="#BBF7D0"></rect> <path d="M11.3307 9.08784C11.1243 8.96993 10.8708 8.97078 10.6653 9.09006C10.4598 9.20934 10.3333 9.42902 10.3333 9.66667V12.3333C10.3333 12.571 10.4598 12.7907 10.6653 12.9099C10.8708 13.0292 11.1243 13.0301 11.3307 12.9122L13.664 11.5788C13.8717 11.4601 13.9999 11.2392 13.9999 11C13.9999 10.7608 13.8717 10.5399 13.664 10.4212L11.3307 9.08784Z" fill="#16A34A"></path> <path fill-rule="evenodd" clip-rule="evenodd" d="M7.33325 6C6.22868 6 5.33325 6.89543 5.33325 8V14C5.33325 15.1046 6.22868 16 7.33325 16H16.6666C17.7712 16 18.6666 15.1046 18.6666 14V8C18.6666 6.89543 17.7712 6 16.6666 6H7.33325ZM6.66659 8C6.66659 7.63181 6.96506 7.33333 7.33325 7.33333H16.6666C17.0348 7.33333 17.3333 7.63181 17.3333 8V14C17.3333 14.3682 17.0348 14.6667 16.6666 14.6667H7.33325C6.96506 14.6667 6.66659 14.3682 6.66659 14V8Z" fill="#16A34A"></path> <path d="M8.66659 16.6667C8.2984 16.6667 7.99992 16.9651 7.99992 17.3333C7.99992 17.7015 8.2984 18 8.66659 18H15.3333C15.7014 18 15.9999 17.7015 15.9999 17.3333C15.9999 16.9651 15.7014 16.6667 15.3333 16.6667H8.66659Z" fill="#16A34A"></path> </svg> <span class="text-ds-small-medium text-ds-default">Recipient takes over</span> </div> <span class="text-ds-small-regular text-ds-muted">They use their code to unlock access</span> </div> </div> </div> </div> </div> </div> </div> </turbo-frame> <div class="bg-ds-subtle sm:px-12 lg:px-18 xl:px-24 2xl:px-32"> <div id="instructions-accordion" data-controller="accordion" class="hidden bg-white dark:bg-black dark:lg:bg-ds-default sm:rounded-lg mx-auto w-full sm:max-w-lg xl:max-w-xl sm:mb-6" > <div class="p-6 cursor-pointer flex flex-row justify-between items-center" data-action="click->accordion#toggle"> <span class="text-ds-large-medium text-ds-default">How gifts work</span> <ds-icon data-accordion-target="icon" name="chevron-down" size="24"></ds-icon> </div> <div data-accordion-target="content" class="px-6 pb-6 flex flex-col gap-4 hidden"> <div class="flex flex-col"> <div class="flex flex-row items-center mb-1"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="mr-2 rtl:ml-2 rtl:mr-0"> <rect width="24" height="24" rx="4" fill="#BBF7D0"></rect> <path fill-rule="evenodd" clip-rule="evenodd" d="M12.6666 6.00016C12.6666 5.63197 12.3681 5.3335 11.9999 5.3335C11.6317 5.3335 11.3333 5.63197 11.3333 6.00016V6.66683H10.1785C8.60711 6.66683 7.33325 7.94068 7.33325 9.51206C7.33325 10.9146 8.35529 12.1079 9.74115 12.3235L11.3333 12.5711L11.3333 16.0002H10.3661C9.42749 16.0002 8.66659 15.2393 8.66659 14.3006V13.8668C8.66659 13.4986 8.36811 13.2002 7.99992 13.2002C7.63173 13.2002 7.33325 13.4986 7.33325 13.8668V14.3006C7.33325 15.9756 8.69111 17.3335 10.3661 17.3335H11.3333V17.6668C11.3333 18.035 11.6317 18.3335 11.9999 18.3335C12.3681 18.3335 12.6666 18.035 12.6666 17.6668V17.3335H13.8214C15.3927 17.3335 16.6666 16.0596 16.6666 14.4883C16.6666 13.0857 15.6445 11.8924 14.2587 11.6768L12.6666 11.4292V8.00016H13.8221C14.6567 8.00016 15.3333 8.67671 15.3333 9.51127C15.3333 9.87946 15.6317 10.1779 15.9999 10.1779C16.3681 10.1779 16.6666 9.87946 16.6666 9.51127C16.6666 7.94033 15.3931 6.66683 13.8221 6.66683H12.6666V6.00016ZM11.3333 8.00016H10.1785C9.34349 8.00016 8.66659 8.67706 8.66659 9.51206C8.66659 10.2573 9.20968 10.8914 9.94609 11.006L11.3333 11.2218V8.00016ZM12.6666 12.7786V16.0002H13.8214C14.6564 16.0002 15.3333 15.3233 15.3333 14.4883C15.3333 13.743 14.7902 13.1089 14.0537 12.9943L12.6666 12.7786Z" fill="#16A34A"></path> </svg> <span class="text-ds-small-medium text-ds-default">Buy a gift</span> </div> <span class="text-ds-small-regular text-ds-muted">Pick a gift to share with family and friends</span> </div> <div class="flex flex-col"> <div class="flex flex-row items-center mb-1"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="mr-2 rtl:ml-2 rtl:mr-0"> <rect width="24" height="24" rx="4" fill="#BBF7D0"></rect> <path fill-rule="evenodd" clip-rule="evenodd" d="M9.17245 6H14.8275C15.3642 5.99999 15.8071 5.99998 16.1679 6.02946C16.5426 6.06008 16.8871 6.12579 17.2106 6.29065C17.7124 6.54631 18.1203 6.95426 18.376 7.45603C18.5409 7.77958 18.6066 8.12405 18.6372 8.49878C18.6667 8.85958 18.6667 9.30248 18.6667 9.83912V12.8276C18.6667 13.3642 18.6667 13.8071 18.6372 14.1679C18.6066 14.5426 18.5409 14.8871 18.376 15.2106C18.1203 15.7124 17.7124 16.1204 17.2106 16.376C16.8871 16.5409 16.5426 16.6066 16.1679 16.6372C15.8071 16.6667 15.3642 16.6667 14.8275 16.6667H13.1225C12.6797 16.6667 12.5508 16.6698 12.4335 16.6939C12.3158 16.718 12.2019 16.758 12.0949 16.8126C11.9883 16.8671 11.8856 16.9452 11.5399 17.2218L9.93117 18.5088C9.80872 18.6068 9.6839 18.7067 9.57416 18.7792C9.46921 18.8486 9.26572 18.9728 9.00106 18.9731C8.69652 18.9735 8.40843 18.835 8.21844 18.597C8.05333 18.3901 8.0232 18.1536 8.01182 18.0283C7.99992 17.8973 7.99995 17.7375 7.99998 17.5806L7.99998 16.6612C7.73878 16.6526 7.51478 16.6307 7.3098 16.5758C6.38955 16.3292 5.67076 15.6104 5.42418 14.6902C5.33278 14.3491 5.333 13.9553 5.33328 13.4251C5.3333 13.3949 5.33332 13.3644 5.33332 13.3333L5.33332 9.83913C5.33331 9.30249 5.3333 8.85958 5.36278 8.49878C5.3934 8.12405 5.45911 7.77958 5.62397 7.45603C5.87963 6.95426 6.28758 6.54631 6.78934 6.29065C7.1129 6.12579 7.45737 6.06008 7.8321 6.02946C8.1929 5.99998 8.6358 5.99999 9.17245 6ZM7.94068 7.35837C7.6484 7.38225 7.49893 7.42553 7.39466 7.47866C7.14378 7.60649 6.93981 7.81046 6.81197 8.06135C6.75885 8.16561 6.71556 8.31508 6.69168 8.60736C6.66717 8.90742 6.66665 9.29561 6.66665 9.86667V13.3333C6.66665 13.9962 6.67238 14.1969 6.71208 14.3451C6.83537 14.8052 7.19477 15.1646 7.65489 15.2879C7.80308 15.3276 8.00375 15.3333 8.66665 15.3333C9.03484 15.3333 9.33332 15.6318 9.33332 16V17.2796L10.707 16.1806C10.7222 16.1685 10.7371 16.1565 10.7519 16.1447C11.0333 15.9194 11.246 15.7491 11.4883 15.6253C11.7023 15.516 11.9301 15.4361 12.1654 15.3878C12.4321 15.3331 12.7045 15.3332 13.065 15.3333C13.0839 15.3333 13.1031 15.3333 13.1225 15.3333H14.8C15.371 15.3333 15.7592 15.3328 16.0593 15.3083C16.3516 15.2844 16.501 15.2411 16.6053 15.188C16.8562 15.0602 17.0602 14.8562 17.188 14.6053C17.2411 14.5011 17.2844 14.3516 17.3083 14.0593C17.3328 13.7592 17.3333 13.3711 17.3333 12.8V9.86667C17.3333 9.29561 17.3328 8.90742 17.3083 8.60736C17.2844 8.31508 17.2411 8.16561 17.188 8.06135C17.0602 7.81046 16.8562 7.60649 16.6053 7.47866C16.501 7.42553 16.3516 7.38225 16.0593 7.35837C15.7592 7.33385 15.371 7.33333 14.8 7.33333H9.19998C8.62893 7.33333 8.24073 7.33385 7.94068 7.35837ZM7.99998 10.3333C7.99998 9.96514 8.29846 9.66667 8.66665 9.66667H12C12.3682 9.66667 12.6666 9.96514 12.6666 10.3333C12.6666 10.7015 12.3682 11 12 11H8.66665C8.29846 11 7.99998 10.7015 7.99998 10.3333ZM7.99998 12.6667C7.99998 12.2985 8.29846 12 8.66665 12H14C14.3682 12 14.6666 12.2985 14.6666 12.6667C14.6666 13.0349 14.3682 13.3333 14 13.3333H8.66665C8.29846 13.3333 7.99998 13.0349 7.99998 12.6667Z" fill="#16A34A"></path> </svg> <span class="text-ds-small-medium text-ds-default">Share details</span> </div> <span class="text-ds-small-regular text-ds-muted">Send gift details to recipient however you like</span> </div> <div class="flex flex-col"> <div class="flex flex-row items-center mb-1"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="mr-2 rtl:ml-2 rtl:mr-0"> <rect width="24" height="24" rx="4" fill="#BBF7D0"></rect> <path d="M11.3307 9.08784C11.1243 8.96993 10.8708 8.97078 10.6653 9.09006C10.4598 9.20934 10.3333 9.42902 10.3333 9.66667V12.3333C10.3333 12.571 10.4598 12.7907 10.6653 12.9099C10.8708 13.0292 11.1243 13.0301 11.3307 12.9122L13.664 11.5788C13.8717 11.4601 13.9999 11.2392 13.9999 11C13.9999 10.7608 13.8717 10.5399 13.664 10.4212L11.3307 9.08784Z" fill="#16A34A"></path> <path fill-rule="evenodd" clip-rule="evenodd" d="M7.33325 6C6.22868 6 5.33325 6.89543 5.33325 8V14C5.33325 15.1046 6.22868 16 7.33325 16H16.6666C17.7712 16 18.6666 15.1046 18.6666 14V8C18.6666 6.89543 17.7712 6 16.6666 6H7.33325ZM6.66659 8C6.66659 7.63181 6.96506 7.33333 7.33325 7.33333H16.6666C17.0348 7.33333 17.3333 7.63181 17.3333 8V14C17.3333 14.3682 17.0348 14.6667 16.6666 14.6667H7.33325C6.96506 14.6667 6.66659 14.3682 6.66659 14V8Z" fill="#16A34A"></path> <path d="M8.66659 16.6667C8.2984 16.6667 7.99992 16.9651 7.99992 17.3333C7.99992 17.7015 8.2984 18 8.66659 18H15.3333C15.7014 18 15.9999 17.7015 15.9999 17.3333C15.9999 16.9651 15.7014 16.6667 15.3333 16.6667H8.66659Z" fill="#16A34A"></path> </svg> <span class="text-ds-small-medium text-ds-default">Recipient takes over</span> </div> <span class="text-ds-small-regular text-ds-muted">They use their code to unlock access</span> </div> </div> </div> <div class="flex flex-col md:items-center"> </div> </div> </div> </div> <script src="https://js.stripe.com/v3/"></script> <script src="https://assets-gke.uscreencdn.com/vite/assets/vue_storefront-DcTJcDJE.js" crossorigin="anonymous" type="module"></script><link rel="modulepreload" href="https://assets-gke.uscreencdn.com/vite/assets/preload-helper-B8hUOznO.js" as="script" crossorigin="anonymous"> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous"> </body> </html>

CINXE.COM

Urduflix