﻿a{text-decoration:none;color:inherit;}
button{cursor:pointer;border:none;outline:none;font-family:var(--font-body);}
input{font-family:var(--font-body);}

/* LOGIN REQUIRED MESSAGE */
.login-required-message{display:flex;align-items:center;justify-content:center;gap:60px;padding:60px 40px;max-width:1200px;margin:0 auto;}
.login-visual{flex:1;display:flex;flex-direction:column;align-items:center;gap:24px;}
.login-illustration{width:280px;height:280px;background:linear-gradient(135deg,rgba(16,185,129,0.1),rgba(6,182,212,0.1));border-radius:40px;display:flex;align-items:center;justify-content:center;position:relative;}
.login-illustration::before{content:'';position:absolute;width:200px;height:200px;background:linear-gradient(135deg,var(--accent),var(--accent2));border-radius:50%;opacity:0.2;animation:float 3s ease-in-out infinite;}
@keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-20px);}}
.login-illustration i{font-size:120px;color:var(--accent);position:relative;z-index:1;}
.login-content{flex:1;display:flex;flex-direction:column;gap:20px;}
.login-content h2{font-family:var(--font-head);font-size:32px;font-weight:800;color:var(--text);margin-bottom:8px;line-height:1.2;}
.login-content h2 span{background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.login-content p{font-size:15px;color:var(--text2);line-height:1.7;margin-bottom:8px;}
.login-content .highlight{color:var(--accent);font-weight:600;}
.login-actions{display:flex;gap:16px;margin-top:16px;}
.btn-login{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;padding:14px 32px;border-radius:12px;font-size:14px;font-weight:700;text-decoration:none;transition:all .3s;box-shadow:0 4px 16px rgba(16,185,129,0.3);white-space:nowrap;}
.btn-login:hover{background:linear-gradient(135deg,var(--accent2),var(--accent));transform:translateY(-2px);box-shadow:0 6px 24px rgba(16,185,129,0.4);}
.btn-secondary{display:inline-flex;align-items:center;justify-content:center;background:var(--bg2);color:var(--text);padding:14px 32px;border-radius:12px;font-size:14px;font-weight:600;text-decoration:none;border:2px solid var(--border);transition:all .3s;white-space:nowrap;}
.btn-secondary:hover{border-color:var(--accent);color:var(--accent);background:rgba(16,185,129,0.05);transform:translateY(-2px);}
.register-text{font-size:13px;color:var(--text3);margin-top:24px;}
.register-text a{color:var(--accent);font-weight:700;text-decoration:none;transition:all .3s;}
.register-text a:hover{color:var(--accent2);text-decoration:underline;}

@media(max-width:768px){
  .login-required-message{flex-direction:column;text-align:center;gap:40px;padding:40px 24px;}
  .login-illustration{width:200px;height:200px;}
  .login-illustration i{font-size:80px;}
  .login-content h2{font-size:32px;}
  .login-content p{font-size:16px;}
  .login-actions{flex-direction:column;width:100%;}
  .btn-login,.btn-secondary{width:100%;justify-content:center;}
}

/* CHECKOUT LAYOUT */
.checkout-wrapper{flex:1;display:grid;grid-template-columns:1fr 400px;gap:32px;padding:32px 24px;max-width:1400px;margin:0 auto;width:100%;}

/* CHECKOUT FORM */
.checkout-form{display:flex;flex-direction:column;gap:24px;}
.checkout-section{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:32px;box-shadow:0 4px 20px rgba(0,0,0,0.06);transition:all .3s ease;}
.checkout-section:hover{box-shadow:0 8px 30px rgba(0,0,0,0.1);}
.section-title{font-family:var(--font-head);font-size:20px;font-weight:700;color:var(--text);margin-bottom:24px;display:flex;align-items:center;gap:12px;padding-bottom:16px;border-bottom:2px solid var(--border);}
.section-title i{color:var(--accent);font-size:18px;}
.section-title .step{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--accent),#059669);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;box-shadow:0 4px 12px rgba(16,185,129,0.3);}

.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:8px;}
.form-group{margin-bottom:20px;position:relative;}
.form-label{display:block;font-size:14px;font-weight:600;color:var(--text);margin-bottom:8px;}
.form-label span{color:var(--pink);}
.form-input{width:100%;background:var(--bg2);border:2px solid var(--border);border-radius:12px;color:var(--text);font-family:var(--font-body);font-size:15px;padding:14px 16px;transition:all .3s ease;outline:none;}
.form-input:focus{border-color:var(--accent);background:#fff;box-shadow:0 0 0 4px rgba(16,185,129,0.1);transform:translateY(-1px);}
.form-input::placeholder{color:var(--text3);font-size:14px;}
.form-input.error{border-color:var(--pink);background:rgba(236,72,153,0.05);animation:shake 0.3s ease;}
.form-input.error:focus{border-color:var(--pink);box-shadow:0 0 0 4px rgba(236,72,153,0.1);}
.form-select{width:100%;background:var(--bg2);border:2px solid var(--border);border-radius:12px;color:var(--text);font-family:var(--font-body);font-size:15px;padding:14px 16px;transition:all .3s ease;outline:none;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:calc(100% - 16px) center;background-size:12px;}
.form-select:focus{border-color:var(--accent);background:#fff;box-shadow:0 0 0 4px rgba(16,185,129,0.1);transform:translateY(-1px);}
.form-select.error{border-color:var(--pink);background:rgba(236,72,153,0.05);animation:shake 0.3s ease;}
.form-select.error:focus{border-color:var(--pink);box-shadow:0 0 0 4px rgba(236,72,153,0.1);}

/* ERROR MESSAGES */
.error-message{display:none;color:var(--pink);font-size:13px;margin-top:6px;font-weight:500;padding:8px 12px;background:rgba(236,72,153,0.1);border-radius:6px;border-left:3px solid var(--pink);animation:slideDown 0.3s ease;}
.error-message:not(:empty){display:block;}

@keyframes shake{
  0%,100%{transform:translateX(0);}
  25%{transform:translateX(-5px);}
  75%{transform:translateX(5px);}
}

@keyframes slideDown{
  from{opacity:0;transform:translateY(-10px);}
  to{opacity:1;transform:translateY(0);}
}

/* PAYMENT METHODS */
.payment-methods{display:flex;flex-direction:column;gap:12px;}
.payment-method{display:flex;align-items:center;gap:12px;padding:16px;background:var(--bg2);border:2px solid var(--border);border-radius:12px;cursor:pointer;transition:all .3s ease;}
.payment-method:hover{border-color:var(--border2);transform:translateX(4px);}
.payment-method.active{border-color:var(--accent);background:rgba(16,185,129,0.08);box-shadow:0 4px 12px rgba(16,185,129,0.15);}
.payment-method input{accent-color:var(--accent);width:18px;height:18px;}
.payment-method-icon{width:40px;height:26px;background:#fff;border-radius:8px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border2);box-shadow:0 2px 8px rgba(0,0,0,0.1);}
.payment-method-icon i{font-size:18px;color:var(--text2);}
.payment-method-info{flex:1;}
.payment-method-name{font-size:15px;font-weight:600;color:var(--text);}
.payment-method-desc{font-size:13px;color:var(--text3);}

/* CREDIT CARD FORM */
.card-form{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px;padding-top:20px;border-top:1px solid var(--border);}
.card-form.full{grid-template-columns:1fr;}

/* ORDER SUMMARY */
.order-summary{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:28px;height:fit-content;position:sticky;top:24px;box-shadow:0 4px 20px rgba(0,0,0,0.06);}
.summary-title{font-family:var(--font-head);font-size:20px;font-weight:700;color:var(--text);margin-bottom:20px;padding-bottom:16px;border-bottom:2px solid var(--border);}
.summary-item{display:flex;gap:12px;padding:16px 0;border-bottom:1px solid var(--border);transition:all .2s ease;}
.summary-item:last-child{border-bottom:none;}
.summary-item-img{width:70px;height:70px;border-radius:10px;object-fit:cover;background:var(--bg3);flex-shrink:0;box-shadow:0 2px 8px rgba(0,0,0,0.1);}
.summary-item-details{flex:1;}
.summary-item-name{font-size:14px;font-weight:600;color:var(--text);margin-bottom:4px;}
.summary-item-meta{font-size:12px;color:var(--text3);margin-bottom:2px;}
.summary-item-meta.support{color:var(--accent);font-weight:500;}
.summary-item-price{font-family:var(--font-head);font-size:16px;font-weight:700;color:var(--text);}

.summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;}
.summary-row.subtotal{padding-bottom:16px;border-bottom:1px solid var(--border);}
.summary-label{font-size:15px;color:var(--text2);font-weight:500;}
.summary-value{font-family:var(--font-head);font-size:16px;font-weight:600;color:var(--text);}
.summary-row.discount .summary-label{color:var(--accent);}
.summary-row.discount .summary-value{color:var(--accent);}
.summary-row.support .summary-label{color:var(--accent);}
.summary-row.support .summary-value{color:var(--accent);}
.summary-row.total{padding-top:16px;margin-top:16px;border-top:1px solid var(--border);}
.summary-row.total .summary-label{font-size:16px;font-weight:700;color:var(--text);}
.summary-row.total .summary-value{font-size:24px;font-weight:800;color:var(--accent);}

.trust-badges{display:flex;flex-direction:column;gap:12px;margin-top:24px;padding-top:24px;border-top:1px solid var(--border);}
.trust-item{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text3);padding:8px;background:var(--bg2);border-radius:8px;}
.trust-item i{color:var(--accent);font-size:16px;}

.btn-checkout{width:100%;background:linear-gradient(135deg,var(--accent),#059669);color:#fff;padding:16px;border-radius:12px;font-size:16px;font-weight:700;font-family:var(--font-head);transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:10px;margin-top:20px;box-shadow:0 4px 15px rgba(16,185,129,0.3);}
.btn-checkout:hover{background:linear-gradient(135deg,#059669,#047857);transform:translateY(-2px);box-shadow:0 6px 20px rgba(16,185,129,0.4);}
.btn-checkout:disabled{background:var(--text3);cursor:not-allowed;transform:none;box-shadow:none;}
.btn-checkout i{font-size:16px;}

/* RESPONSIVE */
@media(max-width:1024px){
  .checkout-wrapper{grid-template-columns:1fr 360px;}
}
@media(max-width:768px){
  .checkout-wrapper{grid-template-columns:1fr;padding:20px 16px;}
  .order-summary{position:static;}
  .form-row{grid-template-columns:1fr;}
  .card-form{grid-template-columns:1fr;}
}
@media(max-width:480px){
  .checkout-wrapper{padding:16px 12px;}
  .checkout-section{padding:24px;}
  .section-title{font-size:18px;}
  .section-title .step{width:28px;height:28px;font-size:13px;}
}

/* ANIMATIONS */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
.checkout-section{animation:fadeUp .4s ease both;}
.checkout-section:nth-child(1){animation-delay:0.05s;}
.checkout-section:nth-child(2){animation-delay:0.1s;}
.checkout-section:nth-child(3){animation-delay:0.15s;}
.order-summary{animation:fadeUp .5s ease both;animation-delay:0.2s;}
