/** * evf-locked-fields.scss * * Styles for LOCKED (Pro / addon) fields shown as an upsell by "Create with AI" * and in the builder. Kept in a dedicated stylesheet (not admin.scss) so the * rules stay at the top level and are not accidentally nested under another * selector. Compiled by grunt-sass to evf-locked-fields.css and enqueued on * Everest Forms admin screens. */ /* ========================================================================== 1. Canvas / AI-preview: locked field block + PRO ribbon ========================================================================== */ .everest-forms-field.everest-forms-field-locked { position: relative; &::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; border: 1px dashed #d7c7f5; border-radius: 6px; } } /* Orange "Pro" marker shown INLINE right after the field label — same icon as the fields sidebar (everest-form-pro-icon.png), placed side-by-side with the label instead of a corner badge. */ .everest-forms-field.everest-forms-field-locked .label-title::after, .everest-forms-field.everest-forms-field-locked .evf-locked-field-label::after { content: ""; display: inline-block; width: 15px; height: 15px; margin-left: 6px; vertical-align: -3px; background: url(../images/icons/everest-form-pro-icon.png) no-repeat center; background-size: contain; } /* Addon fields: replace crown image with a blue "ADD-ON" text pill. */ .everest-forms-field.everest-forms-field-locked-addon .label-title::after, .everest-forms-field.everest-forms-field-locked-addon .evf-locked-field-label::after { content: "ADD-ON"; width: auto; height: auto; background: #3b82f6; background-image: none; color: #fff; font-size: 9px; font-weight: 700; letter-spacing: 0.05em; padding: 2px 5px; border-radius: 3px; vertical-align: 2px; } /* Synthesized preview card (fallback for fields whose real preview needs Pro code). */ .evf-locked-field-label { display: block; margin: 0 0 6px; font-size: 13px; font-weight: 500; color: #374151; .evf-locked-field-required { color: #ef4444; margin-left: 2px; } } .evf-locked-field-placeholder { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 12px 14px; color: #6b7280; font-size: 13px; background: #faf8fe; border: 1px dashed #d7c7f5; border-radius: 6px; .dashicons { color: #7e3bd0; width: 18px; height: 18px; font-size: 18px; } } /* ========================================================================== 2. Field Options panel: readable but NOT editable ========================================================================== */ /* The setting GROUPS are greyed + non-interactive. Inputs are intentionally NOT given the HTML `disabled` attribute (disabled inputs are not POSTed), so the field data still round-trips on save and the field works the instant the user upgrades. The banner is rendered OUTSIDE the groups, so it stays interactive. */ .everest-forms-field-option-locked { .everest-forms-field-option-group { position: relative; pointer-events: none; user-select: none; opacity: 0.65; cursor: not-allowed; } /* Force every group (incl. the normally-collapsed "Advanced Options") open so ALL settings stay readable while locked. */ .everest-forms-field-option-group.everest-forms-hide, .everest-forms-field-option-group.closed { display: block !important; } .everest-forms-field-option-group-inner { display: block !important; } /* Make the inputs themselves read clearly as disabled. */ .everest-forms-field-option-group input, .everest-forms-field-option-group select, .everest-forms-field-option-group textarea { background-color: #f3f4f6 !important; color: #6b7280 !important; cursor: not-allowed !important; } } /* ========================================================================== 3. PRO showcase banner (settings panel header) ========================================================================== */ .everest-forms-field-option-locked-banner { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin: 0 0 18px; padding: 16px; /* Neutral card so the orange "Pro" tag stands out (matches sidebar accent). */ background: #faf9fb; border: 1px solid #e8e6ee; border-radius: 8px; /* Stays interactive even though the surrounding panel groups are locked. */ pointer-events: auto; .evf-locked-banner-tag { display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; font-size: 11px; font-weight: 700; letter-spacing: 0.05em; color: #fff; /* Orange Pro accent — same family as the fields sidebar pro icon. */ background: #ff8c39; border-radius: 4px; .dashicons { width: 13px; height: 13px; font-size: 13px; } } /* Addon fields use blue instead of the orange PRO accent. */ &.evf-upgrade-addon .evf-locked-banner-tag { background: #3b82f6; } .evf-locked-banner-text { margin: 0; font-size: 13px; line-height: 1.5; color: #4b4b57; strong { color: #2b2b38; } } .evf-locked-banner-cta { margin: 2px 0 0; padding: 8px 20px; font-size: 13px; font-weight: 600; line-height: 1.2; /* Match EVF brand button. */ background: #7e3bd0; border-color: #7e3bd0; color: #fff; border-radius: 4px; cursor: pointer; &:hover { background: #6c2fbb; border-color: #6c2fbb; color: #fff; } } } /* Credit Card locked preview — compact layout. The real inline layout ships with the Stripe addon CSS (absent in free), so without this the inputs stack into a tall column. This keeps the free Pro-showcase compact. */ .everest-forms-field-credit-card .everest-forms-credit-card-cardnumber { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; .everest-forms-card-icon { flex: 0 0 auto; line-height: 0; svg { width: 28px; height: auto; } } input { height: 38px; border: 1px solid #e1e1e1; border-radius: 4px; padding: 0 10px; background: #fff; margin: 0; } .card-number { flex: 1 1 200px; min-width: 0; } .card-expiration { flex: 1 1 120px; min-width: 0; } .card-cvc { flex: 1 1 90px; min-width: 0; } } Home - Rupal's Yogasthenics
Home2023-12-05T13:09:36+05:30

find your

inner peaceinner calmtranquility

    

GET STARTED – BOOK TODAY

register for our upcoming

classes & workshops

Why Rupal’s Yogasthenics

benefits & outcomes

Find inner peace

Find Inner Peace

Keep lifestyle diseases at bay

Keep lifestyle diseases at bay

Focus on your purpose

Focus on your purpose

Be better, everyday

Be better, everyday

Improve flexibility

Improve flexibility

Improve your quality of life

Improve your quality of life

WHY YOGA?

benefits & outcomes

Improve Health

Sleep Better

Balance Your Mind

Weight Loss

Lower Blood Pressure

Increase Flexibility

In a timeless Pursuit of

Spreading good health

Yoga

meditation-workshop-featured

Yoga Therapy

Somatic Healer

Retreats

Pre-Post Natel

Gyrotonic and Gyrokinesis

Corporate Workshops

Yoga for Children

articles & stories

from the blog

Draft Post

Private: The Age old game of Hormones

Private: The Age old game of Hormones Our Body functions 24×7. Most of these internal activities such as digestion, reproduction, the process of growth and development, wear and

Yoga and Ulcers

Yoga and Ulcers Ulcers can be of various sorts, the most common ones are mouth ulcers and stomach

why not book a

class or workshop

Mumbai

+91 8976168824

fitrupal@gmail.com

© Copyright 2017 - 2026 | Rupal's Yogasthenics | All Rights Reserved

Go to Top