/*
 * TurnKey Owner Portal — front office.
 * Inherits fonts and text colors from the theme; only spacing, borders and the accent color are set here.
 */
.tkop-portal, .tkop-login {
	--tkop-accent: #1f6f8b;
	--tkop-border: rgba(0, 0, 0, 0.12);
	--tkop-soft: rgba(0, 0, 0, 0.03);
	--tkop-muted: rgba(0, 0, 0, 0.6);
	--tkop-radius: 6px;
	box-sizing: border-box;
	max-width: 1100px;
	margin: 0 auto;
	font-size: 1rem;
	line-height: 1.55;
}
.tkop-portal *, .tkop-login * { box-sizing: border-box; }

/* Buttons and fields */
.tkop-button, .tkop-portal button[type="submit"], .tkop-login button[type="submit"] {
	display: inline-block;
	padding: 0.65em 1.4em;
	border: 1px solid var(--tkop-accent);
	border-radius: var(--tkop-radius);
	background: var(--tkop-accent);
	color: #fff !important;
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none !important;
	cursor: pointer;
}
.tkop-button:hover, .tkop-portal button[type="submit"]:hover, .tkop-login button[type="submit"]:hover { filter: brightness(0.92); }
.tkop-button-secondary { background: transparent; color: var(--tkop-accent) !important; }

.tkop-form label { display: block; margin-bottom: 0.3em; font-weight: 600; }
.tkop-form input[type="text"], .tkop-form input[type="email"], .tkop-form input[type="password"] {
	width: 100%;
	max-width: 100%;
	padding: 0.6em 0.75em;
	border: 1px solid var(--tkop-border);
	border-radius: var(--tkop-radius);
	font: inherit;
	background: #fff;
}
.tkop-form input:focus { outline: 2px solid var(--tkop-accent); outline-offset: 1px; }
.tkop-form input[disabled] { background: var(--tkop-soft); }
.tkop-form p { margin: 0 0 1em; }
.tkop-remember label { font-weight: normal; }
.tkop-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.2em; }
@media (max-width: 640px) { .tkop-grid { grid-template-columns: 1fr; } }
.tkop-small { font-size: 0.9em; color: var(--tkop-muted); }

/* Notices */
.tkop-notice { padding: 0.8em 1em; margin: 0 0 1.2em; border-radius: var(--tkop-radius); border-left: 4px solid; background: var(--tkop-soft); }
.tkop-notice-success { border-color: #2e7d32; }
.tkop-notice-error { border-color: #c62828; }
.tkop-notice-warning { border-color: #ed6c02; }

/* Login */
.tkop-login-box { max-width: 440px; margin: 2em auto; padding: 2em; border: 1px solid var(--tkop-border); border-radius: var(--tkop-radius); background: #fff; }
.tkop-login-box h2 { margin-top: 0; }

/* View-as banner */
.tkop-viewas { display: flex; align-items: center; justify-content: space-between; gap: 1em; flex-wrap: wrap; padding: 0.7em 1em; margin-bottom: 1em; border-radius: var(--tkop-radius); background: #fff4e5; border: 1px solid #ed6c02; }
.tkop-viewas form { margin: 0; }
.tkop-viewas button[type="submit"] { background: #ed6c02; border-color: #ed6c02; padding: 0.45em 1em; }

/* Header */
.tkop-header { border: 1px solid var(--tkop-border); border-radius: var(--tkop-radius); background: #fff; margin-bottom: 1.5em; }
.tkop-header-main { display: flex; align-items: center; gap: 1.2em; padding: 1em 1.2em; flex-wrap: wrap; }
.tkop-logo { max-height: 48px; width: auto; }
.tkop-villa-title { display: flex; flex-direction: column; flex: 1 1 auto; }
.tkop-eyebrow, .tkop-villa-select label { font-size: 0.75em; text-transform: uppercase; letter-spacing: 0.06em; color: var(--tkop-muted); }
.tkop-villa-name { font-size: 1.3em; font-weight: 600; }
.tkop-villa-select { display: flex; flex-direction: column; margin: 0; }
.tkop-villa-select select { font: inherit; font-size: 1.15em; font-weight: 600; padding: 0.3em 0.5em; border: 1px solid var(--tkop-border); border-radius: var(--tkop-radius); max-width: 100%; }
.tkop-user { display: flex; gap: 1em; align-items: center; font-size: 0.95em; }
.tkop-user a { color: var(--tkop-accent); }
.tkop-nav { display: flex; gap: 0.25em; padding: 0 1.2em; border-top: 1px solid var(--tkop-border); overflow-x: auto; }
.tkop-nav a { padding: 0.8em 0.9em; border-bottom: 3px solid transparent; color: inherit; text-decoration: none; white-space: nowrap; }
.tkop-nav a:hover { color: var(--tkop-accent); }
.tkop-nav a.is-active { border-bottom-color: var(--tkop-accent); color: var(--tkop-accent); font-weight: 600; }

/* Content */
.tkop-section { margin: 0 0 2em; }
.tkop-section h2 { margin: 0 0 0.6em; }
.tkop-section h3 { margin: 0 0 0.6em; padding-bottom: 0.3em; border-bottom: 1px solid var(--tkop-border); }
.tkop-lead { font-size: 1.05em; }
.tkop-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.2em; }
.tkop-card { padding: 1.2em; border: 1px solid var(--tkop-border); border-radius: var(--tkop-radius); background: #fff; }
.tkop-card h3 { margin: 0 0 0.5em; font-size: 1.1em; }
.tkop-card p:last-child { margin-bottom: 0; }
.tkop-card a, .tkop-dl a { color: var(--tkop-accent); }
.tkop-list { margin: 0; padding-left: 1.1em; }
.tkop-dl { display: grid; grid-template-columns: minmax(160px, 30%) 1fr; gap: 0.5em 1.5em; margin: 0; }
.tkop-dl dt { color: var(--tkop-muted); }
.tkop-dl dd { margin: 0; }
@media (max-width: 640px) { .tkop-dl { grid-template-columns: 1fr; } .tkop-dl dd { margin-bottom: 0.6em; } }
.tkop-message { max-width: 560px; margin: 2em auto; padding: 2em; text-align: center; border: 1px solid var(--tkop-border); border-radius: var(--tkop-radius); background: #fff; }

/* Documents */
.tkop-section-head { display: flex; justify-content: space-between; align-items: center; gap: 1em; flex-wrap: wrap; margin-bottom: 0.8em; }
.tkop-section-head h2 { margin: 0; }
.tkop-doc-filters { display: flex; gap: 0.6em; flex-wrap: wrap; margin: 0 0 1em; }
.tkop-doc-filters select, .tkop-doc-filters input[type="search"] { font: inherit; padding: 0.5em 0.7em; border: 1px solid var(--tkop-border); border-radius: var(--tkop-radius); background: #fff; }
.tkop-doc-filters input[type="search"] { flex: 1 1 220px; }
.tkop-table { width: 100%; border-collapse: collapse; margin: 0 0 1em; }
.tkop-table th { text-align: left; font-weight: 600; font-size: 0.85em; text-transform: uppercase; letter-spacing: 0.04em; color: var(--tkop-muted); padding: 0.6em 0.8em; border-bottom: 2px solid var(--tkop-border); }
.tkop-table td { padding: 0.75em 0.8em; border-bottom: 1px solid var(--tkop-border); vertical-align: top; }
.tkop-doc-meta, .tkop-doc-desc { display: block; font-size: 0.85em; color: var(--tkop-muted); }
.tkop-doc-actions { white-space: nowrap; text-align: right; }
.tkop-doc-actions a, .tkop-link-button { color: var(--tkop-accent); margin-left: 0.8em; }
.tkop-link-button { background: none !important; border: 0 !important; padding: 0 !important; font: inherit; cursor: pointer; text-decoration: underline; color: #c62828 !important; font-weight: normal !important; }
.tkop-inline-form { display: inline; margin: 0; }
.tkop-empty { padding: 1.5em; text-align: center; border: 1px dashed var(--tkop-border); border-radius: var(--tkop-radius); color: var(--tkop-muted); }
.tkop-pager { display: flex; gap: 0.3em; flex-wrap: wrap; }
.tkop-pager a { padding: 0.3em 0.7em; border: 1px solid var(--tkop-border); border-radius: var(--tkop-radius); text-decoration: none; color: inherit; }
.tkop-pager a.is-active { background: var(--tkop-accent); border-color: var(--tkop-accent); color: #fff; }
.tkop-upload { padding: 1.2em; border: 1px solid var(--tkop-border); border-radius: var(--tkop-radius); background: var(--tkop-soft); }
.tkop-upload h3 { border: 0 !important; }
.tkop-form textarea { width: 100%; padding: 0.6em 0.75em; border: 1px solid var(--tkop-border); border-radius: var(--tkop-radius); font: inherit; background: #fff; }
.tkop-form input[type="file"] { display: block; margin: 0.3em 0; }
@media (max-width: 720px) {
	.tkop-table thead { display: none; }
	.tkop-table, .tkop-table tbody, .tkop-table tr, .tkop-table td { display: block; width: 100%; }
	.tkop-table tr { padding: 0.6em 0; border-bottom: 1px solid var(--tkop-border); }
	.tkop-table td { border: 0; padding: 0.2em 0; }
	.tkop-table td[data-label]:not(:first-child)::before { content: attr(data-label) ": "; color: var(--tkop-muted); }
	.tkop-doc-actions { text-align: left; }
	.tkop-doc-actions a:first-child { margin-left: 0; }
}