/* Public and admin presentation only. Keep account, email, data and workflows independent. */
:is(.nook-public, .nook-admin) {
    --nook-ink: #30383b;
    --nook-muted: #626a70;
    --nook-line: #e2e6e8;
    --nook-renter: #a74327;
    --nook-renter-border: #e0a084;
    --nook-renter-wash: #fff2eb;
    --nook-host: #a53550;
    --nook-host-border: #e5a1af;
    --nook-host-wash: #fff0f3;
    --action-ink: #384247;
    --action-border: #cdd3d6;
    --action-wash: #f5f6f7;
    color: var(--nook-ink);
}

/* Outlined actions; maintain dimensions for existing toolbars and responsive layouts. */
:is(.nook-public, .nook-admin) :is(.btn, .btn-search, .MuiButton-root) {
    background: #fff !important;
    background-image: none !important;
    color: var(--action-ink) !important;
    border: 1px solid var(--action-border) !important;
    border-radius: 7px !important;
    box-shadow: none !important;
    font-weight: 600;
    letter-spacing: 0;
    transition: none !important;
    animation: none !important;
    transform: none !important;
    text-shadow: none !important;
}
:is(.nook-public, .nook-admin) :is(.btn, .btn-search, .MuiButton-root):is(:hover, :focus, :active, .active, [aria-pressed="true"]) {
    background: var(--action-wash) !important;
    border-color: var(--action-ink) !important;
    color: var(--action-ink) !important;
    box-shadow: none !important;
    transform: none !important;
}
:is(.nook-public, .nook-admin) :is(.btn, .btn-search)::before,
:is(.nook-public, .nook-admin) :is(.btn, .btn-search)::after,
:is(.nook-public, .nook-admin) .ripple-container,
.nook-public .MuiButton-root .MuiTouchRipple-root { display: none !important; }
:is(.nook-public, .nook-admin) :is(.btn, .MuiButton-root):disabled,
:is(.nook-public, .nook-admin) .btn.disabled { opacity: .5; cursor: not-allowed; }
:is(.nook-public, .nook-admin) :is(a, button, input, select, textarea, summary):focus-visible {
    outline: 2px solid var(--action-ink) !important;
    outline-offset: 3px;
}
.nook-public :is(.btn-primary, .btn-search, .MuiButton-containedPrimary),
:is(.nook-public, .nook-admin) :is(.btn-renter, .renters-btn, .btn-learn-more--renter) {
    --action-ink: var(--nook-renter);
    --action-border: var(--nook-renter-border);
    --action-wash: var(--nook-renter-wash);
}
.nook-public[data-nook-role="host"] .btn-primary,
:is(.nook-public, .nook-admin) :is(.btn-host, .hosts-btn, .btn-learn-more--host),
.nook-public .btn:is([href*="/become-a-host"], [href*="/dashboard/create-listing"], [href*="/frequently-asked-questions-host"]) {
    --action-ink: var(--nook-host);
    --action-border: var(--nook-host-border);
    --action-wash: var(--nook-host-wash);
}
:is(.nook-public, .nook-admin) :is(.btn-danger, .btn-outline-danger) { --action-ink: #a02e2e; --action-border: #d6aaaa; --action-wash: #fff1f1; }
:is(.nook-public, .nook-admin) :is(.btn-success, .btn-outline-success) { --action-ink: #356047; --action-border: #a3c7b0; --action-wash: #eff6f1; }
:is(.nook-public, .nook-admin) :is(.btn-warning, .btn-outline-warning) { --action-ink: #825518; --action-border: #d5bb89; --action-wash: #fff7e9; }
:is(.nook-public, .nook-admin) :is(.btn-info, .btn-outline-info) { --action-ink: #356175; --action-border: #a0bdca; --action-wash: #f0f6f9; }
:is(.nook-public, .nook-admin) .btn-link { background: transparent !important; border-color: transparent !important; }
.nook-public .btn:not(.btn-sm):not(.btn-xs):not(.btn-fab):not(.close-map-btn) { min-height: 42px; padding: 10px 22px; }
/* One search surface, with a renter-coloured pill tucked into its right edge. */
.nook-public.home-page .home-container .hero-search .hero-form {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    padding: 6px;
    background: #fff;
    border: 1px solid var(--nook-line);
    border-radius: 999px;
    box-sizing: border-box;
}
.nook-public.home-page .home-container .hero-search .hero-form:focus-within { border-color: var(--nook-renter-border); }
.nook-public.home-page .home-container .hero-search .hero-form .location-select {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    max-width: none;
}
.nook-public.home-page .home-container .hero-search .hero-form .address-input {
    height: 44px;
    padding: 0 16px;
    background: #fff !important;
    border: 0;
    box-shadow: none;
    border-radius: 999px;
}
.nook-public.home-page .home-container .hero-search .hero-form .btn-search {
    flex: 0 0 auto;
    width: auto !important;
    min-height: 44px;
    height: auto;
    margin: 0 !important;
    padding: 10px 20px;
    line-height: 22px;
    border-radius: 999px !important;
    background: var(--nook-renter-wash) !important;
    white-space: nowrap;
}
@media (max-width: 480px) {
    .nook-public.home-page .home-container .hero-search .hero-form { gap: 2px; padding: 5px; }
    .nook-public.home-page .home-container .hero-search .hero-form .address-input { padding: 0 10px; }
    .nook-public.home-page .home-container .hero-search .hero-form .btn-search { padding: 10px 12px; font-size: 14px; }
}
/* This transform positions the map action; it is not a hover animation. */
.nook-public .card-map button.btn { transform: translate(-50%, -50%) !important; }

/* Retain renter/host distinctions on the home-page mode selector. */
.nook-public .howit-toggle .howit-btn { background: #fff !important; color: var(--nook-muted) !important; border: 1px solid var(--nook-line); border-radius: 7px; box-shadow: none !important; transition: none !important; transform: none !important; }
.nook-public .howit-btn[data-type="renters"].active { background: var(--nook-renter-wash) !important; color: var(--nook-renter) !important; border-color: var(--nook-renter-border); }
.nook-public .howit-btn[data-type="hosts"].active { background: var(--nook-host-wash) !important; color: var(--nook-host) !important; border-color: var(--nook-host-border); }
.nook-public .timeline-badge.renter { background: var(--nook-renter-wash) !important; color: var(--nook-renter) !important; border: 1px solid var(--nook-renter-border); box-shadow: none; }
.nook-public .timeline-badge.host { background: var(--nook-host-wash) !important; color: var(--nook-host) !important; border: 1px solid var(--nook-host-border); box-shadow: none; }
.nook-public :is(.timeline-panel, .feature-card) { background: #fff; border: 1px solid var(--nook-line) !important; border-radius: 12px !important; box-shadow: none !important; transition: none !important; }
.nook-public :is(.timeline-panel, .feature-card):hover { transform: none !important; box-shadow: none !important; }
.nook-public .cta-section { background: #f8f9fa; border-top: 1px solid var(--nook-line); color: var(--nook-ink); }
.nook-public .cta-section :is(h2,p) { color: var(--nook-ink); }

/* Quiet surfaces, with the existing page composition and imagery retained. */
.nook-public .listing-card-link { display: block; color: var(--nook-ink); text-decoration: none; border-radius: 12px; }
.nook-public .listing-card-link:hover { color: var(--nook-ink); text-decoration: none; }
.nook-public .listing-card-link:focus-visible { outline-offset: -3px; }
.nook-public .listing-card-link .listing-title { padding: 18px 16px; border-bottom: 0; }
.nook-public .listing-card-link .listing-status { background: var(--nook-host-wash); color: var(--nook-host); font-weight: 500; }
.nook-public .listing-card-link img { transform: none !important; transition: none !important; }
.nook-public .listing-card-description { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 16px; }
.nook-public .listing-card-summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 16px; margin: 0 16px; padding: 18px 0; border-bottom: 1px solid var(--nook-line); background: #fff; }
.nook-public .listing-card-details { min-width: 0; }
.nook-public .listing-card-name { margin: 0; color: var(--nook-ink); font-size: 16px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.nook-public .listing-card-rate { text-align: right; white-space: nowrap; line-height: 1.4; }
.nook-public .listing-card-amount { display: block; color: var(--nook-ink); font-size: 16px; font-weight: 500; }
.nook-public .listing-card-period { display: block; margin-top: 6px; color: var(--nook-muted); font-size: 12px; font-weight: 400; }
.nook-public .listing-card-location { display: flex; align-items: flex-start; gap: 5px; margin-top: 6px; color: var(--nook-muted); font-size: 13px; line-height: 1.5; }
.nook-public .listing-card-location svg { flex: 0 0 16px; margin-top: 1px; color: #f76164; }
.nook-public .listing-card-location span { min-width: 0; overflow-wrap: anywhere; }
.nook-public .listing-feature-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; list-style: none; margin: 0 16px 20px; padding: 18px 0 0; border-top: 1px solid var(--nook-line); }
.nook-public .listing-feature-grid li { display: flex; align-items: flex-start; gap: 10px; color: var(--nook-muted); font-size: 14px; line-height: 1.5; min-width: 0; overflow-wrap: anywhere; }
.nook-public .listing-feature-grid .material-icons { flex-shrink: 0; font-size: 20px; line-height: 21px; color: var(--nook-renter); }
.nook-public .host-help-links { display: flex; justify-content: center; gap: 24px; }
.nook-public .host-help-links a { display: inline-flex; align-items: center; min-height: 44px; color: var(--nook-muted); font-size: 14px; font-weight: 500; text-decoration: underline; text-decoration-color: var(--nook-line); text-underline-offset: 5px; }
.nook-public .host-help-links a:is(:hover, :focus-visible) { color: var(--nook-host); text-decoration-color: currentColor; }
.nook-public :is(.listing-card, .card-signup, .panel, .gl-card, .MuiCard-root),
.nook-admin :is(.card, .panel, .nd-card, .webhook-card, .admin-conversation-card) {
    background-color: #fff;
    border: 1px solid var(--nook-line);
    border-radius: 12px;
    box-shadow: none !important;
    transition: none !important;
}
.nook-public :is(.listing-card, .listing-card-wrapper, .card-signup, .panel, .MuiCard-root, .storage-type),
.nook-public .listings-grid > div,
.nook-admin :is(.card, .panel, .nd-card, .webhook-card, .admin-conversation-card) {
    transform: none !important;
    transition: none !important;
}
.nook-public :is(.listing-card, .listing-card-wrapper, .card-signup, .panel, .MuiCard-root, .storage-type):hover,
.nook-public .listings-grid > div:hover,
.nook-admin :is(.card, .panel, .nd-card, .webhook-card, .admin-conversation-card):hover { transform: none !important; box-shadow: none !important; }
.nook-public :is(.listing-container, .contact-container) { background-color: #f8f9fa; }
.nook-public.listing-page .listing-container:has(> #map-canvas) { padding-top: 0 !important; }
.nook-public.listing-page .listing-sidebar .media-avatar { width: 56px; height: 56px; margin: 0 auto 12px; }
.nook-public.listing-page .listing-sidebar .media-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.nook-public :is(.panel-heading, .card-signup .card-header) { background: #fff; color: var(--nook-ink); border-bottom: 1px solid var(--nook-line); }
.nook-public :is(.form-control, .map-filter-select) { border-color: #cdd3d6; border-radius: 6px; box-shadow: none; }
.nook-public :is(.form-control, .map-filter-select):focus { border-color: var(--nook-renter-border); box-shadow: none; }
.nook-public[data-nook-role="host"] .form-control:focus { border-color: var(--nook-host-border); }
.nook-public .header { box-shadow: none; border-bottom: 0; }
.nook-public .header .header-container { border: 1px solid var(--nook-line); border-top: 0; box-shadow: none; }
.nook-public .dropdown-menu { border: 1px solid var(--nook-line); border-radius: 8px; box-shadow: 0 8px 24px #30383b0d; }
.nook-public .dropdown-menu > li > a:hover { background: #f5f6f7; color: var(--nook-ink); }
.nook-public .header #dashboard-dropdown > li > a:is(:hover, :focus) {
    background: transparent;
    box-shadow: none;
    text-shadow: none;
}
.nook-public .header #dashboard-dropdown > li > a::after { content: none; }

/* Admin uses the same quiet shell as myNook, without changing operational signals. */
.nook-admin, .nook-admin .main-panel { background: #f8f9fa; }
.nook-admin .sidebar { background: #fff; border-right: 1px solid var(--nook-line); box-shadow: none; }
.nook-admin .sidebar:before, .nook-admin .sidebar:after { display: none; }
.nook-admin .sidebar .logo { border-bottom: 1px solid var(--nook-line); padding: 28px 16px; }
.nook-admin .sidebar .logo img { max-width: 150px !important; }
.nook-admin .sidebar .nav li > a { background: transparent; color: #525b60; border-radius: 8px; margin: 5px 14px; padding: 13px 14px; font-size: 15px; font-weight: 500; box-shadow: none !important; transition: none !important; transform: none !important; }
.nook-admin .sidebar .nav li > a:hover { background: #f5f6f7; }
.nook-admin .sidebar .nav li.active > a { background: #fff2eb !important; color: #853820 !important; border-left: 0; }
.nook-admin .sidebar .nav li > a i { color: inherit !important; }
.nook-admin .btn { height: auto; min-height: 34px; padding: 7px 12px; font-size: 14px; }
.nook-admin :is(.btn-sm, .btn-xs) { min-height: 30px; padding: 5px 9px; font-size: 13px; }
.nook-admin .btn-fab { padding: 0; }
.nook-admin :is(.panel-heading, .card-header, .dashboard-header) { background: #fff !important; color: var(--nook-ink) !important; box-shadow: none !important; border-bottom: 1px solid var(--nook-line); }
.nook-admin :is(.panel-heading, .card-header, .dashboard-header) :is(h1,h2,h3,h4,p) { color: var(--nook-ink) !important; }
.nook-admin .table > thead > tr > th { background: #f8f9fa; color: #505b62; border-bottom: 1px solid var(--nook-line); }
.nook-admin .table > tbody > tr > td { border-color: var(--nook-line); }
.nook-admin .table-hover > tbody > tr:hover { background: #f8f9fa; }
.nook-admin .form-control { border-color: #cdd3d6; border-radius: 6px; box-shadow: none; }
.nook-admin .nav-pills > li > a { border-radius: 7px; }
.nook-admin .nav-pills > li.active > a { background: #fff2eb !important; color: #853820 !important; box-shadow: none !important; }
.nook-admin .list-group-item.active { background: #f5f6f7 !important; color: var(--nook-ink) !important; border-color: var(--nook-line); }
.nook-admin .list-group-item.active[href*="type=hosts"] { background: var(--nook-host-wash) !important; color: var(--nook-host) !important; border-color: var(--nook-host-border); }
.nook-admin .list-group-item.active[href*="type=renters"] { background: var(--nook-renter-wash) !important; color: var(--nook-renter) !important; border-color: var(--nook-renter-border); }
.nook-admin .pagination > .active > span, .nook-admin .pagination > .active > a { background: #fff2eb; border-color: #e0a084; color: #853820; }
.nook-admin .nd-root { --nd-ink: #30383b; --nd-ink-2: #626a70; --nd-muted: #626a70; --nd-border: #e2e6e8; }
.nook-admin .nd-action:hover { background: #f8f9fa; }
.nook-admin .nd-range-btn { transition: none; border-radius: 7px; }
.nook-admin .nd-action-cta { color: var(--nook-renter); }
.nook-admin .footer { border-top: 1px solid var(--nook-line); }
@media (max-width: 767px) {
    .nook-public .btn { white-space: normal; }
    .nook-admin .btn:not(.btn-fab) { max-width: 100%; white-space: normal; }
}
