/**
 * 360 Broadway - Nova Child: Floor Plans page template (floor-plans.php): listing, filters, map view, unit tables, floor plan pop-ups.
 * Loaded only on pages that use it (see bw_css_components() in inc/enqueue.php).
 * Loads after style.css; rules keep their original order.
 */

table {
  border-collapse: collapse;
}
th {
  text-align: inherit;
}
.col-12 {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}
.text-center {
  text-align: center !important;
}

@media print {
	thead {
	    display: table-header-group;
	  }
}

.floorplans_section {
    padding: 60px 0;
}
.floorplans_section_inner {
    max-width: 1300px;
    padding: 0 30px;
    margin: 0 auto;
}
.floorplans_items {
	margin-bottom: 50px;
}
.modal-content {
    border: 0;
    background: transparent;
    position: relative;
    padding-top: 30px;
}
.floorplan_modal .modal-dialog {
    max-width: 900px;
}
.floorplan_modal_content_col_inner {
    max-width: 210px;
}
.floorplan_modal_content_btns {
    margin-top: 30px;
}
.floorplan_modal_content_btns a span {
    transition: all 0.3s;
}
.ui-datepicker .ui-datepicker-title {
    display: block !important;
    letter-spacing: 3px !important;
    font-size: 10px !important;
    margin-bottom: 10px !important;
    text-transform: uppercase !important;
    font-weight: normal !important;
}
.ui-datepicker .ui-datepicker-header {
    top: -40px !important;
    background: transparent !important;
    border: 0 !important;
    position: absolute !important;
    width: 100% !important;
}
.ui-datepicker th {
    letter-spacing: 3px !important;
    font-size: 10px !important;
    margin-bottom: 10px !important;
    text-transform: uppercase !important;
    font-weight: normal !important;
}
.ui-datepicker td span,
.ui-datepicker td a {
    text-align: center !important;
    border: 0 !important;
    margin: 2px !important;
}
.floorplan-images {
	width: 100%;
	height: 450px;
}

@media all and (max-width:  767px) {
	.floorplans_section_inner {
		    padding: 0;
		}
	.floorplan_modal_image_col {
		    order: 1;
		}
	.floorplan_modal_content_col {
		    order: 2;
		    margin-bottom: 20px;
		}
	.floorplan_modal_content_col_inner ul {
		    text-align: center;
		}
	.floorplan_modal_content_col_inner {
		    max-width: 100%;
		}
	.floorplan_modal_content_btns a {
		    margin: 15px auto;
		}
	.floorplans_section {padding: 60px 20px;
		}
}

.page-intro {
	margin-bottom: 30px;
}
.fp-filter-form button.clear-filter,
.fp-filter-form a.clear-filter {
	background: var(--bw-white);
	border: 1px solid var(--bw-gold);
}
.fp-filter-form button.clear-filter:hover,
.fp-filter-form a.clear-filter:hover {
	background: var(--bw-gold);
	border-color: var(--bw-gold);
}
.floorplans_section {
	background: var(--bw-cream);
	margin: 0;
}
.floorplans_section_inner h1 {
	margin-bottom: 50px;
}
.floorplans_section .floorplan_item_col .floorplan_item,
.floorplans_section .floorplan_item_col .floor-plan-link .floorplan_item {
	background: var(--bw-white);
}
.ui-datepicker .ui-datepicker-header {
	top: 0!important;
	position: relative!important;
}
.floorplan-images {
	height: auto;
}

@media (max-width: 768px) {
	.floorplan-images {
			padding-left: 20px;
			padding-right: 20px;
		}
}

.floorplans_section_inner h1 {
	margin-bottom: 30px;
}
.available-units-table .special-tag {
	position: relative;
	top: initial;
	right: initial;
}
.available-units-table {
	width: 100%;
}
.available-units-table thead td {
	font-weight: 600;
}
.available-units-table td {
	border-top: 1px solid var(--bw-text);
	border-bottom: 1px solid var(--bw-text);
	padding: 20px 0;
	text-align: center;
}

@media (max-width: 767px) {
	.available-units-table thead {
			display: none;
		}
	.available-units-table td {
			border: 0;
			padding: 5px 0;
			display: block;
		}
	.available-units-table tr td:first-child {
			border-top: 1px solid var(--bw-text);
			padding-top: 20px;
			font-weight: bold;
		}
	.available-units-table tr td:last-child {
			border-bottom: 1px solid var(--bw-text);
			padding-bottom: 20px;
		}
}

@media (min-width: 768px) {
	.floorplan_modal_content_col_inner {
			max-width: 240px;
		}
}

@media (max-width: 768px) {
	.floorplan-image-slider {
			margin-bottom: 30px;
		}
}

.floorplan_modal_content_btns a {
	padding-left: 10px;
	padding-right: 10px;
	letter-spacing: 1.5px;
}
.floorplan_modal_content_btns a::before {
	background: var(--bw-secondary);
}
.floorplan_modal .modal-dialog {
    max-width: 1100px;
}
.floorplan_item_col { margin-bottom: 30px;
}
.floorplan_modal .special-tag {
	position: relative;
	top: auto;
	right: auto;
}

@media (max-width: 767px) {
	.floorplan_modal .special-tag {
			margin: 0 auto;
		}
}

.floorplan_modal .special-tag span {
	right: auto;
	left: 27px;
}

@media (max-width: 767px) {
	.floorplan_modal .special-tag span {
			left: -107px;
			top: calc(100% + 5px);
		}
}

.fp-header-control .fp-filter {
        margin-bottom: 0;
}
.fp-header-control .view-toggles {
        align-self: flex-start;
}
.view-toggles,
.btn-toggle-view {
        border-radius: 0 !important;
}
.btn-toggle-view {
        padding: 12px 24px;
        background: var(--bw-white);
        color: var(--bw-gold);
        border: none;
        cursor: pointer;
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 1px;
        transition: all 0.3s ease;
}
.btn-toggle-view.active {
        background: var(--bw-gold);
        color: var(--bw-white);
}
.btn-toggle-view:not(.active):hover {
        background: var(--bw-c-fdfaf4);
}
#fp-map-container {
        width: 100%;
        height: 80vh; 
        min-height: 600px;
        margin-bottom: 40px;
        overflow: hidden;
        background: var(--bw-c-f0f0f0);
}
#fp-map-container iframe {
        border: 0;
}
.view-container {
        transition: opacity 0.3s ease;
}
.locate-unit:hover {
        color: var(--bw-gold-dark);
}
.fp-map-shell {
        border: 1px solid var(--bw-line);
        overflow: hidden;
        background: var(--bw-white);
        box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}
.fp-map-canvas {
        position: relative;
        height: 80vh;
        min-height: 600px;
        background: var(--bw-c-f0f0f0);
}
.fp-map-skeleton.is-hidden {
        opacity: 0;
        pointer-events: none;
}
.fp-skeleton-label {
        font-size: 13px;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: var(--bw-taupe);
}
.fp-skeleton-blocks span {
        display: block;
        width: 64px;
        height: 10px;
        background: var(--bw-c-e8e0d2);
        animation: fp-skeleton-pulse 1.1s ease-in-out infinite;
}
.fp-skeleton-blocks span:nth-child(2) { animation-delay: 0.15s;
}
.fp-skeleton-blocks span:nth-child(3) { animation-delay: 0.3s;
}
.fp-tooltip {
        position: absolute;
        z-index: 5;
        max-width: 190px;
        padding: 8px 12px;
        background: var(--bw-text);
        color: var(--bw-white);
        font-size: 13px;
        line-height: 1.4;
        pointer-events: none;
        box-shadow: 0 4px 12px rgba(0,0,0,0.25);
}
.fp-details {
        position: absolute;
        z-index: 6;
        top: 16px;
        right: 16px;
        width: 290px;
        max-width: calc(100% - 32px);
        padding: 20px;
        background: var(--bw-white);
        border: 1px solid var(--bw-line);
        border-top: 4px solid var(--bw-gold);
        box-shadow: 0 10px 30px rgba(0,0,0,0.18);
}
.fp-details-close {
        position: absolute;
        top: 8px;
        right: 10px;
        border: 0;
        background: none;
        font-size: 22px;
        line-height: 1;
        color: var(--bw-taupe);
        cursor: pointer;
}
.fp-details-num {
        font-size: 20px;
        font-weight: 700;
}
.fp-details-plan {
        margin: 2px 0 10px;
        color: var(--bw-gold-dark);
        font-size: 14px;
        letter-spacing: 0.03em;
}
.fp-details-meta {
        margin: 0 0 16px;
        padding: 0;
        list-style: none;
        font-size: 14px;
        color: var(--bw-text);
}
.fp-details-meta li {
        padding: 3px 0;
        border-bottom: 1px solid var(--bw-c-f0ede6);
}
.fp-btn-solid {
        background: var(--bw-gold);
        color: var(--bw-white);
        border: 1px solid var(--bw-gold);
}
.fp-btn-solid:hover {
        background: var(--bw-gold-dark);
        border-color: var(--bw-gold-dark);
        color: var(--bw-white);
}
.fp-btn-line {
        background: var(--bw-white);
        color: var(--bw-gold-dark);
        border: 1px solid var(--bw-gold);
}
.fp-btn-line:hover {
        background: var(--bw-cream);
        color: var(--bw-c-8f744a);
}
.fp-map-list-head {
        padding: 14px 18px;
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: var(--bw-taupe);
        border-bottom: 1px solid var(--bw-line);
}
.fp-map-list-scroll {
        overflow-y: auto;
        max-height: 80vh;
        padding: 12px;
}
.fp-unit:hover {
        border-color: var(--bw-gold);
}
.fp-unit.is-active {
        border-left-color: var(--bw-gold);
        border-color: var(--bw-gold);
        box-shadow: 0 3px 10px rgba(192,173,131,0.35);
}
.fp-unit-num {
        font-weight: 700;
        font-size: 15px;
}
.fp-unit-rent {
        color: var(--bw-gold-dark);
        font-weight: 600;
        font-size: 14px;
}

@media (max-width: 991px) {
	.fp-map-body {
	            grid-template-columns: 1fr;
		}
	.fp-map-canvas {
	            height: 62vh;
	            min-height: 420px;
		}
	.fp-map-list {
	            border-left: 0;
	            border-top: 1px solid var(--bw-line);
		}
	.fp-map-list-scroll {
	            max-height: 320px;
		}
	.fp-details {
	            top: auto;
	            bottom: 12px;
	            right: 12px;
		}
}

a.clear-filter {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
}
.bw-dialog.floorplan_modal {
	width: min(900px, 94vw);
}
.bw-dialog .modal-content {
	position: relative;
}
.bw-table-scroll {
	overflow-x: auto;
}
.available-units-table th {
	font-weight: inherit;
}
.fp-filter-form a.clear-filter {
	letter-spacing: 1px;
	text-transform: uppercase;
	padding: 5px 22px;
	height: 46px;
	box-sizing: border-box;
	position: relative;
	cursor: pointer;
	transition: background 0.2s;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--bw-font-body);
	text-decoration: none;
}
.fp-filter-form a.clear-filter span {
	font-size: 15px;
}

/* Manual floor plans: availability panel in the pop-up (no units list). */
.fp-availability {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 15px 30px;
	padding: 20px 0;
	border-top: 1px solid var(--bw-text);
	border-bottom: 1px solid var(--bw-text);
	text-align: center;
}
.fp-availability .fp-availability-status {
	margin: 0;
	font-family: var(--bw-font-ui);
	letter-spacing: 1px;
	text-transform: uppercase;
}
