/* ==========================================
   BuyTopAccount - Updated Brand CSS Theme
   Premium SaaS Gradient Style
========================================== */

:root {
  --brand-primary: #2563eb;
  --brand-primary-dark: #1e40af;
  --brand-secondary: #7c3aed;
  --brand-accent: #06b6d4;

  --brand-dark: #071426;
  --brand-ink: #0f172a;

  --brand-soft: #f8fafc;
  --brand-tint: #eff6ff;
  --brand-white: #ffffff;

  --gradient-primary: linear-gradient(
    135deg,
    #2563eb 0%,
    #7c3aed 50%,
    #06b6d4 100%
  );

  --gradient-dark: linear-gradient(
    135deg,
    #071426 0%,
    #1e3a8a 55%,
    #2563eb 100%
  );

  --gradient-glow: radial-gradient(
    circle at top right,
    rgba(37,99,235,.25),
    rgba(124,58,237,.18),
    transparent 65%
  );
}


/* Tailwind variable override */

*,
:before,
:after {
  --border-spacing-x: 0;
  --border-spacing-y: 0;

  --translate-x: 0;
  --translate-y: 0;

  --rotate: 0;
  --skew-x: 0;
  --skew-y: 0;

  --scale-x: 1;
  --scale-y: 1;

  --ring-offset-width: 0px;
  --ring-offset-color: #f8fafc;
  --ring-color: rgb(37 99 235 / .5);

  --ring-offset-shadow: 0 0 #0000;
  --ring-shadow: 0 0 #0000;

  --shadow: 0 0 #0000;
  --shadow-colored: 0 0 #0000;
}


::backdrop {
  --ring-offset-color: #f8fafc;
  --ring-color: rgb(37 99 235 / .5);
}


/* Brand Background */

.bg-brand-primary {
  background-color: #2563eb;
}

.bg-brand-primaryDeep {
  background-color: #1e40af;
}

.bg-brand-secondary {
  background-color: #7c3aed;
}

.bg-brand-accent {
  background-color: #06b6d4;
}

.bg-brand-ink {
  background-color: #071426;
}

.bg-brand-soft {
  background-color: #f8fafc;
}

.bg-brand-tint {
  background-color: #eff6ff;
}


/* Premium Gradients */

.bg-brand-gradient {
  background-image: linear-gradient(
    135deg,
    #2563eb,
    #7c3aed,
    #06b6d4
  );
}

.bg-brand-dark-gradient {
  background-image: linear-gradient(
    135deg,
    #071426,
    #1e3a8a,
    #2563eb
  );
}

.bg-brand-radial {
  background-image: radial-gradient(
    circle at top right,
    rgba(37,99,235,.25),
    rgba(124,58,237,.15),
    transparent 65%
  );
}


/* Text Colors */

.text-brand-primary {
  color: #2563eb;
}

.text-brand-secondary {
  color: #7c3aed;
}

.text-brand-accent {
  color: #06b6d4;
}

.text-brand-dark {
  color: #071426;
}


/* Borders */

.border-brand-primary {
  border-color: #2563eb;
}

.border-brand-primary\/40 {
  border-color: rgba(37,99,235,.4);
}

.border-brand-secondary {
  border-color: #7c3aed;
}


/* Buttons */

.btn-primary {
  background: linear-gradient(
    135deg,
    #2563eb,
    #7c3aed
  );
  color:white;
  border-radius:12px;
  padding:12px 24px;
  transition:.3s ease;
}

.btn-primary:hover {
  transform:translateY(-2px);
  box-shadow:0 15px 35px rgba(37,99,235,.25);
}


.btn-gradient {
  background:linear-gradient(
    135deg,
    #7c3aed,
    #06b6d4
  );
  color:white;
  border-radius:12px;
}


/* Cards */

.brand-card {
  background:#ffffff;
  border:1px solid rgba(37,99,235,.12);
  border-radius:20px;
  box-shadow:0 20px 45px rgba(15,23,42,.08);
}


/* Glow */

.brand-glow {
  background:
  radial-gradient(
    circle,
    rgba(37,99,235,.35),
    transparent 70%
  );
}


/* Form Focus */

input:focus,
textarea:focus,
select:focus {
  outline:none;
  border-color:#2563eb;
  box-shadow:
  0 0 0 4px rgba(37,99,235,.15);
}


/* Smooth UI */

* {
  transition-property:
  color,
  background-color,
  border-color,
  transform,
  box-shadow;
  transition-duration:.2s;
}