/* ============================================== */
/*  Kabamex Brand Email Theme                     */
/*  Colors: #1d3480  #3b82f6  #ffffff             */
/* ============================================== */

/* Reset & base */
body {
    background-color: #f1f5fb !important;
}

/* Wrapper */
.wrapper {
    background-color: #f1f5fb !important;
    padding: 30px 15px !important;
}

/* The main card */
.content {
    background-color: #ffffff !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 20px rgba(30, 64, 175, 0.08) !important;
    border: 1px solid #e0e7f5 !important;
}

/* ============ HEADER ============ */
.header {
    /* background: linear-gradient(135deg, #1d3480 0%, #3b82f6 100%) !important; */
    background: #1d3480 !important;
    padding: 30px 20px !important;
    text-align: center !important;
}

.header a {
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    display: inline-block !important;
}

.header .logo {
    max-height: 55px !important;
    width: auto !important;
    display: block !important;
    margin: 0 auto !important;
}

/* ============ BODY ============ */
.body {
    background-color: #ffffff !important;
    border-bottom: none !important;
    border-top: none !important;
}

.content-cell {
    padding: 40px 40px 30px 40px !important;
    color: #1f2937 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
}

.content-cell p {
    color: #374151 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    margin: 0 0 12px 0 !important;
}

/* Greeting */
.content-cell h1 {
    color: #000 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    margin: 0 0 16px 0 !important;
    line-height: 1.3 !important;
}

/* ============ BUTTON ============ */
.button-primary {
    background-color: #1d3480 !important;
    border-top: 12px solid #1d3480 !important;
    border-right: 24px solid #1d3480 !important;
    border-bottom: 12px solid #1d3480 !important;
    border-left: 24px solid #1d3480 !important;
    border-radius: 8px !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

.button-primary:hover {
    background-color: #1c3a99 !important;
    border-color: #1c3a99 !important;
}

/* ============ SUBCOPY ============ */
.subcopy {
    border-top: 1px solid #e5eaf3 !important;
    color: #7b8fa5 !important;
    font-size: 13px !important;
    padding-top: 20px !important;
    margin-top: 30px !important;
}

.subcopy p {
    color: #7b8fa5 !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
}

.subcopy a {
    color: #3b82f6 !important;
    text-decoration: none !important;
}

/* ============ FOOTER ============ */
.footer {
    background-color: #f8fafd !important;
    padding: 22px 30px !important;
    text-align: center !important;
    border-top: 1px solid #e5eaf3 !important;
}

.footer p {
    color: #94a3b8 !important;
    font-size: 12px !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}

.footer a {
    color: #3b82f6 !important;
    text-decoration: none !important;
}

/* Divider between body and footer */
.body + .footer {
    border-top: 1px solid #e5eaf3 !important;
}