/*! Кошик, оформлення та підтвердження замовлення — стилі погодженого макета svitlo-checkout. Правила обмежені .svl-checkout: класи .main, .total, .product, .summary, .steps надто загальні, щоб лишати їх без обгортки. */ .svl-checkout{--black:#0b0f10;--ink:#171a19;--grey:#777b78;--line:#e1e2de; --orange:#f5a000;--pale:#fff7e6;--green:#54a46e;--radius:0; color:var(--ink);color-scheme:light;background:#fff} .svl-checkout *{color-scheme:light} body.woocommerce-cart,body.woocommerce-checkout,body.woocommerce-order-received{background:#fff;color:#171a19} .svl-checkout .wrap{width:min(1120px,100% - 56px);margin:0 auto}.svl-checkout .utility .wrap{justify-content:space-between;align-items:center;width:100%;max-width:none;height:100%;display:flex}.svl-checkout .main{padding:28px 0 74px}.svl-checkout .crumbs{color:#8c908d;align-items:center;gap:18px;margin-bottom:38px;font-size:10px;display:flex}.svl-checkout .crumbs a{align-items:center;gap:5px;display:flex}.svl-checkout .crumbs span:before{content:"·";margin-right:18px}.svl-checkout .title-row{border-bottom:1px solid var(--line);justify-content:space-between;align-items:flex-end;margin-bottom:34px;padding-bottom:28px;display:flex}.svl-checkout .eyebrow{color:var(--orange);letter-spacing:.29em;margin:0 0 14px;font-size:9px}.svl-checkout .title-row h1{letter-spacing:-.045em;margin:0;font-size:48px;font-weight:350;line-height:.98}.svl-checkout .steps{color:#9a9d9a;letter-spacing:.08em;align-items:center;gap:10px;margin-bottom:4px;font-size:9px;display:flex}.svl-checkout .steps span{white-space:nowrap;align-items:center;gap:4px;display:flex}.svl-checkout .steps .done{color:var(--green)}.svl-checkout .steps .done svg{background:var(--green);color:#fff;border-radius:50%;padding:2px}.svl-checkout .steps .active{color:var(--ink)}.svl-checkout .steps i{background:#d9dbd8;width:26px;height:1px;display:block}.svl-checkout .layout{grid-template-columns:minmax(0,1.32fr) minmax(360px,.68fr);align-items:start;gap:66px;display:grid}.svl-checkout .form section{border-bottom:1px solid var(--line);margin:0 0 38px;padding:0 0 38px}.svl-checkout .section-head{align-items:flex-start;gap:18px;margin-bottom:26px;display:flex}.svl-checkout .section-head>span{color:var(--orange);letter-spacing:.14em;padding-top:5px;font-size:9px}.svl-checkout .section-head h2{letter-spacing:-.02em;margin:0 0 5px;font-size:21px;font-weight:500}.svl-checkout .section-head p{color:#8a8e8b;margin:0;font-size:11px}.svl-checkout .field-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.svl-checkout .field{letter-spacing:.05em;flex-direction:column;gap:8px;font-size:10px;display:flex}.svl-checkout .field input,.svl-checkout .field select,.svl-checkout .field textarea{width:100%;color:var(--ink);background:#fff;border:0;border-bottom:1px solid #bfc2be;border-radius:0;outline:0;padding:12px 0;transition:border-color .2s}.svl-checkout .field input:focus,.svl-checkout .field select:focus,.svl-checkout .field textarea:focus{border-color:var(--orange)}.svl-checkout .field input::placeholder,.svl-checkout .field textarea::placeholder{color:#a4a7a4}.svl-checkout .field textarea{resize:vertical;min-height:76px}.svl-checkout .field>span small{color:#9a9d9a;margin-left:5px}.svl-checkout .select-shell{position:relative}.svl-checkout .select-shell select{appearance:none;color:#999c99;padding-right:22px}.svl-checkout .select-shell svg{color:var(--orange);pointer-events:none;position:absolute;top:50%;right:0;transform:translateY(-50%)}.svl-checkout .choice-list{border-top:1px solid var(--line);border-left:1px solid var(--line);grid-template-columns:1fr 1fr;gap:0;display:grid}.svl-checkout .choice{border-right:1px solid var(--line);border-bottom:1px solid var(--line);cursor:pointer;background:#fff;align-items:center;gap:12px;min-height:76px;padding:15px;transition:background .2s,border-color .2s;display:flex}.svl-checkout .choice.selected{background:var(--pale);box-shadow:inset 0 0 0 1px var(--orange)}.svl-checkout .choice>svg{color:#595d5a;flex:none}.svl-checkout .choice.selected>svg{color:var(--orange)}.svl-checkout .choice>span{flex-direction:column;gap:5px;display:flex}.svl-checkout .choice small{color:#858985;font-size:9px;line-height:1.35}.svl-checkout .choice em{color:#1662a1;margin-left:auto;font-size:9px;font-weight:700}.svl-checkout .portmone-choice{object-fit:contain;width:86px;height:auto;margin-left:auto}.svl-checkout .delivery-fields{margin-top:22px}.svl-checkout .payments{grid-template-columns:1fr}.svl-checkout .payments .choice{min-height:68px}.svl-checkout .note{margin-top:24px}.svl-checkout .agree{color:#777b78;cursor:pointer;align-items:flex-start;gap:10px;font-size:10px;line-height:1.45;display:flex}.svl-checkout .agree a{color:var(--ink);border-bottom:1px solid #999}.svl-checkout .submit{background:var(--black);color:#fff;cursor:pointer;border:0;border-radius:0;justify-content:space-between;align-items:center;width:100%;height:57px;margin-top:22px;padding:0 21px;display:flex}.svl-checkout .submit span{font-size:12px;font-weight:700}.svl-checkout .submit strong{color:var(--orange);font-size:15px}.svl-checkout .submit:hover{background:#1b1f20}.svl-checkout .safe{color:#999c99;justify-content:center;gap:6px;margin:11px 0 0;font-size:9px;display:flex}.svl-checkout .summary{border-top:3px solid var(--orange);background:#f7f7f5;padding:27px 28px;position:sticky;top:20px}.svl-checkout .summary-top{justify-content:space-between;align-items:baseline;margin-bottom:20px;display:flex}.svl-checkout .summary-top h2{margin:0;font-size:17px;font-weight:500}.svl-checkout .summary-top a{color:#777;border-bottom:1px solid #aaa;font-size:9px}.svl-checkout .product{border-bottom:1px solid #d9dbd8;grid-template-columns:142px 1fr;gap:16px;padding-bottom:24px;display:grid}.svl-checkout .product-img{background:#111;height:122px;overflow:hidden}.svl-checkout .product-img img{object-fit:cover;width:100%;height:100%}.svl-checkout .product-info{flex-direction:column;min-width:0;display:flex}.svl-checkout .product-info>p{letter-spacing:.14em;color:var(--green);margin:0 0 8px;font-size:8px}.svl-checkout .product-info h3{margin:0 0 5px;font-size:12px;font-weight:500;line-height:1.32}.svl-checkout .product-info>small{color:#999;font-size:8px}.svl-checkout .product-info>div{color:#777;justify-content:space-between;align-items:flex-end;margin-top:auto;font-size:9px;display:flex}.svl-checkout .product-info>div strong{color:var(--ink);white-space:nowrap;font-size:12px}.svl-checkout .summary dl{border-bottom:1px solid #d9dbd8;gap:13px;margin:0;padding:21px 0;display:grid}.svl-checkout .summary dl div{justify-content:space-between;gap:15px;font-size:10px;display:flex}.svl-checkout .summary dt{color:#858985}.svl-checkout .summary dd{text-align:right;margin:0}.svl-checkout .total{justify-content:space-between;align-items:baseline;padding:21px 0;display:flex}.svl-checkout .total span{font-size:12px}.svl-checkout .total strong{color:var(--orange);font-size:23px}.svl-checkout .summary-note{border-top:1px solid #d9dbd8;padding-top:17px}.svl-checkout .summary-note span{letter-spacing:.17em;color:var(--orange);font-size:8px}.svl-checkout .summary-note p{color:#858985;margin:6px 0 0;font-size:9px;line-height:1.45}.svl-checkout .checkout-summary{color:var(--ink);border-top:3px solid var(--orange);background:#f4efe4;padding:0}.svl-checkout .checkout-summary .summary-top{margin-bottom:18px;padding:25px 27px 0}.svl-checkout .checkout-summary .summary-top a{color:#6f726f;border-color:#aaa89f}.svl-checkout .checkout-summary .product{border-color:#d8d1c4;padding:0 27px 24px;display:block}.svl-checkout .checkout-summary .product-img{background:#e8e0d2;height:220px;margin:0 -27px 20px}.svl-checkout .checkout-summary .product-info>p{color:var(--green)}.svl-checkout .checkout-summary .product-info h3{font-size:17px;line-height:1.25}.svl-checkout .checkout-summary .product-info>small{color:#85877f}.svl-checkout .checkout-summary .product-info>div{color:#74766f;margin-top:18px}.svl-checkout .checkout-summary .product-info>div strong{color:var(--ink);font-size:15px}.svl-checkout .checkout-summary dl{border-color:#d8d1c4;margin:0 27px}.svl-checkout .checkout-summary dt{color:#74766f}.svl-checkout .checkout-summary .total{margin:0 27px}.svl-checkout .checkout-summary .total strong{font-size:27px}.svl-checkout .checkout-summary .summary-note{border-color:#d8d1c4;margin:0 27px;padding:18px 0 25px}.svl-checkout .checkout-summary .summary-note p{color:#74766f}.svl-checkout .cart-title h1{font-size:52px}.svl-checkout .cart-layout{grid-template-columns:minmax(0,1.45fr) minmax(330px,.55fr);align-items:start;gap:64px;display:grid}.svl-checkout .cart-labels{border-bottom:1px solid var(--line);color:#999c99;letter-spacing:.14em;grid-template-columns:1fr 130px 120px;padding:0 42px 12px 0;font-size:9px;display:grid}.svl-checkout .cart-labels span:nth-child(2),.svl-checkout .cart-labels span:nth-child(3){text-align:center}.svl-checkout .cart-product{border-bottom:1px solid var(--line);grid-template-columns:1fr 130px 120px;align-items:center;padding:24px 42px 24px 0;display:grid;position:relative}.svl-checkout .cart-product-main{grid-template-columns:174px 1fr;align-items:center;gap:20px;display:grid}.svl-checkout .cart-product-image{background:#111;height:145px;overflow:hidden}.svl-checkout .cart-product-image img{object-fit:cover;width:100%;height:100%}.svl-checkout .stock{color:var(--green);letter-spacing:.13em;margin:0 0 8px;font-size:9px}.svl-checkout .cart-product-main h2{margin:0 0 7px;font-size:17px;font-weight:450;line-height:1.3}.svl-checkout .cart-product-main small{color:#999c99;font-size:9px}.svl-checkout .unit-price{display:none}.svl-checkout .quantity{border:1px solid var(--line);justify-self:center;align-items:center;display:flex}.svl-checkout .quantity button{cursor:pointer;background:#fff;border:0;place-items:center;width:34px;height:38px;display:grid}.svl-checkout .quantity span{text-align:center;width:35px;font-size:12px}.svl-checkout .line-total{justify-self:center;font-size:14px}.svl-checkout .remove{color:#aaa;cursor:pointer;background:0 0;border:0;position:absolute;top:50%;right:0;transform:translateY(-50%)}.svl-checkout .remove:hover{color:var(--orange)}.svl-checkout .continue-shopping{align-items:center;gap:8px;margin-top:20px;font-size:10px;display:inline-flex}.svl-checkout .continue-shopping svg{color:var(--orange);transform:rotate(180deg)}.svl-checkout .cart-total{border-top:3px solid var(--orange);background:#f7f7f5;padding:28px}.svl-checkout .cart-total h2{margin:0 0 24px;font-size:24px;font-weight:400}.svl-checkout .cart-total dl{border-bottom:1px solid #d9dbd8;gap:14px;margin:0;padding-bottom:22px;display:grid}.svl-checkout .cart-total dl div{justify-content:space-between;gap:18px;font-size:11px;display:flex}.svl-checkout .cart-total dt{color:#888}.svl-checkout .cart-total dd{text-align:right;margin:0}.svl-checkout .cart-submit{margin-top:0}.svl-checkout .cart-submit svg{color:var(--orange)}.svl-checkout .cart-delivery{border-top:1px solid #d9dbd8;gap:10px;margin-top:18px;padding-top:18px;display:flex}.svl-checkout .cart-delivery svg{color:var(--orange)}.svl-checkout .cart-delivery span{color:#888;flex-direction:column;gap:4px;font-size:9px;display:flex}.svl-checkout .cart-delivery strong{color:var(--ink);font-size:10px}.svl-checkout .success-main{padding-top:36px}.svl-checkout .success-steps{justify-content:center;margin-bottom:54px}.svl-checkout .success-hero{text-align:center;max-width:760px;margin:0 auto 58px}.svl-checkout .success-icon{border:1px solid var(--orange);width:62px;height:62px;color:var(--orange);place-items:center;margin:0 auto 20px;display:grid}.svl-checkout .success-hero>p:last-child{color:#777b78;margin:0;font-size:12px;line-height:1.6}.svl-checkout .success-layout{grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr);align-items:start;gap:64px;display:grid}.svl-checkout .success-details{border-top:1px solid var(--ink)}.svl-checkout .success-detail-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:18px 0;display:flex}.svl-checkout .success-detail-head h2{margin:0;font-size:18px;font-weight:450}.svl-checkout .success-detail-head span{color:#999;font-size:10px}.svl-checkout .success-product{border-bottom:1px solid var(--line);grid-template-columns:148px 1fr auto;align-items:center;gap:18px;padding:22px 0;display:grid}.svl-checkout .success-product img{object-fit:cover;background:#111;width:148px;height:124px}.svl-checkout .success-product h3{margin:0 0 6px;font-size:14px;font-weight:450;line-height:1.35}.svl-checkout .success-product small{color:#999;font-size:9px}.svl-checkout .success-product>strong{font-size:15px}.svl-checkout .success-order-lines{margin:0}.svl-checkout .success-order-lines>div{border-bottom:1px solid var(--line);grid-template-columns:160px 1fr;padding:16px 0;font-size:11px;line-height:1.5;display:grid}.svl-checkout .success-order-lines dt{color:#8b8e8b}.svl-checkout .success-order-lines dd{margin:0}.svl-checkout .success-total{justify-content:space-between;align-items:baseline;padding:22px 0;display:flex}.svl-checkout .success-total span{font-size:13px}.svl-checkout .success-total strong{color:var(--orange);font-size:24px}.svl-checkout .next-steps{border-top:3px solid var(--orange);background:#f7f7f5;padding:29px}.svl-checkout .next-steps h2{margin:0 0 26px;font-size:25px;font-weight:400;line-height:1.14}.svl-checkout .next-steps ol{gap:20px;margin:0;padding:0;list-style:none;display:grid}.svl-checkout .next-steps li{align-items:flex-start;gap:13px;display:flex}.svl-checkout .next-steps li>span{width:34px;height:34px;color:var(--orange);border:1px solid #d8dad7;flex:none;place-items:center;display:grid}.svl-checkout .next-steps li div{flex-direction:column;gap:5px;display:flex}.svl-checkout .next-steps li strong{font-size:11px}.svl-checkout .next-steps li small{color:#888;font-size:9px;line-height:1.4}.svl-checkout .work-time{border-top:1px solid #d9dbd8;border-bottom:1px solid #d9dbd8;gap:10px;margin-top:24px;padding:17px 0;display:flex}.svl-checkout .work-time svg{color:var(--orange);flex:none}.svl-checkout .work-time span{color:#888;flex-direction:column;gap:5px;font-size:9px;line-height:1.4;display:flex}.svl-checkout .work-time strong{color:var(--ink);font-size:10px}.svl-checkout .success-catalog{justify-content:center}.svl-checkout .support-link{text-align:center;color:#777;text-underline-offset:3px;margin-top:14px;font-size:9px;text-decoration:underline;display:block}.svl-checkout .crumbs{font-size:11px}.svl-checkout .eyebrow,.svl-checkout .steps{font-size:10px}.svl-checkout .section-head p{font-size:12px}.svl-checkout .field{font-size:11px}.svl-checkout .choice strong{font-size:12px}.svl-checkout .choice small,.svl-checkout .summary-top a,.svl-checkout .summary-note p{font-size:10px}.svl-checkout .product-info h3{font-size:13px}.svl-checkout .product-info>small,.svl-checkout .product-info>div,.svl-checkout .summary-note span{font-size:9px}.svl-checkout .summary dl div,.svl-checkout .footer-row>div{font-size:11px}.svl-checkout .success-hero>.eyebrow{color:#f7a51a;letter-spacing:.17em;margin-bottom:15px;font-size:15px;font-weight:650}.svl-checkout .section-head h2{font-size:23px}.svl-checkout .field{font-size:12px}.svl-checkout .field input,.svl-checkout .field select,.svl-checkout .field textarea{min-height:48px;font-size:15px}.svl-checkout .choice{min-height:82px;padding:17px}.svl-checkout .choice strong{font-size:13px}.svl-checkout .choice small{font-size:11px}.svl-checkout .success-steps{margin-bottom:42px}.svl-checkout .success-hero h1 span{display:block}.svl-checkout .success-message{color:#666a66;max-width:390px;margin:0 0 3px;font-size:14px;line-height:1.7}.svl-checkout .contact-section .section-head h2{font-size:24px}.svl-checkout .contact-section .field{gap:10px;font-size:13px}.svl-checkout .contact-section .field input{min-height:54px;padding:14px 0;font-size:16px}.svl-checkout .contact-section .field input::placeholder{color:#8d908c}.svl-checkout .contact-section .field{letter-spacing:0;color:var(--ink);font-size:14px;font-weight:500}.svl-checkout .contact-section .field input{font-size:16px;font-weight:400}.svl-checkout .success-hero{text-align:center;background:0 0;border-top:0;max-width:760px;margin:0 auto 58px;padding:0 0 12px}.svl-checkout .success-icon-modern{color:#111;background:#f7a51a;border:0;border-radius:50%;place-items:center;width:52px;height:52px;margin:0 auto 21px;display:grid}.svl-checkout .success-icon-modern svg{stroke-width:2.25px}.svl-checkout .success-order-label{color:#f7a51a;letter-spacing:.16em;margin:0 0 17px;font-size:16px;font-weight:650;display:block}.svl-checkout .success-hero h1{letter-spacing:-.05em;margin:0 0 19px;font-size:54px;font-weight:350;line-height:1}.svl-checkout .success-message{color:#777b78;margin:0;font-size:13px;line-height:1.65}@media (width<=1050px){.svl-checkout .layout{gap:36px}}@media (width<=760px){.svl-checkout .utility .wrap,.svl-checkout .header-row{width:calc(100% - 30px)}.svl-checkout .wrap{width:calc(100% - 30px)}.svl-checkout .utility .wrap{justify-content:center}.svl-checkout .main{padding-top:18px;padding-bottom:34px}.svl-checkout .crumbs{margin-bottom:24px;font-size:10px}.svl-checkout .crumbs span{display:none}.svl-checkout .title-row{border-bottom:0;margin-bottom:0;padding-bottom:21px;display:block}.svl-checkout .eyebrow{margin-bottom:10px;font-size:9px}.svl-checkout .title-row h1{font-size:34px;line-height:1}.svl-checkout .desktop-break{display:none}.svl-checkout .steps{border-top:1px solid var(--line);border-bottom:1px solid var(--line);justify-content:center;margin-top:23px;padding:13px 0;font-size:9px}.svl-checkout .steps i{width:18px}.svl-checkout .layout{flex-direction:column;gap:28px;display:flex}.svl-checkout .summary{border-top-width:2px;order:0;width:calc(100% + 30px);margin-left:-15px;padding:19px 15px 20px;position:static}.svl-checkout .form{order:1}.svl-checkout .summary-top{margin-bottom:14px}.svl-checkout .summary-top h2{font-size:16px}.svl-checkout .product{grid-template-columns:118px 1fr;gap:13px;padding-bottom:17px}.svl-checkout .product-img{height:102px}.svl-checkout .product-info h3{font-size:12px}.svl-checkout .summary dl{gap:10px;padding:15px 0}.svl-checkout .total{padding:16px 0}.svl-checkout .total strong{font-size:20px}.svl-checkout .summary-note{padding-top:13px}.svl-checkout .form section{margin-bottom:29px;padding-bottom:29px}.svl-checkout .section-head{gap:13px;margin-bottom:20px}.svl-checkout .section-head h2{font-size:19px}.svl-checkout .section-head p{font-size:11px}.svl-checkout .field-grid{grid-template-columns:1fr;gap:16px}.svl-checkout .field{font-size:11px}.svl-checkout .field input,.svl-checkout .field select,.svl-checkout .field textarea{min-height:46px;font-size:14px}.svl-checkout .choice-list{grid-template-columns:1fr}.svl-checkout .choice{min-height:68px;padding:13px}.svl-checkout .choice strong{font-size:13px}.svl-checkout .choice small{font-size:10px}.svl-checkout .delivery-fields{margin-top:19px}.svl-checkout .desktop-submit{margin-bottom:0}.svl-checkout .safe{text-align:center;font-size:9px}.svl-checkout .agree{font-size:11px}.svl-checkout .checkout-summary .product-img{height:180px}.svl-checkout .checkout-summary .product-info h3{font-size:15px}.svl-checkout .checkout-summary .summary-top{padding:20px 15px 0}.svl-checkout .checkout-summary .product{padding:0 15px 20px}.svl-checkout .checkout-summary dl,.svl-checkout .checkout-summary .total,.svl-checkout .checkout-summary .summary-note{margin-left:15px;margin-right:15px}.svl-checkout .cart-main{padding-top:24px}.svl-checkout .cart-title h1{font-size:38px}.svl-checkout .cart-layout{flex-direction:column;gap:25px;display:flex}.svl-checkout .cart-labels{display:none}.svl-checkout .cart-product{padding:18px 0 20px;display:block}.svl-checkout .cart-product-main{grid-template-columns:122px 1fr;gap:14px}.svl-checkout .cart-product-image{height:104px}.svl-checkout .cart-product-main h2{font-size:13px}.svl-checkout .unit-price{margin:9px 0 0;font-size:12px;display:block}.svl-checkout .quantity{position:absolute;bottom:18px;left:136px}.svl-checkout .line-total{display:none}.svl-checkout .remove{top:20px;right:0;transform:none}.svl-checkout .continue-shopping{font-size:11px}.svl-checkout .cart-total{border-top-width:2px;width:calc(100% + 30px);margin-left:-15px;padding:22px 15px}.svl-checkout .cart-total h2{font-size:22px}.svl-checkout .cart-total dl div{font-size:12px}.svl-checkout .cart-submit{display:flex}.svl-checkout .success-main{padding-top:24px}.svl-checkout .success-steps{margin:0 0 36px;padding:13px 0}.svl-checkout .success-hero{margin-bottom:38px}.svl-checkout .success-icon{width:54px;height:54px}.svl-checkout .success-hero h1{font-size:36px}.svl-checkout .success-hero>p:last-child{font-size:11px}.svl-checkout .success-layout{flex-direction:column;gap:25px;display:flex}.svl-checkout .success-details{width:100%}.svl-checkout .success-detail-head h2{font-size:16px}.svl-checkout .success-product{grid-template-columns:112px 1fr;gap:13px}.svl-checkout .success-product img{width:112px;height:96px}.svl-checkout .success-product h3{font-size:12px}.svl-checkout .success-product>strong{grid-column:2;font-size:14px}.svl-checkout .success-order-lines>div{grid-template-columns:105px 1fr;font-size:11px}.svl-checkout .next-steps{border-top-width:2px;width:calc(100% + 30px);margin-left:-15px;padding:23px 15px}.svl-checkout .next-steps h2{font-size:23px}.svl-checkout .next-steps li strong{font-size:12px}.svl-checkout .next-steps li small,.svl-checkout .work-time span{font-size:10px}.svl-checkout .success-catalog{display:flex}.svl-checkout .portmone-choice{width:78px}.svl-checkout .cart-site .quantity{width:max-content;margin:16px 0 0 136px;position:static}.svl-checkout .success-hero>.eyebrow{font-size:14px;line-height:1.35}.svl-checkout .section-head h2{font-size:21px}.svl-checkout .section-head p{font-size:12px}.svl-checkout .field{gap:9px;font-size:12px}.svl-checkout .field input,.svl-checkout .field select,.svl-checkout .field textarea{min-height:51px;font-size:15px}.svl-checkout .choice{min-height:76px;padding:15px}.svl-checkout .choice strong{font-size:14px}.svl-checkout .choice small{font-size:11px;line-height:1.45}.svl-checkout .agree{font-size:12px;line-height:1.5}.svl-checkout .success-main .success-hero{border-top-width:3px;width:calc(100% + 30px);margin-bottom:38px;margin-left:-15px;padding:28px 20px 32px}.svl-checkout .success-hero h1{letter-spacing:-.045em;font-size:40px;line-height:1}.svl-checkout .success-main .success-hero{background:0 0;border-top:0;padding:0 15px 8px}.svl-checkout .success-icon-modern{width:46px;height:46px;margin-bottom:18px}.svl-checkout .success-order-label{letter-spacing:.12em;margin-bottom:15px;font-size:14px}.svl-checkout .success-hero h1{margin-bottom:18px;font-size:38px;line-height:1.02}.svl-checkout .success-message{margin-top:0;font-size:13px;line-height:1.6}}.svl-checkout .success-main .success-hero{max-width:940px;padding:20px 24px 28px;position:relative;overflow:visible}.svl-checkout .success-icon-modern{color:#171817;background:#f7a51a;border-radius:50%;width:54px;height:54px;margin:0;animation:.65s cubic-bezier(.2,.8,.2,1) both successCheckIn;position:relative;box-shadow:0 12px 34px #f7a51a40}.svl-checkout .success-order-label{color:#df8e00;letter-spacing:.15em;background:#fffaf0;border:1px solid #f7a51a47;border-radius:999px;justify-content:center;align-items:center;margin:0 0 22px;padding:8px 14px 7px;font-size:13px;font-weight:600;display:inline-flex}.svl-checkout .success-main .success-hero h1{letter-spacing:-.052em;color:#171817;max-width:940px;margin:0 auto 22px;font-size:58px;font-weight:260;line-height:1.04;animation:.7s 80ms both successRise}.svl-checkout .success-main .success-hero h1 span{color:#f7a51a;font-weight:260}.svl-checkout .success-main .success-message{color:#6f736f;text-align:center;flex-direction:column;align-items:center;gap:3px;max-width:650px;margin:0 auto;font-size:14px;line-height:1.6;animation:.7s .16s both successRise;display:flex}.svl-checkout .success-message span{display:block}@media (width<=760px){.svl-checkout .success-main .success-hero{width:auto;margin:0 auto 40px;padding:6px 0 18px}.svl-checkout .success-icon-modern{width:48px;height:48px}.svl-checkout .success-order-label{letter-spacing:.12em;margin-bottom:18px;padding:7px 11px 6px;font-size:11px}.svl-checkout .success-main .success-hero h1{letter-spacing:-.048em;max-width:350px;margin-bottom:19px;font-size:40px;font-weight:260;line-height:1.03}.svl-checkout .success-main .success-hero h1 span{display:block}.svl-checkout .success-main .success-message{text-align:center;gap:5px;max-width:340px;font-size:13px;line-height:1.55}}@media (prefers-reduced-motion:reduce){.svl-checkout .success-icon-stage:before,.svl-checkout .success-orbit,.svl-checkout .success-icon-modern,.svl-checkout .success-main .success-hero h1,.svl-checkout .success-main .success-message{animation:none}}.svl-checkout .success-main .success-hero{text-align:center;max-width:900px;padding:14px 24px 30px}.svl-checkout .success-main .success-icon-modern{color:#f7a51a;width:46px;height:46px;box-shadow:none;background:#fff8eb;border:1px solid #f7a51a3d;border-radius:12px;margin:0 auto 22px;animation:none}.svl-checkout .success-main .success-icon-modern svg{stroke-width:1.8px}.svl-checkout .success-main .success-order-label{color:#f7a51a;letter-spacing:.16em;background:0 0;border:0;border-radius:0;margin:0 0 22px;padding:0;font-size:14px;font-weight:600}.svl-checkout .success-main .success-hero h1{color:#1b1c1b;letter-spacing:-.045em;max-width:none;margin:0 auto 22px;font-size:52px;font-weight:280;line-height:1.08;animation:none}.svl-checkout .success-main .success-hero h1 span{color:inherit;font-weight:inherit;display:inline}.svl-checkout .success-main .success-message{color:#727672;text-align:center;align-items:center;max-width:680px;margin:0 auto;font-size:14px;line-height:1.65;animation:none;display:flex}@media (width<=760px){.svl-checkout .success-main .success-hero{padding:4px 12px 20px}.svl-checkout .success-main .success-icon-modern{border-radius:11px;width:42px;height:42px;margin-bottom:19px}.svl-checkout .success-main .success-order-label{letter-spacing:.13em;margin-bottom:18px;font-size:12px}.svl-checkout .success-main .success-hero h1{max-width:360px;margin-bottom:19px;font-size:38px;font-weight:280;line-height:1.05}.svl-checkout .success-main .success-hero h1 span{display:block}.svl-checkout .success-main .success-message{text-align:center;gap:5px;max-width:345px;font-size:13px;line-height:1.58}}.svl-checkout .success-main .success-title{letter-spacing:-.045em;text-align:center;width:100%;max-width:100%;font-family:Segoe UI,Helvetica Neue,Arial,sans-serif;font-size:51px;font-weight:300;line-height:1.08}.svl-checkout .success-main .success-title span{font-family:inherit;font-weight:inherit}.svl-checkout .success-main .success-message{text-align:center;width:100%;max-width:100%;margin-left:auto;margin-right:auto;display:block}@media (width<=760px){.svl-checkout .success-main .success-title{letter-spacing:-.04em;max-width:360px;font-size:38px;font-weight:300;line-height:1.06}.svl-checkout .success-main .success-message{text-align:center;max-width:350px}.svl-checkout .success-product img{object-fit:contain;object-position:center;background:#111;padding:3px}.svl-checkout .checkout-summary .product-img{aspect-ratio:auto;background:#111;height:auto;min-height:0}.svl-checkout .checkout-summary .product-img img{object-fit:contain;object-position:center;background:#111;width:100%;height:auto;display:block}.svl-checkout .contact-section .section-head h2{font-size:22px}.svl-checkout .contact-section .field{font-size:13px}.svl-checkout .contact-section .field input{min-height:54px;font-size:16px}}@media (width<=370px){.svl-checkout .product{grid-template-columns:102px 1fr}.svl-checkout .product-img{height:90px}.svl-checkout .product-info h3{font-size:10px}.svl-checkout .steps{gap:6px}.svl-checkout .steps i{width:12px}} /* ================================================================ Стикування з WooCommerce ================================================================ */ .svl-checkout h1,.svl-checkout h2,.svl-checkout h3{color:var(--ink)} .svl-checkout h1,.svl-checkout h2,.svl-checkout h3,.svl-checkout p{text-wrap:initial} /* Повідомлення WooCommerce на світлому тлі. */ .svl-checkout .woocommerce-notices-wrapper,.woocommerce-notices-wrapper{max-width:1280px;margin:0 auto} .woocommerce-message,.woocommerce-info,.woocommerce-error{background:var(--pale,#fff7e6); border-left:3px solid var(--orange,#f5a000);color:#171a19;padding:14px 18px;margin:0 0 14px; list-style:none;font-size:13px} /* Поля WooCommerce у розмітці макета: підкреслення замість рамки. */ .svl-checkout .field input[type=text],.svl-checkout .field input[type=tel], .svl-checkout .field input[type=email],.svl-checkout .field input[type=number], .svl-checkout .field textarea{width:100%;background:0 0;border:0;border-bottom:1px solid var(--line); border-radius:0;padding:10px 0;font-size:14px;color:var(--ink);outline:0; box-shadow:none;min-height:0;height:auto} .svl-checkout .field input:focus,.svl-checkout .field textarea:focus{border-bottom-color:var(--orange)} .svl-checkout .field input::placeholder,.svl-checkout .field textarea::placeholder{color:#a7aba8} .svl-checkout .field textarea{resize:vertical;min-height:74px} /* Обов'язкова зірочка — як у макеті, без окремого кольору. */ .svl-checkout .field label .required,.svl-checkout abbr.required{color:inherit;text-decoration:none;border:0} /* Помилки валідації WooCommerce. */ .svl-checkout .woocommerce-invalid input,.svl-checkout .woocommerce-invalid textarea{border-bottom-color:#d1483a} .svl-checkout .field .svl-err{color:#d1483a;font-size:11px;margin:5px 0 0} /* Порожній кошик. */ .svl-checkout .cart-empty{padding:70px 0 90px;text-align:center} .svl-checkout .cart-empty h1{font-family:Manrope,Inter,sans-serif;font-weight:280; font-size:clamp(32px,3.4vw,46px);letter-spacing:-.04em;margin:0 0 12px} .svl-checkout .cart-empty p{color:var(--grey);margin:0 0 26px;font-size:14px} /* Кнопка «Оновити кошик» потрібна WooCommerce, але в макеті її немає: ховаємо візуально, лишаючи доступною з клавіатури й без JS. */ .svl-checkout .svl-update-cart{position:absolute;width:1px;height:1px;padding:0;margin:-1px; overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0} /* Поле кількості між «−» і «+»: у макеті це просто число. */ .svl-checkout .quantity input.qty{width:38px;text-align:center;background:0 0;border:0; color:inherit;font:inherit;padding:0;-moz-appearance:textfield;appearance:textfield} .svl-checkout .quantity input.qty::-webkit-outer-spin-button, .svl-checkout .quantity input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0} .svl-checkout .quantity button[disabled]{opacity:.35;cursor:default} .svl-checkout .cart-product .remove{display:inline-flex;align-items:center;justify-content:center} /* Тема загортає сторінки в
з темним тлом і зовнішнім .wrap на 1800px. Для кошика й оформлення це зайве: ширину задає власний .wrap макета (1120px). */ body.woocommerce-cart main.section, body.woocommerce-checkout main.section, body.woocommerce-order-received main.section{background:#fff;padding:0} body.woocommerce-cart main.section > .wrap, body.woocommerce-checkout main.section > .wrap, body.woocommerce-order-received main.section > .wrap{max-width:none;width:auto;padding:0;margin:0} /* Назва товару в кошику — звичайний текст, без підкреслення теми. */ .svl-checkout .cart-product h2 a{color:inherit;text-decoration:none} .svl-checkout .cart-product h2 a:hover{color:var(--orange)} /* Заголовок сторінки — розміром із макета: тема задає власний clamp. */ .svl-checkout .title-row h1,.svl-checkout .success-title{font-family:Manrope,Inter,sans-serif; font-size:48px;font-weight:350;letter-spacing:-.045em;line-height:.98;margin:0} @media (max-width:720px){.svl-checkout .title-row h1{font-size:34px}} /* «Продовжити покупки» — темний текст, як у макеті. */ .svl-checkout .continue-shopping{color:var(--ink);text-decoration:none} .svl-checkout .continue-shopping:hover{color:var(--orange)} /* Рідна кнопка WooCommerce нижче форми не потрібна — своя стоїть у смузі підтвердження, з тими самими name і value. */ .svl-checkout #place_order{display:none} /* ================================================================ Поля й блоки WooCommerce у світлій розмітці макета ================================================================ */ /* WooCommerce виводить поля як

, а тема фарбує всі поля темними. На цій сторінці вони світлі, з підкресленням. */ .svl-checkout .form-row{margin:0 0 4px;padding:0} .svl-checkout .field-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px 38px} .svl-checkout .field-grid > .form-row{margin:0} .svl-checkout .form-row label{display:block;color:var(--ink);font-size:12px;font-weight:600;margin:0 0 6px} .svl-checkout .form-row .required{color:inherit;text-decoration:none;border:0} .svl-checkout input[type=text],.svl-checkout input[type=tel], .svl-checkout input[type=email],.svl-checkout input[type=number], .svl-checkout input[type=search],.svl-checkout textarea, .svl-checkout .input-text{ width:100%;background:#fff!important;color:var(--ink)!important; border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0!important; padding:10px 0!important;font-size:14px;line-height:1.4;min-height:0;height:auto; box-shadow:none!important;outline:0} .svl-checkout input:focus,.svl-checkout textarea:focus{border-bottom-color:var(--orange)!important} .svl-checkout input::placeholder,.svl-checkout textarea::placeholder{color:#a7aba8} .svl-checkout textarea{resize:vertical;min-height:78px} .svl-checkout .woocommerce-invalid input,.svl-checkout .woocommerce-invalid textarea{border-bottom-color:#d1483a!important} /* Блок оплати: тема дає темний фон, у макеті він світлий. */ .svl-checkout .woocommerce-checkout-payment, .svl-checkout #payment{background:0 0!important;border:0;padding:0;border-radius:0} /* Купонів на проєкті немає — смуга «Маєте купон?» тільки заважає. */ .svl-checkout .woocommerce-form-coupon-toggle, .svl-checkout .checkout_coupon{display:none!important} /* Поля міста й відділення в кроці доставки — тим самим стилем. */ .svl-checkout .svl-field{margin:0 0 22px} .svl-checkout .svl-field label{display:block;font-size:12px;font-weight:600;margin:0 0 6px} /* ================================================================ Перебиваємо темні стилі форм із style.css ================================================================ Там правило `.woocommerce form .form-row input.input-text` іде з !important, тому світлий вигляд задаємо селектором на клас більше. */ .svl-checkout .checkout .form-row input.input-text, .svl-checkout .checkout .form-row textarea, .svl-checkout .checkout .form-row select, .svl-checkout .checkout .form-row input[type=text], .svl-checkout .checkout .form-row input[type=tel], .svl-checkout .checkout .form-row input[type=email], .svl-checkout .checkout .svl-field input, .svl-checkout .checkout .svl-field textarea{ height:auto!important;min-height:0!important; background:#fff!important;color:var(--ink)!important; border:0!important;border-bottom:1px solid var(--line)!important; border-radius:0!important;padding:10px 0!important;font-size:14px!important; box-shadow:none!important} .svl-checkout .checkout .form-row input.input-text:focus, .svl-checkout .checkout .form-row textarea:focus, .svl-checkout .checkout .svl-field input:focus{ border-bottom-color:var(--orange)!important;outline:none} .svl-checkout .checkout .form-row label, .svl-checkout .checkout .svl-field label{color:var(--ink)!important;font-size:12px;font-weight:600} .svl-checkout .checkout .form-row textarea, .svl-checkout .checkout .svl-field textarea{min-height:78px!important;resize:vertical} /* Смуга «Маєте купон?» друкується до обгортки, тож ховаємо її на рівні сторінки. */ body.woocommerce-checkout .woocommerce-form-coupon-toggle, body.woocommerce-checkout .checkout_coupon{display:none!important} /* Підказки списку міст і відділень — світлі. */ .svl-checkout .svl-sug{background:#fff;border:1px solid var(--line);box-shadow:0 18px 40px -20px #00000040} .svl-checkout .svl-sug__opt{color:var(--ink);background:0 0} .svl-checkout .svl-sug__opt:hover,.svl-checkout .svl-sug__opt.is-on{background:var(--pale)} /* Рідна кнопка WooCommerce не потрібна: своя стоїть у смузі підтвердження з тими самими name і value, тож на сервер іде однаковий запит. */ .svl-checkout #payment .place-order, .svl-checkout #place_order{display:none!important} /* Дрібний текст політики під способами оплати — як у макеті. */ .svl-checkout .woocommerce-privacy-policy-text{color:var(--grey);font-size:11px;margin:14px 0 0} .svl-checkout .woocommerce-privacy-policy-text p{margin:0;font-size:11px} /* Сума в кнопці підтвердження — помаранчевим, як у макеті. */ .svl-checkout .desktop-submit .submit strong, .svl-checkout .desktop-submit .submit strong *{color:var(--orange)!important;font-size:15px;font-weight:650} .svl-checkout .desktop-submit .submit span{font-size:13px;font-weight:650} .svl-checkout .agree input[type=checkbox]{accent-color:var(--orange);width:15px;height:15px;margin:1px 0 0} .svl-checkout .agree a{color:var(--ink);text-decoration:underline;text-underline-offset:2px} /* ================================================================ Картки вибору: перевізник і спосіб оплати ================================================================ У темі лишився попередній, темний вигляд цих блоків — із заокругленням 10px, власним радіо та окремою панеллю під підписом, причому частина правил іде з !important. Тому спершу знімаємо їх повністю, а потім задаємо вигляд макета: сітка з волосяними лініями, без заокруглень, обраний рядок — бежевий із помаранчевою рамкою. Одна сітка на обидва блоки: у макеті це той самий елемент .choice. */ /* --- знімаємо оформлення теми --- */ .svl-checkout .woocommerce-checkout-payment ul.payment_methods, .svl-checkout .woocommerce-checkout-payment ul.payment_methods li, .svl-checkout .woocommerce-checkout-payment ul.payment_methods li label, .svl-checkout .woocommerce-checkout-payment .payment_box{ border-radius:0!important;background:0 0!important;border:0!important; box-shadow:none!important;margin:0!important;padding:0!important; font:inherit!important;color:inherit!important} /* --- контейнер: верхня й ліва лінії сітки --- */ .svl-checkout .svl-ship, .svl-checkout .woocommerce-checkout-payment ul.payment_methods{ display:grid!important;gap:0;list-style:none; border-top:1px solid var(--line);border-left:1px solid var(--line)} .svl-checkout .svl-ship{grid-template-columns:1fr 1fr;margin:0 0 26px} .svl-checkout .woocommerce-checkout-payment ul.payment_methods{ grid-template-columns:1fr!important;margin:0 0 14px!important} /* --- рядок вибору --- */ .svl-checkout .svl-ship__opt, .svl-checkout .woocommerce-checkout-payment ul.payment_methods li{ display:grid!important;grid-template-columns:auto auto minmax(0,1fr) auto; align-items:center;gap:12px;min-height:76px;padding:15px!important; background:#fff!important;cursor:pointer;position:relative; /* Усі чотири сторони задаємо явно: у темі в цих класів своя рамка по колу, і без цього верхня з лівою лишались темними від неї. */ border-top:0!important;border-left:0!important; border-right:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important; border-radius:0!important;transition:background .2s,box-shadow .2s} /* --- обраний рядок --- Рамку малюємо назовні (0 0 0 1px), а не всередину. Внутрішня тінь лягала поруч із власною сірою лінією сітки — на стику двох карток виходило дві лінії, помаранчева й сіра. Зовнішня накриває і свою межу, і сусідню, тож видно рівно один помаранчевий прямокутник. z-index потрібен, щоб тінь лягла поверх сусідів. */ .svl-checkout .svl-ship__opt.is-on, .svl-checkout .woocommerce-checkout-payment ul.payment_methods li:has(input:checked), .svl-checkout .woocommerce-checkout-payment ul.payment_methods li.svl-on{ background:var(--pale)!important; /* Рамку малює тільки зовнішня тінь — рівний 1px по колу. Якщо лишити ще й власні праву й нижню лінії, вони стають поруч із тінню, і рамка виходить удвічі товщою з двох боків. */ border-color:transparent!important; /* !important обов'язковий: у скиданні стилів теми вище стоїть box-shadow:none!important, і без нього кільце не малювалось зовсім. */ box-shadow:0 0 0 1px var(--orange)!important; z-index:2} /* Тема фарбує рамку рядка при наведенні в темний — на світлому блоці це читається як зайва лінія. */ .svl-checkout .woocommerce-checkout-payment ul.payment_methods li:hover, .svl-checkout .woocommerce-checkout-payment ul.payment_methods li.wc_payment_method:hover, .svl-checkout .svl-ship__opt:hover{ border-top-color:transparent!important;border-left-color:transparent!important; border-right-color:var(--line)!important;border-bottom-color:var(--line)!important} .svl-checkout .woocommerce-checkout-payment ul.payment_methods li:has(input:checked):hover, .svl-checkout .svl-ship__opt.is-on:hover{border-color:transparent!important} .svl-checkout .svl-ship__opt:hover:not(.is-on), .svl-checkout .woocommerce-checkout-payment ul.payment_methods li:hover:not(:has(input:checked)){ background:#fcfcfb!important} /* --- радіо: одне й те саме коло в обох блоках --- */ .svl-checkout .svl-ship__opt input, .svl-checkout .woocommerce-checkout-payment ul.payment_methods li input.input-radio{ appearance:none;-webkit-appearance:none;width:17px;height:17px;margin:0!important; border:1px solid #b9bbb6;border-radius:50%;background:#fff;display:grid;place-items:center; cursor:pointer;grid-column:1;grid-row:1;position:static;opacity:1} .svl-checkout .svl-ship__opt input:after, .svl-checkout .woocommerce-checkout-payment ul.payment_methods li input.input-radio:after{ content:"";width:9px;height:9px;border-radius:50%;background:0 0;transition:background .18s} .svl-checkout .svl-ship__opt input:checked, .svl-checkout .woocommerce-checkout-payment ul.payment_methods li input.input-radio:checked{border-color:var(--orange)} .svl-checkout .svl-ship__opt input:checked:after, .svl-checkout .woocommerce-checkout-payment ul.payment_methods li input.input-radio:checked:after{background:var(--orange)} /* Власна позначка з розмітки перевізника більше не потрібна. */ .svl-checkout .svl-ship__mark{display:none} /* Клікабельна вся стрічка. У макеті рядок — це один