.elementor-120 .elementor-element.elementor-element-e6ef26b{--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:flex-start;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:120px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:2vw;--padding-bottom:15vw;--padding-left:0vw;--padding-right:0vw;}.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-120 .elementor-element.elementor-element-d5e7b3f{margin:0vw 0vw calc(var(--kit-widget-spacing, 0px) + 0vw) 0vw;text-align:center;}.elementor-120 .elementor-element.elementor-element-d5e7b3f .elementor-heading-title{font-family:"Lora", Sans-serif;font-size:3.7rem;font-weight:600;color:#522A16;}.elementor-widget-divider{--divider-color:var( --e-global-color-secondary );}.elementor-widget-divider .elementor-divider__text{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-divider.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-120 .elementor-element.elementor-element-777321f{--divider-border-style:solid;--divider-color:#9E631E;--divider-border-width:1px;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-120 .elementor-element.elementor-element-777321f .elementor-divider-separator{width:41%;margin:0 auto;margin-center:0;}.elementor-120 .elementor-element.elementor-element-777321f .elementor-divider{text-align:center;padding-block-start:6px;padding-block-end:6px;}.elementor-120 .elementor-element.elementor-element-777321f.elementor-view-stacked .elementor-icon{background-color:#9E631E;}.elementor-120 .elementor-element.elementor-element-777321f.elementor-view-framed .elementor-icon, .elementor-120 .elementor-element.elementor-element-777321f.elementor-view-default .elementor-icon{color:#9E631E;border-color:#9E631E;}.elementor-120 .elementor-element.elementor-element-777321f.elementor-view-framed .elementor-icon, .elementor-120 .elementor-element.elementor-element-777321f.elementor-view-default .elementor-icon svg{fill:#9E631E;}.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-120 .elementor-element.elementor-element-f065452{margin:0vw 0vw calc(var(--kit-widget-spacing, 0px) + 2vw) 0vw;padding:0px 0px 0px 0px;text-align:center;font-family:"Karla", Sans-serif;font-size:1.4rem;font-weight:400;}.elementor-120 .elementor-element.elementor-element-68e0c9f4{z-index:2;}.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-120 .elementor-element.elementor-element-ccb53e2.elementor-element{--order:99999 /* order end hack */;}body:not(.rtl) .elementor-120 .elementor-element.elementor-element-ccb53e2{left:0%;}body.rtl .elementor-120 .elementor-element.elementor-element-ccb53e2{right:0%;}.elementor-120 .elementor-element.elementor-element-ccb53e2{bottom:0px;z-index:2;}.elementor-120 .elementor-element.elementor-element-ccb53e2 img{width:58%;}body.elementor-page-120:not(.elementor-motion-effects-element-type-background), body.elementor-page-120 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FDF9F1;}@media(max-width:1024px){.elementor-120 .elementor-element.elementor-element-e6ef26b{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:3vw;--padding-bottom:0vw;--padding-left:3vw;--padding-right:3vw;}}@media(max-width:880px){.elementor-120 .elementor-element.elementor-element-e6ef26b{--margin-top:2vw;--margin-bottom:0vw;--margin-left:0vw;--margin-right:0vw;}}@media(max-width:480px){.elementor-120 .elementor-element.elementor-element-e6ef26b{--margin-top:2vw;--margin-bottom:0vw;--margin-left:0vw;--margin-right:0vw;--padding-top:2vw;--padding-bottom:0vw;--padding-left:4vw;--padding-right:4vw;}.elementor-120 .elementor-element.elementor-element-d5e7b3f .elementor-heading-title{font-size:3.3rem;}}/* Start custom CSS for text-editor, class: .elementor-element-68e0c9f4 *//** ========================================================= BOSTIE BUBBLES — MY ACCOUNT COMPLETE STYLES ========================================================= Gold: #9E631E Brown: #522A16 Cream: #F9EED9 Off-white: #FDF9F1 Text: #111111 Border: #CFCFCF ========================================================= */ /* ========================================================= GLOBAL BOX SIZING ========================================================= */ .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce, .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce * { box-sizing: border-box; } /* ========================================================= ========================================================= GUEST — LOGIN / REGISTER ========================================================= ========================================================= */ /* ========================================================= LAYOUT PRINCIPALE ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .u-columns { display: flex; align-items: stretch; gap: 32px; margin: 0; } /* ========================================================= COLONNE ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .u-column1, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .u-column2 { display: flex; flex-direction: column; float: none; width: 50%; margin: 0; } /* ========================================================= CARD ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-account-card { display: flex; flex-direction: column; flex: 1; width: 100%; padding: 28px 32px; border: 1px solid #9E631E; border-radius: 1em; background: #F9EED9; } /* ========================================================= TITOLI CARD ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-account-card > h2 { margin: 0 0 28px; padding: 0; font-family: "Lora", serif; font-size: 1.55rem; font-weight: 600; line-height: 1.2; text-align: center; text-transform: uppercase; color: #522A16; } /* ========================================================= FORM LOGIN / REGISTER ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register { display: flex; flex-direction: column; flex: 1; width: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; } /* ========================================================= TESTI GENERALI ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login p, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register p, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login label, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register label { font-family: "Karla", sans-serif; color: #111111; } /* ========================================================= RIGHE FORM ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login .form-row, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register .form-row { display: flex; flex-direction: column; width: 100%; margin: 0; padding: 0; } /* ========================================================= LABEL ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login .form-row > label, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register .form-row > label { display: block; margin: 0 0 6px !important; padding: 0; font-family: "Karla", sans-serif; font-size: 1.05rem; font-weight: 500; line-height: 1.15; color: #111111; } /* ========================================================= PASSWORD WRAPPER ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login .password-input, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register .password-input { display: block; width: 100%; margin: 0; padding: 0; } /* ========================================================= INPUT ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login input.input-text, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register input.input-text { display: block; width: 100%; min-height: 50px; margin: 0 !important; padding: 10px 14px; font-family: "Karla", sans-serif; font-size: 1rem; line-height: 1.4; color: #111111; background: #FFFFFF; border: 1px solid #CFCFCF; border-radius: 6px; transition: border-color 0.2s ease, box-shadow 0.2s ease; } /* ========================================================= FOCUS ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login input.input-text:focus, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register input.input-text:focus { outline: none; border-color: #9E631E; box-shadow: 0 0 0 2px rgba(158, 99, 30, 0.16); } /* ========================================================= LOGIN SPACING ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login .form-row { margin-bottom: 18px; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login .woocommerce-form-row--wide:nth-of-type(2) { margin-bottom: 0; } /* ========================================================= REGISTER SPACING ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register .woocommerce-form-row--wide { margin: 0 0 18px !important; } /* ========================================================= REMEMBER ME ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login .woocommerce-form-login__rememberme { display: inline-flex; flex-direction: row; align-items: center; gap: 7px; margin: -7px 0 0; padding: 0; font-family: "Karla", sans-serif; font-size: 0.95rem; font-weight: 400; line-height: 1.2; color: #111111; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login .woocommerce-form-login__rememberme input { width: 16px; height: 16px; margin: 0; } /* ========================================================= LOGIN ACTION ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login .form-row:last-of-type { display: block; margin-top: auto; margin-bottom: 0; } /* ========================================================= LOGIN / REGISTER BUTTONS ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login button.button, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register button.button { width: 100%; min-height: 48px; margin: 14px 0 0; padding: 12px 28px; font-family: "Karla", sans-serif; font-size: 0.95rem; font-weight: 700; line-height: 1; text-transform: uppercase; color: #FFFFFF; background: #9E631E; border: 1px solid #9E631E; border-radius: 100px; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login button.button:hover, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register button.button:hover { color: #FFFFFF; background: #522A16; border-color: #522A16; } /* ========================================================= CREATE ACCOUNT LABEL ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register button.button { font-size: 0; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register button.button::after { content: "CREATE ACCOUNT"; font-size: 0.95rem; font-weight: 700; } /* ========================================================= LOST PASSWORD ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-LostPassword { margin: 7px 0 0; padding: 0; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-LostPassword a { font-family: "Karla", sans-serif; font-size: 0.95rem; font-weight: 400; color: #9E631E; text-decoration: underline; text-underline-offset: 3px; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-LostPassword a:hover { color: #522A16; } /* ========================================================= PRIVACY REGISTER ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register .woocommerce-privacy-policy-text { margin: 0 0 18px; padding: 0; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register .woocommerce-privacy-policy-text p { margin: 0; font-family: "Karla", sans-serif; font-size: 0.9rem; font-weight: 400; line-height: 1.45; color: #111111; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register .woocommerce-privacy-policy-link { color: #9E631E; text-decoration: underline; text-underline-offset: 3px; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register .woocommerce-privacy-policy-link:hover { color: #522A16; } /* ========================================================= JOIN THE PACK INTRO ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-intro { display: flex; flex-direction: column; flex: 1; width: 100%; } /* ========================================================= BENEFITS ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-benefits-list { display: flex; flex-direction: column; gap: 16px; margin: 0; padding: 0; list-style: none; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-benefits-list li { position: relative; margin: 0; padding: 0 0 0 31px; font-family: "Karla", sans-serif; font-size: 1.05rem; font-weight: 400; line-height: 1.4; color: #111111; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-benefits-list li::before { content: "✓"; position: absolute; top: 0; left: 0; font-size: 1.05rem; font-weight: 700; color: #9E631E; } /* ========================================================= SIGN UP ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-start { width: 100%; min-height: 48px; margin: auto 0 0; padding: 12px 28px; font-family: "Karla", sans-serif; font-size: 0.95rem; font-weight: 700; line-height: 1; text-transform: uppercase; color: #FFFFFF; background: #9E631E; border: 1px solid #9E631E; border-radius: 100px; cursor: pointer; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-start:hover { color: #FFFFFF; background: #522A16; border-color: #522A16; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-start:focus-visible { outline: 2px solid #522A16; outline-offset: 3px; } /* ========================================================= REGISTER OPEN ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-is-open form.register { display: flex; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.register .form-row:last-of-type { display: block; margin-top: 0; margin-bottom: 0; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce.bostie-register-form-open .u-columns { align-items: flex-start; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce.bostie-register-form-open .bostie-account-card { flex: none; } /* ========================================================= ========================================================= LOGGED IN — GENERAL LAYOUT ========================================================= ========================================================= */ /* ========================================================= GRID ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce { display: grid !important; grid-template-columns: minmax(230px, 270px) minmax(0, 1fr); column-gap: 32px; row-gap: 24px; align-items: start; width: 100%; } /* ========================================================= NOTICES ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .woocommerce-notices-wrapper { grid-column: 1 / -1; width: 100%; } /* ========================================================= NOTICE — BASE ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-message, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-info, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-error { position: relative; width: 100%; margin: 0 0 24px !important; padding: 16px 18px 16px 52px !important; font-family: "Karla", sans-serif; font-size: 1rem; font-weight: 500; line-height: 1.5; color: #522A16; background: #FDF9F1; border: 1px solid #CFCFCF !important; border-radius: 10px; box-shadow: none; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-message::before, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-info::before, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-error::before { position: absolute; top: 50%; left: 18px; margin: 0; font-size: 1.15rem; line-height: 1; transform: translateY(-50%); } /* ========================================================= NOTICE — SUCCESS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-message { border-color: #2E6B3B !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-message::before { color: #2E6B3B; } /* ========================================================= NOTICE — INFO ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-info { border-color: #9E631E !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-info::before { color: #9E631E; } /* ========================================================= NOTICE — ERROR ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-error { border-color: #8B2E2E !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-error::before { color: #8B2E2E; } /* ========================================================= NOTICE LINKS / BUTTONS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-message a, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-info a, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-error a { font-weight: 700; color: #522A16; text-decoration: underline; text-underline-offset: 3px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-message a:hover, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-info a:hover, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-error a:hover { color: #9E631E; } /* ========================================================= NOTICE — FOCUS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-message:focus, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-info:focus, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-error:focus { outline: 2px solid #522A16; outline-offset: 3px; } /* ========================================================= NAVIGATION ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation { grid-column: 1; grid-row: 2; float: none !important; clear: none !important; width: 100% !important; margin: 0 !important; padding: 14px; border: 1px solid #9E631E; border-radius: 1em; background: #F9EED9; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation ul { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation li { margin: 0; padding: 0; list-style: none; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation li a { display: block; width: 100%; padding: 13px 16px; font-family: "Karla", sans-serif; font-size: 1rem; font-weight: 500; line-height: 1.3; color: #522A16; text-decoration: none; border-radius: 8px; transition: background-color 0.2s ease, color 0.2s ease; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation li a:hover { color: #522A16; background: rgba(158, 99, 30, 0.10); } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation li.is-active a { font-weight: 700; color: #FFFFFF; background: #9E631E; } /* ========================================================= LOGOUT ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--customer-logout { margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(82, 42, 22, 0.18); } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--customer-logout a { color: #522A16; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--customer-logout a:hover { color: #FFFFFF; background: #522A16; } /* ========================================================= CONTENT CARD ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content { grid-column: 2; grid-row: 2; float: none !important; clear: none !important; width: 100% !important; min-width: 0; margin: 0 !important; padding: 32px 36px; font-family: "Karla", sans-serif; color: #111111; background: #FFFFFF; border: 1px solid rgba(158, 99, 30, 0.55); border-radius: 1em; } /* ========================================================= CONTENT TYPOGRAPHY ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content p { margin-top: 0; font-family: "Karla", sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.6; color: #111111; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content h2, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content h3 { font-family: "Lora", serif; font-weight: 600; color: #522A16; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content h2 { margin: 0 0 20px; font-size: 1.65rem; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content h3 { margin: 24px 0 12px; font-size: 1.25rem; } /* ========================================================= CONTENT LINKS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content a { color: #9E631E; text-decoration: underline; text-underline-offset: 3px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content a:hover { color: #522A16; } /* ========================================================= MY PAW PICKS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-paw-picks-placeholder { width: 100%; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-paw-picks-placeholder h2 { margin-top: 0; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-paw-picks-placeholder p { margin-bottom: 0; } /* ========================================================= TABLES ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content table { width: 100%; border-collapse: collapse; font-family: "Karla", sans-serif; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content table th { padding: 12px; font-weight: 700; text-align: left; color: #522A16; border-bottom: 1px solid #9E631E; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content table td { padding: 12px; color: #111111; border-bottom: 1px solid #E5E5E5; } /* ========================================================= ACCOUNT BUTTONS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content .button, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content button.button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 11px 22px; font-family: "Karla", sans-serif; font-size: 0.95rem; font-weight: 700; line-height: 1; text-align: center; vertical-align: middle; color: #FFFFFF; background: #9E631E; border: 1px solid #9E631E; border-radius: 100px; text-decoration: none; cursor: pointer; appearance: none; -webkit-appearance: none; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content .button:hover, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content button.button:hover { color: #FFFFFF; background: #522A16; border-color: #522A16; } /* ========================================================= ACCOUNT INPUTS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content input.input-text, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content input[type="text"], body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content input[type="email"], body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content input[type="password"], body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content input[type="tel"], body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content input[type="number"], body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content input[type="date"], body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content select, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content textarea { width: 100%; min-height: 48px; padding: 10px 14px; font-family: "Karla", sans-serif; font-size: 1rem; color: #111111; background: #FFFFFF; border: 1px solid #CFCFCF; border-radius: 6px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content input:focus, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content select:focus, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content textarea:focus { outline: none; border-color: #9E631E; box-shadow: 0 0 0 2px rgba(158, 99, 30, 0.16); } /* ========================================================= ACCOUNT DETAILS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm { width: 100%; } /* First name / Last name remain side by side on desktop */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row--first, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row--last { width: calc(50% - 12px); } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row--first { float: left; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row--last { float: right; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm::after { content: ""; display: table; clear: both; } /* Help text under Display name */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm em { display: block; margin-top: 8px; font-family: "Karla", sans-serif; font-size: 0.92rem; font-weight: 400; line-height: 1.45; color: #522A16; } /* Password section */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm fieldset { width: 100%; margin: 34px 0 0; padding: 30px 0 0; border: 0; border-top: 1px solid rgba(158, 99, 30, 0.25); background: transparent; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm fieldset legend { width: 100%; margin: 0 0 24px; padding: 0; font-family: "Lora", serif; font-size: 1.45rem; font-weight: 600; line-height: 1.2; color: #522A16; } /* Password inputs keep the WooCommerce eye toggle */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .password-input { display: block; width: 100%; } /* Save changes spacing */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm button[name="save_account_details"] { margin-top: 28px !important; } /* ========================================================= ACCOUNT DETAILS — FIELD SPACING ========================================================= */ /* Force a compact vertical stack, overriding WooCommerce/theme spacing */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row { display: flex !important; flex-direction: column !important; gap: 4px !important; margin: 0 0 12px !important; padding: 0 !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row > label { display: block !important; margin: 0 !important; padding: 0 !important; line-height: 1.25 !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row input, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row select, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row textarea, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row .password-input { margin: 0 !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm > p > em, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row > span.description, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row > em { margin-top: 2px !important; margin-bottom: 2px !important; } /* Password fields use the same compact rhythm */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm fieldset { margin-top: 24px; padding-top: 24px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm fieldset legend { margin-bottom: 14px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm fieldset .woocommerce-form-row { gap: 4px !important; margin-bottom: 12px !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm fieldset .woocommerce-form-row:last-child { margin-bottom: 0 !important; } /* ========================================================= ACCOUNT DETAILS — RESPONSIVE ========================================================= */ @media (max-width: 767px) { body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row--first, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm .woocommerce-form-row--last { float: none; width: 100%; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm fieldset { margin-top: 28px; padding-top: 26px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm fieldset legend { font-size: 1.3rem; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-EditAccountForm button[name="save_account_details"] { margin-top: 24px !important; } } /* ========================================================= ========================================================= ADDRESSES ========================================================= ========================================================= */ /* ========================================================= INTRO TEXT ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content .woocommerce-Addresses + p, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content > p:first-child { margin-bottom: 24px; } /* ========================================================= ADDRESSES GRID ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses.col2-set { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; width: 100%; margin: 0; } /* WooCommerce usa ::before e ::after per il clearfix. In un contenitore CSS Grid diventano grid item e spostano Billing e Shipping su celle/righe sbagliate. */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses.col2-set::before, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses.col2-set::after { display: none !important; content: none !important; } /* ========================================================= ADDRESS COLUMN ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .col-1, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .col-2 { float: none !important; clear: none !important; width: 100% !important; max-width: none !important; min-width: 0; margin: 0 !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address { padding: 0 32px 0 0; } /* ========================================================= SECOND COLUMN ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address:nth-of-type(2), body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .u-column2 { padding: 0 0 0 32px; border-left: 1px solid rgba(158, 99, 30, 0.22); } /* ========================================================= ADDRESS TITLE AREA ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address-title { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; width: 100%; margin: 0 0 18px; padding: 0; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address-title::before { display: none !important; content: none !important; } /* ========================================================= FLORIDA SHIPPING NOTICE ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address:nth-of-type(2) address::after, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .u-column2 address::after { content: "We're currently shipping within Florida only.\A More states coming soon."; display: block; width: 100%; margin: 18px 0 0; padding: 12px 14px; white-space: pre-line; font-family: "Karla", sans-serif; font-size: 0.9rem; font-weight: 400; line-height: 1.45; color: #522A16; background: #F9EED9; border: 1px solid rgba(158, 99, 30, 0.55); border-radius: 8px; } /* ========================================================= ADDRESS TITLES ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address-title h2 { float: none !important; width: 100%; margin: 0; padding: 0; font-family: "Lora", serif; font-size: 1.65rem; font-weight: 600; line-height: 1.2; color: #522A16; } /* ========================================================= EDIT / ADD ADDRESS LINKS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address-title .edit { position: static !important; float: none !important; clear: none !important; display: inline-flex; align-items: center; width: auto; margin: 0; padding: 0; font-family: "Karla", sans-serif; font-size: 0.95rem; font-weight: 600; line-height: 1.3; color: #9E631E; text-decoration: underline; text-underline-offset: 3px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address-title .edit:hover { color: #522A16; } /* ========================================================= ADDRESS CONTENT ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses address { margin: 0; padding: 0; font-family: "Karla", sans-serif; font-size: 1rem; font-style: normal; font-weight: 400; line-height: 1.6; color: #111111; } /* ========================================================= ADDRESS — CUSTOMER NAME ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses address::first-line { font-weight: 700; } /* ========================================================= EMPTY ADDRESS MESSAGE ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses address p, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address address { text-align: left; } /* ========================================================= TABLET ========================================================= */ @media (max-width: 1024px) { body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address { padding-right: 24px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address:nth-of-type(2), body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .u-column2 { padding-left: 24px; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 767px) { body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses.col2-set { grid-template-columns: 1fr; gap: 28px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .col-1, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .col-2 { width: 100% !important; padding: 0; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address:nth-of-type(2), body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .u-column2 { padding-top: 28px; border-top: 1px solid rgba(158, 99, 30, 0.22); border-left: 0; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-Addresses .woocommerce-Address-title h2 { font-size: 1.45rem; } } /* ========================================================= ========================================================= MY DOGS ========================================================= ========================================================= */ /* ========================================================= MY DOGS WRAPPER ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-dogs { width: 100%; } /* ========================================================= HEADER ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-dogs-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; width: 100%; margin: 0 0 28px; } /* ========================================================= HEADER COPY ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-dogs-header-copy { min-width: 0; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-dogs-header-copy h2 { margin: 0 0 6px; font-family: "Lora", serif; font-size: 1.75rem; font-weight: 600; line-height: 1.2; color: #522A16; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-dogs-header-copy p { margin: 0; font-size: 1rem; line-height: 1.5; color: #111111; } /* ========================================================= ADD DOG BUTTON ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-add-dog-button { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-width: 140px; min-height: 48px; margin: 0 !important; padding: 11px 22px; line-height: 1; text-align: center; } /* ========================================================= EMPTY STATE ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-dogs-empty { padding: 32px; text-align: center; border: 1px dashed rgba(158, 99, 30, 0.50); border-radius: 1em; background: #F9EED9; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-dogs-empty p { margin: 0; color: #522A16; } /* ========================================================= DOG LIST ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; width: 100%; } /* ========================================================= DOG CARD ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-card { display: flex; flex-direction: column; min-width: 0; padding: 24px; border: 1px solid #9E631E; border-radius: 1em; background: #F9EED9; } /* ========================================================= DOG NAME ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-card > h3 { margin: 0 0 18px; font-family: "Lora", serif; font-size: 1.55rem; font-weight: 600; line-height: 1.2; color: #522A16; } /* ========================================================= DOG DETAILS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-card > p { margin: 0 0 7px; font-family: "Karla", sans-serif; font-size: 0.95rem; line-height: 1.45; color: #111111; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-card > p strong { font-weight: 600; color: #522A16; } /* ========================================================= DOG CARD ACTIONS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-card-actions { display: flex; align-items: stretch; gap: 12px; margin-top: auto; padding-top: 22px; } /* ========================================================= EDIT ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-card .bostie-edit-dog { display: inline-flex; align-items: center; justify-content: center; flex: 1 1 0; width: 100%; min-width: 0; min-height: 46px; margin: 0; padding: 10px 18px; line-height: 1; text-align: center; color: #FFFFFF; text-decoration: none; } /* ========================================================= DELETE FORM ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-dog-form { display: flex; flex: 1 1 0; margin: 0; padding: 0; } /* ========================================================= REMOVE BUTTON ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-remove-dog-button { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 46px; margin: 0; padding: 10px 18px; font-family: "Karla", sans-serif; font-size: 0.9rem; font-weight: 600; line-height: 1; text-align: center; color: #522A16; background: transparent; border: 1px solid rgba(82, 42, 22, 0.40); border-radius: 100px; cursor: pointer; appearance: none; -webkit-appearance: none; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-remove-dog-button:hover { color: #FFFFFF; background: #522A16; border-color: #522A16; } /* ========================================================= ADD / EDIT DOG FORM WRAPPER ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-add-dog-form-wrap { width: 100%; margin: 0 0 28px; padding: 28px; border: 1px solid #9E631E; border-radius: 1em; background: #F9EED9; } /* ========================================================= HIDDEN FORM ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-add-dog-form-wrap[hidden] { display: none !important; } /* ========================================================= FORM GRID ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-add-dog-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 24px; width: 100%; margin: 0; } /* ========================================================= DOG FIELD ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; } /* ========================================================= FIELD LABEL / LEGEND ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field > label, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field > legend { margin: 0; padding: 0; font-family: "Karla", sans-serif; font-size: 1rem; font-weight: 600; line-height: 1.3; color: #522A16; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field .required { color: #9E631E; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field .bostie-optional { font-size: 0.85rem; font-weight: 400; color: #666666; } /* ========================================================= MY DOGS INPUTS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field input[type="text"], body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field input[type="number"], body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field input[type="date"], body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field select { width: 100%; min-height: 48px; margin: 0; padding: 10px 14px; font-family: "Karla", sans-serif; font-size: 1rem; color: #111111; background: #FFFFFF; border: 1px solid #CFCFCF; border-radius: 6px; } /* ========================================================= MY DOGS INPUT FOCUS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field input:focus, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field select:focus { outline: none; border-color: #9E631E; box-shadow: 0 0 0 2px rgba(158, 99, 30, 0.16); } /* ========================================================= BIRTH FIELD ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-birth-field { grid-column: 1 / -1; display: flex; flex-direction: row; flex-wrap: wrap; gap: 10px 24px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-birth-field > legend { flex-basis: 100%; margin-bottom: 2px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-birth-field > label { display: inline-flex; align-items: center; gap: 7px; font-weight: 400; color: #111111; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-birth-field input[type="radio"] { width: 16px; height: 16px; margin: 0; accent-color: #9E631E; } /* ========================================================= PERSONALITY ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-personality { grid-column: 1 / -1; } /* ========================================================= PERSONALITY HELP ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-field-help { margin: 0 0 6px !important; font-size: 0.9rem !important; line-height: 1.4 !important; color: #666666 !important; } /* ========================================================= PERSONALITY OPTIONS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-personality-options { display: flex; flex-wrap: wrap; gap: 10px; } /* ========================================================= PERSONALITY CHIP ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-personality-options label { display: inline-flex; align-items: center; gap: 7px; margin: 0; padding: 9px 13px; font-family: "Karla", sans-serif; font-size: 0.9rem; font-weight: 500; line-height: 1; color: #522A16; background: #FFFFFF; border: 1px solid rgba(158, 99, 30, 0.40); border-radius: 100px; cursor: pointer; } /* ========================================================= PERSONALITY CHECKBOX ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-personality-options input[type="checkbox"] { width: 15px; height: 15px; margin: 0; accent-color: #9E631E; } /* ========================================================= FORM ACTIONS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-form-actions { grid-column: 1 / -1; display: flex; align-items: center; gap: 14px; margin-top: 8px; } /* ========================================================= SAVE DOG ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-form-actions button[type="submit"] { display: inline-flex; align-items: center; justify-content: center; min-width: 160px; min-height: 48px; margin: 0; padding: 11px 22px; line-height: 1; text-align: center; } /* ========================================================= CANCEL DOG ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-cancel-dog-button { display: inline-flex; align-items: center; justify-content: center; min-width: 160px; min-height: 48px; margin: 0; padding: 11px 22px; font-family: "Karla", sans-serif; font-size: 0.95rem; font-weight: 600; line-height: 1; text-align: center; color: #522A16; background: transparent; border: 1px solid rgba(82, 42, 22, 0.35); border-radius: 100px; cursor: pointer; appearance: none; -webkit-appearance: none; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-cancel-dog-button:hover { color: #FFFFFF; background: #522A16; border-color: #522A16; } /* ========================================================= ========================================================= TABLET ========================================================= ========================================================= */ @media (max-width: 1024px) { /* ---------- GUEST ---------- */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .u-columns { flex-direction: column; gap: 32px; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .u-column1, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .u-column2 { width: 100%; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-account-card { flex: none; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce form.login .form-row:last-of-type { margin-top: 14px; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-start { margin-top: 32px; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-intro::after { display: none; } /* ---------- LOGGED IN ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce { grid-template-columns: 1fr; gap: 24px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation { grid-column: 1; grid-row: auto; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content { grid-column: 1; grid-row: auto; } /* ---------- MY DOGS ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-list { grid-template-columns: 1fr; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-add-dog-form { grid-template-columns: 1fr; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-birth-field, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-personality, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-form-actions { grid-column: auto; } } /* ========================================================= ========================================================= MOBILE ========================================================= ========================================================= */ @media (max-width: 767px) { /* ---------- GUEST ---------- */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-account-card { padding: 24px 20px; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-account-card > h2 { margin-bottom: 24px; font-size: 1.3rem; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-benefits-list { gap: 13px; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-register-benefits-list li { font-size: 1rem; } /* ---------- ACCOUNT ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation { padding: 10px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-navigation li a { padding: 12px 14px; font-size: 0.95rem; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce-MyAccount-content { padding: 24px 20px; } /* ---------- MY DOGS HEADER ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-dogs-header { flex-direction: column; align-items: stretch; gap: 18px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-add-dog-button { width: 100%; } /* ---------- DOG CARD ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-card { padding: 20px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-card-actions { flex-direction: column; align-items: stretch; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-card .bostie-edit-dog, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-remove-dog-button { width: 100%; } /* ---------- FORM ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-add-dog-form-wrap { padding: 20px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-birth-field { flex-direction: column; gap: 10px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-personality-options { gap: 8px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-personality-options label { padding: 8px 11px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-form-actions { flex-direction: column; align-items: stretch; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-dog-form-actions button { width: 100%; } } /* ========================================================= DELETE ACCOUNT ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account { width: 100%; margin-top: 24px; padding-top: 18px; border-top: 1px solid rgba(139, 46, 46, 0.28); } /* ---------- TITLE ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account h3 { margin: 0 0 4px !important; font-family: "Lora", serif; font-size: 1.35rem; font-weight: 600; line-height: 1.25; color: #522A16; } /* ---------- INTRO ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account > p { width: 100%; margin: 0 0 18px !important; padding: 0 !important; font-family: "Karla", sans-serif; font-size: 0.95rem; font-weight: 400; line-height: 1.45; color: #522A16; } /* ---------- FORM ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-form { display: block !important; width: 100%; margin: 0 !important; padding: 0 !important; } /* ---------- PASSWORD ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-password { width: 100%; max-width: 520px; margin: 0 0 14px !important; padding: 0 !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-password label { display: block; margin: 0 0 5px !important; padding: 0; font-family: "Karla", sans-serif; font-size: 0.95rem; font-weight: 500; line-height: 1.3; color: #522A16; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-password input { display: block; width: 100% !important; min-height: 48px; margin: 0 !important; padding: 10px 14px !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-password input:focus { outline: none; border-color: #8B2E2E; box-shadow: 0 0 0 2px rgba(139, 46, 46, 0.14); } /* ---------- CONFIRMATION ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-confirm { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 9px !important; width: 100%; max-width: 760px; margin: 0 0 18px !important; padding: 0 !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-confirm input[type="checkbox"] { position: static !important; flex: 0 0 18px; width: 18px !important; height: 18px !important; min-width: 18px !important; min-height: 18px !important; margin: 0 !important; padding: 0 !important; transform: none !important; accent-color: #8B2E2E; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-confirm label { display: block !important; flex: 0 1 auto; width: auto !important; min-width: 0; margin: 0 !important; padding: 0 !important; font-family: "Karla", sans-serif; font-size: 0.92rem; font-weight: 400; line-height: 1.4; color: #522A16; } /* ---------- DELETE BUTTON ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-button { display: inline-flex !important; align-items: center; justify-content: center; width: auto !important; min-height: 46px; margin: 0 !important; padding: 10px 20px; font-family: "Karla", sans-serif; font-size: 0.92rem; font-weight: 700; line-height: 1; color: #8B2E2E; background: transparent; border: 1px solid #8B2E2E; border-radius: 100px; cursor: pointer; transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-button:hover { color: #FFFFFF; background: #8B2E2E; border-color: #8B2E2E; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-button:focus-visible { outline: 2px solid #8B2E2E; outline-offset: 3px; } /* ---------- MOBILE ---------- */ @media (max-width: 767px) { body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account { margin-top: 20px; padding-top: 16px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account > p { margin-bottom: 16px !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-password { max-width: none; margin-bottom: 14px !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-confirm { align-items: flex-start !important; margin-bottom: 16px !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-confirm input[type="checkbox"] { margin-top: 2px !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-delete-account-button { width: 100% !important; } } /* ========================================================= MY PAW PICKS ========================================================= */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks { width: 100%; } /* ---------- HEADER ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-header { margin: 0 0 24px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-header h2 { margin: 0 0 6px !important; font-family: "Lora", serif; font-size: 1.55rem; font-weight: 600; line-height: 1.25; color: #522A16; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-header p { margin: 0 !important; font-family: "Karla", sans-serif; font-size: 0.95rem; line-height: 1.45; color: #222222; } /* ---------- GRID ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; width: 100%; } /* ---------- CARD ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-card { position: relative; display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 0; background: #FFFFFF; border: 1px solid rgba(158, 99, 30, 0.28); border-radius: 16px; overflow: hidden; box-shadow: none; } /* ---------- MEDIA ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-media { position: relative; width: 100%; aspect-ratio: 4 / 3; margin: 0; padding: 0; background: #FDF9F1; overflow: hidden; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-media > a, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-media .bostie-paw-media-pawpick, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-media .bostie-paw-viewer-trigger { display: block; width: 100%; height: 100%; margin: 0; padding: 0; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-media img { display: block; width: 100% !important; height: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; object-fit: cover; object-position: center; } /* ---------- CONTENT ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-card-content { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; padding: 18px; } /* ---------- META ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-meta { display: flex; align-items: center; gap: 8px; width: 100%; margin: 0 0 12px; padding: 0; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-meta .bostie-paw-dynamic-type-icon { display: block; width: 22px !important; height: 22px !important; min-width: 22px; margin: 0 !important; object-fit: contain; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-meta time { margin: 0; padding: 0; font-family: "Karla", sans-serif; font-size: 0.72rem; font-weight: 600; line-height: 1.2; letter-spacing: 0.04em; text-transform: uppercase; color: #522A16; } /* ---------- ARTICLE TITLE ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-title { margin: 0 0 10px !important; font-family: "Lora", serif; font-size: 1.2rem; font-weight: 600; line-height: 1.3; color: #522A16; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-title a { color: #522A16; text-decoration: none; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-title a:hover { color: #9E631E; } /* ---------- EXCERPT ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-excerpt { margin: 0 0 18px !important; font-family: "Karla", sans-serif; font-size: 0.92rem; font-weight: 400; line-height: 1.55; color: #222222; } /* ---------- ACTION BAR ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions { width: 100%; margin-top: auto; padding-top: 14px; border-top: 1px solid rgba(82, 42, 22, 0.12); } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-actions { display: flex; align-items: center; justify-content: space-between; width: 100%; margin: 0; padding: 0; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action { position: relative; display: inline-flex !important; align-items: center; justify-content: center; width: 36px !important; height: 36px !important; margin: 0 !important; padding: 0 !important; color: #522A16 !important; background: transparent !important; border: 0 !important; border-radius: 50% !important; box-shadow: none !important; text-decoration: none !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action__icon { display: block; width: 21px; height: 21px; flex: 0 0 21px; background-color: currentColor; -webkit-mask-image: var(--bostie-icon-url); mask-image: var(--bostie-icon-url); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action--like .bostie-paw-action__icon, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action--bookmark .bostie-paw-action__icon { position: absolute; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action__icon--normal { opacity: 1; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action__icon--active { opacity: 0; color: #9E631E; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action--like.is-active .bostie-paw-action__icon--normal, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action--bookmark.is-active .bostie-paw-action__icon--normal, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action--like[aria-pressed="true"] .bostie-paw-action__icon--normal, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action--bookmark[aria-pressed="true"] .bostie-paw-action__icon--normal { opacity: 0; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action--like.is-active .bostie-paw-action__icon--active, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action--bookmark.is-active .bostie-paw-action__icon--active, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action--like[aria-pressed="true"] .bostie-paw-action__icon--active, body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action--bookmark[aria-pressed="true"] .bostie-paw-action__icon--active { opacity: 1; color: #9E631E; } @media (hover: hover) { body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-actions .bostie-paw-action:hover { color: #9E631E !important; } } /* ---------- EMPTY STATE ---------- */ body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-empty { padding: 30px; text-align: center; background: #FDF9F1; border: 1px solid rgba(158, 99, 30, 0.28); border-radius: 16px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-empty p { margin: 0 0 16px !important; font-family: "Karla", sans-serif; font-size: 1rem; line-height: 1.5; color: #522A16; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-browse { display: inline-flex !important; align-items: center; justify-content: center; min-height: 44px; padding: 10px 20px !important; font-family: "Karla", sans-serif; font-size: 0.9rem; font-weight: 700; color: #FFFFFF !important; background: #9E631E !important; border: 1px solid #9E631E !important; border-radius: 999px !important; text-decoration: none !important; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-browse:hover { color: #FFFFFF !important; background: #522A16 !important; border-color: #522A16 !important; } /* ========================================================= MY PAW PICKS — TABLET ========================================================= */ @media (max-width: 1024px) { body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-grid { gap: 18px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-card-content { padding: 16px; } } /* ========================================================= MY PAW PICKS — MOBILE ========================================================= */ @media (max-width: 767px) { body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-header { margin-bottom: 20px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-grid { grid-template-columns: 1fr; gap: 18px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-media { aspect-ratio: 4 / 3; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-card-content { padding: 16px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-title { font-size: 1.12rem; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-empty { padding: 24px 18px; } body.logged-in .elementor-120 .elementor-element.elementor-element-68e0c9f4 .bostie-my-paw-picks-browse { width: 100%; } } /* ========================================================= ========================================================= GUEST — LOST / RESET PASSWORD ========================================================= ========================================================= */ /* ========================================================= WRAPPER ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword { display: flex; flex-direction: column; width: 100%; max-width: 590px; margin: 0 auto !important; padding: 28px 32px !important; font-family: "Karla", sans-serif; color: #111111; background: #F9EED9; border: 1px solid #9E631E; border-radius: 1em; } /* ========================================================= INTRO TEXT ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword > p:first-child { margin: 0 0 24px !important; padding: 0; font-family: "Karla", sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.55; color: #111111; } /* ========================================================= FORM ROWS ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword .form-row { display: flex !important; flex-direction: column !important; float: none !important; clear: both !important; width: 100% !important; margin: 0 0 18px !important; padding: 0 !important; } /* ========================================================= LABELS ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword .form-row > label { display: block; width: 100%; margin: 0 0 6px !important; padding: 0; font-family: "Karla", sans-serif; font-size: 1.05rem; font-weight: 500; line-height: 1.15; color: #111111; } /* ========================================================= PASSWORD WRAPPER ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword .password-input { display: block; width: 100%; margin: 0; padding: 0; } /* ========================================================= INPUTS ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword input.input-text, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword input[type="text"], body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword input[type="email"], body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword input[type="password"] { display: block; width: 100% !important; min-height: 50px; margin: 0 !important; padding: 10px 14px; font-family: "Karla", sans-serif; font-size: 1rem; line-height: 1.4; color: #111111; background: #FFFFFF; border: 1px solid #CFCFCF; border-radius: 6px; transition: border-color 0.2s ease, box-shadow 0.2s ease; } /* ========================================================= INPUT FOCUS ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword input:focus { outline: none; border-color: #9E631E; box-shadow: 0 0 0 2px rgba(158, 99, 30, 0.16); } /* ========================================================= SUBMIT ROW ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword .form-row:last-of-type { margin: 4px 0 0 !important; } /* ========================================================= BUTTON ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword button.button { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 48px; margin: 0 !important; padding: 12px 28px; font-family: "Karla", sans-serif; font-size: 0.95rem; font-weight: 700; line-height: 1; text-align: center; text-transform: uppercase; color: #FFFFFF; background: #9E631E; border: 1px solid #9E631E; border-radius: 100px; cursor: pointer; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword button.button:hover { color: #FFFFFF; background: #522A16; border-color: #522A16; } /* ========================================================= PASSWORD EYE ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword .show-password-input { top: 50%; transform: translateY(-50%); } /* ========================================================= CLEAR FLOATS / WOOCOMMERCE LEGACY ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword::before, body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword::after { display: none !important; content: none !important; } /* ========================================================= TABLET ========================================================= */ @media (max-width: 1024px) { body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword { max-width: 590px; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 767px) { body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword { max-width: none; padding: 24px 20px !important; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce > form.woocommerce-ResetPassword > p:first-child { margin-bottom: 20px !important; } } /* ========================================================= ========================================================= GUEST — PASSWORD RESET CONFIRMATION ========================================================= ========================================================= */ /* ========================================================= CONFIRMATION WRAPPER ========================================================= */ /* * Quando WooCommerce ha appena inviato l'email di reset, * il notice e il testo di conferma sono figli diretti * del wrapper .woocommerce. */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce:has( .woocommerce-message + .woocommerce-form-login-toggle ), body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce:has( .woocommerce-message + p ) { font-family: "Karla", sans-serif; } /* ========================================================= SUCCESS NOTICE ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .woocommerce-message { position: relative; width: 100%; max-width: 590px; margin: 0 auto !important; padding: 18px 20px 18px 52px !important; font-family: "Karla", sans-serif; font-size: 1rem; font-weight: 600; line-height: 1.45; color: #522A16; background: #F9EED9; border: 1px solid #9E631E !important; border-radius: 1em; box-shadow: none; } /* WooCommerce success icon */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .woocommerce-message::before { position: absolute; top: 50%; left: 20px; margin: 0; color: #522A16; transform: translateY(-50%); } /* ========================================================= CONFIRMATION TEXT ========================================================= */ body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .woocommerce-message + p { width: 100%; max-width: 590px; margin: 18px auto 0 !important; padding: 0 4px; font-family: "Karla", sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.55; color: #111111; } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 767px) { body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .woocommerce-message { max-width: none; padding: 16px 18px 16px 48px !important; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .woocommerce-message::before { left: 18px; } body:not(.logged-in) .elementor-120 .elementor-element.elementor-element-68e0c9f4 .woocommerce .woocommerce-message + p { max-width: none; margin-top: 16px !important; padding: 0; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-ccb53e2 *//* ========================================================= BOSTIE BUBBLES — ACCOUNT PEEKING DOG ========================================================= */ /* ========================================================= POSIZIONAMENTO ========================================================= */ .elementor-120 .elementor-element.elementor-element-ccb53e2 { position: absolute !important; /* * Mantiene il cane ancorato al bordo sinistro * del viewport, indipendentemente dalla * larghezza del container principale. */ left: calc((100vw - 100%) / -2) !important; /* * Posizione verticale. */ bottom: -10px !important; /* * Determina quanta parte del cane * rimane fuori dal viewport. */ transform: translateX(-28%); /* * Il cane rimane sopra allo sfondo * ma sotto alle card. */ z-index: 1; /* * L'immagine è decorativa e non deve * interferire con click o selezioni. */ pointer-events: none; user-select: none; } /* ========================================================= UTENTE LOGGATO Nasconde il cane nel frontend ========================================================= */ body.logged-in:not(.elementor-editor-active) .bostie-account-dog { display: none !important; }/* End custom CSS */