/*------------------------------------------------------------------
MIR Rolodex Frontend Overrides
Load this file AFTER main.css and primary.css
File: public/frontend/css/mir.css
-------------------------------------------------------------------*/

/*--------------------------------------------------------------
# Brand Variables
--------------------------------------------------------------*/
:root {
    --mir-primary: #0f2a3d;
    --mir-primary-dark: #071722;
    --mir-accent: #b89b5e;
    --mir-accent-dark: #9f8348;
    --mir-light: #f6f4ef;
    --mir-soft: #f5f5f5;
    --mir-white: #ffffff;
    --mir-black: #071722;
    --mir-text: #555555;
    --mir-heading: #222222;
    --mir-border: #e6e6e6;
    --mir-muted: #888888;
    --mir-danger: #d9534f;
    --mir-success: #28a745;
}

/*--------------------------------------------------------------
# Global Branding
--------------------------------------------------------------*/
body {
    color: var(--mir-text);
}

a,
a:visited {
    color: var(--mir-primary);
}

a:hover,
a:focus {
    color: var(--mir-accent);
}

.text-black {
    color: var(--mir-heading);
}

.bg-primary {
    background: var(--mir-primary) !important;
}

.bg-black {
    background: var(--mir-primary-dark) !important;
}

.bg-grey-light {
    background: var(--mir-soft) !important;
}

.bg-grey {
    background: #e9e7e1 !important;
}

.bg-grey-dark {
    background: var(--mir-primary) !important;
}

.mir-bg-light {
    background: var(--mir-light) !important;
}

.mir-bg-primary {
    background: var(--mir-primary) !important;
}

.mir-bg-dark {
    background: var(--mir-primary-dark) !important;
}

.mir-text-primary {
    color: var(--mir-primary) !important;
}

.mir-text-accent {
    color: var(--mir-accent) !important;
}

.mir-white {
    color: var(--mir-white);
    margin-bottom: 15px;
}

.mir-cta-text {
    color: var(--mir-white);
    max-width: 780px;
    margin: 0 auto 25px;
    line-height: 1.8;
}

/*--------------------------------------------------------------
# Buttons
--------------------------------------------------------------*/
.au-btn,
.au-btn-primary,
button.au-btn,
input.au-btn {
    background: var(--mir-primary);
    border-color: var(--mir-primary);
    color: var(--mir-white) !important;
}

.au-btn:hover,
.au-btn:focus,
.au-btn-primary:hover,
.au-btn-primary:focus {
    background: var(--mir-accent);
    border-color: var(--mir-accent);
    color: var(--mir-white) !important;
}

.au-btn-border,
.au-btn-border-light {
    background: transparent;
    border-color: var(--mir-white);
    color: var(--mir-white) !important;
}

.au-btn-border:hover,
.au-btn-border-light:hover {
    background: var(--mir-accent);
    border-color: var(--mir-accent);
    color: var(--mir-white) !important;
}

.btn-gradient,
.btn-mir {
    background: var(--mir-primary) !important;
    border-color: var(--mir-primary) !important;
    color: var(--mir-white) !important;
}

.btn-gradient:hover,
.btn-mir:hover {
    background: var(--mir-accent) !important;
    border-color: var(--mir-accent) !important;
    color: var(--mir-white) !important;
}

/*--------------------------------------------------------------
# Headings
--------------------------------------------------------------*/
.heading-section-1 h3,
.heading-section-2 h3,
.heading-page-1 .title {
    color: var(--mir-heading);
}

.heading-section-2 h3:after {
    background: var(--mir-accent);
}

.heading-section-2.light h3,
.heading-page-1 .title {
    color: var(--mir-white);
}

.heading-page-1 {
    position: relative;
    background-color: var(--mir-primary-dark);
}

.heading-page-1:before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(7, 23, 34, 0.62);
    z-index: 0;
}

.heading-page-1 .container {
    position: relative;
    z-index: 2;
}

.heading-page-1 .breadcrumbs li a,
.heading-page-1 .breadcrumbs li:after {
    color: var(--mir-white);
}

/*--------------------------------------------------------------
# Header / Topbar
--------------------------------------------------------------*/
.topbar {
    background: var(--mir-primary-dark) !important;
}

.topbar .icon-box-4 span,
.icon-box-4 span,
.topbar .icon-box-4 a span {
    color: var(--mir-white);
}

.topbar .icon-box-4 .icon {
    color: var(--mir-accent);
}

.topbar .social-item-1 {
    background: rgba(255, 255, 255, 0.12);
}

.topbar .social-item-1:hover {
    background: var(--mir-accent);
}

.topbar .social-item-1 a {
    color: var(--mir-white);
}

.section-navbar-2 {
    background: var(--mir-white) !important;
}

.logo img {
    max-height: 75px;
    width: auto;
}

.au-navbar-menu > li > a,
.navbar-1 ul li a {
    color: var(--mir-primary-dark);
    font-weight: 700;
}

.au-navbar-menu > li > a:hover,
.navbar-1 ul li a:hover {
    color: var(--mir-accent);
}

.navbar-1 ul li.drop .drop-menu {
    border-top: 3px solid var(--mir-accent);
}

.navbar-1 ul li.drop .drop-menu li a {
    color: var(--mir-primary-dark);
}

.navbar-1 ul li.drop .drop-menu li a:hover {
    color: var(--mir-accent);
    background: var(--mir-light);
}

.section-navbar-1.fixed,
.section-navbar-2.fixed {
    background: rgba(255, 255, 255, 0.98) !important;
}

.header-mobile-1 .top-header {
    background: var(--mir-white);
}

.navbar-mobile-1 ul.au-navbar-menu {
    background: var(--mir-primary-dark);
}

.navbar-mobile-1 ul.au-navbar-menu li a {
    color: var(--mir-white);
}

.navbar-mobile-1 ul.au-navbar-menu li a:hover {
    color: var(--mir-accent);
}

.navbar-mobile-1 ul.au-navbar-menu li.drop .drop-menu {
    background: var(--mir-white);
}

.navbar-mobile-1 ul.au-navbar-menu li.drop .drop-menu li a {
    color: var(--mir-primary-dark);
}

.navbar-mobile-1 ul.au-navbar-menu li.drop .drop-menu li a:hover {
    color: var(--mir-accent);
}

/*--------------------------------------------------------------
# Slider
--------------------------------------------------------------*/
.slider-1 .caption-1 {
    color: var(--mir-white);
    text-shadow: 0 3px 14px rgba(0, 0, 0, 0.35);
}

.slider-1 .caption-2 {
    color: #f1f1f1;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}

.slider-1 .tparrows {
    background: rgba(7, 23, 34, 0.5);
}

.slider-1 .tparrows:hover {
    background: var(--mir-accent);
}

/*--------------------------------------------------------------
# CTA
--------------------------------------------------------------*/
.cta-section-1,
.cta-section-2 {
    background: var(--mir-primary) !important;
}

.cta-section-1 p,
.cta-section-2 p {
    color: var(--mir-white);
}

/*--------------------------------------------------------------
# Icon Boxes
--------------------------------------------------------------*/
.icon-box-5 .icon {
    background: var(--mir-primary);
}

.icon-box-5 .icon a,
.icon-box-5 .icon i {
    color: var(--mir-white);
}

.icon-box-5:hover .icon {
    background: var(--mir-accent);
}

.icon-box-5 .content .title a {
    color: var(--mir-heading);
}

.icon-box-5 .content .title a:hover {
    color: var(--mir-accent);
}

.icon-box-1 .icon {
    border-color: var(--mir-border);
}

.icon-box-1 .icon i {
    color: var(--mir-accent);
}

.mir-card-min {
    min-height: 220px;
}

.mir-list {
    margin: 0;
    padding: 0;
}

.mir-list li {
    margin-bottom: 12px;
    font-size: 15px;
    line-height: 1.7;
}

.mir-list li i {
    margin-right: 8px;
    color: var(--mir-accent);
}

/*--------------------------------------------------------------
# Image Cards
--------------------------------------------------------------*/
.image-card-1 {
    margin-bottom: 35px;
}

.image-card-1 .image {
    background: var(--mir-light);
}

.image-card-1 .image img {
    width: 100%;
    height: 230px;
    object-fit: cover;
}

.image-card-1 .title,
.image-card-1 .title a {
    color: var(--mir-heading);
}

.image-card-1 .title a:hover {
    color: var(--mir-accent);
}

.image-card-1 .link a {
    color: var(--mir-primary);
    font-weight: 700;
}

.image-card-1 .link a:hover {
    color: var(--mir-accent);
}

.image-card-1.dark a {
    color: var(--mir-heading);
}

.image-card-1.dark a:hover {
    color: var(--mir-accent);
}

.limited-lines {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}

.limited-lines-2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.limited-lines-3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.limited-lines-6 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    overflow: hidden;
}

/*--------------------------------------------------------------
# News / Events
--------------------------------------------------------------*/
.news-event-card {
    min-height: 430px;
}

.news-event-meta {
    font-size: 13px;
    margin-bottom: 10px;
    color: var(--mir-muted);
}

.news-event-type {
    display: inline-block;
    background: var(--mir-primary);
    color: var(--mir-white);
    padding: 4px 9px;
    margin-right: 8px;
    border-radius: 3px;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.4px;
}

.news-event-date {
    color: var(--mir-muted);
}

.news-event-detail-image {
    width: 100%;
    max-height: 460px;
    object-fit: cover;
    margin-bottom: 25px;
}

.post-tabs-1 li.active a,
.post-tabs-1 li a:hover {
    border-left-color: var(--mir-accent);
    color: var(--mir-primary);
}

/*--------------------------------------------------------------
# Resources
--------------------------------------------------------------*/
.resource-card {
    min-height: 430px;
}

.resource-card .image img {
    width: 100%;
    height: 210px;
    object-fit: cover;
}

.resource-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    font-size: 13px;
    color: var(--mir-muted);
    margin-bottom: 10px;
}

.resource-type {
    display: inline-block;
    background: var(--mir-primary);
    color: var(--mir-white);
    padding: 4px 10px;
    border-radius: 3px;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.4px;
}

.resource-date {
    color: var(--mir-muted);
}

.resource-card .link a {
    font-weight: 700;
}

.resource-card .link .fa-download {
    margin-right: 6px;
}

.resource-download-btn {
    display: inline-block;
    background: var(--mir-primary);
    color: var(--mir-white) !important;
    padding: 10px 16px;
    border-radius: 3px;
    font-weight: 700;
}

.resource-download-btn:hover {
    background: var(--mir-accent);
    color: var(--mir-white) !important;
}

/*--------------------------------------------------------------
# Service Pages
--------------------------------------------------------------*/
.service-detail-image {
    width: 100%;
    max-height: 460px;
    object-fit: cover;
    margin-bottom: 25px;
}

.sidebar-lists-1 li a:hover,
.sidebar-lists-1 li.active a {
    color: var(--mir-accent);
}

.banner-contact {
    background: var(--mir-primary);
    color: var(--mir-white);
}

.banner-contact h4,
.banner-contact p {
    color: var(--mir-white);
}

/*--------------------------------------------------------------
# Forms / Contact
--------------------------------------------------------------*/
.au-input-2,
.au-textarea,
.form-control {
    border-color: var(--mir-border);
}

.au-input-2:focus,
.au-textarea:focus,
.form-control:focus {
    border-color: var(--mir-accent);
    box-shadow: none;
}

.contact-form-section {
    border-color: var(--mir-border);
}

.alert-success {
    border-color: rgba(40, 167, 69, 0.25);
}

.alert-danger {
    border-color: rgba(217, 83, 79, 0.25);
}

.text-danger {
    color: var(--mir-danger) !important;
}

/*--------------------------------------------------------------
# Pagination
--------------------------------------------------------------*/
.pagination {
    display: inline-flex;
    gap: 6px;
    padding-left: 0;
}

.pagination > li > a,
.pagination > li > span,
.page-link {
    color: var(--mir-primary);
    border-color: var(--mir-border);
}

.pagination > .active > a,
.pagination > .active > span,
.page-item.active .page-link {
    background: var(--mir-primary);
    border-color: var(--mir-primary);
    color: var(--mir-white);
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.page-link:hover {
    background: var(--mir-light);
    border-color: var(--mir-accent);
    color: var(--mir-accent);
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.footer-1 {
    background: var(--mir-primary-dark) !important;
}

.footer-1 .title h3 {
    color: var(--mir-white);
}

.footer-summary {
    color: #cccccc;
    margin-top: 15px;
    line-height: 1.8;
}

.footer-block-1 .quick-link ul li a,
.bot-footer .quick-link ul li a {
    color: #e5e5e5;
}

.footer-block-1 .quick-link ul li a:hover,
.bot-footer .quick-link ul li a:hover {
    color: var(--mir-accent);
}

.footer-block-2 .contact-list ul li {
    color: #aaaaaa;
}

.footer-block-2 .contact-list ul li a {
    color: #e5e5e5;
}

.footer-block-2 .contact-list ul li a:hover {
    color: var(--mir-accent);
}

.footer-block-3 .social-list .social-item-1 {
    background: rgba(255, 255, 255, 0.12);
}

.footer-block-3 .social-list .social-item-1:hover {
    background: var(--mir-accent);
}

.footer-block-3 .social-list .social-item-1 a {
    color: var(--mir-white);
}

.bot-footer .block-inner {
    border-top-color: rgba(255, 255, 255, 0.08);
}

.bot-footer .block-left span {
    color: #e5e5e5;
}

/*--------------------------------------------------------------
# Cards / Utility Blocks
--------------------------------------------------------------*/
.mir-card {
    background: var(--mir-white);
    border: 1px solid var(--mir-border);
    padding: 25px;
    margin-bottom: 30px;
    transition: all 0.3s ease;
}

.mir-card:hover {
    box-shadow: 0 6px 20px rgba(7, 23, 34, 0.08);
    transform: translateY(-2px);
}

.mir-card-title {
    color: var(--mir-heading);
    font-weight: 700;
    margin-top: 0;
}

.mir-badge {
    display: inline-block;
    background: var(--mir-primary);
    color: var(--mir-white);
    padding: 4px 10px;
    border-radius: 3px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.mir-badge-accent {
    background: var(--mir-accent);
}

.mir-divider {
    width: 55px;
    height: 5px;
    background: var(--mir-accent);
    border-radius: 4px;
    margin: 15px 0 25px;
}

.mir-center {
    text-align: center;
}

.mir-center .mir-divider {
    margin-left: auto;
    margin-right: auto;
}

/*--------------------------------------------------------------
# Tables / Content from TinyMCE
--------------------------------------------------------------*/
.text-block table,
.content table,
.mir-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
}

.text-block table td,
.text-block table th,
.content table td,
.content table th,
.mir-content table td,
.mir-content table th {
    border: 1px solid var(--mir-border);
    padding: 10px;
}

.text-block table th,
.content table th,
.mir-content table th {
    background: var(--mir-light);
    color: var(--mir-heading);
}

/*--------------------------------------------------------------
# Back to Top
--------------------------------------------------------------*/
#up-to-top {
    background: var(--mir-primary);
    color: var(--mir-white);
}

#up-to-top:hover {
    background: var(--mir-accent);
}

/*--------------------------------------------------------------
# Responsive Fixes
--------------------------------------------------------------*/
@media (max-width: 1199px) {
    .logo img {
        max-height: 65px;
    }

    .navbar-2 > ul > li {
        margin-left: 20px;
    }
}

@media (max-width: 991px) {
    .header-mobile-1 .top-header .logo img {
        max-height: 65px;
        width: auto;
    }

    .image-card-1 .image img,
    .resource-card .image img {
        height: 210px;
    }

    .mir-card-min,
    .resource-card,
    .news-event-card {
        min-height: auto;
    }
}

@media (max-width: 767px) {
    .logo img {
        max-height: 58px;
    }

    .heading-page-1 {
        padding: 50px 0;
    }

    .heading-page-1 .title {
        font-size: 32px;
    }

    .heading-section-2 h3 {
        font-size: 26px;
    }

    .cta-section-1 .block-left,
    .cta-section-1 .block-right,
    .cta-section-2 .block-left,
    .cta-section-2 .block-right {
        float: none;
        display: block;
        text-align: center;
    }

    .cta-section-1 .block-left,
    .cta-section-2 .block-left {
        margin-bottom: 15px;
    }

    .bot-footer .block-left,
    .bot-footer .block-right {
        float: none;
        text-align: center;
    }

    .bot-footer .quick-link ul li {
        float: none;
        display: inline-block;
        margin: 0 8px;
    }

    .resource-meta {
        display: block;
    }

    .resource-date {
        display: block;
        margin-top: 8px;
    }
}

@media (max-width: 479px) {
    .header-mobile-1 .top-header .logo {
        margin-top: 0;
    }

    .header-mobile-1 .top-header .logo img {
        max-height: 52px;
        width: auto;
    }

    .image-card-1 .image img,
    .resource-card .image img {
        height: 190px;
    }

    .heading-page-1 .title {
        font-size: 28px;
    }

    .au-btn {
        font-size: 16px;
        padding: 13px 22px;
    }
}