/* CondoPodcast brand theme — custom overrides for PodcastGenerator default theme */

/* Brand variables */
:root {
    --cp-primary:      #227bbd;
    --cp-primary-dark: #1a5f94;
    --cp-primary-light: #eaf4fc;
}

/* ---------- Base ---------- */
body, html {
    font-family: "Montserrat", sans-serif;
    background: #fff;
    color: #333;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
}

/* ---------- Navbar ---------- */
.cp-navbar {
    background-color: var(--cp-primary) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
}

.cp-navbar .navbar-brand {
    color: #fff;
    font-weight: 700;
    font-size: 1.15rem;
}
.cp-navbar .navbar-brand:hover {
    color: rgba(255, 255, 255, .85);
}

.cp-navbar .nav-link {
    color: rgba(255, 255, 255, .85) !important;
    font-weight: 600;
    padding: .5rem 1rem !important;
    transition: color .15s;
}
.cp-navbar .nav-link:hover {
    color: #fff !important;
}

.cp-logo {
    height: 36px;
    width: auto;
    margin-right: .5rem;
    vertical-align: middle;
}

/* ---------- Hero ---------- */
.cp-hero {
    position: relative;
    min-height: calc(100vh - 58px);
    background-color: var(--cp-primary);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: #fff;
    display: flex;
    align-items: center;
}

/* Dark overlay for readability over background image — adjust opacity as needed */
.cp-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0);
    z-index: 0;
}

.cp-hero > .container {
    position: relative;
    z-index: 1;
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.cp-hero-title {
    color: #fff;
    font-size: 2.6rem;
    letter-spacing: -.5px;
    margin-bottom: .4rem;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .3);
}

.cp-hero-subtitle {
    color: rgba(255, 255, 255, .75);
    font-size: 1.1rem;
    font-weight: 400;
    font-style: italic;
    margin: 0 0 0 .65rem;
    text-shadow: 0 1px 4px rgba(0, 0, 0, .3);
}

.cp-hero-lead {
    color: rgba(255, 255, 255, .9);
    font-size: 1.15rem;
    margin-bottom: 1.75rem;
    max-width: 680px;
    text-shadow: 0 1px 4px rgba(0, 0, 0, .3);
}

.cp-hero .btn-light {
    background: #fff;
    color: var(--cp-primary);
    border: none;
    font-weight: 600;
    border-radius: 4px;
    padding: .4rem 1.2rem;
    margin: .2rem .1rem;
}
.cp-hero .btn-light:hover {
    background: var(--cp-primary-light);
    color: var(--cp-primary-dark);
}

/* Freebox card inside hero: reset white text inherited from hero */
.cp-hero .card {
    color: #333;
}

/* ---------- Search bar ---------- */
.cp-search {
    background: #f8f9fa;
    padding: 1.25rem 0;
    border-bottom: 1px solid #e9ecef;
}

.cp-search .form-control {
    border-radius: 4px 0 0 4px;
    border-right: 0;
    font-size: .95rem;
}

.cp-search .btn {
    border-radius: 0 4px 4px 0;
}

/* ---------- Main content ---------- */
.cp-main {
    padding-top: 2.5rem;
    padding-bottom: 2rem;
}

/* ---------- Links ---------- */
a {
    color: var(--cp-primary);
}
a:hover {
    color: var(--cp-primary-dark);
}

/* ---------- Buttons ---------- */
.btn-info,
.btn-primary {
    background-color: var(--cp-primary);
    border-color: var(--cp-primary);
    color: #fff;
    font-weight: 600;
}
.btn-info:hover,
.btn-info:focus,
.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--cp-primary-dark);
    border-color: var(--cp-primary-dark);
    color: #fff;
}

.btn-outline-primary {
    color: var(--cp-primary);
    border-color: var(--cp-primary);
    font-weight: 600;
}
.btn-outline-primary:hover {
    background-color: var(--cp-primary);
    border-color: var(--cp-primary);
    color: #fff;
}

/* ---------- Cards ---------- */
.card {
    border: none;
    border-radius: 10px;
    box-shadow: 0 2px 16px rgba(0, 0, 0, .08);
    transition: box-shadow .2s;
}
.card:hover {
    box-shadow: 0 4px 24px rgba(0, 0, 0, .13);
}

.card-img-top {
    border-radius: 10px 10px 0 0;
}

.card h5 a {
    color: #222;
    text-decoration: none;
}
.card h5 a:hover {
    color: var(--cp-primary);
}

.card-footer {
    background: #fff !important;
    border-top: 1px solid #f0f0f0;
    border-radius: 0 0 10px 10px !important;
}

/* ---------- List group (categories) ---------- */
.list-group-item-action:focus,
.list-group-item-action:hover {
    color: var(--cp-primary);
    background-color: var(--cp-primary-light);
}
.list-group-item.active {
    background-color: var(--cp-primary);
    border-color: var(--cp-primary);
}

/* ---------- Pagination ---------- */
.page-link {
    color: var(--cp-primary);
}
.page-item.active .page-link {
    background-color: var(--cp-primary);
    border-color: var(--cp-primary);
    color: #fff;
}
.page-link:hover {
    color: var(--cp-primary-dark);
}

/* ---------- Footer ---------- */
.cp-footer {
    background: var(--cp-primary);
    color: rgba(255, 255, 255, .85);
    padding: 2.5rem 0 1.5rem;
    margin-top: 3rem;
}

.cp-footer a {
    color: rgba(255, 255, 255, .85);
    text-decoration: none;
}
.cp-footer a:hover {
    color: #fff;
}

.cp-footer-brand {
    color: #fff;
    font-weight: 700;
    font-size: 1.1rem;
    margin-bottom: .3rem;
}

.cp-footer-tagline {
    font-size: .875rem;
    margin-bottom: 0;
}

.cp-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, .25);
    margin-top: 1.5rem;
    padding-top: 1rem;
    font-size: .8rem;
    text-align: center;
    color: rgba(255, 255, 255, .7);
}

/* ---------- Material Icons sizing ---------- */
.material-icons {
    font-size: 1em;
    vertical-align: middle;
    line-height: 1;
}