/* Shared Veloura actions used by catalogue, product and account modules. */
#button-cart,
.product-thumb .button-group button:first-child,
.product-thumb button[onclick^="cart.add"] {
  min-height: 44px;
  border: 0 !important;
  border-radius: 11px !important;
  background: linear-gradient(135deg, var(--berry), var(--coral)) !important;
  color: #fff !important;
  font-weight: 700;
  box-shadow: 0 8px 18px rgba(182, 37, 102, .18);
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

#button-cart:hover,
#button-cart:focus,
.product-thumb .button-group button:first-child:hover,
.product-thumb button[onclick^="cart.add"]:hover {
  color: #fff !important;
  filter: saturate(1.08) brightness(1.03);
  transform: translateY(-1px);
  box-shadow: 0 11px 24px rgba(182, 37, 102, .25);
}

#button-cart i,
.product-thumb .button-group button:first-child i,
.product-thumb button[onclick^="cart.add"] i {
  color: #fff !important;
}

.product-thumb .button-group button + button {
  border-color: var(--berry) !important;
  border-radius: 9px !important;
  background: #fff !important;
  color: var(--berry) !important;
}

/* Independent customer registration screen; existing OpenCart field names stay intact. */
.veloura-register-page #column-left,
body:has(form[action*="account/register"]) #column-left {
  display: none !important;
}

.veloura-register-page #content,
body:has(form[action*="account/register"]) #content {
  float: none !important;
  width: min(1180px, 92vw) !important;
  margin: 0 auto 70px !important;
  padding: 46px clamp(28px, 5vw, 72px) 54px !important;
  border: 1px solid var(--line);
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(247,178,103,.14), #fff 30%, rgba(199,165,232,.13));
  box-shadow: 0 24px 65px rgba(61,36,48,.09);
}

.veloura-register-page #content > h1,
body:has(form[action*="account/register"]) #content > h1 {
  margin: 0 0 8px;
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 4.2vw, 58px);
  color: var(--cocoa);
}

.veloura-register-page #content > h1::before,
body:has(form[action*="account/register"]) #content > h1::before {
  content: 'VELOURA MEMBERSHIP';
  display: block;
  margin-bottom: 10px;
  font-family: 'DM Sans', sans-serif;
  font-size: 11px;
  letter-spacing: .18em;
  color: var(--berry);
}

.veloura-register-page form[action*="account/register"],
body:has(form[action*="account/register"]) form[action*="account/register"] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 26px;
  margin-top: 32px;
}

.veloura-register-page form[action*="account/register"] fieldset,
body:has(form[action*="account/register"]) form[action*="account/register"] fieldset {
  display: contents;
}

.veloura-register-page form[action*="account/register"] legend,
body:has(form[action*="account/register"]) form[action*="account/register"] legend {
  grid-column: 1 / -1;
  margin: 8px 0 0;
  padding: 0 0 12px;
  border-bottom: 2px solid transparent;
  border-image: linear-gradient(90deg, var(--berry), var(--coral), var(--apricot)) 1;
  font-family: 'Playfair Display', serif;
  font-size: 27px;
  color: var(--cocoa);
}

.veloura-register-page form[action*="account/register"] .form-group,
body:has(form[action*="account/register"]) form[action*="account/register"] .form-group {
  display: block !important;
  margin: 0;
}

.veloura-register-page form[action*="account/register"] .control-label,
body:has(form[action*="account/register"]) form[action*="account/register"] .control-label,
.veloura-register-page form[action*="account/register"] [class*="col-sm-"],
body:has(form[action*="account/register"]) form[action*="account/register"] [class*="col-sm-"] {
  float: none;
  width: 100%;
  padding: 0;
  text-align: left;
}

.veloura-register-page form[action*="account/register"] .control-label,
body:has(form[action*="account/register"]) form[action*="account/register"] .control-label {
  margin-bottom: 7px;
  font-weight: 700;
}

.veloura-register-page form[action*="account/register"] .form-control,
body:has(form[action*="account/register"]) form[action*="account/register"] .form-control {
  width: 100%;
  min-height: 52px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  box-shadow: none;
}

.veloura-register-page form[action*="account/register"] .buttons,
body:has(form[action*="account/register"]) form[action*="account/register"] .buttons {
  grid-column: 1 / -1;
  margin: 8px 0 0;
  padding-top: 22px;
  border-top: 1px solid var(--line);
}

.veloura-register-page form[action*="account/register"] .btn-primary,
body:has(form[action*="account/register"]) form[action*="account/register"] .btn-primary {
  min-width: 160px;
  min-height: 48px;
  padding: 0 25px;
  border: 0;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--berry), var(--coral));
  color: #fff;
  font-weight: 700;
}

@media (max-width: 760px) {
  .veloura-register-page form[action*="account/register"],
  body:has(form[action*="account/register"]) form[action*="account/register"] { grid-template-columns: 1fr; }
  .veloura-register-page #content,
  body:has(form[action*="account/register"]) #content { width: calc(100% - 28px) !important; padding: 30px 20px 38px !important; }
}

/* Veloura registration composition: brand story and form are one visual unit. */
.veloura-register-page #content {
  padding: 0 !important;
  overflow: hidden;
  background: #fff !important;
}

.veloura-reg-layout {
  display: grid;
  grid-template-columns: minmax(360px, .82fr) minmax(540px, 1.18fr);
  min-height: 780px;
}

.veloura-reg-story {
  position: relative;
  overflow: hidden;
  padding: 70px 52px;
  background: linear-gradient(155deg, var(--coral) 0%, var(--berry) 54%, #713763 100%);
  color: #fff;
}

.veloura-reg-story::before,
.veloura-reg-story::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  background: rgba(247, 178, 103, .55);
}

.veloura-reg-story::before { width: 280px; height: 280px; top: -115px; right: -90px; }
.veloura-reg-story::after { width: 190px; height: 190px; bottom: -80px; left: -70px; background: rgba(199,165,232,.42); }
.veloura-reg-story > * { position: relative; z-index: 1; }
.veloura-reg-story > span { font-size: 11px; font-weight: 800; letter-spacing: .2em; color: #ffe0a7; }
.veloura-reg-story h2 { margin: 32px 0 18px; font-family: 'Playfair Display', serif; font-size: clamp(42px, 4.2vw, 64px); line-height: 1.02; letter-spacing: -.035em; }
.veloura-reg-story > p { max-width: 430px; margin-bottom: 38px; font-size: 16px; color: rgba(255,255,255,.88); }

.veloura-reg-benefit {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 2px 12px;
  margin: 14px 0;
  padding: 15px 17px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 14px;
  background: rgba(255,255,255,.09);
}

.veloura-reg-benefit i { grid-row: 1 / 3; align-self: center; font-size: 20px; color: #ffe0a7; }
.veloura-reg-benefit b { font-size: 14px; }
.veloura-reg-benefit small { color: rgba(255,255,255,.76); }

.veloura-reg-form { padding: 56px clamp(38px, 5vw, 76px); }
.veloura-reg-form > h1 { margin: 0 0 8px; font-family: 'Playfair Display', serif; font-size: clamp(38px, 4vw, 56px); color: var(--cocoa); }
.veloura-reg-form > h1::before { content: 'YENİ ÜYELİK'; display: block; margin-bottom: 10px; font-family: 'DM Sans', sans-serif; font-size: 11px; letter-spacing: .2em; color: var(--berry); }
.veloura-reg-form form[action*="account/register"] { grid-template-columns: 1fr !important; gap: 15px !important; margin-top: 28px !important; }
.veloura-reg-form form[action*="account/register"] legend { margin-top: 5px; font-size: 24px; }
.veloura-reg-form form[action*="account/register"] .form-control { min-height: 49px; }
.veloura-reg-form form[action*="account/register"] .buttons { margin-top: 4px; }

@media (max-width: 980px) {
  .veloura-reg-layout { grid-template-columns: 1fr; }
  .veloura-reg-story { min-height: 520px; }
}

@media (max-width: 560px) {
  .veloura-reg-story { padding: 48px 25px; }
  .veloura-reg-form { padding: 38px 22px; }
}
