.ckrents-form-field {
  margin-block: 1rem;
}

.ckrents-form-fieldset {
  border: none;
  margin-block: 1rem;
  padding: 0;
  display: grid;
  gap: .5rem;
}

.ckrents-form-fieldset legend {
  font-weight: 600;
  font-size: 1.2em;
}

.ckrents-form-fieldset label {
  font-size: .9em;
}

.ckrents-form-fieldset .ckrents-form-field {
  margin-block: 0;
}

.ckrents-field-hint {
  margin-block: .25rem 0;
  font-size: .85em;
  color: #666;
}

.ckrents-field-hint code {
  font-size: inherit;
}

/* ── Frontend Property Gallery ─────────────────────────────────────────────── */

.ckr-fe-gallery-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	min-height: 80px;
	padding: 8px;
	margin-bottom: 10px;
	border: 2px dashed #c3c4c7;
	border-radius: 4px;
	transition: border-color 0.15s, background 0.15s;
}

.ckr-fe-gallery-grid.is-drop-target {
	border-color: #2271b1;
	background: #f0f6fc;
}

.ckr-fe-gallery-placeholder {
	margin: auto;
	color: #8c8f94;
	font-size: 0.875em;
	pointer-events: none;
}

.ckr-fe-gallery-grid .ckr-gallery-item {
	position: relative;
	width: 120px;
	height: 90px;
	border: 1px solid #c3c4c7;
	border-radius: 3px;
	overflow: hidden;
	cursor: grab;
}

.ckr-fe-gallery-grid .ckr-gallery-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	pointer-events: none;
}

.ckr-fe-gallery-grid .ckr-gallery-remove {
	position: absolute;
	top: 3px;
	right: 3px;
	width: 20px;
	height: 20px;
	padding: 0;
	line-height: 1;
	font-size: 16px;
	background: rgba(0, 0, 0, .55);
	color: #fff;
	border: none;
	border-radius: 50%;
	cursor: pointer;
}

.ckr-fe-gallery-grid .ckr-gallery-item.is-drag-over { outline: 2px dashed #2271b1; }
.ckr-fe-gallery-grid .ckr-gallery-item.is-dragging  { opacity: .35; }
.ckr-fe-gallery-grid .ckr-gallery-item.is-deleted   { opacity: .25; filter: grayscale(1); cursor: default; }

.ckr-fe-gallery-upload-row {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

#ckr-fe-gallery-file-input { display: none; }

#ckr-fe-gallery-status {
	font-size: 0.875em;
	color: #646970;
}

/* Video field (add/edit property forms) */
.ckr-video-field #ckr-video-file-input { display: none; }

.ckr-video-preview {
	margin-bottom: 10px;
}

.ckr-video-preview video {
	display: block;
	max-width: 100%;
	max-height: 240px;
	margin-bottom: 8px;
	background: #000;
	border-radius: 3px;
}

.ckr-video-upload-row {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

.ckr-video-status {
	font-size: 0.875em;
	color: #646970;
}

.ckr-video-hint {
	margin-top: 6px;
	font-size: 0.8125em;
	color: #646970;
}


.ckrents-my-account-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
}

.ckrents-unread-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.4em;
    height: 1.4em;
    padding: 0 0.3em;
    border-radius: 9999px;
    background-color: #e53935;
    color: #fff;
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
}






.ckr-property-owner-section {
    margin-top: 40px;
    padding: 30px;
    background: #f8f9fa;
    border-radius: 8px;
}

.ckr-property-views h3,
.ckr-property-management h3 {
    margin: 0 0 20px;
    font-size: 1.5em;
    color: #333;
}

.ckr-views-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.ckr-views-stats .stat-item {
    padding: 15px;
    background: white;
    border-radius: 6px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.ckr-views-stats .stat-label {
    display: block;
    color: #666;
    font-size: 0.9em;
    margin-bottom: 5px;
}

.ckr-views-stats .stat-value {
    display: block;
    font-size: 1.8em;
    font-weight: bold;
    color: #333;
}

.ckr-management-links {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.ckr-button {
    display: inline-block;
    padding: 10px 20px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease;
}

.ckr-button.edit {
    background: #007bff;
    color: white;
}

.ckr-button.status {
    background: #6c757d;
    color: white;
}

.ckr-button.delete {
    background: #dc3545;
    color: white;
}

.ckr-button:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

/* ── Tenant Application ────────────────────────────────────────────────────── */

/* Persistent site-wide reminder for tenants without an application on file. */
.ckrents-application-banner {
	background: var(--wp--preset--color--tertiary, #d6b665);
	color: var(--wp--preset--color--secondary, #021d2a);
	font-size: 0.9rem;
	line-height: 1.4;
}

.ckrents-application-banner p {
	max-width: var(--wp--style--global--content-size, 1200px);
	margin: 0 auto;
	padding: 0.75rem 1rem;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.25rem 1rem;
	text-align: center;
}

.ckrents-application-banner__link {
	color: inherit;
	font-weight: 600;
	text-decoration: underline;
	white-space: nowrap;
}

.ckrents-application-banner__link:hover,
.ckrents-application-banner__link:focus {
	text-decoration: none;
}

/* Shown in place of the application form when it can't be submitted. */
.ckrents-application-notice {
	padding: 1.25rem;
	border: 1px solid var(--wp--preset--color--primary-2, #b8d3e0);
	border-left: 4px solid var(--wp--preset--color--primary, #4886a5);
	border-radius: 4px;
	background: #f6fafc;
}

.ckrents-application-notice p:first-child {
	margin-top: 0;
}

.ckrents-application-notice p:last-child {
	margin-bottom: 0;
}