/*
 * Keysletter - Custom Overrides
 *
 * Product:     Keysletter Email Marketing Platform
 * Version:     1.0.0
 * Author:      Key Design & Art
 * Website:     https://keysletter.com
 */

/* Breadcrumb */
.breadcrumb.breadcrumb-block {
    border-radius: 8px;
}
.breadcrumb.breadcrumb-light,
.breadcrumb.breadcrumb-light a,
.breadcrumb.breadcrumb-light li,
.breadcrumb.breadcrumb-light .active {
    color: #fff !important;
}
.breadcrumb.breadcrumb-light .active {
    opacity: 0.8;
}

/* Card list items - same size as p */
.card-body ul li {
    font-size: 1rem;
    line-height: 1.8;
}

/* Headings normal case */
h1, h2, h3, h4, h5, h6 {
    text-transform: none;
}

/* Footer list items */
#footer li,
#footer .list li,
#footer ul li {
    color: #6c757d;
    font-size: inherit;
    line-height: inherit;
}

/* Footer useful links - match paragraph size */
#footer .list.list-icons li,
#footer .list.list-icons li a {
    font-size: 1rem;
    line-height: 1.8;
}

/* Footer Ribbon */
#footer .footer-ribbon span {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 700;
}

/* Footer Form */
#footer .contact-form .form-control,
#footer .contact-form textarea,
#footer .contact-form input[type="text"],
#footer .contact-form input[type="email"],
#footer .contact-form input[type="submit"],
#footer .contact-form .btn {
    border-radius: 8px !important;
}

/* ══════════════════════════════════════════
   Pricing Page
   ══════════════════════════════════════════ */

/* Plan border-radius */
.pricing-table .plan {
    border-radius: 8px !important;
    overflow: hidden;
}
.pricing-table .plan .plan-header,
.pricing-table .plan .plan-price,
.pricing-table .plan .plan-features,
.pricing-table .plan .plan-footer {
    border-radius: 0 !important;
}
.pricing-table .plan .plan-footer {
    border-bottom-left-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}
@media (min-width: 992px) {
    .pricing-table .plan { border-radius: 0 !important; }
    .pricing-table .plan .plan-footer {
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }
    /* Starter: sol üst + sol alt */
    .pricing-table .col-lg-3:first-child .plan {
        border-radius: 8px 0 0 8px !important;
    }
    .pricing-table .col-lg-3:first-child .plan .plan-header {
        border-top-left-radius: 7px !important;
    }
    .pricing-table .col-lg-3:first-child .plan .plan-footer {
        border-bottom-left-radius: 7px !important;
    }
    /* Plus: alt kenarlar */
    .pricing-table .col-lg-3:nth-child(2) .plan {
        border-radius: 0 0 8px 8px !important;
    }
    .pricing-table .col-lg-3:nth-child(2) .plan .plan-footer {
        border-bottom-left-radius: 7px !important;
        border-bottom-right-radius: 7px !important;
    }
    /* Pro (featured): dört kenar */
    .pricing-table .col-lg-3:nth-child(3) .plan.plan-featured {
        border-radius: 8px !important;
    }
    .pricing-table .col-lg-3:nth-child(3) .plan.plan-featured .plan-header {
        border-radius: 7px 7px 0 0 !important;
    }
    .pricing-table .col-lg-3:nth-child(3) .plan.plan-featured .plan-footer {
        border-bottom-left-radius: 7px !important;
        border-bottom-right-radius: 7px !important;
    }
    /* Enterprise: sağ üst + sağ alt */
    .pricing-table .col-lg-3:last-child .plan {
        border-radius: 0 8px 8px 0 !important;
    }
    .pricing-table .col-lg-3:last-child .plan .plan-header {
        border-top-right-radius: 7px !important;
    }
    .pricing-table .col-lg-3:last-child .plan .plan-footer {
        border-bottom-right-radius: 7px !important;
    }
}

/* Plan buttons */
.pricing-table .plan .plan-footer .btn {
    border-radius: 8px !important;
    padding: 8px 22px !important;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    transition: all 0.3s;
}
.pricing-table .plan .plan-footer .btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0,0,0,0.15);
}
.pricing-table .plan .plan-footer .btn.btn-dark,
.pricing-table .plan .plan-footer .btn.btn-outline {
    color: var(--dark) !important;
}
.pricing-table .plan .plan-footer .btn.btn-dark:hover,
.pricing-table .plan .plan-footer .btn.btn-outline:hover {
    background: var(--dark) !important;
    border-color: var(--dark) !important;
    color: #fff !important;
}
.pricing-table .plan.plan-featured .plan-footer .btn {
    padding: 10px 26px !important;
}
.pricing-table .plan.plan-featured .plan-footer .btn.btn-primary:hover {
    background: var(--dark) !important;
    border-color: var(--dark) !important;
    color: #fff !important;
}

/* Currency switch desktop left */
@media (min-width: 992px) {
    #currencySwitchRow {
        position: relative;
        display: flex;
        justify-content: flex-start;
        align-items: flex-end;
        margin-bottom: -20px;
        z-index: 2;
    }
}

/* Add-on card */
.kl-addon-card {
    border: 1px solid rgba(0,0,0,0.08);
    border-radius: 12px;
    padding: 28px 32px;
    display: flex;
    align-items: center;
    gap: 20px;
    background: #fff;
    transition: box-shadow 0.3s, transform 0.3s;
}
.kl-addon-card:hover {
    box-shadow: 0 8px 30px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}
.kl-addon-icon {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    flex-shrink: 0;
}
.kl-addon-body { flex: 1; }
.kl-addon-price {
    font-size: 1.5rem;
    font-weight: 700;
    white-space: nowrap;
}

/* Feature table rounded */
.kl-table-wrapper {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,0.08);
}
.kl-table-wrapper table { margin-bottom: 0; }
.kl-table-wrapper thead th { border-top: none; }

/* ══════════════════════════════════════════
   Shared CTA Gradient (Pricing, References)
   ══════════════════════════════════════════ */
.kl-cta-gradient {
    background: linear-gradient(135deg, #c2690a 0%, #f59e0b 100%);
    border-radius: 16px;
    padding: 60px 48px;
    position: relative;
    overflow: hidden;
}
.kl-cta-gradient > * { position: relative; z-index: 1; }
.kl-cta-shape {
    position: absolute;
    border-radius: 50%;
    opacity: 0.12;
    z-index: 0;
}
.kl-cta-shape-1 { width: 200px; height: 200px; border: 3px solid #fff; top: -60px; right: -40px; }
.kl-cta-shape-2 { width: 120px; height: 120px; background: #fff; bottom: -30px; left: 60px; }
.kl-cta-shape-3 { width: 60px; height: 60px; background: #fff; top: 30px; left: 20%; }
.kl-cta-shape-4 { width: 300px; height: 300px; border: 4px solid #fff; bottom: -120px; right: 15%; }
.kl-cta-shape-5 { width: 24px; height: 24px; background: #fff; opacity: 0.2; top: 25%; right: 10%; }
.kl-cta-shape-6 { width: 16px; height: 16px; background: #fff; opacity: 0.25; bottom: 30%; left: 8%; }
.kl-cta-plus {
    position: absolute;
    color: rgba(255,255,255,0.12);
    font-size: 32px;
    font-weight: 700;
    z-index: 0;
}
.kl-cta-plus-1 { top: 18px; right: 22%; }
.kl-cta-plus-2 { bottom: 20px; right: 8%; font-size: 22px; }
.kl-cta-plus-3 { top: 40%; left: 5%; font-size: 26px; }

/* CTA button */
.kl-cta-btn {
    background: #fff !important;
    color: #f59e0b !important;
    border: none !important;
    border-radius: 50px !important;
    font-weight: 700 !important;
    font-size: 1rem !important;
    padding: 14px 36px !important;
    transition: all 0.35s cubic-bezier(0.4,0,0.2,1) !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none !important;
}
.kl-cta-btn:hover {
    background: var(--dark) !important;
    color: #fff !important;
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.3);
    text-decoration: none !important;
}
.kl-cta-btn i { transition: color 0.35s; }
.kl-cta-btn:hover i { color: #fff !important; }

/* CTA outline variant */
.kl-cta-btn-outline {
    background: transparent !important;
    border: 2px solid #fff !important;
    color: #fff !important;
}
.kl-cta-btn-outline:hover {
    background: #fff !important;
    border-color: #fff !important;
    color: #f59e0b !important;
}
.kl-cta-btn-outline:hover i { color: #f59e0b !important; }

@media (max-width: 767px) {
    .kl-cta-gradient { padding: 40px 24px; border-radius: 12px; }
    .kl-addon-card { flex-direction: column; text-align: center; }
    .kl-addon-price { margin-top: 4px; }
}

/* Navbar login button hover */
.kl-nav-login-btn:hover {
    background: var(--dark) !important;
    color: #fff !important;
    border-color: var(--dark) !important;
}

/* ══════════════════════════════════════════
   Homepage
   ══════════════════════════════════════════ */

/* Hero buttons */
.kl-hero-btn-primary {
    background: #f59e0b !important;
    color: #fff !important;
    border: 2px solid #f59e0b !important;
    text-decoration: none !important;
    transition: all 0.3s !important;
}
.kl-hero-btn-primary:hover {
    background: var(--dark) !important;
    color: #fff !important;
    border-color: var(--dark) !important;
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.3);
}
.kl-hero-btn-outline {
    background: rgba(255,255,255,0.08) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
    text-decoration: none !important;
    transition: all 0.3s !important;
}
.kl-hero-btn-outline:hover {
    background: #fff !important;
    color: #1a1a1a !important;
    border-color: #fff !important;
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(255,255,255,0.15);
}

/* Process steps center fix */
.process.process-connecting-line .process-step {
    align-items: center;
}
.process.process-connecting-line .connecting-line {
    top: 22px;
}

/* ══════════════════════════════════════════
   Contact Page
   ══════════════════════════════════════════ */

/* Social media icons */
.kl-social-icon {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    background: rgba(245,158,11,0.08);
    color: #f59e0b;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
}
.kl-social-icon:hover {
    background: #f59e0b;
    color: #fff !important;
}
.kl-social-icon i { color: inherit !important; }

/* Contact form submit button */
.kl-contact-submit-btn {
    color: #fff !important;
    transition: all 0.3s !important;
}
.kl-contact-submit-btn:hover {
    background: var(--dark) !important;
    border-color: var(--dark) !important;
    color: #fff !important;
}

/* ══════════════════════════════════════════
   References Page
   ══════════════════════════════════════════ */

/* Logo grid */
.kl-logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100px;
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 12px;
    background: #fff;
    transition: all 0.3s;
    padding: 0 10px;
}
.kl-logo-item:hover {
    box-shadow: 0 6px 24px rgba(0,0,0,0.08);
    transform: translateY(-3px);
    border-color: rgba(245,158,11,0.2);
}
.kl-logo-item i {
    font-size: 2.8rem;
    color: #adb5bd;
    transition: color 0.3s;
}
.kl-logo-item:hover i { color: #6c757d; }
.kl-logo-item img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.kl-logo-item a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}
.kl-logo-text {
    font-size: 1.4rem;
    font-weight: 700;
    color: #adb5bd;
    letter-spacing: -0.5px;
    transition: color 0.3s;
}
.kl-logo-item:hover .kl-logo-text { color: #6c757d; }

/* Stats */
.kl-stat-card {
    text-align: center;
    padding: 32px 16px;
}
.kl-stat-number {
    font-size: 2.8rem;
    font-weight: 800;
    line-height: 1;
    background: linear-gradient(135deg, #c2690a, #f59e0b);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
