.checkout-page{max-width:1200px;margin:0 auto;padding:2rem 24px}h1{font-size:2rem;margin-bottom:2rem;color:var(--color-text)}.checkout-container{display:grid;grid-template-columns:1fr;gap:2rem}@media(min-width:992px){.checkout-container{grid-template-columns:1.5fr 1fr;gap:4rem}}.form-section{margin-bottom:3rem}.form-section h2{font-size:1.25rem;font-weight:500;margin-bottom:1.5rem;color:var(--color-text);padding-bottom:.5rem;border-bottom:1px solid var(--color-surface-variant)}.form-row{display:flex;gap:1rem;flex-wrap:wrap}.form-row .form-group{flex:1;min-width:150px}.form-group{margin-bottom:1.5rem;display:flex;flex-direction:column;gap:.5rem}.form-group label{font-size:.875rem;font-weight:500;color:var(--color-text-secondary)}.form-group input{padding:12px 16px;border:1px solid var(--color-outline-variant);border-radius:var(--radius-sm);background-color:var(--color-surface);color:var(--color-text);font-family:inherit;font-size:1rem;outline:none;transition:border-color .2s}.form-group input:focus{border-color:var(--color-primary)}.payment-methods{display:grid;gap:1rem}.payment-method{cursor:pointer;position:relative}.payment-method input[type=radio]{position:absolute;opacity:0}.method-details{display:flex;align-items:center;gap:1rem;padding:16px;border:1px solid var(--color-outline-variant);border-radius:var(--radius-sm);background-color:var(--color-surface);transition:all .2s}.method-details svg{width:24px;height:24px}.payment-method input[type=radio]:checked+.method-details{border-color:var(--color-primary);background-color:var(--color-secondary-container);color:var(--color-on-secondary-container)}.summary-card{background-color:var(--color-surface);border-radius:var(--radius-md);padding:24px;border:1px solid var(--color-surface-variant);position:sticky;top:100px}.summary-card h2{font-size:1.25rem;font-weight:500;margin-bottom:1.5rem;color:var(--color-text)}.summary-items{max-height:400px;overflow-y:auto;margin-bottom:1.5rem;padding-right:8px}.summary-item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--color-surface-variant)}.summary-item:last-child{border-bottom:none}.item-visual{width:56px;height:56px;background-color:var(--color-bg);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--color-outline);overflow:hidden;flex-shrink:0;border:1px solid var(--color-surface-variant)}.item-img{width:100%;height:100%;object-fit:cover}.item-visual-link{display:block;width:100%;height:100%;text-decoration:none}.item-info{flex:1}.item-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.item-title{font-size:.875rem;font-weight:500;color:var(--color-text);margin-bottom:4px;text-decoration:none;transition:color .2s}.item-title:hover{color:var(--color-primary)}.item-qty{font-size:.75rem;color:var(--color-text-secondary)}.item-price{font-weight:700;color:var(--color-primary);font-size:.875rem}.remove-item-btn{border:none;cursor:pointer;color:var(--color-text-secondary);width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:transparent;margin-left:8px;flex-shrink:0;transition:color .2s,background-color .2s}.remove-item-btn svg{width:18px;height:18px}.remove-item-btn:active{color:#d32f2f;background-color:var(--color-surface-variant)}.summary-totals{border-top:1px solid var(--color-surface-variant);padding-top:1.5rem;margin-bottom:1.5rem;display:flex;flex-direction:column;gap:.75rem}.total-row{display:flex;justify-content:space-between;color:var(--color-text-secondary);font-size:.875rem}.total-row.grand-total{margin-top:.5rem;padding-top:1rem;border-top:1px dashed var(--color-surface-variant);font-size:1.25rem;font-weight:700;color:var(--color-text)}.btn-primary{width:100%;background-color:var(--color-primary);color:var(--color-on-primary);font-family:inherit;font-weight:500;font-size:1rem;padding:16px;border-radius:var(--radius-full);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:opacity .2s}.btn-primary svg{width:20px;height:20px}.btn-primary:active{opacity:.85}.btn-primary:disabled{background-color:var(--color-surface-variant);color:var(--color-text-secondary);cursor:not-allowed;opacity:1}
