.elementor-3181 .elementor-element.elementor-element-6a8ecef{--display:flex;}.elementor-3181 .elementor-element.elementor-element-0b5b2e7{--display:flex;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-3181 .elementor-element.elementor-element-d8a3bd6 img{border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-58e7ca0{--display:flex;}.elementor-3181 .elementor-element.elementor-element-8009ced{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:37px;--margin-bottom:30px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-59b47d7{--display:flex;--justify-content:flex-start;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );border-style:solid;--border-style:solid;border-width:0px 4px 0px 0px;--border-top-width:0px;--border-right-width:4px;--border-bottom-width:0px;--border-left-width:0px;border-color:var( --e-global-color-b3c9963 );--border-color:var( --e-global-color-b3c9963 );--border-radius:10px 10px 10px 10px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-3181 .elementor-element.elementor-element-5004100{text-align:center;}.elementor-3181 .elementor-element.elementor-element-5004100 .elementor-heading-title{font-family:"bold rokh", Sans-serif;font-size:29px;font-weight:600;color:var( --e-global-color-ae75eee );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-3181 .elementor-element.elementor-element-ec73f67{text-align:center;font-family:"yekan bakh", Sans-serif;font-weight:400;color:#3333336B;}.elementor-3181 .elementor-element.elementor-element-07877a6{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:0px 30px;--row-gap:0px;--column-gap:30px;}.elementor-3181 .elementor-element.elementor-element-590ff51{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-3181 .elementor-element.elementor-element-590ff51:not(.elementor-motion-effects-element-type-background), .elementor-3181 .elementor-element.elementor-element-590ff51 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-3181 .elementor-element.elementor-element-3747159 > .elementor-widget-container{margin:-5px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-3747159{text-align:center;}.elementor-3181 .elementor-element.elementor-element-3747159 img{width:80%;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-01db75c{text-align:center;}.elementor-3181 .elementor-element.elementor-element-01db75c .elementor-heading-title{font-family:"med yekan", Sans-serif;font-weight:600;}.elementor-3181 .elementor-element.elementor-element-17f88c0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-3181 .elementor-element.elementor-element-17f88c0:not(.elementor-motion-effects-element-type-background), .elementor-3181 .elementor-element.elementor-element-17f88c0 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-3181 .elementor-element.elementor-element-542f482 > .elementor-widget-container{margin:-5px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-542f482{text-align:center;}.elementor-3181 .elementor-element.elementor-element-542f482 img{width:80%;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-7ac923b{text-align:center;}.elementor-3181 .elementor-element.elementor-element-7ac923b .elementor-heading-title{font-family:"med yekan", Sans-serif;font-weight:600;}.elementor-3181 .elementor-element.elementor-element-bee7941{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-3181 .elementor-element.elementor-element-bee7941:not(.elementor-motion-effects-element-type-background), .elementor-3181 .elementor-element.elementor-element-bee7941 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-3181 .elementor-element.elementor-element-263e353 > .elementor-widget-container{margin:-5px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-263e353{text-align:center;}.elementor-3181 .elementor-element.elementor-element-263e353 img{width:80%;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-70a8e01{text-align:center;}.elementor-3181 .elementor-element.elementor-element-70a8e01 .elementor-heading-title{font-family:"med yekan", Sans-serif;font-weight:600;}.elementor-3181 .elementor-element.elementor-element-52b92f4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-3181 .elementor-element.elementor-element-52b92f4:not(.elementor-motion-effects-element-type-background), .elementor-3181 .elementor-element.elementor-element-52b92f4 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-3181 .elementor-element.elementor-element-a1d593a > .elementor-widget-container{margin:-5px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-a1d593a{text-align:center;}.elementor-3181 .elementor-element.elementor-element-a1d593a img{width:80%;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-f01ef18{text-align:center;}.elementor-3181 .elementor-element.elementor-element-f01ef18 .elementor-heading-title{font-family:"med yekan", Sans-serif;font-weight:600;}.elementor-3181 .elementor-element.elementor-element-f5d9f0d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-3181 .elementor-element.elementor-element-3cdf147 .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-3cdf147 > .elementor-widget-container{margin:50px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-3cdf147 .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-3cdf147 .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-1e803c1{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--flex-wrap:wrap;--margin-top:70px;--margin-bottom:70px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-4947f4f{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-1157b23 img{height:330px;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-4c1292a{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-98f7f7b img{border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-f625db6{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-50fb55d img{border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-574bfdb{--display:flex;--margin-top:70px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-widget-nested-tabs.elementor-widget-n-tabs > .elementor-widget-container > .e-n-tabs[data-touch-mode='false'] > .e-n-tabs-heading > .e-n-tab-title[aria-selected="false"]:hover{background:var( --e-global-color-accent );}.elementor-widget-nested-tabs.elementor-widget-n-tabs > .elementor-widget-container > .e-n-tabs > .e-n-tabs-heading > .e-n-tab-title[aria-selected="true"], .elementor-widget-nested-tabs.elementor-widget-n-tabs > .elementor-widget-container > .e-n-tabs[data-touch-mode='true'] > .e-n-tabs-heading > .e-n-tab-title[aria-selected="false"]:hover{background:var( --e-global-color-accent );}.elementor-widget-nested-tabs.elementor-widget-n-tabs > .elementor-widget-container > .e-n-tabs > .e-n-tabs-heading > :is( .e-n-tab-title > .e-n-tab-title-text, .e-n-tab-title ){font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-3181 .elementor-element.elementor-element-644e174{--display:flex;}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-product__title{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-product__title, .elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products{--products-title-color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.products-heading-show .related-products > h2, .elementor-widget-woocommerce-products.products-heading-show .upsells > h2, .elementor-widget-woocommerce-products.products-heading-show .cross-sells > h2{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price ins{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price ins .amount{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del .amount{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del {font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products .added_to_cart{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-3181 .elementor-element.elementor-element-e9a5893.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-e9a5893.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-a9e85bd .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-a9e85bd > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-a9e85bd .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-a9e85bd .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-5934a90{--display:flex;}.elementor-3181 .elementor-element.elementor-element-bba9e9e.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-bba9e9e.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-e5b22e5 .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-e5b22e5 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-e5b22e5 .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-e5b22e5 .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-9c85e64{--display:flex;}.elementor-3181 .elementor-element.elementor-element-b2f2193.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-b2f2193.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-72dc98f .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-72dc98f > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-72dc98f .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-72dc98f .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-f830987{--display:flex;}.elementor-3181 .elementor-element.elementor-element-fcb4a06.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-fcb4a06.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-63a4180{--display:flex;}.elementor-3181 .elementor-element.elementor-element-19b914e.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-19b914e.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-5ddfd04{--display:flex;}.elementor-3181 .elementor-element.elementor-element-0ad6ff4.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-0ad6ff4.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-1de777f .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-1de777f > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-1de777f .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-1de777f .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-d248ad2{--display:flex;}.elementor-3181 .elementor-element.elementor-element-d1edc5c.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-d1edc5c.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-baaa8ff{--display:flex;}.elementor-3181 .elementor-element.elementor-element-7391687.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-7391687.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-b3ea1ab{--display:flex;}.elementor-3181 .elementor-element.elementor-element-b7055ec.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-b7055ec.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-d839bec{--n-tabs-heading-wrap:wrap;--n-tabs-heading-overflow-x:initial;--n-tabs-title-white-space:initial;}.elementor-3181 .elementor-element.elementor-element-d839bec.elementor-widget-n-tabs > .elementor-widget-container > .e-n-tabs > .e-n-tabs-heading > :is( .e-n-tab-title > .e-n-tab-title-text, .e-n-tab-title ){font-weight:500;}.elementor-3181 .elementor-element.elementor-element-bb1e9f8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:37px;--margin-bottom:30px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-111b156{--display:flex;--justify-content:flex-start;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );border-style:solid;--border-style:solid;border-width:0px 4px 0px 0px;--border-top-width:0px;--border-right-width:4px;--border-bottom-width:0px;--border-left-width:0px;border-color:var( --e-global-color-b3c9963 );--border-color:var( --e-global-color-b3c9963 );--border-radius:10px 10px 10px 10px;}.elementor-3181 .elementor-element.elementor-element-51bcfc1{text-align:center;}.elementor-3181 .elementor-element.elementor-element-51bcfc1 .elementor-heading-title{font-family:"bold rokh", Sans-serif;font-size:29px;font-weight:600;color:var( --e-global-color-ae75eee );}.elementor-3181 .elementor-element.elementor-element-5161568{text-align:center;font-family:"yekan bakh", Sans-serif;font-weight:400;color:#3333336B;}.elementor-3181 .elementor-element.elementor-element-68a19d2{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:0px 30px;--row-gap:0px;--column-gap:30px;}.elementor-3181 .elementor-element.elementor-element-4d91a33{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-3181 .elementor-element.elementor-element-4d91a33:not(.elementor-motion-effects-element-type-background), .elementor-3181 .elementor-element.elementor-element-4d91a33 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-3181 .elementor-element.elementor-element-be35d0c > .elementor-widget-container{margin:-5px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-be35d0c{text-align:center;}.elementor-3181 .elementor-element.elementor-element-be35d0c img{width:80%;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-95bc30a{text-align:center;}.elementor-3181 .elementor-element.elementor-element-95bc30a .elementor-heading-title{font-family:"med yekan", Sans-serif;font-weight:600;}.elementor-3181 .elementor-element.elementor-element-a6aad3e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-3181 .elementor-element.elementor-element-a6aad3e:not(.elementor-motion-effects-element-type-background), .elementor-3181 .elementor-element.elementor-element-a6aad3e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-3181 .elementor-element.elementor-element-9aa1e7a > .elementor-widget-container{margin:-5px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-9aa1e7a{text-align:center;}.elementor-3181 .elementor-element.elementor-element-9aa1e7a img{width:80%;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-0c79344{text-align:center;}.elementor-3181 .elementor-element.elementor-element-0c79344 .elementor-heading-title{font-family:"med yekan", Sans-serif;font-weight:600;}.elementor-3181 .elementor-element.elementor-element-6733b71{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3181 .elementor-element.elementor-element-6d293d0 .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-6d293d0 > .elementor-widget-container{margin:50px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-6d293d0 .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-6d293d0 .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-7501257{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:70px;--margin-bottom:70px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-6f40160{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-61451a0 img{height:332px;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-89ad9d6{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-c3eb1c1 img{border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-3ba50cc{--display:flex;--margin-top:70px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-f5d8648{--display:flex;}.elementor-3181 .elementor-element.elementor-element-5f60d6b.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-5f60d6b.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-a81dc37 .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-a81dc37 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-a81dc37 .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-a81dc37 .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-208a9f3{--display:flex;}.elementor-3181 .elementor-element.elementor-element-b927188.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-b927188.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-7498328 .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-7498328 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-7498328 .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-7498328 .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-61420b9{--display:flex;}.elementor-3181 .elementor-element.elementor-element-b292019.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-b292019.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-52d1b0b{--n-tabs-heading-wrap:wrap;--n-tabs-heading-overflow-x:initial;--n-tabs-title-white-space:initial;}.elementor-3181 .elementor-element.elementor-element-52d1b0b.elementor-widget-n-tabs > .elementor-widget-container > .e-n-tabs > .e-n-tabs-heading > :is( .e-n-tab-title > .e-n-tab-title-text, .e-n-tab-title ){font-weight:500;}.elementor-3181 .elementor-element.elementor-element-7561f44{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:37px;--margin-bottom:30px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-c3a13c1{--display:flex;--justify-content:flex-start;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );border-style:solid;--border-style:solid;border-width:0px 4px 0px 0px;--border-top-width:0px;--border-right-width:4px;--border-bottom-width:0px;--border-left-width:0px;border-color:var( --e-global-color-b3c9963 );--border-color:var( --e-global-color-b3c9963 );--border-radius:10px 10px 10px 10px;}.elementor-3181 .elementor-element.elementor-element-7476f7f{text-align:center;}.elementor-3181 .elementor-element.elementor-element-7476f7f .elementor-heading-title{font-family:"bold rokh", Sans-serif;font-size:29px;font-weight:600;color:var( --e-global-color-ae75eee );}.elementor-3181 .elementor-element.elementor-element-a01f289{text-align:center;font-family:"yekan bakh", Sans-serif;font-weight:400;color:#3333336B;}.elementor-3181 .elementor-element.elementor-element-87f3f27{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:0px 30px;--row-gap:0px;--column-gap:30px;}.elementor-3181 .elementor-element.elementor-element-627c7ed{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-3181 .elementor-element.elementor-element-627c7ed:not(.elementor-motion-effects-element-type-background), .elementor-3181 .elementor-element.elementor-element-627c7ed > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-3181 .elementor-element.elementor-element-2e0c110 > .elementor-widget-container{margin:-5px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-2e0c110{text-align:center;}.elementor-3181 .elementor-element.elementor-element-2e0c110 img{width:80%;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-32f78f2{text-align:center;}.elementor-3181 .elementor-element.elementor-element-32f78f2 .elementor-heading-title{font-family:"med yekan", Sans-serif;font-weight:600;}.elementor-3181 .elementor-element.elementor-element-29b1b0d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-3181 .elementor-element.elementor-element-29b1b0d:not(.elementor-motion-effects-element-type-background), .elementor-3181 .elementor-element.elementor-element-29b1b0d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-3181 .elementor-element.elementor-element-8669c14 > .elementor-widget-container{margin:-5px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-8669c14{text-align:center;}.elementor-3181 .elementor-element.elementor-element-8669c14 img{width:80%;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-919807a{text-align:center;}.elementor-3181 .elementor-element.elementor-element-919807a .elementor-heading-title{font-family:"med yekan", Sans-serif;font-weight:600;}.elementor-3181 .elementor-element.elementor-element-b7c2c36{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-3181 .elementor-element.elementor-element-b7c2c36:not(.elementor-motion-effects-element-type-background), .elementor-3181 .elementor-element.elementor-element-b7c2c36 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-3181 .elementor-element.elementor-element-5f04d8a > .elementor-widget-container{margin:-5px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-5f04d8a{text-align:center;}.elementor-3181 .elementor-element.elementor-element-5f04d8a img{width:80%;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-5908ef6{text-align:center;}.elementor-3181 .elementor-element.elementor-element-5908ef6 .elementor-heading-title{font-family:"med yekan", Sans-serif;font-weight:600;}.elementor-3181 .elementor-element.elementor-element-7fb4dda{--display:flex;--margin-top:70px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-95aa002{--display:flex;}.elementor-3181 .elementor-element.elementor-element-0e90cca.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-0e90cca.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-ca84dbf .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-ca84dbf > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-ca84dbf .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-ca84dbf .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-35f1ffd{--display:flex;}.elementor-3181 .elementor-element.elementor-element-101bd2c.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-101bd2c.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-f8f1bd0 .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-f8f1bd0 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-f8f1bd0 .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-f8f1bd0 .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-7a1e277{--display:flex;}.elementor-3181 .elementor-element.elementor-element-04804f7.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-04804f7.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-f10e38a .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-f10e38a > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-f10e38a .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-f10e38a .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-13deb51{--n-tabs-heading-wrap:wrap;--n-tabs-heading-overflow-x:initial;--n-tabs-title-white-space:initial;}.elementor-3181 .elementor-element.elementor-element-13deb51.elementor-widget-n-tabs > .elementor-widget-container > .e-n-tabs > .e-n-tabs-heading > :is( .e-n-tab-title > .e-n-tab-title-text, .e-n-tab-title ){font-weight:500;}.elementor-3181 .elementor-element.elementor-element-fb450b8{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:70px;--margin-bottom:70px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-d49cfb7{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-9cadfaa img{border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-0487f40{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-1927f25 img{border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-c7c17ae{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:37px;--margin-bottom:30px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-509cad1{--display:flex;--justify-content:flex-start;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );border-style:solid;--border-style:solid;border-width:0px 4px 0px 0px;--border-top-width:0px;--border-right-width:4px;--border-bottom-width:0px;--border-left-width:0px;border-color:var( --e-global-color-b3c9963 );--border-color:var( --e-global-color-b3c9963 );--border-radius:10px 10px 10px 10px;}.elementor-3181 .elementor-element.elementor-element-7870b02{text-align:center;}.elementor-3181 .elementor-element.elementor-element-7870b02 .elementor-heading-title{font-family:"bold rokh", Sans-serif;font-size:29px;font-weight:600;color:var( --e-global-color-ae75eee );}.elementor-3181 .elementor-element.elementor-element-3cf3f87{--display:flex;}.elementor-3181 .elementor-element.elementor-element-7b0fe89.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-7b0fe89.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-1f033b1{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-d3fe705 .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-d3fe705 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-d3fe705 .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-d3fe705 .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-ac3ba39{--display:flex;--margin-top:70px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-ff9ebe0{--display:flex;}.elementor-3181 .elementor-element.elementor-element-c74cb6d.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-c74cb6d.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-f7d50ee .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-f7d50ee > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-f7d50ee .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-f7d50ee .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-c6a5461{--display:flex;}.elementor-3181 .elementor-element.elementor-element-8e5b6ec.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-8e5b6ec.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-d83a0e8{--display:flex;}.elementor-3181 .elementor-element.elementor-element-a8ce484.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-a8ce484.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-0aff1b4 .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-0aff1b4 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-0aff1b4 .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-0aff1b4 .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-62cca1a{--n-tabs-heading-wrap:wrap;--n-tabs-heading-overflow-x:initial;--n-tabs-title-white-space:initial;}.elementor-3181 .elementor-element.elementor-element-62cca1a.elementor-widget-n-tabs > .elementor-widget-container > .e-n-tabs > .e-n-tabs-heading > :is( .e-n-tab-title > .e-n-tab-title-text, .e-n-tab-title ){font-weight:500;}.elementor-3181 .elementor-element.elementor-element-1c473e2{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:70px;--margin-bottom:70px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-32dc4c0{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-0467f0e img{border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-92d1fbd{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-0557d1d img{border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-baf59f5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:37px;--margin-bottom:30px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-7db268b{--display:flex;--justify-content:flex-start;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );border-style:solid;--border-style:solid;border-width:0px 4px 0px 0px;--border-top-width:0px;--border-right-width:4px;--border-bottom-width:0px;--border-left-width:0px;border-color:var( --e-global-color-b3c9963 );--border-color:var( --e-global-color-b3c9963 );--border-radius:10px 10px 10px 10px;}.elementor-3181 .elementor-element.elementor-element-1ab9a73{text-align:center;}.elementor-3181 .elementor-element.elementor-element-1ab9a73 .elementor-heading-title{font-family:"bold rokh", Sans-serif;font-size:29px;font-weight:600;color:var( --e-global-color-ae75eee );}.elementor-3181 .elementor-element.elementor-element-a23c690{--display:flex;}.elementor-3181 .elementor-element.elementor-element-1ad6fdc.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-1ad6fdc.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-f4f8e1d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3181 .elementor-element.elementor-element-753feb1 .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-753feb1 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-753feb1 .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-753feb1 .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-9c033df{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:70px;--margin-bottom:70px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-62acfea{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-cba3709 img{border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-a6b6140{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-704da0b img{height:330px;border-radius:20px 20px 20px 20px;}.elementor-3181 .elementor-element.elementor-element-0d447ca{--display:flex;--margin-top:70px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-22229ec{--display:flex;}.elementor-3181 .elementor-element.elementor-element-606885f.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-606885f.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-31f3e08{--display:flex;}.elementor-3181 .elementor-element.elementor-element-ae6f774.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-ae6f774.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-d68a3c4{--n-tabs-heading-wrap:wrap;--n-tabs-heading-overflow-x:initial;--n-tabs-title-white-space:initial;}.elementor-3181 .elementor-element.elementor-element-d68a3c4.elementor-widget-n-tabs > .elementor-widget-container > .e-n-tabs > .e-n-tabs-heading > :is( .e-n-tab-title > .e-n-tab-title-text, .e-n-tab-title ){font-weight:500;}.elementor-3181 .elementor-element.elementor-element-4c87eee{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:37px;--margin-bottom:30px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-6413ce1{--display:flex;--justify-content:flex-start;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );border-style:solid;--border-style:solid;border-width:0px 4px 0px 0px;--border-top-width:0px;--border-right-width:4px;--border-bottom-width:0px;--border-left-width:0px;border-color:var( --e-global-color-b3c9963 );--border-color:var( --e-global-color-b3c9963 );--border-radius:10px 10px 10px 10px;}.elementor-3181 .elementor-element.elementor-element-8722a65{text-align:center;}.elementor-3181 .elementor-element.elementor-element-8722a65 .elementor-heading-title{font-family:"bold rokh", Sans-serif;font-size:29px;font-weight:600;color:var( --e-global-color-ae75eee );}.elementor-3181 .elementor-element.elementor-element-2828061{text-align:center;font-family:"yekan bakh", Sans-serif;font-weight:400;color:#3333336B;}.elementor-3181 .elementor-element.elementor-element-1e1b27e{--display:flex;}.elementor-3181 .elementor-element.elementor-element-2af4ec5.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-2af4ec5.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-3181 .elementor-element.elementor-element-352acd0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3181 .elementor-element.elementor-element-b3725a8 .elementor-button{background-color:transparent;font-family:"yekan bakh", Sans-serif;font-size:22px;font-weight:400;line-height:18px;letter-spacing:0.3px;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, var( --e-global-color-2309ffb ) 0%, var( --e-global-color-b3c9963 ) 100%);border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-b3725a8 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-b3725a8 .elementor-button:hover, .elementor-3181 .elementor-element.elementor-element-b3725a8 .elementor-button:focus{box-shadow:0px 0px 10px 0px rgba(101.41303100585938, 99.24732901807283, 99.24732901807283, 0.5);}.elementor-3181 .elementor-element.elementor-element-abdf4a9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3181 .elementor-element.elementor-element-286cd3d{--display:flex;}:root{--page-title-display:none;}body.elementor-page-3181{padding:0px 0px 0px 0px;}@media(max-width:1024px){.elementor-3181 .elementor-element.elementor-element-e9a5893.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-bba9e9e.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-b2f2193.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-fcb4a06.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-19b914e.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-0ad6ff4.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-d1edc5c.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-7391687.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-b7055ec.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-5f60d6b.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-b927188.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-b292019.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-0e90cca.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-101bd2c.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-04804f7.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-7b0fe89.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-c74cb6d.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-8e5b6ec.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-a8ce484.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-1ad6fdc.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-606885f.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-ae6f774.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-2af4ec5.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(max-width:767px){.elementor-3181 .elementor-element.elementor-element-6a8ecef{--margin-top:15px;--margin-bottom:15px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-0b5b2e7{--content-width:100%;--min-height:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-d8a3bd6 img{width:100%;height:236px;}.elementor-3181 .elementor-element.elementor-element-8009ced{--margin-top:47px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-59b47d7{--padding-top:5px;--padding-bottom:5px;--padding-left:5px;--padding-right:15px;}.elementor-3181 .elementor-element.elementor-element-5004100 .elementor-heading-title{font-size:20px;}.elementor-3181 .elementor-element.elementor-element-ec73f67{text-align:center;font-size:12px;}.elementor-3181 .elementor-element.elementor-element-07877a6{--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:15px 20px;--row-gap:15px;--column-gap:20px;--margin-top:15px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-590ff51{--width:40%;}.elementor-3181 .elementor-element.elementor-element-3747159 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-3747159 img{width:80%;}.elementor-3181 .elementor-element.elementor-element-17f88c0{--width:40%;}.elementor-3181 .elementor-element.elementor-element-542f482 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-542f482 img{width:80%;}.elementor-3181 .elementor-element.elementor-element-bee7941{--width:40%;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-3181 .elementor-element.elementor-element-263e353 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-263e353 img{width:80%;}.elementor-3181 .elementor-element.elementor-element-52b92f4{--width:40%;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-3181 .elementor-element.elementor-element-a1d593a > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-a1d593a img{width:80%;}.elementor-3181 .elementor-element.elementor-element-f5d9f0d{--margin-top:15px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-3cdf147 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-3cdf147 .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-1e803c1{--min-height:30px;--margin-top:50px;--margin-bottom:50px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-1157b23 img{height:203px;}.elementor-3181 .elementor-element.elementor-element-644e174{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-e9a5893.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-a9e85bd > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-a9e85bd .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-bba9e9e > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-bba9e9e.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-e5b22e5 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-e5b22e5 .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-b2f2193.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-72dc98f > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-72dc98f .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-f830987{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-fcb4a06.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-19b914e.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-0ad6ff4.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-1de777f > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-1de777f .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-d1edc5c.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-7391687.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-b7055ec.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-d839bec{--n-tabs-heading-justify-content:center;--n-tabs-title-width:initial;--n-tabs-title-height:initial;--n-tabs-title-align-items:center;--n-tabs-title-flex-grow:0;--n-tabs-heading-wrap:nowrap;--n-tabs-heading-overflow-x:scroll;--n-tabs-title-white-space:nowrap;--n-tabs-title-justify-content:center;--n-tabs-title-text-align:center;--n-tabs-title-gap:0px;--n-tabs-gap:0px;--n-tabs-title-font-size:13px;}.elementor-3181 .elementor-element.elementor-element-bb1e9f8{--margin-top:47px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-111b156{--padding-top:5px;--padding-bottom:5px;--padding-left:5px;--padding-right:15px;}.elementor-3181 .elementor-element.elementor-element-51bcfc1 .elementor-heading-title{font-size:20px;}.elementor-3181 .elementor-element.elementor-element-5161568{text-align:center;font-size:12px;}.elementor-3181 .elementor-element.elementor-element-68a19d2{--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:15px 12px;--row-gap:15px;--column-gap:12px;--margin-top:30px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-4d91a33{--width:40%;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-3181 .elementor-element.elementor-element-be35d0c > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-be35d0c img{width:80%;}.elementor-3181 .elementor-element.elementor-element-a6aad3e{--width:40%;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-3181 .elementor-element.elementor-element-9aa1e7a > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-9aa1e7a img{width:80%;}.elementor-3181 .elementor-element.elementor-element-6733b71{--margin-top:15px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-6d293d0 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-6d293d0 .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-7501257{--min-height:30px;--margin-top:50px;--margin-bottom:50px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-61451a0 img{height:203px;}.elementor-3181 .elementor-element.elementor-element-f5d8648{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-5f60d6b.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-a81dc37 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-a81dc37 .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-b927188 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-b927188.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-7498328 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-7498328 .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-61420b9{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-b292019.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-52d1b0b{--n-tabs-heading-justify-content:center;--n-tabs-title-width:initial;--n-tabs-title-height:initial;--n-tabs-title-align-items:center;--n-tabs-title-flex-grow:0;--n-tabs-heading-wrap:nowrap;--n-tabs-heading-overflow-x:scroll;--n-tabs-title-white-space:nowrap;--n-tabs-title-justify-content:center;--n-tabs-title-text-align:center;--n-tabs-title-gap:0px;--n-tabs-gap:0px;--n-tabs-title-font-size:13px;}.elementor-3181 .elementor-element.elementor-element-7561f44{--margin-top:47px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-c3a13c1{--padding-top:5px;--padding-bottom:5px;--padding-left:5px;--padding-right:15px;}.elementor-3181 .elementor-element.elementor-element-7476f7f .elementor-heading-title{font-size:20px;}.elementor-3181 .elementor-element.elementor-element-a01f289{text-align:center;font-size:12px;}.elementor-3181 .elementor-element.elementor-element-87f3f27{--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:15px 12px;--row-gap:15px;--column-gap:12px;--margin-top:30px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-627c7ed{--width:40%;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-3181 .elementor-element.elementor-element-2e0c110 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-2e0c110 img{width:80%;}.elementor-3181 .elementor-element.elementor-element-29b1b0d{--width:40%;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-3181 .elementor-element.elementor-element-8669c14 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-8669c14 img{width:80%;}.elementor-3181 .elementor-element.elementor-element-b7c2c36{--width:40%;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-3181 .elementor-element.elementor-element-5f04d8a > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-5f04d8a img{width:80%;}.elementor-3181 .elementor-element.elementor-element-95aa002{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-0e90cca.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-ca84dbf > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-ca84dbf .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-101bd2c > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-101bd2c.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-f8f1bd0 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-f8f1bd0 .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-7a1e277{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-04804f7.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-f10e38a > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-f10e38a .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-13deb51{--n-tabs-heading-justify-content:center;--n-tabs-title-width:initial;--n-tabs-title-height:initial;--n-tabs-title-align-items:center;--n-tabs-title-flex-grow:0;--n-tabs-heading-wrap:nowrap;--n-tabs-heading-overflow-x:scroll;--n-tabs-title-white-space:nowrap;--n-tabs-title-justify-content:center;--n-tabs-title-text-align:center;--n-tabs-title-gap:0px;--n-tabs-gap:0px;--n-tabs-title-font-size:13px;}.elementor-3181 .elementor-element.elementor-element-fb450b8{--min-height:30px;--margin-top:50px;--margin-bottom:50px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-c7c17ae{--margin-top:47px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-509cad1{--padding-top:5px;--padding-bottom:5px;--padding-left:5px;--padding-right:15px;}.elementor-3181 .elementor-element.elementor-element-7870b02 .elementor-heading-title{font-size:20px;}.elementor-3181 .elementor-element.elementor-element-7b0fe89.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-d3fe705 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-d3fe705 .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-ff9ebe0{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-c74cb6d.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-f7d50ee > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-f7d50ee .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-c6a5461{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-8e5b6ec.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-d83a0e8{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-a8ce484.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-0aff1b4 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-0aff1b4 .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-62cca1a{--n-tabs-heading-justify-content:center;--n-tabs-title-width:initial;--n-tabs-title-height:initial;--n-tabs-title-align-items:center;--n-tabs-title-flex-grow:0;--n-tabs-heading-wrap:nowrap;--n-tabs-heading-overflow-x:scroll;--n-tabs-title-white-space:nowrap;--n-tabs-title-justify-content:center;--n-tabs-title-text-align:center;--n-tabs-title-gap:0px;--n-tabs-gap:0px;--n-tabs-title-font-size:13px;}.elementor-3181 .elementor-element.elementor-element-1c473e2{--min-height:30px;--margin-top:50px;--margin-bottom:50px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-baf59f5{--margin-top:47px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-7db268b{--padding-top:5px;--padding-bottom:5px;--padding-left:5px;--padding-right:15px;}.elementor-3181 .elementor-element.elementor-element-1ab9a73 .elementor-heading-title{font-size:20px;}.elementor-3181 .elementor-element.elementor-element-1ad6fdc.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-753feb1 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-753feb1 .elementor-button{font-size:14px;}.elementor-3181 .elementor-element.elementor-element-9c033df{--min-height:30px;--margin-top:50px;--margin-bottom:50px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-704da0b img{height:200px;}.elementor-3181 .elementor-element.elementor-element-22229ec{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3181 .elementor-element.elementor-element-606885f.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-ae6f774 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-ae6f774.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-d68a3c4{--n-tabs-heading-justify-content:center;--n-tabs-title-width:initial;--n-tabs-title-height:initial;--n-tabs-title-align-items:center;--n-tabs-title-flex-grow:0;--n-tabs-heading-wrap:nowrap;--n-tabs-heading-overflow-x:scroll;--n-tabs-title-white-space:nowrap;--n-tabs-title-justify-content:center;--n-tabs-title-text-align:center;--n-tabs-title-gap:0px;--n-tabs-gap:0px;--n-tabs-title-font-size:13px;}.elementor-3181 .elementor-element.elementor-element-4c87eee{--margin-top:47px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3181 .elementor-element.elementor-element-6413ce1{--padding-top:5px;--padding-bottom:5px;--padding-left:5px;--padding-right:15px;}.elementor-3181 .elementor-element.elementor-element-8722a65 .elementor-heading-title{font-size:20px;}.elementor-3181 .elementor-element.elementor-element-2828061{text-align:center;font-size:12px;}.elementor-3181 .elementor-element.elementor-element-2af4ec5.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-3181 .elementor-element.elementor-element-b3725a8 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3181 .elementor-element.elementor-element-b3725a8 .elementor-button{font-size:14px;}body.elementor-page-3181{padding:0px 5px 0px 5px;}}@media(min-width:768px){.elementor-3181 .elementor-element.elementor-element-590ff51{--width:15%;}.elementor-3181 .elementor-element.elementor-element-17f88c0{--width:15%;}.elementor-3181 .elementor-element.elementor-element-bee7941{--width:15%;}.elementor-3181 .elementor-element.elementor-element-52b92f4{--width:15%;}.elementor-3181 .elementor-element.elementor-element-4947f4f{--width:49%;}.elementor-3181 .elementor-element.elementor-element-4c1292a{--width:49%;}.elementor-3181 .elementor-element.elementor-element-f625db6{--width:50%;}.elementor-3181 .elementor-element.elementor-element-4d91a33{--width:15%;}.elementor-3181 .elementor-element.elementor-element-a6aad3e{--width:15%;}.elementor-3181 .elementor-element.elementor-element-6f40160{--width:50%;}.elementor-3181 .elementor-element.elementor-element-89ad9d6{--width:50%;}.elementor-3181 .elementor-element.elementor-element-627c7ed{--width:15%;}.elementor-3181 .elementor-element.elementor-element-29b1b0d{--width:15%;}.elementor-3181 .elementor-element.elementor-element-b7c2c36{--width:15%;}.elementor-3181 .elementor-element.elementor-element-d49cfb7{--width:50%;}.elementor-3181 .elementor-element.elementor-element-0487f40{--width:50%;}.elementor-3181 .elementor-element.elementor-element-32dc4c0{--width:50%;}.elementor-3181 .elementor-element.elementor-element-92d1fbd{--width:50%;}.elementor-3181 .elementor-element.elementor-element-62acfea{--width:50%;}.elementor-3181 .elementor-element.elementor-element-a6b6140{--width:50%;}}/* Start custom CSS for shortcode, class: .elementor-element-90587ed *//** * ============================================================================== * استایل هماهنگ‌سازی افزونه‌های جستجوی زنده با تم آنیلاتل * پشتیبانی از: FiboSearch (DGWT), Advanced Woo Search (AWS), YITH و ابزارک‌های المنتور * ============================================================================== */ /* ۱. کادر بیرونی و فیلد جستجوی افزونه */ .anila-search-box, .anila-search-box .dgwt-wcas-search-wrapp, .anila-search-box .aws-container, .dgwt-wcas-search-wrapp, .aws-container { max-width: 580px !important; width: 100% !important; margin: 0 auto !important; direction: rtl !important; } /* ۲. بدنه فرم ورودی (Input Wrapper) */ .anila-search-box input[type="search"], .anila-search-box .dgwt-wcas-search-input, .anila-search-box .aws-search-field, .dgwt-wcas-search-wrapp .dgwt-wcas-search-input, .aws-container .aws-search-field { background-color: #fdfbf7 !important; border: 1.5px solid #ebdccf !important; border-radius: 18px !important; color: #2b221a !important; font-family: inherit !important; font-size: 0.88rem !important; font-weight: 600 !important; height: 46px !important; padding: 0 18px !important; box-shadow: 0 4px 14px -3px rgba(43, 34, 26, 0.04) !important; transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1) !important; } /* متن کم‌رنگ پیش‌فرض (Placeholder) */ .anila-search-box input::placeholder, .dgwt-wcas-search-input::placeholder, .aws-search-field::placeholder { color: #9c8e82 !important; font-size: 0.84rem !important; font-weight: 500 !important; } /* حالت کلیک و فعال بودن سرچ (Focus) */ .anila-search-box input[type="search"]:focus, .anila-search-box .dgwt-wcas-search-input:focus, .anila-search-box .aws-search-field:focus, .dgwt-wcas-search-wrapp .dgwt-wcas-search-input:focus, .aws-container .aws-search-field:focus { background-color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 8px 24px -4px rgba(217, 24, 155, 0.2) !important; outline: none !important; } /* ۳. دکمه جستجو / آیکون ذره‌بین */ .anila-search-box .dgwt-wcas-search-submit, .anila-search-box .aws-search-btn_box, .anila-search-box button[type="submit"], .dgwt-wcas-search-submit, .aws-search-btn_box { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; border-radius: 14px !important; border: none !important; color: #ffffff !important; height: 38px !important; min-width: 38px !important; display: flex !important; align-items: center !important; justify-content: center !important; box-shadow: 0 3px 10px rgba(217, 24, 155, 0.3) !important; cursor: pointer !important; transition: all 0.22s ease !important; margin-left: 4px !important; } .anila-search-box .dgwt-wcas-search-submit:hover, .dgwt-wcas-search-submit:hover, .aws-search-btn_box:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; transform: scale(1.04) !important; } .anila-search-box .dgwt-wcas-search-submit svg, .dgwt-wcas-search-submit svg, .aws-search-btn_box svg { fill: #ffffff !important; stroke: #ffffff !important; } /* ۴. پنجره نتایج زنده کشویی (Ajax Suggestions Dropdown) */ .dgwt-wcas-suggestions-wrapp, .aws_result_list, .yith-ajaxsearchform-container .autocomplete-suggestions { background-color: #ffffff !important; border: 1px solid #ebdccf !important; border-radius: 20px !important; box-shadow: 0 18px 40px -4px rgba(43, 34, 26, 0.15) !important; padding: 8px !important; margin-top: 8px !important; direction: rtl !important; overflow: hidden !important; } /* هر ردیف نتیجه در منوی بازشو */ .dgwt-wcas-suggestion, .aws_result_item { border-radius: 12px !important; padding: 10px 14px !important; transition: background-color 0.2s ease !important; border-bottom: 1px solid #f6ede3 !important; } .dgwt-wcas-suggestion:last-child, .aws_result_item:last-child { border-bottom: none !important; } /* هاور روی نتیجه سرچ */ .dgwt-wcas-suggestion:hover, .dgwt-wcas-suggestion.dgwt-wcas-suggestion-selected, .aws_result_item:hover { background-color: #fdfbf7 !important; } /* تیتر محصول در نتایج */ .dgwt-wcas-st-title, .aws_result_title { color: #2b221a !important; font-weight: 800 !important; font-size: 0.86rem !important; } /* قیمت محصول در نتایج سرچ */ .dgwt-wcas-st-price, .aws_result_price { color: #d9189b !important; font-weight: 800 !important; font-size: 0.82rem !important; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-07877a6 *//** * ============================================================================== * استایل اختصاصی کارت‌های دسته‌بندی ووکامرس (Anilatell Category Cards) * ریسپانسیو: ۲ یا ۳ ستونه در موبایل + ۴ ستونه در دسکتاپ * هماهنگ با تم آنیلاتل: کرم شنی + بوردر لوکس + هاور ارغوانی #d9189b * ============================================================================== */ :root { --anila-cat-bg: #fdfbf7; --anila-cat-border: #ebdccf; --anila-cat-hover-border: #d9189b; --anila-cat-pink: #d9189b; --anila-cat-title: #2b221a; --anila-cat-sub: #786657; } /* ---------- ۱. چیدمان شبکه (گرید) دسته‌بندی‌ها ---------- */ .woocommerce ul.product-categories, .woocommerce-categories, .anila-category-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; /* ۲ ستونه در موبایل */ gap: 12px !important; margin: 24px 0 40px 0 !important; padding: 0 !important; list-style: none !important; direction: rtl !important; } @media (min-width: 640px) { .woocommerce ul.product-categories, .woocommerce-categories, .anila-category-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 16px !important; } } @media (min-width: 1024px) { .woocommerce ul.product-categories, .woocommerce-categories, .anila-category-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 20px !important; } } /* ---------- ۲. طراحی کارت هر دسته‌بندی ---------- */ .woocommerce ul.product-categories li.product-category, .anila-category-card { background: var(--anila-cat-bg) !important; border: 1px solid var(--anila-cat-border) !important; border-radius: 20px !important; padding: 14px !important; margin: 0 !important; box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: space-between !important; position: relative !important; overflow: hidden !important; box-shadow: 0 4px 16px -2px rgba(43, 34, 26, 0.05) !important; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important; text-align: center !important; cursor: pointer !important; } @media (min-width: 768px) { .woocommerce ul.product-categories li.product-category, .anila-category-card { padding: 18px !important; border-radius: 24px !important; } } /* افکت هاور مدرن کارت */ .woocommerce ul.product-categories li.product-category:hover, .anila-category-card:hover { transform: translateY(-5px) !important; border-color: var(--anila-cat-hover-border) !important; background: #ffffff !important; box-shadow: 0 16px 32px -4px rgba(217, 24, 155, 0.16), 0 4px 12px rgba(43, 34, 26, 0.04) !important; } /* لینک داخلی کارت */ .woocommerce ul.product-categories li.product-category a, .anila-category-card a { display: flex !important; flex-direction: column !important; align-items: center !important; text-decoration: none !important; width: 100% !important; color: inherit !important; } /* ---------- ۳. کادر و عکس دسته‌بندی ---------- */ .woocommerce ul.product-categories li.product-category a img, .anila-category-card .cat-image { width: 100% !important; height: 120px !important; object-fit: contain !important; background: radial-gradient(circle, #faf5ee 45%, #f4e9de 100%) !important; border: 1px solid #f0e3d5 !important; border-radius: 14px !important; padding: 10px !important; margin: 0 0 12px 0 !important; box-sizing: border-box !important; transition: transform 0.35s ease !important; } @media (min-width: 768px) { .woocommerce ul.product-categories li.product-category a img, .anila-category-card .cat-image { height: 150px !important; border-radius: 16px !important; padding: 12px !important; } } .woocommerce ul.product-categories li.product-category:hover a img, .anila-category-card:hover .cat-image { transform: scale(1.07) !important; } /* ---------- ۴. عنوان دسته‌بندی ---------- */ .woocommerce ul.product-categories li.product-category .woocommerce-loop-category__title, .woocommerce ul.product-categories li.product-category h2, .anila-category-card .cat-title { font-size: 0.88rem !important; font-weight: 800 !important; color: var(--anila-cat-title) !important; line-height: 1.4 !important; margin: 4px 0 6px 0 !important; padding: 0 !important; transition: color 0.22s ease !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; width: 100% !important; } @media (min-width: 768px) { .woocommerce ul.product-categories li.product-category .woocommerce-loop-category__title, .woocommerce ul.product-categories li.product-category h2, .anila-category-card .cat-title { font-size: 0.98rem !important; } } .woocommerce ul.product-categories li.product-category:hover .woocommerce-loop-category__title, .anila-category-card:hover .cat-title { color: var(--anila-cat-pink) !important; } /* ---------- ۵. بج شمارنده تعداد کالاها (Count Badge) ---------- */ .woocommerce ul.product-categories li.product-category mark.count, .anila-category-card .cat-count { background-color: #f6ede3 !important; color: var(--anila-cat-sub) !important; font-size: 0.72rem !important; font-weight: 700 !important; padding: 3px 10px !important; border-radius: 20px !important; display: inline-block !important; margin-top: 4px !important; border: 1px solid #ebdccf !important; transition: all 0.22s ease !important; } .woocommerce ul.product-categories li.product-category:hover mark.count, .anila-category-card:hover .cat-count { background-color: rgba(217, 24, 155, 0.1) !important; color: var(--anila-cat-pink) !important; border-color: rgba(217, 24, 155, 0.3) !important; } /* مخفی کردن پرانتزهای پیش‌فرض ووکامرس در صورت وجود */ .woocommerce ul.product-categories li.product-category mark.count::before, .woocommerce ul.product-categories li.product-category mark.count::after { content: "" !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-3cdf147 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a9e85bd *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-e5b22e5 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-72dc98f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-1de777f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a9e85bd *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-e5b22e5 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-72dc98f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-1de777f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a9e85bd *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-e5b22e5 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-72dc98f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-1de777f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a9e85bd *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-e5b22e5 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-72dc98f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-1de777f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a9e85bd *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-e5b22e5 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-72dc98f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-1de777f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a9e85bd *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-e5b22e5 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-72dc98f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-1de777f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a9e85bd *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-e5b22e5 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-72dc98f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-1de777f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a9e85bd *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-e5b22e5 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-72dc98f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-1de777f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a9e85bd *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-e5b22e5 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-72dc98f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-1de777f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a9e85bd *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-e5b22e5 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-72dc98f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-1de777f *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for nested-tabs, class: .elementor-element-d839bec *//** * ============================================================================== * استایل اختصاصی تب‌های محصولات آنیلاتل (Anilatell Product Tabs) * سازگار با المنتور (Elementor Tabs / Nested Tabs) و تب‌های سفارشی HTML * ویژگی‌ها: اسکرول لمسی نرم در موبایل + تب فعال ارغوانی #d9189b + هاور لوکس * ============================================================================== */ :root { --anila-tab-bg: #f8f3eb; --anila-tab-card: #fdfbf7; --anila-tab-border: #ebdccf; --anila-tab-pink: #d9189b; --anila-tab-text: #5c493c; --anila-tab-active-text: #ffffff; } /* ---------- ۱. کانتینر اصلی سربرگ تب‌ها ---------- */ .anila-tabs-nav, .elementor-tabs-wrapper, .e-n-tabs-heading { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important; background-color: var(--anila-tab-bg) !important; border: 1px solid var(--anila-tab-border) !important; padding: 6px !important; border-radius: 20px !important; margin: 0 auto 28px auto !important; width: fit-content !important; max-width: 100% !important; box-sizing: border-box !important; direction: rtl !important; box-shadow: 0 4px 14px -3px rgba(43, 34, 26, 0.05) !important; /* اسکرول افقی مرتب در موبایل */ overflow-x: auto !important; scrollbar-width: none !important; /* فایرفاکس */ -webkit-overflow-scrolling: touch !important; } /* مخفی کردن اسکرول‌بار در مرورگرهای وب‌کیت (کروم، سافاری) */ .anila-tabs-nav::-webkit-scrollbar, .elementor-tabs-wrapper::-webkit-scrollbar, .e-n-tabs-heading::-webkit-scrollbar { display: none !important; } /* ---------- ۲. آیتم‌ها و دکمه‌های هر تب ---------- */ .anila-tab-btn, .elementor-tab-title, .e-n-tab-title { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; padding: 9px 18px !important; border-radius: 14px !important; font-size: 0.84rem !important; font-weight: 800 !important; color: var(--anila-tab-text) !important; background: transparent !important; border: 1px solid transparent !important; cursor: pointer !important; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important; white-space: nowrap !important; text-decoration: none !important; outline: none !important; user-select: none !important; } @media (min-width: 768px) { .anila-tab-btn, .elementor-tab-title, .e-n-tab-title { padding: 10px 22px !important; font-size: 0.9rem !important; } } /* هاور تب غیرفعال */ .anila-tab-btn:hover, .elementor-tab-title:hover, .e-n-tab-title:hover { background-color: rgba(255, 255, 255, 0.8) !important; color: var(--anila-tab-pink) !important; border-color: var(--anila-tab-border) !important; } /* ---------- ۳. وضعیت تب فعال (Active Tab) ---------- */ .anila-tab-btn.active, .elementor-tab-title.elementor-active, .e-n-tab-title[aria-selected="true"], .e-n-tab-title.e-active { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: var(--anila-tab-active-text) !important; border-color: #d9189b !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.35) !important; transform: translateY(-1px) !important; } /* آیکون داخل تب در حالت فعال */ .anila-tab-btn.active svg, .elementor-tab-title.elementor-active svg, .e-n-tab-title.e-active svg { color: #ffffff !important; stroke: #ffffff !important; } /* بج یا شمارنده داخل تب (در صورت وجود) */ .anila-tab-btn .tab-badge, .elementor-tab-title .badge { font-size: 0.68rem !important; font-weight: 800 !important; padding: 2px 7px !important; border-radius: 10px !important; background: rgba(255, 255, 255, 0.25) !important; color: inherit !important; margin-right: 4px !important; } /* ---------- ۴. انیمیشن نرم محتوای تب هنگام تعویض ---------- */ .anila-tab-content, .elementor-tab-content, .e-n-tabs-content > div { animation: anilaTabFadeIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards !important; } @keyframes anilaTabFadeIn { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: translateY(0); } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-68a19d2 *//** * ============================================================================== * کلاس‌های اختصاصی دسته‌بندی‌های آنیلاتل (Custom Category Classes) * ============================================================================== */ /* ۱. گرید اصلی - ۲ ستونه موبایل و ۴ ستونه دسکتاپ */ .anila-cat-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; width: 100% !important; max-width: 1240px !important; margin: 20px auto !important; padding: 0 10px !important; box-sizing: border-box !important; direction: rtl !important; } @media (min-width: 640px) { .anila-cat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 16px !important; } } @media (min-width: 1024px) { .anila-cat-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 20px !important; padding: 0 16px !important; } } /* ۲. کارت هر دسته‌بندی */ .anila-cat-card { background-color: #fdfbf7 !important; border: 1px solid #ebdccf !important; border-radius: 20px !important; padding: 14px 10px !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: space-between !important; text-decoration: none !important; color: inherit !important; box-shadow: 0 4px 14px -3px rgba(43, 34, 26, 0.05) !important; transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1) !important; position: relative !important; overflow: hidden !important; text-align: center !important; box-sizing: border-box !important; } @media (min-width: 768px) { .anila-cat-card { padding: 18px 14px !important; border-radius: 24px !important; } } /* هاور کارت */ .anila-cat-card:hover { background-color: #ffffff !important; border-color: #d9189b !important; transform: translateY(-5px) !important; box-shadow: 0 14px 28px -4px rgba(217, 24, 155, 0.18), 0 4px 10px rgba(43, 34, 26, 0.04) !important; } /* ۳. تصویر دسته‌بندی */ .anila-cat-img { width: 100% !important; height: 110px !important; max-width: 150px !important; object-fit: contain !important; background: radial-gradient(circle, #faf5ee 40%, #f3e6d8 100%) !important; border: 1px solid #f0e3d5 !important; border-radius: 14px !important; padding: 8px !important; margin: 0 auto 10px auto !important; box-sizing: border-box !important; transition: transform 0.35s ease !important; display: block !important; } @media (min-width: 768px) { .anila-cat-img { height: 140px !important; max-width: 180px !important; border-radius: 16px !important; padding: 12px !important; margin-bottom: 12px !important; } } .anila-cat-card:hover .anila-cat-img { transform: scale(1.08) !important; } /* ۴. عنوان دسته‌بندی */ .anila-cat-title { font-size: 0.85rem !important; font-weight: 800 !important; color: #2b221a !important; margin: 2px 0 6px 0 !important; padding: 0 !important; line-height: 1.4 !important; text-align: center !important; transition: color 0.2s ease !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; width: 100% !important; } @media (min-width: 768px) { .anila-cat-title { font-size: 0.96rem !important; } } .anila-cat-card:hover .anila-cat-title { color: #d9189b !important; } /* ۵. بج شمارنده یا زیرنویس دسته */ .anila-cat-badge { display: inline-block !important; background-color: #f6ede3 !important; color: #786657 !important; font-size: 0.7rem !important; font-weight: 700 !important; padding: 3px 9px !important; border-radius: 12px !important; border: 1px solid #ebdccf !important; transition: all 0.22s ease !important; margin-top: 2px !important; } .anila-cat-card:hover .anila-cat-badge { background-color: #fdf2fa !important; color: #d9189b !important; border-color: rgba(217, 24, 155, 0.3) !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-6d293d0 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a81dc37 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-7498328 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a81dc37 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-7498328 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a81dc37 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-7498328 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-a81dc37 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-7498328 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for nested-tabs, class: .elementor-element-52d1b0b *//** * ============================================================================== * استایل اختصاصی تب‌های محصولات آنیلاتل (Anilatell Product Tabs) * سازگار با المنتور (Elementor Tabs / Nested Tabs) و تب‌های سفارشی HTML * ویژگی‌ها: اسکرول لمسی نرم در موبایل + تب فعال ارغوانی #d9189b + هاور لوکس * ============================================================================== */ :root { --anila-tab-bg: #f8f3eb; --anila-tab-card: #fdfbf7; --anila-tab-border: #ebdccf; --anila-tab-pink: #d9189b; --anila-tab-text: #5c493c; --anila-tab-active-text: #ffffff; } /* ---------- ۱. کانتینر اصلی سربرگ تب‌ها ---------- */ .anila-tabs-nav, .elementor-tabs-wrapper, .e-n-tabs-heading { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important; background-color: var(--anila-tab-bg) !important; border: 1px solid var(--anila-tab-border) !important; padding: 6px !important; border-radius: 20px !important; margin: 0 auto 28px auto !important; width: fit-content !important; max-width: 100% !important; box-sizing: border-box !important; direction: rtl !important; box-shadow: 0 4px 14px -3px rgba(43, 34, 26, 0.05) !important; /* اسکرول افقی مرتب در موبایل */ overflow-x: auto !important; scrollbar-width: none !important; /* فایرفاکس */ -webkit-overflow-scrolling: touch !important; } /* مخفی کردن اسکرول‌بار در مرورگرهای وب‌کیت (کروم، سافاری) */ .anila-tabs-nav::-webkit-scrollbar, .elementor-tabs-wrapper::-webkit-scrollbar, .e-n-tabs-heading::-webkit-scrollbar { display: none !important; } /* ---------- ۲. آیتم‌ها و دکمه‌های هر تب ---------- */ .anila-tab-btn, .elementor-tab-title, .e-n-tab-title { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; padding: 9px 18px !important; border-radius: 14px !important; font-size: 0.84rem !important; font-weight: 800 !important; color: var(--anila-tab-text) !important; background: transparent !important; border: 1px solid transparent !important; cursor: pointer !important; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important; white-space: nowrap !important; text-decoration: none !important; outline: none !important; user-select: none !important; } @media (min-width: 768px) { .anila-tab-btn, .elementor-tab-title, .e-n-tab-title { padding: 10px 22px !important; font-size: 0.9rem !important; } } /* هاور تب غیرفعال */ .anila-tab-btn:hover, .elementor-tab-title:hover, .e-n-tab-title:hover { background-color: rgba(255, 255, 255, 0.8) !important; color: var(--anila-tab-pink) !important; border-color: var(--anila-tab-border) !important; } /* ---------- ۳. وضعیت تب فعال (Active Tab) ---------- */ .anila-tab-btn.active, .elementor-tab-title.elementor-active, .e-n-tab-title[aria-selected="true"], .e-n-tab-title.e-active { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: var(--anila-tab-active-text) !important; border-color: #d9189b !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.35) !important; transform: translateY(-1px) !important; } /* آیکون داخل تب در حالت فعال */ .anila-tab-btn.active svg, .elementor-tab-title.elementor-active svg, .e-n-tab-title.e-active svg { color: #ffffff !important; stroke: #ffffff !important; } /* بج یا شمارنده داخل تب (در صورت وجود) */ .anila-tab-btn .tab-badge, .elementor-tab-title .badge { font-size: 0.68rem !important; font-weight: 800 !important; padding: 2px 7px !important; border-radius: 10px !important; background: rgba(255, 255, 255, 0.25) !important; color: inherit !important; margin-right: 4px !important; } /* ---------- ۴. انیمیشن نرم محتوای تب هنگام تعویض ---------- */ .anila-tab-content, .elementor-tab-content, .e-n-tabs-content > div { animation: anilaTabFadeIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards !important; } @keyframes anilaTabFadeIn { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: translateY(0); } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-ca84dbf *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f8f1bd0 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f10e38a *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-ca84dbf *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f8f1bd0 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f10e38a *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-ca84dbf *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f8f1bd0 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f10e38a *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-ca84dbf *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f8f1bd0 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f10e38a *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for nested-tabs, class: .elementor-element-13deb51 *//** * ============================================================================== * استایل اختصاصی تب‌های محصولات آنیلاتل (Anilatell Product Tabs) * سازگار با المنتور (Elementor Tabs / Nested Tabs) و تب‌های سفارشی HTML * ویژگی‌ها: اسکرول لمسی نرم در موبایل + تب فعال ارغوانی #d9189b + هاور لوکس * ============================================================================== */ :root { --anila-tab-bg: #f8f3eb; --anila-tab-card: #fdfbf7; --anila-tab-border: #ebdccf; --anila-tab-pink: #d9189b; --anila-tab-text: #5c493c; --anila-tab-active-text: #ffffff; } /* ---------- ۱. کانتینر اصلی سربرگ تب‌ها ---------- */ .anila-tabs-nav, .elementor-tabs-wrapper, .e-n-tabs-heading { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important; background-color: var(--anila-tab-bg) !important; border: 1px solid var(--anila-tab-border) !important; padding: 6px !important; border-radius: 20px !important; margin: 0 auto 28px auto !important; width: fit-content !important; max-width: 100% !important; box-sizing: border-box !important; direction: rtl !important; box-shadow: 0 4px 14px -3px rgba(43, 34, 26, 0.05) !important; /* اسکرول افقی مرتب در موبایل */ overflow-x: auto !important; scrollbar-width: none !important; /* فایرفاکس */ -webkit-overflow-scrolling: touch !important; } /* مخفی کردن اسکرول‌بار در مرورگرهای وب‌کیت (کروم، سافاری) */ .anila-tabs-nav::-webkit-scrollbar, .elementor-tabs-wrapper::-webkit-scrollbar, .e-n-tabs-heading::-webkit-scrollbar { display: none !important; } /* ---------- ۲. آیتم‌ها و دکمه‌های هر تب ---------- */ .anila-tab-btn, .elementor-tab-title, .e-n-tab-title { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; padding: 9px 18px !important; border-radius: 14px !important; font-size: 0.84rem !important; font-weight: 800 !important; color: var(--anila-tab-text) !important; background: transparent !important; border: 1px solid transparent !important; cursor: pointer !important; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important; white-space: nowrap !important; text-decoration: none !important; outline: none !important; user-select: none !important; } @media (min-width: 768px) { .anila-tab-btn, .elementor-tab-title, .e-n-tab-title { padding: 10px 22px !important; font-size: 0.9rem !important; } } /* هاور تب غیرفعال */ .anila-tab-btn:hover, .elementor-tab-title:hover, .e-n-tab-title:hover { background-color: rgba(255, 255, 255, 0.8) !important; color: var(--anila-tab-pink) !important; border-color: var(--anila-tab-border) !important; } /* ---------- ۳. وضعیت تب فعال (Active Tab) ---------- */ .anila-tab-btn.active, .elementor-tab-title.elementor-active, .e-n-tab-title[aria-selected="true"], .e-n-tab-title.e-active { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: var(--anila-tab-active-text) !important; border-color: #d9189b !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.35) !important; transform: translateY(-1px) !important; } /* آیکون داخل تب در حالت فعال */ .anila-tab-btn.active svg, .elementor-tab-title.elementor-active svg, .e-n-tab-title.e-active svg { color: #ffffff !important; stroke: #ffffff !important; } /* بج یا شمارنده داخل تب (در صورت وجود) */ .anila-tab-btn .tab-badge, .elementor-tab-title .badge { font-size: 0.68rem !important; font-weight: 800 !important; padding: 2px 7px !important; border-radius: 10px !important; background: rgba(255, 255, 255, 0.25) !important; color: inherit !important; margin-right: 4px !important; } /* ---------- ۴. انیمیشن نرم محتوای تب هنگام تعویض ---------- */ .anila-tab-content, .elementor-tab-content, .e-n-tabs-content > div { animation: anilaTabFadeIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards !important; } @keyframes anilaTabFadeIn { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: translateY(0); } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-d3fe705 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f7d50ee *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-0aff1b4 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f7d50ee *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-0aff1b4 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f7d50ee *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-0aff1b4 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f7d50ee *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-0aff1b4 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for nested-tabs, class: .elementor-element-62cca1a *//** * ============================================================================== * استایل اختصاصی تب‌های محصولات آنیلاتل (Anilatell Product Tabs) * سازگار با المنتور (Elementor Tabs / Nested Tabs) و تب‌های سفارشی HTML * ویژگی‌ها: اسکرول لمسی نرم در موبایل + تب فعال ارغوانی #d9189b + هاور لوکس * ============================================================================== */ :root { --anila-tab-bg: #f8f3eb; --anila-tab-card: #fdfbf7; --anila-tab-border: #ebdccf; --anila-tab-pink: #d9189b; --anila-tab-text: #5c493c; --anila-tab-active-text: #ffffff; } /* ---------- ۱. کانتینر اصلی سربرگ تب‌ها ---------- */ .anila-tabs-nav, .elementor-tabs-wrapper, .e-n-tabs-heading { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important; background-color: var(--anila-tab-bg) !important; border: 1px solid var(--anila-tab-border) !important; padding: 6px !important; border-radius: 20px !important; margin: 0 auto 28px auto !important; width: fit-content !important; max-width: 100% !important; box-sizing: border-box !important; direction: rtl !important; box-shadow: 0 4px 14px -3px rgba(43, 34, 26, 0.05) !important; /* اسکرول افقی مرتب در موبایل */ overflow-x: auto !important; scrollbar-width: none !important; /* فایرفاکس */ -webkit-overflow-scrolling: touch !important; } /* مخفی کردن اسکرول‌بار در مرورگرهای وب‌کیت (کروم، سافاری) */ .anila-tabs-nav::-webkit-scrollbar, .elementor-tabs-wrapper::-webkit-scrollbar, .e-n-tabs-heading::-webkit-scrollbar { display: none !important; } /* ---------- ۲. آیتم‌ها و دکمه‌های هر تب ---------- */ .anila-tab-btn, .elementor-tab-title, .e-n-tab-title { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; padding: 9px 18px !important; border-radius: 14px !important; font-size: 0.84rem !important; font-weight: 800 !important; color: var(--anila-tab-text) !important; background: transparent !important; border: 1px solid transparent !important; cursor: pointer !important; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important; white-space: nowrap !important; text-decoration: none !important; outline: none !important; user-select: none !important; } @media (min-width: 768px) { .anila-tab-btn, .elementor-tab-title, .e-n-tab-title { padding: 10px 22px !important; font-size: 0.9rem !important; } } /* هاور تب غیرفعال */ .anila-tab-btn:hover, .elementor-tab-title:hover, .e-n-tab-title:hover { background-color: rgba(255, 255, 255, 0.8) !important; color: var(--anila-tab-pink) !important; border-color: var(--anila-tab-border) !important; } /* ---------- ۳. وضعیت تب فعال (Active Tab) ---------- */ .anila-tab-btn.active, .elementor-tab-title.elementor-active, .e-n-tab-title[aria-selected="true"], .e-n-tab-title.e-active { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: var(--anila-tab-active-text) !important; border-color: #d9189b !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.35) !important; transform: translateY(-1px) !important; } /* آیکون داخل تب در حالت فعال */ .anila-tab-btn.active svg, .elementor-tab-title.elementor-active svg, .e-n-tab-title.e-active svg { color: #ffffff !important; stroke: #ffffff !important; } /* بج یا شمارنده داخل تب (در صورت وجود) */ .anila-tab-btn .tab-badge, .elementor-tab-title .badge { font-size: 0.68rem !important; font-weight: 800 !important; padding: 2px 7px !important; border-radius: 10px !important; background: rgba(255, 255, 255, 0.25) !important; color: inherit !important; margin-right: 4px !important; } /* ---------- ۴. انیمیشن نرم محتوای تب هنگام تعویض ---------- */ .anila-tab-content, .elementor-tab-content, .e-n-tabs-content > div { animation: anilaTabFadeIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards !important; } @keyframes anilaTabFadeIn { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: translateY(0); } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-753feb1 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS for nested-tabs, class: .elementor-element-d68a3c4 *//** * ============================================================================== * استایل اختصاصی تب‌های محصولات آنیلاتل (Anilatell Product Tabs) * سازگار با المنتور (Elementor Tabs / Nested Tabs) و تب‌های سفارشی HTML * ویژگی‌ها: اسکرول لمسی نرم در موبایل + تب فعال ارغوانی #d9189b + هاور لوکس * ============================================================================== */ :root { --anila-tab-bg: #f8f3eb; --anila-tab-card: #fdfbf7; --anila-tab-border: #ebdccf; --anila-tab-pink: #d9189b; --anila-tab-text: #5c493c; --anila-tab-active-text: #ffffff; } /* ---------- ۱. کانتینر اصلی سربرگ تب‌ها ---------- */ .anila-tabs-nav, .elementor-tabs-wrapper, .e-n-tabs-heading { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important; background-color: var(--anila-tab-bg) !important; border: 1px solid var(--anila-tab-border) !important; padding: 6px !important; border-radius: 20px !important; margin: 0 auto 28px auto !important; width: fit-content !important; max-width: 100% !important; box-sizing: border-box !important; direction: rtl !important; box-shadow: 0 4px 14px -3px rgba(43, 34, 26, 0.05) !important; /* اسکرول افقی مرتب در موبایل */ overflow-x: auto !important; scrollbar-width: none !important; /* فایرفاکس */ -webkit-overflow-scrolling: touch !important; } /* مخفی کردن اسکرول‌بار در مرورگرهای وب‌کیت (کروم، سافاری) */ .anila-tabs-nav::-webkit-scrollbar, .elementor-tabs-wrapper::-webkit-scrollbar, .e-n-tabs-heading::-webkit-scrollbar { display: none !important; } /* ---------- ۲. آیتم‌ها و دکمه‌های هر تب ---------- */ .anila-tab-btn, .elementor-tab-title, .e-n-tab-title { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; padding: 9px 18px !important; border-radius: 14px !important; font-size: 0.84rem !important; font-weight: 800 !important; color: var(--anila-tab-text) !important; background: transparent !important; border: 1px solid transparent !important; cursor: pointer !important; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important; white-space: nowrap !important; text-decoration: none !important; outline: none !important; user-select: none !important; } @media (min-width: 768px) { .anila-tab-btn, .elementor-tab-title, .e-n-tab-title { padding: 10px 22px !important; font-size: 0.9rem !important; } } /* هاور تب غیرفعال */ .anila-tab-btn:hover, .elementor-tab-title:hover, .e-n-tab-title:hover { background-color: rgba(255, 255, 255, 0.8) !important; color: var(--anila-tab-pink) !important; border-color: var(--anila-tab-border) !important; } /* ---------- ۳. وضعیت تب فعال (Active Tab) ---------- */ .anila-tab-btn.active, .elementor-tab-title.elementor-active, .e-n-tab-title[aria-selected="true"], .e-n-tab-title.e-active { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: var(--anila-tab-active-text) !important; border-color: #d9189b !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.35) !important; transform: translateY(-1px) !important; } /* آیکون داخل تب در حالت فعال */ .anila-tab-btn.active svg, .elementor-tab-title.elementor-active svg, .e-n-tab-title.e-active svg { color: #ffffff !important; stroke: #ffffff !important; } /* بج یا شمارنده داخل تب (در صورت وجود) */ .anila-tab-btn .tab-badge, .elementor-tab-title .badge { font-size: 0.68rem !important; font-weight: 800 !important; padding: 2px 7px !important; border-radius: 10px !important; background: rgba(255, 255, 255, 0.25) !important; color: inherit !important; margin-right: 4px !important; } /* ---------- ۴. انیمیشن نرم محتوای تب هنگام تعویض ---------- */ .anila-tab-content, .elementor-tab-content, .e-n-tabs-content > div { animation: anilaTabFadeIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards !important; } @keyframes anilaTabFadeIn { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: translateY(0); } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-b3725a8 *//** * ============================================================================== * پکیج استایل اختصاصی دکمه‌های آنیلاتل (Anilatell Button System) * هماهنگ با ووکامرس، المنتور و فرم‌ها * ============================================================================== */ :root { --anila-btn-pink: #d9189b; --anila-btn-pink-hover: #b81282; --anila-btn-sand: #fbf6ee; --anila-btn-sand-border: #ebdccf; --anila-btn-text: #2b221a; --anila-btn-wa: #25d366; --anila-btn-wa-hover: #1ebc59; } /* -------------------------------------------------------------------------- ۱. استایل پایه و عمومی دکمه‌های اصلی ووکامرس و قالب (Global Buttons) -------------------------------------------------------------------------- */ button.button, a.button, input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; font-family: inherit !important; font-weight: 800 !important; font-size: 0.86rem !important; line-height: 1 !important; padding: 12px 22px !important; border-radius: 14px !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; outline: none !important; box-sizing: border-box !important; white-space: nowrap !important; transition: all 0.24s cubic-bezier(0.4, 0, 0.2, 1) !important; user-select: none !important; position: relative !important; overflow: hidden !important; } /* افکت فشردن کلیک (Micro-interaction) */ button.button:active, a.button:active, .elementor-button:active { transform: scale(0.97) !important; } /* -------------------------------------------------------------------------- ۲. دکمه اصلی ارغوانی آنیلاتل (Primary / Brand Button) کلاس کمکی: .anila-btn-primary -------------------------------------------------------------------------- */ .anila-btn-primary, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background: linear-gradient(135deg, #d9189b 0%, #b81282 100%) !important; color: #ffffff !important; border-color: #d9189b !important; box-shadow: 0 4px 14px rgba(217, 24, 155, 0.3) !important; } .anila-btn-primary:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background: linear-gradient(135deg, #b81282 0%, #9c0e6e 100%) !important; color: #ffffff !important; box-shadow: 0 8px 22px rgba(217, 24, 155, 0.45) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۳. دکمه کرم شنی لوکس (Secondary / Light Cream Button) کلاس کمکی: .anila-btn-secondary -------------------------------------------------------------------------- */ .anila-btn-secondary, .woocommerce a.button:not(.alt), .woocommerce button.button:not(.alt) { background-color: var(--anila-btn-sand) !important; color: var(--anila-btn-pink) !important; border: 1px solid var(--anila-btn-sand-border) !important; box-shadow: 0 2px 8px rgba(43, 34, 26, 0.04) !important; } .anila-btn-secondary:hover, .woocommerce a.button:not(.alt):hover, .woocommerce button.button:not(.alt):hover { background-color: var(--anila-btn-pink) !important; color: #ffffff !important; border-color: var(--anila-btn-pink) !important; box-shadow: 0 6px 18px rgba(217, 24, 155, 0.28) !important; transform: translateY(-2px) !important; } /* -------------------------------------------------------------------------- ۴. دکمه ارتباط و خرید واتساپ (WhatsApp Button) کلاس کمکی: .anila-btn-whatsapp -------------------------------------------------------------------------- */ .anila-btn-whatsapp { background-color: var(--anila-btn-wa) !important; color: #ffffff !important; border-color: var(--anila-btn-wa) !important; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3) !important; } .anila-btn-whatsapp:hover { background-color: var(--anila-btn-wa-hover) !important; box-shadow: 0 8px 22px rgba(37, 211, 102, 0.45) !important; transform: translateY(-2px) !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- ۵. دکمه کپسولی گرد یا حاشیه‌دار (Outline / Pill Buttons) کلاس‌های کمکی: .anila-btn-outline و .anila-btn-pill -------------------------------------------------------------------------- */ .anila-btn-outline { background: transparent !important; color: var(--anila-btn-pink) !important; border: 1.5px solid var(--anila-btn-pink) !important; box-shadow: none !important; } .anila-btn-outline:hover { background: var(--anila-btn-pink) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(217, 24, 155, 0.25) !important; } /* حالت قرصی کامل (کاملاً گرد) */ .anila-btn-pill { border-radius: 9999px !important; padding: 10px 26px !important; } /* سایز کوچک برای موبایل یا داخل کارت‌ها */ .anila-btn-sm { padding: 8px 14px !important; font-size: 0.78rem !important; border-radius: 10px !important; }/* End custom CSS */ /* Start custom CSS */html, body { overflow-x: hidden; }/* End custom CSS */ /* Start Custom Fonts CSS */@font-face { font-family: 'bold rokh'; font-style: normal; font-weight: 700; font-display: auto; src: url('https://anilatell.ir/wp-content/uploads/2025/10/Rokh-Bold.woff2') format('woff2'), url('https://anilatell.ir/wp-content/uploads/2025/10/Rokh-Bold.woff') format('woff'), url('https://anilatell.ir/wp-content/uploads/2025/10/RokhFaNum-Bold.ttf') format('truetype'); } @font-face { font-family: 'bold rokh'; font-style: normal; font-weight: normal; font-display: auto; src: ; } @font-face { font-family: 'bold rokh'; font-style: normal; font-weight: normal; font-display: auto; src: ; } /* End Custom Fonts CSS */ /* Start Custom Fonts CSS */@font-face { font-family: 'yekan bakh'; font-style: normal; font-weight: 400; font-display: auto; src: url('https://anilatell.ir/wp-content/uploads/2025/10/yekan-bakh-en-04-regular.woff2') format('woff2'), url('https://anilatell.ir/wp-content/uploads/2025/10/yekan-bakh-en-04-regular.woff') format('woff'), url('https://anilatell.ir/wp-content/uploads/2025/10/yekan-bakh-en-04-regular.ttf') format('truetype'); } /* End Custom Fonts CSS */ /* Start Custom Fonts CSS */@font-face { font-family: 'med yekan'; font-style: normal; font-weight: normal; font-display: auto; src: url('https://anilatell.ir/wp-content/uploads/2025/10/yekan-bakh-en-05-medium.woff2') format('woff2'), url('https://anilatell.ir/wp-content/uploads/2025/10/yekan-bakh-en-05-medium.woff') format('woff'), url('https://anilatell.ir/wp-content/uploads/2025/10/yekan-bakh-en-05-medium.ttf') format('truetype'); } /* End Custom Fonts CSS */