/* HOVER + FOCUS (exclude tooltip triggers) */
button.btn:hover,
button.btn:focus,
input[type="button"].btn:hover,
input[type="button"].btn:focus,
input[type="submit"].btn:hover,
input[type="submit"].btn:focus,
a.btn:not(.tooltip-link):hover,
a.btn:not(.tooltip-link):focus {
  text-decoration: none;
  background-color: #002347 !important;
  border-color: #002347 !important;
  color: #fff;
}

/* ACTIVE (exclude tooltip triggers) */
button.btn:active,
input[type="button"].btn:active,
input[type="submit"].btn:active,
a.btn:not(.tooltip-link):active {
  border-style: inset;
  border-color: #BFBFBF !important;
  background-color: #000000 !important;
}

/* FOCUS RING (exclude tooltip triggers) */
button.btn:focus,
input[type="button"].btn:focus,
input[type="submit"].btn:focus,
a.btn:not(.tooltip-link):focus {
  z-index: 3;
  outline: 4px solid #0076AD !important;
}

.tooltip-link[role="tooltip"] {
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  display: inline;         
  font: inherit;
  line-height: inherit;
  text-transform: none;
  box-shadow: none;
  border-radius: 0;
  cursor: pointer;
}

.tooltip-link[role="tooltip"] { 
    color: #cb4642 !important;
    font-weight: bold;
    text-decoration: underline dotted !important;
}
/*.tooltip-link[role="tooltip"]:hover,
.tooltip-link[role="tooltip"]:focus {
  color: #a53834 !important;
  text-decoration: underline dotted !important;
}*/

.tooltip-link[role="tooltip"]:focus {
  outline: 2px solid #0076AD;
  outline-offset: 2px;
}

.tooltip-inner {
  text-align: left !important;
  max-width: 350px !important;
  white-space: normal;
}
.bg-light-blue {
    background-color:#eef1f8;
}
.table-primary {
    background-color: #4476C1;
    color: white;
}

.ccb-overview li {
    font-size: 1.25rem;
}
.info-card {
    background-color: #eef1f8; /* Light blue background */
    padding: 2rem;
    border-radius: 0.25rem;
    transition: background-color 0.3s ease;
    height: 100%;
}
.info-card:hover {
    background-color: #d8e6f5; /* Slightly darker on hover */
}
.info-card hr {
    border: none;
    height: 3px;
    width: 30px;
    background-color: #6c7a89; /* Gray line above text */
    margin: 0 0 0.5rem 0;
}
.info-card a {
    font-weight: 600;
    color: #2a6ebd;
    margin: 0;
    font-size: 1.1rem;
}
.info-alert {
    display: flex;
    align-items: stretch;
    background-color: #e2ecf8;
    border-radius: .25rem;
    overflow: hidden;
}
.info-alert .icon-pane {
    background-color: #eef1f8;
    align-items: center;
    justify-content: center;
    padding: .75rem .875rem;
    flex: 0 0 auto;
}
.info-alert .icon {
    background-color: #000;
    color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.info-alert .text-pane {
    padding: 1rem;
    flex: 1 1 auto;
    white-space: normal;
    margin-bottom: 0;
}
.info-alert .text-pane a {
    color: #2a6ebd;
    font-weight: 600;
    text-decoration: none;
}
.info-alert .text-pane a:hover {
    text-decoration: underline;
}
ul.check-list {
    padding-left: 1.25rem;
}
ul.check-list > li {
    list-style: none;
    position: relative;
    padding-left: 1.5em;
    margin-bottom: .5rem;
}
ul.check-list > li::before {
    content: '✓'; 
    font-weight: 900;
    position: absolute;
    left: 0;
    color: black;
}
.sub-bullets {
    padding-left: 5em;
}
/* Horizontal row by default */
.timeline-steps {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
}
.timeline-steps li {
    display: flex;
    align-items: center;
    margin: 8px 0;
}
.step-box {
    width: 112px;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.25;
    text-align: left;
    min-height: 2.6em;
    display: flex;
    align-items: center;
}
li.step-box{
    width: 95px;
}
/* Chevron between steps (desktop) */
.timeline-steps img.chevron {
    width: 25px;
    height: auto;
    margin: 0 20px;
}

/* Tablet & smaller: stack each item and move chevron under the box */
@media (max-width: 767.98px) {
.step-box {
    width: 275px;
    display: contents;
    text-align: center !important;
}
.timeline-steps {
    flex-direction: column;
    align-items: center;
}
.timeline-steps li {
    flex-direction: column;      /* stack box over chevron */
    align-items: center;
    margin-bottom: 0px;
}
    
.timeline-steps img.chevron {
    display: block;
    align-content: center;
    transform: rotate(90deg);    /* point downward */
}
}
/* ---------- Steps layout ---------- */
.steps-wrap {
    margin-top: .75rem;
}
.ccb-steps {
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.ccb-step .step-body .step-title ~ ul > li {
    list-style: disc;
}
.ccb-step {
--gap: 2.5rem;
    margin-bottom: var(--gap);
    position: relative;
}
.ccb-step:last-child {
    margin-bottom: 0;
}
.step-row {
    display: flex;
    align-items: stretch;
}
.step-col {
    position: relative;
    flex: 0 0 56px;
    width: 56px;
    margin-right: 18px;
}
.step-num {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #2f67b2;
    color: #fff;
    font-weight: 700;
    font-size: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 5px;
}
.step-body {
    flex: 1 1 auto;
    min-width: 0;
}
.step-title {
    margin-top: .70rem;
    margin-bottom: 1rem;
    font-weight: 500;
}
.step-body p {

    margin-bottom: 1rem;
}
.step-rule {
    width: 70px;
    height: 4px;
    background: #a5b5c2;
    border: 0;
    margin: 1.25rem 0;
}
.alert {
    color: black;
}
.alert-warning {
    background: #f1efe3;
    border: none;
}
/* ===== Vertical connector centered on the circle ===== */
.step-col::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 56px;
bottom: calc(var(--gap) * -1);
    width: 2px;
    background: #e0e6f4;
}
/* takes away line after the last step */
.ccb-step:last-child .step-col::after {
    display: none;
}

@media (max-width: 575.98px) {
.step-row {
    flex-direction: row;
}
}
/* ---------- Calendar timeline ---------- */
.cal-timeline {
    margin-top: .75rem;
}
.cal-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.cal-item {
--icon: 48px;          /* calendar icon size */
--gap: 2px;
    position: relative;
    margin-bottom: var(--gap);
}
.cal-item:last-child {
    margin-bottom: 0;
}
.cal-row {
    display: flex;
    align-items: stretch;
}
/* Left column holds the icon and the connector */
.cal-col {
    position: relative;          /* containing block for the connector */
    flex: 0 0 var(--icon);
    width: var(--icon);
    margin-right: 14px;
}
/* The calendar icon image */
.cal-icon {
    width: var(--icon);
    height: var(--icon);
    display: block;
}
/* Dotted connector centered in the icon column */
.cal-col::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: var(--icon);                      /* start just under the icon */
bottom: calc(var(--gap) * -1);         /* extend into the gap to next item */
    border-left: 2px dotted #d7dbe4;       /* dotted vertical line */
}
/* Stop connector after the last item */
.cal-item:last-child .cal-col::after {
    display: none;
}

@media (max-width: 575.98px) {
.cal-sep {
    margin-left: calc(var(--icon) + 14px);
}
}
@media (max-width: 767.98px) {
  .no-border-sm { border-left: 0 !important; }
}
@media (max-width: 767.98px) {
  .col-md-3.no-pl-sm { padding-left: 0 !important; }
}
@media (max-width: 767.98px) {
  .col-lg-3.no-pl-sm { padding-left: 0 !important; }
}