/* "Square corners" for a business's villa websites
 * (Organization.website_corners, chosen with the colours on the page editor).
 *
 * Only the public website shell (templates/public/base_public.html) sets
 * data-site-corners, so the dashboard is untouched. Plain CSS, not Tailwind -
 * no rebuild needed. It removes the rounding from every photo, button, box
 * and field on the page, whatever rounded-* class it has.
 *
 * Kept round on purpose:
 *   - circles (.rounded-full with no side padding): icons, dots, avatars,
 *     the editor's pens - squaring them looks broken, not "square style".
 *     Pill-shaped buttons and labels DO go square: they are .rounded-full too,
 *     but always have side padding (px-*) or are marked .site-button.
 *   - the page editor's own windows and top bar ([role="dialog"], .pms-edit-ui),
 *     which are dashboard tools, not part of the guest's page.
 */
[data-site-corners="square"] body *:not(.rounded-full):not([role="dialog"], [role="dialog"] *, .pms-edit-ui, .pms-edit-ui *) {
  border-radius: 0 !important;
}
[data-site-corners="square"] body :is(.site-button, .btn, .rounded-full[class*="px-"]):not([role="dialog"] *, .pms-edit-ui, .pms-edit-ui *) {
  border-radius: 0 !important;
}