/*
Theme Name: Mitchell County Kansas
Theme URI: https://www.mitchellcountyks.gov/
Author: Neerja Softwares Pvt. Ltd.
Description: Responsive and accessibility-focused custom WordPress theme converted from the supplied Mitchell County HTML design.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: mitchell-county
*/

html {
            scroll-behavior: smooth;
        }

        body {
            font-size: 17px;
            line-height: 1.65;
            -webkit-font-smoothing: antialiased;
        }

        ::selection {
            background: #2F6B3F;
            color: #fff;
        }

        :focus-visible {
            outline: 3px solid #2F6B3F;
            outline-offset: 2px;
            border-radius: 4px;
            box-shadow: 0 0 0 5px #D97706;
        }

        .shell {
            width: 100%;
            max-width: 1240px;
            margin-inline: auto;
            padding-inline: 1.25rem;
        }

        @media (min-width: 768px) {
            .shell {
                padding-inline: 2rem;
            }
        }

        .eyebrow {
            font-weight: 600;
            font-size: .8125rem;
            letter-spacing: .06em;
            text-transform: uppercase;
        }

        .tnum {
            font-variant-numeric: tabular-nums;
        }

        .skip-link {
            position: absolute;
            left: 1rem;
            top: -100%;
            z-index: 100;
            background: #2F6B3F;
            color: #fff;
            padding: .75rem 1.25rem;
            font-weight: 600;
            border-radius: 0 0 6px 6px;
            transition: top .18s ease;
        }

        .skip-link:focus {
            top: .75rem;
        }

        .icon {
            fill: none;
            stroke: currentColor;
            stroke-width: 1.75;
            stroke-linecap: round;
            stroke-linejoin: round;
            flex: none;
        }

        /* Accessibility helper: visually hidden but available to screen readers */
        .sr-only {
            position: absolute !important;
            width: 1px !important;
            height: 1px !important;
            padding: 0 !important;
            margin: -1px !important;
            overflow: hidden !important;
            clip: rect(0, 0, 0, 0) !important;
            white-space: nowrap !important;
            border: 0 !important;
        }

        @media (prefers-reduced-motion: reduce) {
            html {
                scroll-behavior: auto;
            }

            *,
            *::before,
            *::after {
                transition-duration: .001ms !important;
                animation-duration: .001ms !important;
            }
        }

        .mc-dropdown.is-open>.mc-dropdown-panel {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }

        .mc-dropdown.is-open>.mc-dropdown-panel.mc-dropdown-panel-center {
            transform: translate(-50%, 0);
        }


        /* Mitchell County original-style dropdown navigation */
        .mc-primary-nav {
            font-size: 15px;
        }

        .mc-primary-nav>ul {
            gap: 2px;
        }

        .mc-nav-link {
            position: relative;
            display: flex;
            align-items: center;
            gap: 2px;
            height: 52px;
            padding: 0 6px;
            border: 0;
            background: transparent;
            color: #1f2937;
            font: inherit;
            font-weight: 500;
            white-space: nowrap;
            cursor: pointer;
            text-decoration: none;
        }

        .mc-nav-link:hover,
        .mc-dropdown:focus-within>.mc-nav-link {
            background: #eef5f0;
            color: #2F6B3F;
        }

        .mc-chevron {
            font-size: 11px;
            line-height: 1;
            opacity: .7;
            margin-left: 3px;
            font-weight: 700;
        }

        .mc-dropdown {
            position: relative;
        }

        .mc-dropdown-panel {
            position: absolute;
            top: 100%;
            left: 0;
            z-index: 80;
            width: 205px;
            padding: 0;
            background: #2F6B3F;
            box-shadow: 0 12px 28px rgba(15, 23, 42, .18);
            opacity: 0;
            visibility: hidden;
            transform: translateY(6px);
            transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
        }

        .mc-dropdown:hover>.mc-dropdown-panel,
        .mc-dropdown:focus-within>.mc-dropdown-panel {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }

        .mc-dropdown-panel>a,
        .mc-subdropdown>a {
            position: relative;
            display: flex;
            align-items: center;
            justify-content: space-between;
            min-height: 45px;
            padding: 10px 15px;
            color: #fff;
            font-size: 14px;
            line-height: 1.2;
            text-decoration: none;
            background: #2F6B3F;
        }

        .mc-dropdown-panel>a:hover,
        .mc-subdropdown:hover>a,
        .mc-subdropdown:focus-within>a {
            background: #3f8c54;
        }

        .mc-dropdown-panel-left {
            left: 0;
        }

        .mc-dropdown-panel-center {
            left: 50%;
            transform: translate(-50%, 6px);
        }

        .mc-dropdown:hover>.mc-dropdown-panel-center,
        .mc-dropdown:focus-within>.mc-dropdown-panel-center {
            transform: translate(-50%, 0);
        }

        .mc-government-menu {
            width: 200px;
        }

        .mc-living-menu {
            width: 200px;
        }

        .mc-recreation-menu {
            width: 200px;
        }

        .mc-subdropdown {
            position: relative;
        }

        .mc-subdropdown-panel {
            position: absolute;
            top: 0;
            left: 100%;
            z-index: 90;
            min-width: 200px;
            background: #3f8c54;
            box-shadow: 0 12px 28px rgba(15, 23, 42, .16);
            opacity: 0;
            visibility: hidden;
            transform: translateX(5px);
            transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
        }

        .mc-subdropdown:hover>.mc-subdropdown-panel,
        .mc-subdropdown:focus-within>.mc-subdropdown-panel {
            opacity: 1;
            visibility: visible;
            transform: translateX(0);
        }

        .mc-subdropdown-panel a {
            display: flex;
            align-items: center;
            justify-content: space-between;
            min-height: 45px;
            padding: 10px 15px;
            color: #fff;
            font-size: 14px;
            line-height: 1.15;
            text-decoration: none;
        }

        .mc-subdropdown-panel a:hover {
            background: #2F6B3F;
        }

        .mc-schools-panel {
            min-width: 220px;
        }

        .mc-parks-panel {
            min-width: 155px;
        }

        .mc-burn-panel {
            min-width: 220px;
        }

        .mc-mobile-nav {
            display: grid;
            gap: 4px;
        }

        .mc-mobile-nav>a,
        .mc-mobile-nav summary {
            display: flex;
            align-items: center;
            justify-content: space-between;
            min-height: 52px;
            padding: 0 16px;
            border-radius: 8px;
            color: #111827;
            background: #eef5f0;
            font-weight: 600;
            text-decoration: none;
            cursor: pointer;
            list-style: none;
        }

        .mc-mobile-nav summary::-webkit-details-marker {
            display: none;
        }

        .mc-mobile-nav summary::after {
            content: '+';
            font-size: 20px;
            color: #2F6B3F;
        }

        .mc-mobile-nav details[open] summary::after {
            content: '−';
        }

        .mc-mobile-nav details>div {
            margin: 2px 0 5px;
            padding: 5px;
            border-radius: 8px;
            background: #2F6B3F;
        }

        .mc-mobile-nav details>div a {
            display: block;
            padding: 11px 13px;
            color: #fff;
            font-size: .95rem;
            text-decoration: none;
            border-radius: 5px;
        }

        .mc-mobile-nav details>div a:hover {
            background: #3f8c54;
        }

        @media (max-width: 1400px) {
            .mc-primary-nav {
                font-size: 14px;
            }

            .mc-nav-link {
                padding-inline: 9px;
            }
        }

        .calendar-day {
            position: relative;
            min-height: 112px;
            border-right: 1px solid #dfe5ec;
            border-bottom: 1px solid #dfe5ec;
            padding: 8px 6px;
            background: #fff;
        }

        .calendar-day:nth-child(7n) {
            border-right: 0;
        }

        .calendar-date {
            display: block;
            text-align: center;
            font-size: 10px;
            line-height: 1;
            font-weight: 600;
            color: #333;
        }

        .calendar-event {
            display: block;
            margin-top: 10px;
            overflow: hidden;
            border-radius: 4px;
            background: #7c88cf;
            color: #fff;
            padding: 2px 4px;
            font-size: 10px;
            line-height: 1.2;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .calendar-dot-event {
            display: block;
            margin-top: 9px;
            padding-left: 9px;
            color: #333;
            font-size: 10px;
            line-height: 1.1;
            white-space: nowrap;
        }

        .calendar-dot-event::before {
            content: '';
            width: 5px;
            height: 5px;
            margin-left: -8px;
            margin-right: 3px;
            margin-bottom: 1px;
            display: inline-block;
            border-radius: 50%;
            background: #7c88cf;
        }

        /* ================================
           Mitchell County Calendar Styling
           ================================ */
        #meetings .mx-auto.max-w-\[1040px\] {
            max-width: 900px;
        }

        #mc-calendar {
            width: min(100%, 820px);
            margin-inline: auto;
            border: 1px solid #dce3eb;
            border-radius: 10px;
            background: #eef2f7;
            box-shadow: 0 8px 24px rgba(15, 23, 42, .08);
        }

        #mc-calendar>div:first-child {
            min-height: 52px;
        }

        #mc-calendar button,
        #mc-calendar select {
            font-family: inherit;
        }

        #mc-calendar button {
            -webkit-tap-highlight-color: transparent;
        }

        #mc-calendar #mc-today {
            min-width: 68px;
            height: 34px;
            padding: 0 14px;
            border: 1px solid #aeb8c4;
            border-radius: 999px;
            background: #fff;
            color: #334155;
            font-size: 13px;
            font-weight: 600;
            transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
        }

        #mc-calendar #mc-today:hover {
            border-color: #7f8b99;
            background: #f8fafc;
        }

        #mc-calendar #mc-today:focus-visible,
        #mc-calendar #mc-prev:focus-visible,
        #mc-calendar #mc-next:focus-visible,
        #mc-calendar select:focus-visible {
            outline: 2px solid #2F6B3F;
            outline-offset: 2px;
        }

        #mc-calendar #mc-prev,
        #mc-calendar #mc-next {
            width: 30px;
            height: 30px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            color: #475569;
            font-size: 20px;
            line-height: 1;
            transition: background .15s ease, color .15s ease;
        }

        #mc-calendar #mc-prev:hover,
        #mc-calendar #mc-next:hover {
            background: #fff;
            color: #111827;
        }

        #mc-calendar #mc-month-select {
            min-width: 145px;
            height: 34px;
            padding: 0 24px 0 8px;
            border: 0;
            border-radius: 6px;
            background-color: transparent;
            color: #1e293b;
            font-size: 14px;
            font-weight: 600;
        }

        #mc-calendar #mc-view-select {
            height: 34px;
            min-width: 82px;
            padding: 0 12px;
            border: 1px solid #aeb8c4;
            border-radius: 999px;
            background: #fff;
            color: #334155;
            font-size: 13px;
            font-weight: 600;
        }

        #mc-calendar .calendar-grid {
            overflow-x: auto;
            scrollbar-width: thin;
            scrollbar-color: #cbd5e1 transparent;
        }

        #mc-calendar .calendar-grid>div {
            min-width: 680px;
        }

        #mc-calendar .calendar-grid>div>div:first-child {
            min-height: 34px;
            background: #f8fafc;
        }

        #mc-calendar .calendar-grid>div>div:first-child>div {
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 34px;
            border-right: 1px solid #e1e7ee;
            color: #64748b;
            font-size: 9px;
            letter-spacing: .04em;
        }

        #mc-calendar .calendar-grid>div>div:first-child>div:last-child {
            border-right: 0;
        }

        #mc-calendar #mc-calendar-grid {
            grid-auto-rows: minmax(86px, auto);
            background: #fff;
        }

        #mc-calendar .calendar-day {
            position: relative;
            min-height: 86px;
            padding: 7px 6px 6px;
            border-right: 1px solid #e1e7ee;
            border-bottom: 1px solid #e1e7ee;
            background: #fff;
            overflow: hidden;
            transition: background .15s ease;
        }

        #mc-calendar .calendar-day:nth-child(7n) {
            border-right: 0;
        }

        #mc-calendar .calendar-day:hover {
            background: #fafdfb;
        }

        #mc-calendar .calendar-day-muted {
            background: #f8fafc;
        }

        #mc-calendar .calendar-day-muted .calendar-date {
            color: #a8b0ba;
        }

        #mc-calendar .calendar-date {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 22px;
            min-height: 22px;
            margin: 0 auto;
            padding: 0 4px;
            border-radius: 50%;
            color: #1f2937;
            font-size: 10px;
            line-height: 1;
            font-weight: 600;
        }

        #mc-calendar .calendar-today {
            background: #2F6B3F;
            color: #fff !important;
            font-weight: 800;
        }

        #mc-calendar .calendar-event-button {
            width: 100%;
            display: block;
            border: 0;
            cursor: pointer;
            text-align: left;
            font-family: inherit;
            transition: filter .15s ease, transform .15s ease;
        }

        #mc-calendar .calendar-event-button:hover {
            filter: brightness(.94);
        }

        #mc-calendar .calendar-event-button:focus-visible {
            outline: 2px solid #D97706;
            outline-offset: 1px;
        }

        #mc-calendar .calendar-event {
            margin-top: 7px;
            min-height: 17px;
            padding: 2px 5px;
            overflow: hidden;
            border-radius: 4px;
            background: #5b5fc7;
            color: #fff;
            font-size: 9px;
            line-height: 1.35;
            font-weight: 500;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        #mc-calendar .calendar-dot-event {
            position: relative;
            margin-top: 6px;
            padding: 2px 3px 2px 12px;
            color: #334155;
            background: transparent;
            font-size: 9px;
            line-height: 1.3;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        #mc-calendar .calendar-dot-event::before {
            content: "";
            position: absolute;
            left: 3px;
            top: 50%;
            width: 5px;
            height: 5px;
            margin-top: -2.5px;
            border-radius: 50%;
            background: #5b5fc7;
        }

        #mc-calendar>div:last-child {
            min-height: 56px;
        }

        #mc-calendar>div:last-child p {
            margin: 0;
        }

        #mc-calendar>div:last-child a {
            color: #2563eb;
        }

        @media (max-width: 767px) {
            #meetings .mx-auto.max-w-\[1040px\] {
                max-width: 100%;
            }

            #mc-calendar {
                width: 100%;
                border-radius: 8px;
            }

            #mc-calendar>div:first-child {
                padding: 8px 10px;
            }

            #mc-calendar #mc-month-select {
                min-width: 120px;
                font-size: 13px;
            }

            #mc-calendar .calendar-grid>div {
                min-width: 650px;
            }
        }

        @media (max-width: 480px) {
            #mc-calendar>div:first-child {
                align-items: stretch;
            }

            #mc-calendar>div:first-child>div:first-child,
            #mc-calendar>div:first-child>div:last-child {
                width: 100%;
                justify-content: space-between;
            }

            #mc-calendar #mc-month-select {
                flex: 1;
                min-width: 0;
            }

            #mc-calendar .calendar-grid>div {
                min-width: 620px;
            }

            #mc-calendar .calendar-day {
                min-height: 78px;
            }

            #mc-calendar>div:last-child {
                padding: 10px 12px;
            }
        }

        @media (prefers-reduced-motion: reduce) {

            #mc-calendar *,
            #mc-calendar *::before,
            #mc-calendar *::after {
                transition: none !important;
            }
        }

        @media (max-width: 640px) {
            .calendar-day {
                min-height: 78px;
            }
        }

/* WordPress and accessibility hardening */
img, svg, video { max-width: 100%; }
img { height: auto; }
.admin-bar #site-header { top: 32px; }
@media (max-width:782px){ .admin-bar #site-header { top:46px; } }
.screen-reader-text { position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
.screen-reader-text:focus { clip:auto!important;width:auto;height:auto;margin:0;padding:.75rem 1rem;top:5px;left:5px;z-index:100000;background:#fff;color:#111827; }
@media (max-width: 1279px){ .mc-primary-nav { display:none; } }

/* WordPress Custom Logo */
.site-branding .custom-logo-link { display: inline-flex; align-items: center; }
.site-branding .custom-logo { display: block; width: auto; height: 52px; max-width: 260px; object-fit: contain; }
@media (min-width: 1024px) { .site-branding .custom-logo { height: 65px; max-width: 300px; } }
