/* MORZO corrected components.css */

/* Buttons */
.btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:var(--space-2);
    padding:8px 16px;
    min-height:38px;
    border-radius:999px;
    font-size:14px;
    font-weight:var(--font-weight-semibold);
    cursor:pointer;
    text-decoration:none;
}

.btn-primary {
    background:#003631;
    color:#ffffff;
}

.btn-secondary {
    background:#FFEDA8;
    color:#003631;
}

.btn-outline {
    border:2px solid #003631;
    color:#003631;
    background:#ffffff;
}



/* =========================================
   GLOBAL SECTION SYSTEM
========================================= */

.section{

    background:#FCFAF5;

}

.section-container{

    width:100%;

    max-width:1200px;

    margin:0 auto;

}

/* ---------- Heading Block ---------- */

.section-heading{

    max-width:900px;

    margin-bottom:30px;

}

.section-label{

    display:inline-block;

    margin-bottom:8px;

    font-size:13px;

    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;

    color:#003631;

}

.section-title{

    margin:0 0 14px;

    font-size:34px;

    line-height:1.15;

    font-weight:800;

    letter-spacing:-1px;

    color:#003631;

}

.section-description{

    margin:0;

    max-width:900px;

    font-size:18px;

    line-height:1.7;

    color:#5E6472;

	margin-bottom:40px;

}

/* ---------- Content ---------- */

.section-content{

    margin-top:30px;

}



/* =====================================
   PUBLIC HEADER
===================================== */

.public-header {

    width:100%;

    background:#ffffff;

    padding:10px 0;

    box-shadow:0 4px 20px rgba(0,0,0,0.08);

    position:relative;

    z-index:100;

}



.header-container {

    position:relative;

    width:100%;

    display:grid;

    grid-template-columns:minmax(0, 1fr) auto auto;

    align-items:center;

    gap:20px;

    padding:0 40px;

}



.logo {

    display:flex;

    flex-direction:column;

    justify-content:center;

    line-height:1;

}


.logo a {

    text-decoration:none;

    color:#003631;

    font-size:22px;

    font-weight:800;

    letter-spacing:-1px;

}


.logo strong {

    display:block;

    font-size:22px;

    font-weight:800;

    color:#003631;

    letter-spacing:-1px;

}


.logo span {

    display:block;

    margin-top:2px;

    font-size:11px;

    font-weight:600;

    color:#6b7280;

    letter-spacing:0.5px;

}



.public-nav {

    display:flex;

    align-items:center;

    justify-content:center;

    gap:24px;

    white-space:nowrap;

    min-width:0;

    flex-shrink:1;

}

.public-nav a {

    font-size:16px;

    font-weight:700;

    color:#003631;

    text-decoration:none;

    white-space:nowrap;

    flex-shrink:0;

}


.header-actions a,
.header-actions button {

    height:40px;

    padding:0 26px;

    border-radius:14px;

    font-size:16px;

    font-weight:700;

}

.public-nav a:hover {
    color:#FFB700;
}


/* Hero */
.hero {

    min-height:560px;

    display:flex;

    align-items:center;

    padding:60px 40px;

}

.hero h1 {

    font-size:56px;
    line-height:1.15;
    max-width:700px;
    letter-spacing:-1px;

}

.hero p {

    font-size:18px;

    max-width:680px;

    line-height:1.6;

    color:#d8e5e3;

}

.hero .btn {

    padding:14px 28px;

    font-size:15px;

    border-radius:14px;

}


.hero-layout {

    display:grid;

    grid-template-columns:

    1fr 1fr;

    align-items:center;

    gap:50px;

}


.hero-image img {

    width:100%;

    max-width:520px;

    height:520px;

    border-radius:24px;

    object-fit:cover;

}


.hero-image {

    display:flex;

    align-items:center;

    justify-content:center;

}



/* =====================================
   PUBLIC HEADER INFORMATION
===================================== */

.header-info {

    display:flex;

    align-items:center;

    justify-content:flex-start;

    gap:14px;

    min-width:0;

    white-space:nowrap;

    font-size:14px;

    font-weight:600;

    color:#003631;

    overflow:hidden;

}

.header-info span {

    display:inline-flex;

    align-items:center;

	flex-shrink:0;

}



/* =========================================
   AUTHENTICATED HEADER ACTIONS
========================================= */

.header-actions {

    display:flex;

    align-items:center;

    justify-content:flex-end;

    gap:12px;

    min-width:0;

    white-space:nowrap;

}


.header-actions .header-user-info {

    display:flex !important;

    align-items:center;

    gap:6px !important;

    margin-left:0 !important;

    margin-right:0 !important;

    white-space:nowrap;

    flex-shrink:1;

}


.header-actions .btn {

    flex-shrink:0;

}


.header-actions .btn-outline,
.header-actions .btn-primary {

    height:40px;

    padding:0 20px;

    border-radius:14px;

    font-size:15px;

    font-weight:700;

}



.header-user-info > span:first-child {

    max-width:100px;

    overflow:hidden;

    text-overflow:ellipsis;

    white-space:nowrap;

}



/* =========================================
   LOGGED-IN HEADER COMPACT MODE
========================================= */

.header-container:has(.header-user-info) .public-nav {

    gap:18px;

}

.header-container:has(.header-user-info) .public-nav a {

    font-size:15px;

}

.header-container:has(.header-user-info) .header-info {

    gap:10px;

    font-size:13px;

}

.header-container:has(.header-user-info) .header-actions {

    gap:8px;

}

.header-container:has(.header-user-info) .header-actions .btn {

    padding-left:16px;

    padding-right:16px;

}



@media (max-width: 1199px) and (min-width: 993px) {

    .header-container {

        gap:16px;

        padding:0 24px;

    }

    .header-info {

        gap:10px;

        font-size:13px;

    }

    .public-nav {

        gap:18px;

    }

    .public-nav a {

        font-size:15px;

    }

    .header-actions {

        gap:8px;

    }

    .header-actions .btn-outline,
    .header-actions .btn-primary {

        padding:0 14px;

        font-size:14px;

    }

}


/* =========================================
   MOBILE PUBLIC HEADER
========================================= */

@media (max-width: 992px) {

    .header-container {

        grid-template-columns:minmax(0,1fr) auto auto;

        gap:12px;

        padding:0 20px;

    }

    .header-info {

        gap:8px;

        flex-wrap:wrap;

        white-space:normal;

        font-size:11px;

        line-height:1.3;

    }

    .public-nav {

        display:none;

    }

    .mobile-menu-btn {

        display:block;

    }

}



/* =====================================
   SOCIETY TOP BAR
===================================== */


.society-topbar {

    background:var(--morzo-primary);

    color:var(--morzo-white);

    font-size:13px;

	min-height:40px;

}



.topbar-container {


    width:100%;

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:8px 40px;



}



.topbar-left,
.topbar-center,
.topbar-right {


    display:flex;

    align-items:center;

    gap:20px;


}



.topbar-center {


    color:var(--morzo-gold);

    font-weight:600;


}



/* =====================================
   SOCIETY IDENTITY BANNER
===================================== */

.society-identity-banner {
    width: 100%;
    background: #003631;
	color: #FCFAF5;
	text-align: center;
    padding: 18px 20px 14px;
}

.society-identity-content {
    min-height: 56px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 10px 24px;
    text-align: center;
}

.society-name {
    font-size: 32px;
    font-weight: 700;
    letter-spacing: -0.3px;
	line-height: 1.15;
}

.society-location {
    margin-top: 4px;
    font-size: 18px;
    font-weight: 400;
    opacity: 0.85;
}



/* =====================================
   MORZO SOCIETY HEADER TOP
===================================== */

.society-header-top {
    width: 100%;
}



/* =====================================
   NOTICE TICKER
===================================== */


.notice-ticker {

    height:40px;

    display:flex;

    align-items:center;

    background:#fffaf0;

    overflow:hidden;

}



.notice-label {

    height:100%;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:8px;

    padding:0 18px;

    background:#FFEDA8;

    color:#003631;

    font-size:15px;

    font-weight:700;

    line-height:1;

    white-space:nowrap;

}



.notice-scroll {

    flex:1;

    overflow:hidden;

}



.notice-content {

    display:flex;

    gap:80px;

    width:max-content;

    white-space:nowrap;

    animation:notice-scroll 20s linear infinite;

}



.notice-item {

    display:flex;

    align-items:center;

    gap:6px;

    color:#003631;

    font-size:14px;

    font-weight:600;

    line-height:1.2;

}



@keyframes notice-scroll {


    from {

        transform:translateX(100%);

    }


    to {

        transform:translateX(-100%);

    }


}


/* =====================================
   SOCIETY UPDATES TICKER
===================================== */


.society-updates{

    display:flex;

    align-items:center;

    background:#fffaf0;

    border-bottom:1px solid #eee;

    height:40px;

    overflow:hidden;

	z-index:100;

}



.updates-label{

    height:100%;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:8px;

    padding:0 18px;

    background:#FFEDA8;

    color:#003631;

    font-size:15px;

    font-weight:700;

    line-height:1;

    white-space:nowrap;

}



.updates-scroll{

    overflow:hidden;

    flex:1;

}



.updates-content{

    display:flex;

    gap:80px;

    width:max-content;

    white-space:nowrap;

    will-change:transform;

    animation:updateScroll 20s linear infinite;

}



.update-item{

    display:flex;

    align-items:center;

    gap:6px;

    color:#003631;

    font-size:14px;

    font-weight:600;

    line-height:1.2;

}



@keyframes updateScroll{


    from{

        transform:translateX(100%);

    }


    to{

        transform:translateX(-100%);

    }


}


/* =========================================
   PUBLIC FOOTER
========================================= */


.public-footer {

    background:var(--morzo-primary);

    color:var(--morzo-white);

    padding:5px 50px;

	margin-top: auto;

}



.footer-container {

    display:flex;

    justify-content:space-between;

    align-items:flex-end;

    gap:40px;

    max-width:1100px;

    margin:0 auto;

}



.footer-info {

    max-width:500px;

}



.footer-info h3 {

    font-size:18px;

    font-weight:700;

    margin-bottom:8px;

    color:var(--morzo-white);

}



.footer-info p {

    margin:3px 0;

    font-size:13px;

    line-height:1.4;

    color:rgba(252,250,245,0.85);

}



.footer-meta {

    text-align:left;
	padding-bottom:0;

}



.footer-meta p {

    margin:3px 0;

    font-size:13px;

    color:rgba(252,250,245,0.85);

}


/* =========================================
   FACILITY IMAGE SLIDER
========================================= */


.facilities-section{

    background:#FCFAF5;

    padding:80px 0;

}


.facility-slider-wrapper{

	overflow:hidden;

	width:100%;

	margin-top:40px;

}



.facility-slider{


	display:flex;


	gap:20px;


	will-change:transform;


	width:max-content;


	animation:facilityScroll 70s linear infinite;


}



.facility-slider:hover{

    animation-play-state: paused;

}



.facility-slide{


	width:320px;


	background:#ffffff;


	border-radius:20px;


	overflow:hidden;


	box-shadow:0 10px 30px rgba(0,0,0,0.08);


	transition:transform .35s ease,
               box-shadow .35s ease;


}



.facility-slide:hover{

    transform:translateY(-8px);

    box-shadow:0 18px 40px rgba(0,0,0,.15);

}



.facility-slide img{


	width:100%;


	height:220px;


	object-fit:cover;


	display:block;


}



.facility-slide-content{


	padding:24px;


}



.facility-slide-content h3{

    font-size:20px;

    font-weight:700;

    color:#003631;

    line-height:1.3;

    margin-bottom:12px;

}



.facility-slide-content p{


font-size:16px;


font-weight:400;


line-height:1.7;


color:#6b7280;


margin:0;


}




@keyframes facilityScroll{


from{

transform:translateX(0);

}


to{

transform:translateX(-50%);

}


}


/* =========================================
   GALLERY IMAGE SLIDER
========================================= */


.gallery-slider-wrapper{

    overflow:hidden;

    width:100%;

	margin-top:40px;

}



.gallery-slider{

    display:flex;


	gap:20px;


	will-change:transform;


	width:max-content;


	animation:galleryScroll 70s linear infinite;

}



.gallery-slider:hover{

    animation-play-state:paused;

}



.gallery-slide{


    width:320px;


    background:#ffffff;


    border-radius:20px;


    overflow:hidden;


    box-shadow:
    0 10px 30px rgba(0,0,0,0.08);


	transition:transform .35s ease,
               box-shadow .35s ease;


}



.gallery-slide img{


    width:100%;


    height:220px;


    object-fit:cover;


    display:block;


}



.gallery-title{


    padding:25px 0 0;


    text-align:center;


    font-size:20px;


    font-weight:700;


    color:#003631;


}



.gallery-slide:hover{

    transform:translateY(-8px);

    box-shadow:0 18px 40px rgba(0,0,0,.15);

}


.gallery-slide h3 {
    font-size: 18px;
    font-weight: 700;
    text-align: center;
}


.gallery-slide p {
    font-size: 14px;
    text-align: center;
    color: #6b7280;
}





@keyframes galleryScroll{


    from{

        transform:translateX(-50%);

    }


    to{

        transform:translateX(0);

    }


}




/* =====================================
   GALLERY SECTION SPACING
===================================== */

.gallery-section{

	background:#FCFAF5;

    padding:80px 0;

}

.mobile-menu-btn {

    display:none;

    background:none;

    border:none;

    font-size:26px;

    color:#003631;

    cursor:pointer;

}

.mobile-menu {

    display:none;

    position:absolute;

    top:100%;

    left:0;

    width:100%;

    background:#ffffff;

    padding:20px;

    box-shadow:0 10px 30px rgba(0,0,0,0.15);

    z-index:1200;

}


.mobile-menu a {

    display:block;

    padding:12px 0;

    color:#003631;

    text-decoration:none;

    font-size:16px;

    font-weight:700;

}


/* =========================================
   ABOUT SECTION
========================================= */


.about-section {

    padding:40px 0 80px;

    background:#fcfaf5;

}



.about-container {

    max-width:1200px;

    margin:0 auto;

    display:grid;

    grid-template-columns:1fr 1fr;

    align-items:center;

    gap:60px;

}



/* About Content */

.about-content h2 {

    font-size:48px;

    line-height:1.15;

    font-weight:800;

    color:#003631;

    margin-bottom:25px;

    letter-spacing:-1px;

}



.about-content p {

    font-size:17px;

    line-height:1.8;

    color:#374151;

    margin-bottom:18px;

}



/* Small Label */

.about-label {

    display:inline-block;

    margin-bottom:15px;

    font-size:13px;

    font-weight:700;

    letter-spacing:1px;

    color:#003631;

    text-transform:uppercase;

}



/* About Image */

.about-image {

    display:flex;

    justify-content:center;

}



.about-image img {

    width:100%;

    max-width:560px;

    height:420px;

    object-fit:cover;

    border-radius:24px;

    box-shadow:0 15px 35px rgba(0,0,0,0.12);

}



/* =========================================
   ABOUT MOBILE
========================================= */


@media(max-width:768px){


    .about-section {

        padding:50px 50px;

    }



    .about-container {

        grid-template-columns:1fr;

        gap:20px;

        text-align:left;

    }



    .about-content h2 {

        font-size:34px;

    }



    .about-content p {

        font-size:15px;

        line-height:1.7;

    }



    .about-image {

        order:-1;

    }



    .about-image img {

        height:280px;

        border-radius:18px;

    }


	.society-highlights-card {

        flex:0 0 280px;

    }


    .society-highlights-card img {

        height:180px;

    }


	.timeline-wrapper::before{

    left:14px;

	}



	.timeline-item{

    flex-direction:column;

    padding-left:45px;

	}



	.timeline-year{

    width:auto;

	}



	.timeline-dot{

    position:absolute;

    left:6px;

    top:12px;

	}

}



/* =========================================
   SOCIETY HIGHLIGHTS SLIDER
========================================= */



.society-highlights-section {

    background:#fcfaf5;

	padding:80px 0;

}


.society-highlights-slider-wrapper {

    overflow:hidden;

    display:block;

	margin-top:40px;

	width:100%;

}



.society-highlights-card img {

    width:100%;

    height:300px;

    object-fit:cover;

}




.society-highlights-slider {

    display:flex;

	gap:20px;

	width:max-content;

	will-change:transform;

	animation: societyScroll 70s linear infinite;

}



.society-highlights-card{

    flex:0 0 320px;

    width:320px;

    background:#fff;

    border-radius:20px;

    overflow:hidden;

    box-shadow:0 10px 30px rgba(0,0,0,.10);

    transition:transform .35s ease,
               box-shadow .35s ease;

}



.society-highlights-card:hover{

    transform:translateY(-8px);

    box-shadow:0 18px 40px rgba(0,0,0,.15);

}



.society-highlights-slider:hover {

    animation-play-state:paused;

}



@keyframes societyScroll {

    from {
        transform:translateX(-50%);
    }

    to {
        transform:translateX(0);
    }

}


.society-highlights-content {

	padding:24px;

	text-align:left;

}


.society-highlights-content h3 {

    font-size:20px;

    font-weight:700;

    color:#003631;

    margin-bottom:12px;

}


.society-highlights-content p {

    font-size:16px;

    line-height:1.7;

    color:#6b7280;

}




/* =========================================
   MANAGING COMMITTEE
========================================= */


.committee-section{

    background:#fcfaf5;

	padding:80px 0;

}



.committee-slider-wrapper{

	overflow:hidden;

	width:100%;

	display:block;

	margin-top:40px;

}



.committee-slider{

	display:flex;

	gap:20px;

	width:max-content;

	will-change:transform;

	animation: committeeScroll 70s linear infinite;

}



.committee-slider::-webkit-scrollbar{

display:none;

}



.committee-card{

	flex:0 0 320px;

	width:320px;

    flex-shrink:0;

    background:#ffffff;

    border-radius:20px;

    overflow:hidden;

    box-shadow:0 10px 30px rgba(0,0,0,0.10);

	transition:transform .35s ease,
               box-shadow .35s ease;

}



.committee-card img{

width:100%;

height:300px;

object-fit:cover;

}



.committee-card-content{

padding:24px;

text-align:left;

}



.committee-card-content h3{

    margin:0;

    font-size:20px;

    font-weight:700;

    color:#003631;

	margin-bottom:10px;

}



.committee-role{

    margin-top:4px;

    color:#6b7280;

    font-size:16px;

    font-weight:500;

}


.committee-card:hover{

    transform:translateY(-8px);

    box-shadow:
    0 18px 40px rgba(0,0,0,0.15);

}


.committee-slider:hover{

	animation-play-state:paused;

}


@keyframes committeeScroll {

	from {
    transform:translateX(0);
	}

	to {
    transform:translateX(-50%);
	}

}


/*======================================
  Society Timeline
======================================*/

.society-timeline{

    background:#FCFAF5;

	padding:80px 0;

}


/*======================================
  Timeline Section Header
======================================*/

.society-timeline .section-heading{

    max-width:900px;

}


.timeline-wrapper{

    position:relative;

    max-width:1100px;

	width:100%;

    margin:40px auto 0;

}

.timeline-wrapper::before{

    content:"";

    position:absolute;

    left:100px;

    top:0;

    bottom:0;

    width:3px;

    background:rgba(0,54,49,.18);

    opacity:.15;

}

.timeline-item{

    display:flex;

    gap:20px;

    margin-bottom:20px;

    position:relative;

}

.timeline-year{

    width:80px;

	text-align:right;

    flex-shrink:0;

    font-size:34px;

    font-weight:700;

    color:var(--color-primary);

	letter-spacing:-1px;

}

.timeline-dot{

    width:22px;

    height:22px;

    background:#003631;

	border:6px solid #ffffff;

    border-radius:50%;

    margin-top:10px;

    position:relative;

    left:-11px;

    flex-shrink:0;

    box-shadow:0 0 0 4px rgba(0,54,49,.12);

}

.timeline-card{

    background:#ffffff;

	border:1px solid rgba(0,0,0,.05);

    border-radius:18px;

    padding:24px 30px;

    box-shadow:0 12px 35px rgba(0,0,0,.08);

    flex:1;

	transition:
        transform .35s ease,
        box-shadow .35s ease;

}


.timeline-card:hover{

    transform:translateY(-5px);

    box-shadow:0 18px 40px rgba(0,0,0,.12);

}


.timeline-card h3{

    margin:0 0 10px;

    font-size:24px;

    font-weight:700;

    color:#003631;

}

.timeline-card p{

    margin:0;

    font-size:16px;

    line-height:1.6;

    color:#6B7280;

}



/* =========================================
   STAT WIDGET
========================================= */

.widget{

    background:#ffffff;

    border:1px solid rgba(0,0,0,.06);

    border-radius:20px;

    padding:36px 28px;

    text-align:center;

    box-shadow:0 12px 35px rgba(0,0,0,.06);

    transition:all .35s ease;

    height:100%;

}

.widget:hover{

    transform: translateY(-8px);

    box-shadow: 0 22px 45px rgba(0,0,0,.12);

    border-color:#FFEDA8;

}

.widget-icon{

    width:54px;

    height:54px;

    margin:0 auto 14px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#F6F8F7;

    border-radius:16px;

    font-size:28px;

    transition:all .35s ease;

}

.widget:hover .widget-icon{

    background:#FFEDA8;

    transform:scale(1.08);

}



/* =========================================
   GADGETS PAGE
========================================= */


/* =========================================
   POPULAR GADGETS GRID
========================================= */

.popular-gadgets-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));

    gap:30px;

}



/* =========================================
   ALL GADGETS GRID
========================================= */

.gadgets-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));

    gap:30px;

}



/* =========================================
   CATEGORY GRID
========================================= */

.gadget-category-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

    gap:30px;

}



/* =========================================
   GADGET CARD
========================================= */

.gadget-card{

    background:#ffffff;

    border:1px solid rgba(0,54,49,.08);

    border-radius:24px;

    padding:30px;

    display:flex;

    flex-direction:column;

    justify-content:space-between;

    min-height:300px;

    transition:all .35s ease;

    box-shadow:0 8px 24px rgba(0,0,0,.05);

}



.gadget-card:hover{

    transform:translateY(-8px);

    box-shadow:0 20px 40px rgba(0,0,0,.10);

}



/* =========================================
   ICON
========================================= */

.gadget-card-icon{

    width:54px;

    height:54px;

    border-radius:16px;

    background:#f5f8f7;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:28px;

    margin-bottom:14px;

}



/* =========================================
   BODY
========================================= */

.gadget-card-body{

    flex:1;

}



.gadget-card-title{

    font-size:24px;

    font-weight:700;

    color:var(--morzo-primary);

    margin:0 0 15px;

}



.gadget-card-description{

    font-size:16px;

    line-height:1.8;

    color:#6b7280;

    margin:0;

}



/* =========================================
   FOOTER
========================================= */

.gadget-card-footer{

    margin-top:30px;

    padding-top:20px;

    border-top:1px solid rgba(0,54,49,.08);

    display:flex;

    justify-content:space-between;

    align-items:center;

}



/* =========================================
   STATUS
========================================= */

.gadget-status{

    display:inline-flex;

    align-items:center;

    padding:8px 16px;

    border-radius:999px;

    background:#eef7f5;

    color:var(--morzo-primary);

    font-size:13px;

    font-weight:700;

}



.gadget-status.available{

    background:#dcfce7;

    color:#166534;

}

.gadget-status.coming-soon{

    background:#fef3c7;

    color:#92400e;

}



/* =========================================
   ARROW
========================================= */

.gadget-arrow{

    font-size:22px;

    color:var(--morzo-primary);

    transition:transform .3s ease;

}



.gadget-card:hover .gadget-arrow{

    transform:translateX(6px);

}



/* =========================================
   GADGET CATEGORY CARD
========================================= */

.gadget-category-card{

    background:#ffffff;

    border:1px solid rgba(0,54,49,.08);

    border-radius:24px;

    padding:28px;

    display:flex;

    align-items:center;

    gap:20px;

    transition:all .35s ease;

    box-shadow:0 8px 24px rgba(0,0,0,.05);

}



.gadget-category-card:hover{

    transform:translateY(-6px);

    box-shadow:0 18px 36px rgba(0,0,0,.10);

}



/* =========================================
   CATEGORY ICON
========================================= */

.gadget-category-icon{

    width:54px;

    height:54px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:28px;

    border-radius:16px;

    background:#f5f8f7;

	transition: all .35s ease;

}


.gadget-category-card:hover .gadget-category-icon{

    background: #FFEDA8;

    transform: scale(1.08);

}



/* =========================================
   CATEGORY CONTENT
========================================= */

.gadget-category-content{

    flex:1;

}



.gadget-category-content h3{

    margin:0 0 10px;

    font-size:22px;

    color:var(--morzo-primary);

    font-weight:700;

}



.gadget-category-content p{

    margin:0 0 14px;

    font-size:15px;

    line-height:1.7;

    color:#6b7280;

}



/* =========================================
   GADGET COUNT
========================================= */

.gadget-count{

    display:inline-block;

    padding:6px 14px;

    border-radius:999px;

    background:#eef7f5;

    color:var(--morzo-primary);

    font-size:13px;

    font-weight:700;

}



/* =========================================
   CATEGORY ARROW
========================================= */

.gadget-category-arrow{

    font-size:28px;

    color:var(--morzo-primary);

    transition:transform .3s ease;

}



.gadget-category-card:hover .gadget-category-arrow{

    transform:translateX(6px);

}



/* =========================================
   EMERGENCY DIRECTORY
========================================= */

.emergency-grid{

    display:grid;

    grid-template-columns:repeat(auto-fill,minmax(200px,200px));

    gap:20px;

    justify-content:center;

}



/* =========================================
   EMERGENCY TILE
========================================= */

.emergency-tile{

    background:#ffffff;

    border:1px solid rgba(0,54,49,.08);

    border-radius:18px;

    padding:14px;

    min-height:135px;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:space-between;

    text-align:center;

    box-shadow:0 6px 18px rgba(0,0,0,.05);

    transition:.25s ease;

}

.emergency-tile:hover{

    transform:translateY(-8px);

    box-shadow:0 22px 45px rgba(0,0,0,.12);

    border-color:#FFEDA8;

}



/* =========================================
   ICON
========================================= */

.emergency-tile-icon{

    width:54px;

    height:54px;

    border-radius:16px;

    background:#eef5f3;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:28px;

	transition:all .35s ease;

}


.emergency-tile:hover .emergency-tile-icon{

    background:#FFEDA8;

    transform:scale(1.08);

}


/* =========================================
   TITLE
========================================= */

.emergency-tile-title{

    margin:12px 0;

    font-size:18px;

    font-weight:700;

    color:var(--morzo-primary);

}



/* =========================================
   PHONE
========================================= */

.emergency-tile-phone{

    font-size:18px;

    font-weight:700;

    color:var(--morzo-primary);

    white-space:nowrap;

    overflow:hidden;

    text-overflow:ellipsis;

}



/* =========================================
   BUTTON
========================================= */

.emergency-tile-btn{

    width:auto;

    min-width:90px;

    padding:8px 16px;

    border-radius:999px;

    font-size:14px;

    margin-top:12px;

}



/* =========================================
   RESPONSIVE
========================================= */

@media(max-width:992px){

    .emergency-grid{

        grid-template-columns:repeat(2,1fr);

    }

}

@media(max-width:640px){

    .emergency-grid{

        grid-template-columns:1fr;

    }

}



@media(max-width:768px){

    .form-row{

        grid-template-columns:1fr;

    }

}



@media (max-width: 768px) {

    .society-identity-content {
        min-height: 54px;
        flex-direction: column;
        gap: 2px;
        padding: 8px 16px;
    }

    .society-name {
        font-size: 22px;
		font-weight: 700;
    }

    .society-location {
        font-size: 13px;
    }

}



/* =========================================
   GADGET SEARCH
========================================= */

.gadget-search-section{


	margin-top:70px;

    margin-bottom:40px;

}

.gadget-search-box{

    display:flex;

    align-items:center;

	justify-content:space-between;

    gap:12px;

	width:100%;

    max-width:850px;

    margin:0;

    background:#ffffff;

    border:1px solid rgba(0,54,49,.12);

    border-radius:16px;

    padding:14px 20px;

    box-shadow:0 8px 20px rgba(0,0,0,.05);

}

.gadget-search-icon{

    font-size:22px;

}

#gadget-search{

    flex:1;

    border:none;

    outline:none;

    background:transparent;

    font-size:16px;

    color:var(--morzo-primary);

}

#gadget-search::placeholder{

    color:#8b949e;

}


/* =========================================
   CLEAR SEARCH BUTTON
========================================= */

.clear-search-btn{

    display:none;

    align-items:center;

    justify-content:center;

    width:34px;

    height:34px;

    border:none;

    border-radius:50%;

    background:transparent;

    color:#6b7280;

    font-size:20px;

    cursor:pointer;

    transition:all .25s ease;

}

.clear-search-btn:hover{

    background:#eef7f5;

    color:#003631;

}


/* =========================================
   MOBILE HEADER NAVIGATION
========================================= */

.mobile-menu-button{

    display:none;

    background:none;

    border:none;

    font-size:28px;

    color:#003631;

    cursor:pointer;

    padding:8px;

}

/* Tablet & Mobile */

@media (max-width: 992px){

    .mobile-menu-button{

        display:block;

    }

    .main-navigation{

        display:none;

        position:absolute;

        top:100%;

        left:0;

        width:100%;

        background:#ffffff;

        box-shadow:0 12px 30px rgba(0,0,0,.12);

        padding:20px;

        z-index:1200;

    }

    .main-navigation.active{

        display:flex;

        flex-direction:column;

        gap:16px;

    }

    .main-navigation a{

        display:block;

        padding:10px 0;

        font-size:16px;

    }

}


/* =========================================
   PUBLIC MOBILE MENU
========================================= */

.mobile-menu{

    display:none;

    position:absolute;

    top:100%;

    left:0;

    width:100%;

    background:#ffffff;

    box-shadow:0 10px 30px rgba(0,0,0,.12);

    padding:16px;

    z-index:9999;

}

.mobile-menu a{

    display:block;

    padding:12px 0;

    text-decoration:none;

    color:#003631;

    font-weight:600;

    border-bottom:1px solid #eeeeee;

}

.mobile-menu a:last-child{

    border-bottom:none;

}



/* ==========================================
   CONTACT CARDS
========================================== */


.contact-card:hover{

    transform:translateY(-6px);

}

.contact-card .widget-icon{

    margin:0 auto 24px;

}



/* ==========================================
   GADGET CARD HOVER
========================================== */

.gadget-card:hover .gadget-card-icon{

    background: #FFEDA8;

    transform: scale(1.08);

}


.gadget-card-icon{

    transition: all .35s ease;

}



/* =========================================
   MORZO FORM SYSTEM
========================================= */

.morzo-form{

    display:flex;

    flex-direction:column;

    gap:24px;

}

.form-row{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:20px;

}

.form-group{

    display:flex;

    flex-direction:column;

    gap:10px;

}

.form-label{

    font-size:15px;

    font-weight:600;

    color:#003631;

}

.input{

    width:100%;

    min-height:54px;

    padding:0 18px;

    border:1px solid rgba(0,54,49,.15);

    border-radius:14px;

    background:#ffffff;

    font-size:16px;

    color:#003631;

    transition:all .30s ease;

    outline:none;

    box-sizing:border-box;

}

textarea.input{

    min-height:160px;

    padding:16px 18px;

    resize:vertical;

    line-height:1.6;

}

select.input{

    cursor:pointer;

}

.input::placeholder{

    color:#9ca3af;

}

.input:focus{

    border-color:#003631;

    box-shadow:0 0 0 4px rgba(0,54,49,.08);

}

.form-actions{

    margin-top:12px;

}

.form-actions .btn{

    min-width:auto;

}


.container-wide{

    max-width:1400px;

    margin:0 auto;

    padding:0 24px;

}


.map-placeholder{

    height:220px;

    border-radius:16px;

    background:#F6F8F7;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#003631;

    margin-bottom:24px;

}


.office-card{

    transform:none !important;

}

.office-card:hover{

    transform:none !important;

}



/* =========================================
   CONTACT MAP
========================================= */

.map-placeholder{

    width:100%;

    height:260px;

    overflow:hidden;

    border-radius:16px;

    background:#F6F8F7;

}

.map-placeholder iframe{

    width:100%;

    height:100%;

    display:block;

    border:0;

}


/* =========================================
   CONTACT PAGE STATIC CARDS
========================================= */

.contact-form-card {
    height: 100%;
    transform: none !important;
}

.contact-form-card:hover {
    transform: none !important;
}

.office-card {
    transform: none !important;
}

.office-card:hover {
    transform: none !important;
}



/* =========================================
   OFFICE CONTACT BUTTONS
========================================= */

.office-contact-buttons {

    display:flex;

    flex-wrap:wrap;

    gap:12px;

}

.office-contact-btn {

    font-size:14px;

    min-height:38px;

    padding:8px 16px;

    border-radius:999px;

    text-decoration:none;

}


@media(max-width:640px){

    .office-contact-buttons{

        flex-direction:column;

    }

    .office-contact-btn{

        width:100%;

    }

}


.office-contact-section {
    margin-top: 24px;
}



/* =========================================
   ABOUT PAGE - SECTION SPACING FIX
========================================= */

.section.about-intro-section {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

.about-intro-section + .society-highlights-section {
    padding-top: 40px;
}

.society-highlights-section {
    padding-bottom: 40px;
}

.society-highlights-section + .society-timeline {
    padding-top: 40px;
}

/* Timeline → Managing Committee */
.society-timeline {
    padding-bottom: 40px;
}

.society-timeline + .committee-section {
    padding-top: 40px;
}


/* =========================================
   SOCIETY UPDATES - MOBILE TICKER
========================================= */

@media (max-width: 768px){

    .updates-content{

        gap:50px;

        animation-duration:8s;

    }

}



@media (max-width: 768px) {

    .dashboard-header {
        padding-top: 80px;
    }

}


@media (max-width: 768px) {

    .mobile-menu a.btn.btn-outline[href="/dashboard"] {
        border: none !important;
        background: transparent !important;
        border-radius: 0 !important;
        padding: 12px 0 !important;
        text-align: left;
        width: 100%;
        box-shadow: none !important;
    }

}




/* =========================================
   APP-LEVEL MODAL OVERLAY
   Notice View and other modal dialogs must
   sit above the entire SPA, including footer.
========================================= */

body.morzo-modal-open {
    overflow: hidden;
}

.modal {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    box-sizing: border-box;
    background: rgba(0, 54, 49, 0.58);
    z-index: 10000;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, visibility 0.2s ease;
}

.modal.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.modal .modal-content {
    width: min(760px, 100%);
    max-height: min(82vh, 760px);
    overflow: auto;
    background: var(--morzo-white, #FCFAF5);
    color: var(--morzo-primary, #003631);
    border-radius: 18px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
    transform: translateY(12px) scale(0.98);
    transition: transform 0.2s ease;
}

.modal.active .modal-content {
    transform: translateY(0) scale(1);
}

.modal .modal-header {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 24px;
    background: inherit;
    border-bottom: 1px solid rgba(0, 54, 49, 0.10);
}

.modal .modal-header h3 {
    margin: 0;
}

.modal .modal-body {
    padding: 24px;
}

.modal .modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 24px 22px;
    border-top: 1px solid rgba(0, 54, 49, 0.10);
}

.modal .modal-close {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--morzo-primary, #003631);
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
}

.modal .modal-close:hover {
    background: rgba(0, 54, 49, 0.08);
}

@media (max-width: 640px) {
    .modal {
        padding: 12px;
        align-items: flex-end;
    }

    .modal .modal-content {
        max-height: 90vh;
        border-radius: 16px 16px 12px 12px;
    }

    .modal .modal-body {
        padding: 18px;
    }
}

/* =========================================
   MEMBER NOTICE BOARD - TITLE LIST
   Members can read notices, but do not see
   management actions. Clicking a title opens
   the same modal style used by Admin View.
========================================= */
.notice-member-list {
    display: grid;
    gap: 12px;
}

.notice-member-list-item {
    margin: 0;
    padding: 18px 22px;
    cursor: pointer;
    border: 1px solid rgba(0, 54, 49, 0.10);
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.notice-member-list-item:hover,
.notice-member-list-item:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(0, 54, 49, 0.22);
    box-shadow: 0 10px 28px rgba(0, 54, 49, 0.10);
    outline: none;
}

.notice-member-list-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    color: var(--morzo-primary, #003631);
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.45;
}

.notice-member-list-arrow {
    flex: 0 0 auto;
    font-size: 1.6rem;
    line-height: 1;
    opacity: 0.55;
}

/* =========================================
   MEMBER NOTICE BOARD - SEARCH
   Members can search by notice number or
   subject/title. No management actions are
   exposed on the member page.
========================================= */
.notice-member-search-card {
    margin: 22px 0 24px;
    padding: 18px 20px;
}

.notice-member-search-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 10px;
    align-items: center;
    margin-top: 8px;
}

.notice-member-search-row .input {
    min-width: 0;
}

.notice-member-search-result-row {
    margin: 0 0 12px;
    color: var(--morzo-primary, #003631);
}

.notice-member-empty {
    padding: 36px 24px;
}

.notice-member-board-heading .section-title {
    margin-bottom: 4px;
}

@media (max-width: 640px) {
    .notice-member-search-row {
        grid-template-columns: 1fr;
    }

    .notice-member-search-row .btn {
        width: 100%;
    }
}

/* =========================================
   V111A • DASHBOARD WORKSPACE SELECTOR
========================================= */
.dashboard-mode-section {
    background: #FCFAF5;
    padding: 28px 0 0;
}

.dashboard-mode-shell {
    border: 1px solid rgba(0, 54, 49, .12);
    border-radius: 24px;
    padding: 24px;
    background: #ffffff;
    box-shadow: 0 12px 35px rgba(0, 54, 49, .06);
}

.dashboard-mode-intro {
    margin-bottom: 18px;
}

.dashboard-mode-eyebrow {
    display: block;
    margin-bottom: 7px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: #003631;
}

.dashboard-mode-intro h2 {
    margin: 0;
    color: #003631;
    font-size: 25px;
    line-height: 1.2;
}

.dashboard-mode-intro p {
    margin: 7px 0 0;
    color: #687477;
    font-size: 15px;
    line-height: 1.55;
    max-width: 760px;
}

.dashboard-mode-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.dashboard-mode-card {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 24px;
    gap: 14px;
    align-items: center;
    min-height: 96px;
    padding: 16px 18px;
    border: 1px solid #dfe5e3;
    border-radius: 18px;
    background: #FCFAF5;
    color: #003631;
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.dashboard-mode-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(0, 54, 49, .08);
    border-color: rgba(0, 54, 49, .35);
}

.dashboard-mode-card.is-active {
    border: 2px solid #003631;
    background: #003631;
    color: #ffffff;
    box-shadow: 0 12px 28px rgba(0, 54, 49, .15);
}

.dashboard-mode-card.is-active .dashboard-mode-copy small {
    color: rgba(255,255,255,.78);
}

.dashboard-mode-icon {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    background: #FFEDA8;
    font-size: 22px;
}

.dashboard-mode-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.dashboard-mode-copy strong {
    font-size: 17px;
    line-height: 1.25;
}

.dashboard-mode-copy small {
    color: #687477;
    font-size: 13px;
    line-height: 1.45;
}

.dashboard-mode-arrow {
    font-size: 22px;
    font-weight: 700;
}

/* =========================================
   V111A • COMMITTEE DASHBOARD FOUNDATION
========================================= */
.committee-foundation-hero {
    padding: 42px 0 18px;
    background: #FCFAF5;
}

.committee-foundation-hero-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}

.committee-foundation-hero h1 {
    margin: 0;
    color: #003631;
    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.05;
    letter-spacing: -1.5px;
}

.committee-foundation-lead {
    max-width: 720px;
    margin: 14px 0 0;
    color: #687477;
    font-size: 17px;
    line-height: 1.65;
}

.committee-identity-card {
    min-width: 310px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    border: 1px solid #dfe5e3;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(0,54,49,.06);
}

.committee-identity-avatar {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: #FFEDA8;
    font-size: 25px;
}

.committee-identity-card > div:last-child {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.committee-identity-label {
    color: #758184;
    font-size: 12px;
}

.committee-identity-card strong {
    color: #003631;
    font-size: 17px;
}

.committee-identity-card span:last-child {
    color: #687477;
    font-size: 13px;
}

.committee-foundation-section {
    padding-top: 18px;
}

.committee-foundation-panel {
    padding: 28px;
    border: 1px solid #dfe5e3;
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 12px 35px rgba(0,54,49,.06);
}

.committee-foundation-panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.committee-foundation-panel-heading h2 {
    margin: 0;
    color: #003631;
    font-size: 28px;
}

.committee-foundation-panel-heading p {
    margin: 8px 0 0;
    color: #687477;
    line-height: 1.55;
}

.committee-foundation-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    padding: 9px 13px;
    border: 1px solid #dfe5e3;
    border-radius: 999px;
    color: #003631;
    font-size: 13px;
    font-weight: 700;
    background: #FCFAF5;
}

.status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #003631;
}

.committee-foundation-principles {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 14px;
    margin-top: 26px;
}

.committee-principle {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 17px;
    border: 1px solid #e4e9e7;
    border-radius: 17px;
    background: #FCFAF5;
}

.committee-principle-icon {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #ffffff;
    font-size: 18px;
}

.committee-principle div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.committee-principle strong {
    color: #003631;
    font-size: 14px;
}

.committee-principle div span {
    color: #687477;
    font-size: 13px;
    line-height: 1.45;
}

@media (max-width: 850px) {
    .dashboard-mode-options,
    .committee-foundation-principles {
        grid-template-columns: 1fr;
    }

    .committee-foundation-hero-inner,
    .committee-foundation-panel-heading {
        flex-direction: column;
        align-items: stretch;
    }

    .committee-identity-card {
        min-width: 0;
    }
}

@media (max-width: 560px) {
    .dashboard-mode-shell,
    .committee-foundation-panel {
        padding: 18px;
        border-radius: 18px;
    }

    .dashboard-mode-card {
        grid-template-columns: 42px minmax(0,1fr) 18px;
        gap: 11px;
        padding: 14px;
    }

    .dashboard-mode-icon {
        width: 42px;
        height: 42px;
    }
}

/* =========================================
   V111B • Committee Resident Complaints
========================================= */
.committee-dashboard-actions-section { padding-top: 0; }
.committee-dashboard-actions-heading { margin-bottom: 20px; }
.committee-dashboard-actions-heading h2 { margin: 6px 0 8px; }
.committee-dashboard-actions-heading p { color: #6b7f7c; margin: 0; }
.committee-dashboard-action-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; }
.committee-dashboard-action-card { display:flex; align-items:center; gap:18px; padding:22px 24px; border:1px solid rgba(0,54,49,.12); border-radius:18px; background:#fff; text-decoration:none; color:#003631; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.committee-dashboard-action-card:hover { transform:translateY(-2px); box-shadow:0 12px 30px rgba(0,54,49,.08); border-color:rgba(0,54,49,.24); }
.committee-dashboard-action-icon { width:48px; height:48px; border-radius:14px; display:grid; place-items:center; background:rgba(255,237,168,.55); font-size:24px; flex:0 0 48px; }
.committee-dashboard-action-card div { flex:1; min-width:0; }
.committee-dashboard-action-card strong { display:block; font-size:1.08rem; margin-bottom:4px; }
.committee-dashboard-action-card div span { display:block; color:#6b7f7c; line-height:1.55; }
.committee-dashboard-action-arrow { font-size:1.5rem; }
.committee-page-heading { display:flex; justify-content:space-between; gap:24px; align-items:flex-end; margin-bottom:28px; }
.committee-page-heading h1 { margin:7px 0 10px; font-size:clamp(2rem,4vw,3rem); }
.committee-page-heading p { max-width:820px; color:#6b7f7c; line-height:1.65; margin:0; }
.committee-complaint-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:22px; }
.committee-complaint-stat { border:1px solid rgba(0,54,49,.12); border-radius:16px; padding:18px 20px; background:#fff; }
.committee-complaint-stat span { display:block; color:#6b7f7c; font-size:.86rem; font-weight:700; letter-spacing:.03em; }
.committee-complaint-stat strong { display:block; margin-top:8px; font-size:1.8rem; }
.committee-complaint-stat small { display:block; margin-top:3px; color:#8a9997; }
.committee-complaint-stat.is-highlight { background:rgba(255,237,168,.18); border-color:rgba(0,54,49,.16); }
.committee-complaints-panel { padding:24px; }
.committee-complaints-panel-heading { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; margin-bottom:20px; }
.committee-complaints-panel-heading h2 { margin:0 0 6px; }
.committee-live-pill { display:inline-flex; align-items:center; gap:8px; padding:9px 13px; border:1px solid rgba(0,54,49,.12); border-radius:999px; white-space:nowrap; font-size:.86rem; font-weight:700; }
.committee-live-pill .status-dot { width:8px; height:8px; border-radius:50%; background:#003631; display:inline-block; }
.committee-complaint-filters { display:grid; grid-template-columns:minmax(260px,1fr) 190px 180px auto; gap:12px; align-items:end; margin-bottom:20px; }
.committee-complaint-search { min-width:0; }
.committee-complaints-table td { vertical-align:top; }
.committee-complaint-row-highlight { background:rgba(255,237,168,.10); }
.committee-complaint-link { padding:0; border:0; background:none; color:#003631; font:inherit; font-weight:800; text-align:left; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.committee-complaint-sub { margin-top:5px; font-size:.8rem; }
.committee-complaint-modal { position:fixed; inset:0; z-index:10000; display:grid; place-items:center; padding:24px; background:rgba(0,24,22,.58); }
.committee-complaint-modal-panel { width:min(900px,100%); max-height:calc(100vh - 48px); overflow:auto; background:#FCFAF5; color:#003631; border-radius:20px; box-shadow:0 28px 90px rgba(0,0,0,.32); }
.committee-complaint-modal-header { position:sticky; top:0; z-index:2; display:flex; justify-content:space-between; gap:20px; padding:22px 24px; background:#FCFAF5; border-bottom:1px solid rgba(0,54,49,.12); }
.committee-complaint-modal-header h2 { margin:5px 0 4px; }
.committee-complaint-detail-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:22px 24px 0; }
.committee-complaint-detail-grid > div { border:1px solid rgba(0,54,49,.10); border-radius:12px; padding:14px; background:#fff; }
.committee-complaint-detail-grid span, .committee-complaint-description > span { display:block; color:#758582; font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.committee-complaint-detail-grid strong { display:block; margin-top:6px; }
.committee-complaint-description { margin:18px 24px 0; padding:18px; border-radius:14px; background:rgba(0,54,49,.035); }
.committee-complaint-description p { margin:8px 0 0; line-height:1.65; white-space:pre-wrap; }
.committee-complaint-remark-box { margin:20px 24px 0; padding:20px; border:1px solid rgba(0,54,49,.12); border-radius:16px; background:#fff; }
.committee-complaint-remark-box h3 { margin:5px 0 6px; }
.committee-complaint-remark-box textarea { margin-top:14px; min-height:110px; resize:vertical; }
.committee-complaint-history { margin:22px 24px 0; padding-top:20px; border-top:1px solid rgba(0,54,49,.10); }
.committee-complaint-history h3 { margin:0 0 12px; }
.committee-complaint-history-item { padding:13px 0; border-bottom:1px solid rgba(0,54,49,.08); }
.committee-complaint-history-item strong { margin-right:8px; }
.committee-complaint-history-item span, .committee-complaint-history-item small { color:#758582; margin-right:8px; }
.committee-complaint-history-item p { margin:7px 0 0; line-height:1.55; white-space:pre-wrap; }
@media (max-width: 900px) {
  .committee-complaint-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .committee-complaint-filters { grid-template-columns:1fr 1fr; }
  .committee-complaint-search { grid-column:1/-1; }
  .committee-page-heading, .committee-complaints-panel-heading { flex-direction:column; align-items:flex-start; }
  .committee-complaint-detail-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 600px) {
  .committee-complaint-stats, .committee-complaint-detail-grid, .committee-complaint-filters { grid-template-columns:1fr; }
  .committee-complaint-search { grid-column:auto; }
  .committee-complaints-panel { padding:16px; }
  .committee-complaint-modal { padding:10px; }
  .committee-complaint-modal-panel { max-height:calc(100vh - 20px); }
}

/* =========================================
   V112 • COMMITTEE DASHBOARD
========================================= */
.committee-dashboard-hero-section { padding: 38px 0 18px; }
.committee-dashboard-hero { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.committee-dashboard-hero-copy h1 { margin:7px 0 10px; color:#003631; font-size:clamp(2.4rem,5vw,4rem); line-height:1.02; letter-spacing:-2px; }
.committee-dashboard-hero-copy p { margin:0; color:#687477; font-size:18px; line-height:1.55; }
.committee-dashboard-hero-copy p strong { color:#003631; }
.committee-dashboard-identity { min-width:310px; display:flex; align-items:center; gap:14px; padding:16px 18px; border:1px solid #dfe5e3; border-radius:20px; background:#fff; box-shadow:0 10px 28px rgba(0,54,49,.06); }
.committee-dashboard-identity-avatar { width:54px; height:54px; flex:0 0 54px; display:grid; place-items:center; border-radius:16px; background:#FFEDA8; font-size:25px; }
.committee-dashboard-identity div:last-child { display:flex; flex-direction:column; gap:3px; min-width:0; }
.committee-dashboard-identity span { color:#758184; font-size:12px; }
.committee-dashboard-identity strong { color:#003631; font-size:17px; }
.committee-dashboard-identity small { color:#687477; font-size:13px; }
.committee-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:20px; }
.committee-section-heading h2 { margin:6px 0 7px; color:#003631; font-size:clamp(1.7rem,3vw,2.35rem); letter-spacing:-.7px; }
.committee-section-heading p { margin:0; max-width:820px; color:#71807f; line-height:1.55; }
.committee-live-pill { display:inline-flex; align-items:center; gap:8px; padding:9px 13px; border:1px solid rgba(0,54,49,.12); border-radius:999px; white-space:nowrap; font-size:.86rem; font-weight:700; color:#003631; background:#fff; }
.committee-live-pill .status-dot { width:8px; height:8px; border-radius:50%; background:#003631; display:inline-block; }
.committee-overview-section { padding-top:14px; }
.committee-overview-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; }
.committee-overview-card { position:relative; min-height:172px; padding:21px; border:1px solid #dfe5e3; border-radius:20px; background:#fff; color:#003631; text-decoration:none; box-shadow:0 8px 24px rgba(0,54,49,.04); transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.committee-overview-card:hover { transform:translateY(-2px); box-shadow:0 14px 30px rgba(0,54,49,.08); border-color:rgba(0,54,49,.24); }
.committee-overview-card.is-highlight { background:rgba(255,237,168,.24); }
.committee-overview-card.is-disabled { opacity:.78; cursor:default; }
.committee-overview-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:#FCFAF5; font-size:20px; margin-bottom:15px; }
.committee-overview-label { display:block; color:#637371; font-size:.88rem; font-weight:700; }
.committee-overview-card strong { display:block; margin-top:5px; font-size:2.15rem; line-height:1; }
.committee-overview-card small { display:block; margin-top:7px; color:#7a8887; }
.committee-overview-arrow { position:absolute; right:19px; bottom:17px; font-size:1.35rem; font-weight:700; }
.committee-overview-note { position:absolute; right:17px; bottom:18px; color:#8a9896; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.committee-actions-section { padding-top:18px; }
.committee-action-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.committee-action-card { display:grid; grid-template-columns:52px minmax(0,1fr) auto; align-items:center; gap:15px; min-height:126px; padding:20px 22px; border:1px solid #dfe5e3; border-radius:20px; background:#fff; color:#003631; text-decoration:none; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.committee-action-card:hover { transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,54,49,.07); border-color:rgba(0,54,49,.22); }
.committee-action-card.is-disabled { background:#fafaf7; opacity:.72; }
.committee-action-icon { width:52px; height:52px; display:grid; place-items:center; border-radius:15px; background:#FCFAF5; font-size:23px; }
.committee-action-copy { min-width:0; }
.committee-action-copy strong { display:block; margin-bottom:5px; font-size:1.08rem; }
.committee-action-copy small { display:block; color:#71807f; line-height:1.5; font-size:.9rem; }
.committee-action-copy em { display:inline-block; margin-top:8px; color:#8a9896; font-size:.74rem; font-style:normal; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.committee-action-arrow { font-size:1.35rem; font-weight:700; white-space:nowrap; }
.committee-dashboard-centre-section { padding-top:16px; }
.committee-dashboard-centre-card { padding:25px; border:1px solid #dfe5e3; border-radius:22px; background:#fff; box-shadow:0 10px 28px rgba(0,54,49,.04); }
.committee-dashboard-centre-header { display:flex; align-items:flex-start; justify-content:space-between; gap:25px; }
.committee-dashboard-centre-header h2 { margin:6px 0 7px; color:#003631; font-size:1.8rem; }
.committee-dashboard-centre-header p { max-width:760px; margin:0; color:#71807f; line-height:1.55; }
.committee-complaint-mini-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:22px; }
.committee-complaint-mini-stats > div { padding:16px 17px; border:1px solid #e2e7e5; border-radius:15px; background:#FCFAF5; }
.committee-complaint-mini-stats > div.is-highlight { background:rgba(255,237,168,.3); }
.committee-complaint-mini-stats strong { display:block; color:#003631; font-size:1.65rem; }
.committee-complaint-mini-stats span { color:#73817f; font-size:.82rem; font-weight:700; }
.committee-updates-section { padding-top:18px; }
.committee-updates-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.committee-update-panel { border:1px solid #dfe5e3; border-radius:21px; background:#fff; overflow:hidden; }
.committee-update-panel-heading { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:20px 21px 16px; border-bottom:1px solid #e8ecea; }
.committee-update-panel-heading h3 { margin:0; color:#003631; font-size:1.15rem; }
.committee-update-panel-heading a { color:#003631; text-decoration:none; font-size:.84rem; font-weight:700; }
.committee-update-list { padding:4px 0; }
.committee-update-item { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px; padding:15px 21px; color:#003631; text-decoration:none; border-bottom:1px solid #edf0ef; }
.committee-update-item:last-child { border-bottom:0; }
.committee-update-item:hover { background:#FCFAF5; }
.committee-update-item strong { display:block; font-size:.93rem; }
.committee-update-item small { display:block; margin-top:4px; color:#7a8887; font-size:.78rem; }
.committee-update-chip { display:inline-flex; align-items:center; min-height:24px; padding:3px 8px; border-radius:999px; background:#FFEDA8; color:#003631; font-size:.65rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.committee-calendar-icon { width:32px; height:32px; display:grid; place-items:center; border-radius:10px; background:#FCFAF5; }
.committee-empty-state { padding:25px 21px; color:#7a8887; font-size:.9rem; }
.committee-members-summary-section { padding-top:12px; padding-bottom:40px; }
.committee-members-summary { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px 24px; border:1px solid #dfe5e3; border-radius:20px; background:#FCFAF5; }
.committee-members-summary h2 { margin:5px 0 5px; color:#003631; font-size:1.45rem; }
.committee-members-summary p { margin:0; color:#71807f; }
.committee-members-summary p strong { color:#003631; }
.committee-members-summary-badge { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 14px; border:1px solid rgba(0,54,49,.12); border-radius:999px; color:#003631; background:#fff; font-size:.82rem; font-weight:700; white-space:nowrap; cursor:pointer; font-family:inherit; }
.committee-members-summary-badge:hover { border-color:rgba(0,54,49,.28); box-shadow:0 6px 18px rgba(0,54,49,.06); }
.committee-complaint-close-btn { width:auto !important; min-width:84px; min-height:38px !important; height:auto !important; padding:9px 18px !important; white-space:nowrap; flex:0 0 auto; }
.committee-directory-modal { position:fixed; inset:0; z-index:10001; display:grid; place-items:center; padding:24px; background:rgba(0,24,22,.58); }
.committee-directory-modal-panel { width:min(760px,100%); max-height:calc(100vh - 48px); overflow:auto; background:#FCFAF5; color:#003631; border-radius:20px; box-shadow:0 28px 90px rgba(0,0,0,.32); }
.committee-directory-modal-header { position:sticky; top:0; z-index:2; display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:22px 24px; background:#FCFAF5; border-bottom:1px solid rgba(0,54,49,.12); }
.committee-directory-modal-header h2 { margin:5px 0 4px; }
.committee-directory-modal-header p { margin:0; }
.committee-directory-list { padding:8px 24px 24px; }
.committee-directory-row { display:grid; grid-template-columns:180px minmax(0,1fr); gap:18px; align-items:center; padding:16px 0; border-bottom:1px solid rgba(0,54,49,.09); }
.committee-directory-row:last-child { border-bottom:0; }
.committee-directory-role { color:#6f7f7c; font-size:.8rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.committee-directory-person strong { display:block; font-size:1rem; }
.committee-directory-person small { display:block; margin-top:4px; color:#7a8887; }
@media (max-width: 980px) {
    .committee-overview-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .committee-action-grid, .committee-updates-grid { grid-template-columns:1fr; }
    .committee-dashboard-hero, .committee-dashboard-centre-header { flex-direction:column; align-items:stretch; }
    .committee-dashboard-identity { min-width:0; max-width:440px; }
}
@media (max-width: 620px) {
    .committee-dashboard-hero-copy h1 { font-size:2.45rem; }
    .committee-directory-modal { padding:10px; }
    .committee-directory-modal-panel { max-height:calc(100vh - 20px); }
    .committee-directory-modal-header { padding:18px; }
    .committee-directory-list { padding:6px 18px 18px; }
    .committee-directory-row { grid-template-columns:1fr; gap:5px; }
    .committee-overview-grid, .committee-complaint-mini-stats { grid-template-columns:1fr 1fr; }
    .committee-action-card { grid-template-columns:44px minmax(0,1fr); }
    .committee-action-icon { width:44px; height:44px; }
    .committee-action-arrow { display:none; }
    .committee-members-summary { align-items:flex-start; flex-direction:column; }
}
@media (max-width: 430px) {
    .committee-overview-grid, .committee-complaint-mini-stats { grid-template-columns:1fr; }
}


/* =========================================
   V114 • COMMITTEE UPCOMING ACTIVITIES
========================================= */
.committee-upcoming-page { padding-top: 34px; }
.committee-upcoming-table-card { padding: 24px; }
.committee-upcoming-table-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:18px; }
.committee-upcoming-table-heading h2 { margin:0 0 6px; color:#003631; }
.committee-upcoming-table-heading p { margin:0; }
.committee-upcoming-table-wrap { overflow-x:auto; border:1px solid #dfe5e3; border-radius:16px; }
.committee-upcoming-table { width:100%; border-collapse:collapse; min-width:760px; background:#fff; }
.committee-upcoming-table th { padding:13px 15px; text-align:left; color:#637371; background:#FCFAF5; font-size:.76rem; text-transform:uppercase; letter-spacing:.05em; border-bottom:1px solid #dfe5e3; }
.committee-upcoming-table td { padding:16px 15px; color:#003631; border-bottom:1px solid #edf0ef; vertical-align:top; }
.committee-upcoming-table tbody tr:last-child td { border-bottom:0; }
.committee-upcoming-table tbody tr:hover { background:#FCFAF5; }
.committee-upcoming-table td strong { display:block; }
.committee-upcoming-table td small { display:block; margin-top:5px; color:#758582; line-height:1.45; max-width:420px; }
@media (max-width: 700px) {
    .committee-upcoming-table-card { padding:16px; }
    .committee-upcoming-table-heading { flex-direction:column; }
}

/* =========================================
   V115 • Committee Decisions
========================================= */
.committee-decisions-page { padding-top: 34px; }
.committee-decisions-page .committee-page-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:26px; }
.committee-decisions-page .committee-page-heading h1 { margin:7px 0 8px; color:#003631; font-size:clamp(2.2rem,4.5vw,3.5rem); letter-spacing:-1.5px; }
.committee-decisions-page .committee-page-heading p { margin:0; color:#687477; font-size:17px; line-height:1.55; }
.committee-decisions-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:30px; }
.committee-decisions-summary-card { min-height:130px; padding:20px; border:1px solid #dfe5e3; border-radius:18px; background:#fff; display:flex; flex-direction:column; justify-content:center; }
.committee-decisions-summary-card.is-highlight { background:#fff9e4; border-color:#f0dfa0; }
.committee-decisions-summary-card span { color:#637572; font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.committee-decisions-summary-card strong { margin-top:7px; color:#003631; font-size:2.2rem; line-height:1; }
.committee-decisions-summary-card small { margin-top:8px; color:#7a8887; line-height:1.4; }
.committee-decisions-section { margin-top:28px; padding:24px; border:1px solid #dfe5e3; border-radius:22px; background:#fff; }
.committee-decisions-section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:18px; }
.committee-decisions-section-heading h2 { margin:5px 0 5px; color:#003631; font-size:1.65rem; }
.committee-decisions-section-heading p { margin:0; color:#71807f; }
.committee-decisions-table-wrap { overflow-x:auto; }
.committee-decisions-table { width:100%; border-collapse:collapse; min-width:760px; }
.committee-decisions-table th { padding:12px 14px; text-align:left; color:#70807e; background:#fafaf7; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; border-bottom:1px solid #e4e9e7; }
.committee-decisions-table td { padding:16px 14px; color:#003631; border-bottom:1px solid #edf0ef; vertical-align:middle; }
.committee-decisions-table tr:last-child td { border-bottom:0; }
.committee-decisions-table td strong { display:block; font-size:1rem; }
.committee-decisions-table td small { display:block; margin-top:4px; color:#7a8887; }
.committee-decision-status { display:inline-flex; align-items:center; padding:6px 10px; border-radius:999px; font-size:.76rem; font-weight:800; }
.committee-decision-status.is-open { background:#fff0b5; color:#003631; }
.committee-decision-status.is-closed { background:#eef2f0; color:#526360; }
.committee-vote-state { font-weight:700; }
.committee-vote-pending { color:#8a9694; }
.committee-decision-view-btn { padding:9px 14px; white-space:nowrap; }
.committee-decision-modal { position:fixed; inset:0; z-index:10002; display:grid; place-items:center; padding:24px; background:rgba(0,24,22,.58); }
.committee-decision-modal-panel { width:min(920px,100%); max-height:calc(100vh - 48px); overflow:auto; background:#FCFAF5; color:#003631; border-radius:20px; box-shadow:0 28px 90px rgba(0,0,0,.32); }
.committee-decision-modal-header { position:sticky; top:0; z-index:3; display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:22px 26px; background:#FCFAF5; border-bottom:1px solid rgba(0,54,49,.12); }
.committee-decision-modal-header h2 { margin:5px 0 3px; font-size:1.9rem; }
.committee-decision-modal-header p { margin:0; color:#6f7f7c; font-size:1.05rem; }
.committee-decision-close { flex:0 0 auto !important; width:auto !important; min-width:92px !important; height:auto !important; min-height:46px !important; writing-mode:horizontal-tb !important; white-space:nowrap !important; align-self:flex-start !important; }
.committee-decision-detail-body { padding:24px 26px 30px; }
.committee-decision-meta-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.committee-decision-meta-grid > div { padding:15px; border:1px solid #dfe5e3; border-radius:14px; background:#fff; }
.committee-decision-meta-grid span { display:block; color:#73817f; font-size:.74rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.committee-decision-meta-grid strong { display:block; margin-top:6px; font-size:1rem; }
.committee-decision-detail-section { margin-top:22px; padding:20px; border:1px solid #dfe5e3; border-radius:16px; background:#fff; }
.committee-decision-detail-section > p { margin:8px 0 0; color:#3e5652; line-height:1.65; }
.committee-decision-timeline { margin-top:10px; }
.committee-decision-timeline-item { padding:14px 0; border-bottom:1px solid #edf0ef; }
.committee-decision-timeline-item:last-child { border-bottom:0; padding-bottom:0; }
.committee-decision-timeline-item strong { display:block; }
.committee-decision-timeline-item small { display:block; margin-top:3px; color:#7b8987; }
.committee-decision-timeline-item p { margin:7px 0 0; color:#405652; line-height:1.55; }
.committee-decision-voting-section { margin-top:22px; padding:22px; border:1px solid #d8e1de; border-radius:18px; background:#fff; }
.committee-decision-voting-header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.committee-decision-voting-header h3 { margin:5px 0 0; font-size:1.45rem; }
.committee-vote-totals { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.committee-vote-totals span { padding:7px 10px; border:1px solid #e1e7e5; border-radius:999px; color:#657571; font-size:.78rem; }
.committee-vote-totals strong { color:#003631; }
.committee-vote-options { display:flex; gap:12px; margin-top:18px; flex-wrap:wrap; }
.committee-vote-option { cursor:pointer; }
.committee-vote-option input { position:absolute; opacity:0; pointer-events:none; }
.committee-vote-option span { display:block; padding:12px 18px; border:1px solid #cfdad7; border-radius:12px; background:#fff; font-weight:800; }
.committee-vote-option input:checked + span { border-color:#003631; background:#fff1b8; color:#003631; box-shadow:0 0 0 2px rgba(0,54,49,.08); }
.committee-vote-actions { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:18px; }
.committee-vote-closed { margin-top:15px; padding:14px 16px; border-radius:12px; background:#f4f6f4; color:#53645f; }

@media (max-width: 900px) {
    .committee-decisions-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .committee-decisions-page .committee-page-heading { flex-direction:column; }
    .committee-decision-meta-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px) {
    .committee-decisions-summary-grid { grid-template-columns:1fr; }
    .committee-decisions-section { padding:17px; }
    .committee-decisions-section-heading, .committee-decision-voting-header, .committee-vote-actions { flex-direction:column; align-items:stretch; }
    .committee-decision-meta-grid { grid-template-columns:1fr; }
    .committee-decision-modal { padding:10px; }
    .committee-decision-modal-panel { max-height:calc(100vh - 20px); }
    .committee-decision-modal-header, .committee-decision-detail-body { padding:18px; }
    .committee-vote-totals { justify-content:flex-start; }
}

/* =========================================
   V116 • Society Matters
========================================= */
.society-matters-page{padding-top:34px}.society-matters-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:28px}.society-matters-summary-card{min-height:125px;padding:20px;border:1px solid #dfe5e3;border-radius:18px;background:#fff;display:flex;flex-direction:column;justify-content:center}.society-matters-summary-card.is-highlight{background:#fff9e4;border-color:#f0dfa0}.society-matters-summary-card span{color:#637572;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.society-matters-summary-card strong{margin-top:7px;color:#003631;font-size:2.2rem;line-height:1}.society-matters-summary-card small{margin-top:8px;color:#7a8887;line-height:1.4}.society-matters-section{margin-top:28px;padding:24px;border:1px solid #dfe5e3;border-radius:22px;background:#fff}.society-matters-section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:18px}.society-matters-section-heading h2{margin:5px 0;color:#003631;font-size:1.65rem}.society-matters-section-heading p{margin:0;color:#71807f}.society-matters-table-wrap{overflow-x:auto}.society-matters-table{width:100%;border-collapse:collapse;min-width:860px}.society-matters-table th{padding:12px 14px;text-align:left;color:#70807e;background:#fafaf7;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid #e4e9e7}.society-matters-table td{padding:16px 14px;color:#003631;border-bottom:1px solid #edf0ef;vertical-align:middle}.society-matters-table tr:last-child td{border-bottom:0}.society-matters-table td strong{display:block;font-size:1rem}.society-matters-table td small{display:block;margin-top:4px;color:#7a8887}.society-matter-status,.society-matter-priority{display:inline-flex;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800;white-space:nowrap}.society-matter-status.open{background:#eef7f4}.society-matter-status.in-progress{background:#fff8df}.society-matter-status.on-hold{background:#f4f1ea}.society-matter-status.closed{background:#eef0ef}.society-matter-priority.high{background:#fff0ec}.society-matter-priority.medium{background:#fff8df}.society-matter-priority.low{background:#eef3f1}.society-matters-empty{padding:28px;text-align:center;color:#71807f;background:#fafaf7;border:1px dashed #dce3e1;border-radius:14px}.society-matter-modal{position:fixed;inset:0;z-index:9999;background:rgba(0,30,27,.42);display:flex;align-items:center;justify-content:center;padding:24px}.society-matter-modal-panel{width:min(940px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:24px;box-shadow:0 30px 80px rgba(0,54,49,.24)}.society-matter-modal-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:24px 26px;border-bottom:1px solid #e5eae8}.society-matter-modal-header h2{margin:6px 0 3px;color:#003631}.society-matter-modal-header p{margin:0;color:#657572}.society-matter-close{width:auto!important;min-width:92px;white-space:nowrap;display:inline-flex!important;align-items:center;justify-content:center}.society-matter-modal-body{padding:24px 26px}.society-matter-meta-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:24px}.society-matter-meta-grid>div{padding:14px;border:1px solid #e2e8e6;border-radius:14px;background:#fafbf9}.society-matter-meta-grid span{display:block;color:#7a8887;font-size:12px;text-transform:uppercase;font-weight:800}.society-matter-meta-grid strong{display:block;margin-top:5px;color:#003631}.society-matter-detail-section,.society-matter-action-section{margin-top:22px;padding-top:22px;border-top:1px solid #e6ebe9}.society-matter-detail-section h3,.society-matter-action-section h3{margin:5px 0;color:#003631}.society-matter-detail-section>p{margin:10px 0 0;color:#566765;line-height:1.65}.society-matter-remark{padding:14px 0;border-bottom:1px solid #edf0ef}.society-matter-remark:last-child{border-bottom:0}.society-matter-remark strong{color:#003631}.society-matter-remark small{display:block;color:#7a8887;margin-top:3px}.society-matter-remark p{margin:8px 0 0;color:#566765;line-height:1.55}.society-matter-section-heading{display:flex;justify-content:space-between}.society-matter-status-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.society-matter-form-actions{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:12px}.society-matter-form-actions .btn{width:auto!important;min-width:110px;white-space:nowrap}.society-matter-modal textarea{width:100%;resize:vertical}@media(max-width:900px){.society-matters-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.society-matter-meta-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.society-matters-summary-grid,.society-matter-meta-grid{grid-template-columns:1fr}.society-matters-section{padding:17px}.society-matters-section-heading,.society-matter-modal-header,.society-matter-form-actions{flex-direction:column;align-items:stretch}.society-matter-modal{padding:10px}.society-matter-modal-body,.society-matter-modal-header{padding:18px}.society-matter-close{align-self:flex-start}}