/* Assemblr Pro App — prototype styles. Same palette as the other two plugins;
   swap --ap-* variables once real brand colors are final. 9/21: teal retired
   (Cak's call), replaced with a dark gray (secondary, general accents/labels)
   and a dark beige sampled from the hero photo (tertiary, used for action
   buttons, the active-tab state, and numeric call-outs like the job price).
   --ap-amber corrected to match the home page's sampled logo color. */

.ap-card, .ap-dashboard {
	--ap-navy: #12202b;
	--ap-gray: #4a4a4a;
	--ap-gray-dark: #333333;
	--ap-beige: #b58265;
	--ap-beige-dark: #8a5f45;
	--ap-amber: #e25a2c;
	--ap-cream: #f7f4ee;
	--ap-ink: #1c2b33;
	--ap-muted: #5b6b73;
	--ap-white: #ffffff;
	--ap-border: #e3ddd0;
	--ap-radius: 12px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--ap-ink);
}

.ap-card {
	background: var(--ap-white);
	border: 1px solid var(--ap-border);
	border-radius: var(--ap-radius);
	padding: 32px;
	max-width: 680px;
	margin: 32px auto;
}
.ap-card h2 { margin-top: 0; color: var(--ap-navy); }
.ap-card h3 { color: var(--ap-navy); margin: 24px 0 6px; border-top: 1px solid var(--ap-border); padding-top: 20px; }
.ap-card h3:first-of-type { border-top: none; padding-top: 0; }

.ap-card form label, .ap-dashboard form label {
	display: block;
	font-weight: 600;
	font-size: 14px;
	margin: 12px 0 6px;
}
.ap-card input[type=text], .ap-card input[type=email], .ap-card input[type=password],
.ap-card input[type=tel], .ap-card input[type=number], .ap-card select,
.ap-card textarea, .ap-card input[type=file] {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid var(--ap-border);
	border-radius: 8px;
	font-size: 15px;
	font-family: inherit;
}
.ap-checkbox { display: flex; align-items: center; gap: 8px; font-weight: 400 !important; margin: 6px 0 !important; }
.ap-checkbox input { width: auto !important; }
.ap-radio-group { display: flex; gap: 20px; font-weight: 400 !important; }
.ap-radio-group label { display: flex; align-items: center; gap: 6px; font-weight: 400; margin: 0 !important; }

.ap-upsell-row { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
.ap-upsell-row .ap-checkbox { flex: 1; margin: 0 !important; }
.ap-upsell-price { width: 90px !important; }

.ap-btn {
	display: inline-block;
	padding: 12px 22px;
	border-radius: 999px;
	font-weight: 600;
	text-decoration: none;
	border: none;
	cursor: pointer;
	font-size: 15px;
	margin-top: 16px;
}
.ap-btn-primary { background: var(--ap-beige); color: var(--ap-white); }
.ap-btn-secondary { background: var(--ap-cream); color: var(--ap-navy); border: 1px solid var(--ap-border); }

.ap-fineprint { font-size: 13px; color: var(--ap-muted); }
.ap-badge {
	display: inline-block;
	background: var(--ap-cream);
	color: var(--ap-gray-dark);
	padding: 4px 12px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 600;
}
.ap-badge-safety { background: #fdecd2; color: #9a5b00; margin-left: 8px; }
.ap-badge-approved { background: #e8e8e8; color: var(--ap-gray-dark); }
.ap-badge-pending { background: #fdecd2; color: #9a5b00; }
.ap-badge-suspended { background: #fbe1de; color: #a0301f; }

/* Dashboard */
.ap-dashboard { max-width: 900px; margin: 32px auto; }
.ap-dash-header { margin-bottom: 16px; }
.ap-dash-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--ap-border); margin-bottom: 24px; }
.ap-dash-tabs a {
	padding: 10px 16px;
	text-decoration: none;
	color: var(--ap-muted);
	font-weight: 600;
	font-size: 14px;
	border-bottom: 2px solid transparent;
}
.ap-dash-tabs a.active { color: var(--ap-beige-dark); border-bottom-color: var(--ap-beige); }

.ap-job-card {
	background: var(--ap-white);
	border: 1px solid var(--ap-border);
	border-radius: var(--ap-radius);
	padding: 20px;
	margin-bottom: 16px;
}
.ap-job-requested { border-color: var(--ap-amber); }
.ap-job-card h4 { margin: 0 0 6px; }
.ap-job-price { font-size: 20px; font-weight: 700; color: var(--ap-beige-dark); margin: 8px 0; }

.ap-calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; margin: 16px 0; }
.ap-cal-day {
	display: flex; flex-direction: column; align-items: center; gap: 4px;
	padding: 10px 4px; border: 1px solid var(--ap-border); border-radius: 8px;
	font-size: 12px; font-weight: 600; text-align: center;
}
.ap-cal-booked { background: var(--ap-cream); opacity: .7; }

.ap-profile-summary { list-style: none; padding: 0; }
.ap-profile-summary li { padding: 8px 0; border-bottom: 1px solid var(--ap-border); font-size: 14px; }

@media (max-width: 640px) {
	.ap-card { padding: 20px; margin: 16px; }
	.ap-calendar-grid { grid-template-columns: repeat(3, 1fr); }
}