/* -------------------------------------------------------
   Foundation 6 – Avexi Theme Override
   Primary:   #abce6b (green)
   Secondary: #e09500 (amber)
   Background: #222422 (dark neutral)
------------------------------------------------------- */

/* -------------------------------------------------------
   GLOBAL COLORS
------------------------------------------------------- */
body {
  background-color: #222422;
  color: #f1f1f1; 
  font-family: 'Poppins', serif;
  font-weight: 300;
  font-size: 1.2rem;
}

a {
  color: #e05900;
}
a:hover {
  color: #e09500;
}

/* -------------------------------------------------------
   PRIMARY + SECONDARY UTILITIES
------------------------------------------------------- */
.primary {
  background-color: #abce6b;
  color: #222422;
}

.secondary {
  background-color: #e09500;
  color: #222422;
}

.text-primary { color: #abce6b; }
.text-secondary { color: #e09500; }

.bg-primary { background-color: #abce6b; }
.bg-secondary { background-color: #e09500; }

/* -------------------------------------------------------
   BUTTONS
------------------------------------------------------- */
.button{
  border-radius: 24px;
}
.button.primary {
  background-color: #abce6b;
  border-color: #abce6b;
  color: #222422;
}
.button.primary:hover {
  background-color: #556735;
}

.button.secondary {
  background-color: #e09500;
  border-color: #e09500;
  color: #222422;
}
.button.secondary:hover {
  background-color: #c68500;
}

/* Hollow buttons */
.button.hollow.primary {
  color: #abce6b;
  border-color: #abce6b;
}
.button.hollow.primary:hover {
  background-color: #abce6b;
  color: #222422;
}

.button.hollow.secondary {
  color: #e09500;
  border-color: #e09500;
}
.button.hollow.secondary:hover {
  background-color: #e09500;
  color: #222422;
}

/* -------------------------------------------------------
   FORMS
------------------------------------------------------- */
[type=color], [type=date], [type=datetime-local], [type=datetime], [type=email], [type=month], [type=number], [type=password], [type=search], [type=tel], [type=text], [type=time], [type=url], [type=week], textarea {
  background-color: #11140a;
  border: solid 1px #556735;
  color: #f1f1f1;
  border-radius:6px;
  padding: 10px 15px;
}
[type=color]:focus, [type=date]:focus, [type=datetime-local]:focus, [type=datetime]:focus, [type=email]:focus, [type=month]:focus, [type=number]:focus, [type=password]:focus, [type=search]:focus, [type=tel]:focus, [type=text]:focus, [type=time]:focus, [type=url]:focus, [type=week]:focus, textarea:focus {
  background: #313333;
  border-color: #abce6b;
}

input,
textarea,
select {
  background-color: #11140a;
  border: 1px solid #4a4c49;
  color: #f1f1f1;
}

input:focus,
textarea:focus,
select:focus {
  border-color: #abce6b;
  box-shadow: 0 0 0 2px rgba(171, 206, 107, 0.35);
}

/* Checkboxes + radios */
input[type="checkbox"]:checked,
input[type="radio"]:checked {
  background-color: #abce6b;
  border-color: #abce6b;
}

/* Switch */
.switch-paddle {
  background: #4a4c49;
}
input:checked + .switch-paddle {
  background: #abce6b;
}

/* -------------------------------------------------------
   CALLOUTS
------------------------------------------------------- */
.callout {
  border-radius: 24px;
}

.callout.primary {
  background-color: rgba(171, 206, 107, 0.15);
  border: 4px solid #abce6b;
  color: #dfe8d2;
}

.callout.secondary {
  background-color: rgba(224, 149, 0, 0.15);
  border: 4px solid #e09500;
  color: #f3d9a8;
}

/* -------------------------------------------------------
   LABELS
------------------------------------------------------- */
.label.primary {
  background-color: #abce6b;
  color: #222422;
}

.label.secondary {
  background-color: #e09500;
  color: #222422;
}

/* -------------------------------------------------------
   PAGINATION
------------------------------------------------------- */
.pagination .current {
  background-color: #abce6b;
  color: #222422;
}

.pagination a:hover {
  background-color: #556735;
  color: #222422;
}

/* -------------------------------------------------------
   TABS
------------------------------------------------------- */
.tabs-title > a {
  color: #f1f1f1;
}
.tabs-title > a:hover {
  color: #abce6b;
}

.tabs-title.is-active > a {
  background-color: #abce6b;
  color: #222422;
}

/* -------------------------------------------------------
   PROGRESS BAR
------------------------------------------------------- */
.progress.primary .progress-meter {
  background-color: #abce6b;
}

.progress.secondary .progress-meter {
  background-color: #e09500;
}

label{
  color: #eaeaea;
}


/* -------------------------------------------------------
   TOP BAR
------------------------------------------------------- */
.top-bar{
background: transparent;
}