/* =========================
   Card panels
   ========================= */

.list-panel {
  background-color: #3E8E7E !important;
  color: #ffffff !important;
  border-radius: 20px !important;
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
  transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
  overflow: hidden;
}

/* Landing page card panels */
body > div.landing-root .list-panel {
  background-color: #3E8E7E !important;
  color: #ffffff !important;
  border-radius: 20px !important;
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
  transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
  overflow: hidden;
}

/* Card hover lift */
body > div.landing-root .list-panel:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.20);
  background-color: #367d70 !important;
}

/* Keep card text white */
body > div.landing-root .list-panel,
body > div.landing-root .list-panel *,
body > div.landing-root .list-panel a,
.list-panel,
.list-panel *,
.list-panel a {
  color: #ffffff !important;
}


/* =========================
   Global button style
   Matches card buttons
   ========================= */

button,
.btn,
a.btn,
input[type="button"],
input[type="submit"],
input[type="reset"],
.markdown-container a,
.markdown-container a.btn,
.radio-button-strip label span,
.composite-address-input .postcode-buttons button,
.composite-address-input .postcode-buttons .postcode-go,
#postcode-form button,
#waste-form button,
body > div.landing-root > div:nth-child(1) > div > div.home-action > a,
body > div.landing-root .list-panel button,
body > div.landing-root .list-panel .btn,
body > div.landing-root .list-panel a.btn,
body > div.landing-root .list-panel input[type="button"],
body > div.landing-root .list-panel input[type="submit"],
.list-panel button,
.list-panel .btn,
.list-panel a.btn,
.list-panel input[type="button"],
.list-panel input[type="submit"] {
  background-color: #FABB51 !important;
  border: 1px solid #FABB51 !important;
  color: #000000 !important;
  border-radius: 999px !important;
  padding: 10px 18px !important;
  font-weight: 700 !important;
  font-family: 'Lato', sans-serif !important;
  font-size: 0.875rem !important;
  line-height: 1em !important;
  text-decoration: none !important;
  cursor: pointer !important;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  white-space: nowrap;
  min-width: 3.5em;
  position: relative;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

/* Global button hover */
button:hover,
.btn:hover,
a.btn:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
.markdown-container a:hover,
.markdown-container a.btn:hover,
.radio-button-strip label span:hover,
.composite-address-input .postcode-buttons button:hover,
.composite-address-input .postcode-buttons .postcode-go:hover,
#postcode-form button:hover,
#waste-form button:hover,
body > div.landing-root > div:nth-child(1) > div > div.home-action > a:hover,
body > div.landing-root .list-panel button:hover,
body > div.landing-root .list-panel .btn:hover,
body > div.landing-root .list-panel a.btn:hover,
body > div.landing-root .list-panel input[type="button"]:hover,
body > div.landing-root .list-panel input[type="submit"]:hover,
.list-panel button:hover,
.list-panel .btn:hover,
.list-panel a.btn:hover,
.list-panel input[type="button"]:hover,
.list-panel input[type="submit"]:hover {
  background-color: #e7a93f !important;
  border-color: #e7a93f !important;
  color: #000000 !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
}

/* Keep text/icons/spans inside buttons black */
button *,
.btn *,
a.btn *,
.markdown-container a *,
.radio-button-strip label span *,
#postcode-form button *,
#waste-form button *,
.list-panel button *,
.list-panel .btn *,
.list-panel a.btn * {
  color: #000000 !important;
}


/* =========================
   Specific postcode/waste form fixes
   ========================= */

.composite-address-input .postcode-buttons .postcode-go {
  margin-left: 20px !important;
}

.composite-address-input .postcode-buttons button {
  padding: 10px 18px !important;
}

#waste-form > div.container.spaced-bottom > button > span {
  color: #000000 !important;
}


/* =========================
   Breadcrumb / progress header
   ========================= */

.progress-header {
  background-color: #3E8E7E;
  color: #ffffff;
  margin-top: 1px;
  margin-bottom: 1em;
}

ul.breadcrumb li {
  color: #ffffff;
}

ul.breadcrumb li.current:after {
  content: "";
  display: block;
  background-color: #000000;
}

.navbar {
background-color: #3E8E7E !important; ;
color: white;
padding: 0 1rem;
line-height: 24px;
font-size: 14px;
}

.composite-address-input .postcode-input {
position: absolute;
left: 0;
top: 0;
line-height: 49px;
font-size: 1.2em;
color: #FABB51 !important;
padding: 0 10px;
margin: 0;
border: none;
text-transform: uppercase;
overflow: hidden;
border-radius: 5px;
}

.composite-address-input .selected-address-summary {
position: absolute;
left: 10px;
top: 0;
width: calc(100% - 95px);
line-height: 49px;
font-size: 1.2em;
color: #FABB51 !important;
cursor: pointer;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.skip-capacity {
width: 82px;
height: 82px;
border-radius: 50%;
background-color: #FABB51 !important;
color: #fdea14;
text-align: center;
}

.custom-calendar table.calendar-table td {
text-align: center;
vertical-align: middle;
height: 5em;
padding: 5px 10px;
position: relative;
transition: height 0.6s, font-size 0.6s;
border: 1px solid #3E8E7E;
color: #999;
border-radius: 10px;
background: linear-gradient(to top left, rgba(52, 139, 65, 0) 0%, rgba(52, 139, 65, 0) calc(50% - 2px), #ddd 50%, rgba(52, 139, 65, 0) calc(50% + 2px), rgba(52, 139, 65, 0) 100%);
}

.custom-calendar .custom-calendar-nav .custom-calendar-nav-date .month {
text-align: center;
color: #3E8E7E;
}

.custom-calendar table.calendar-table td.isSelectable {
background: none;
background-color: #3E8E7E;
}

.custom-calendar table.calendar-table td.today {
background: none;
background-color: #FABB51 !important;
border-color: #FABB51 !important;
color: #3E8E7E;
}

.customcheck:checked ~ .customcheck-o {
background-color: #3E8E7E;
}
.custom-calendar table.calendar-table td.isSelectable:hover {
background-color: #000000;
border-color: #000000;
}

.customcheck ~ .customcheck-o .fa-check {
opacity: 0;
position: relative;
font-size: 18px;
left: 2px;
top: 2px;
color: #FABB51;
}

.customcheck-o {
display: block;
width: 100%;
height: 100%;
border-radius: 5px;
background-color: white;
border: 1px solid #3E8E7E;
}

.customcheck-label:hover > .customcheck-o {
background-color: #000000;
color: white;
}

h1 .alt, h2 .alt, h3 .alt, h4 .alt, h5 .alt {
font-weight: normal;
color: #3E8E7E;
}

.customradio:checked ~ .customradio-o {
background-color: #3E8E7E;
border-color: #3E8E7E;
}

.full-page-overlay .dialog-container .dialog-title {
position: relative;
margin: 0;
padding: 10px 15px 7px 15px;
background-color: #3E8E7E;
color: white;
}

ul.breadcrumb li a {
cursor: pointer;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
max-width: 70vw;
color: darkslategrey;
}

.address-results label:hover {
color: #3E8E7E;
background-color: #f0f0f0;
}

ul.breadcrumb li:hover:not(.future):after {
content: "";
display: block;
background-color: white;
position: absolute;
left: 1px;
right: 1px;
bottom: -2px;
}


Style Attribute {
font-size: 4rem;
color: transparent;
}