/**
 * Owner Dashboard & Registration Styles
 */

@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@600;700&family=Roboto:wght@400;500;700&display=swap');

/* =========================================================================
   CSS Variables
   ========================================================================= */
:root {
    --mrbean-primary:      #a8606b;
    --mrbean-primary-dark: #8f4f5a;
    --mrbean-secondary:    #6b4c3b;
    --mrbean-success:      #46b450;
    --mrbean-warning:      #f0a500;
    --mrbean-error:        #dc3232;
    --mrbean-border:       #e0e0e0;
    --mrbean-bg:           #f7f5f3;
    --mrbean-bg-white:     #fff;
    --mrbean-text:         #1a1a1a;
    --mrbean-text-light:   #666;
    --mrbean-radius:       10px;
    --mrbean-shadow:       0 2px 12px rgba(0,0,0,.07);
}

/* =========================================================================
   Notices
   ========================================================================= */
.mrbean-notice {
    padding: 14px 18px;
    border-radius: var(--mrbean-radius);
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 1.5;
}

.mrbean-notice-success {
    background: #edf7ee;
    border: 1px solid var(--mrbean-success);
    color: #2d7a33;
}

.mrbean-notice-warning {
    background: #fff8e1;
    border: 1px solid var(--mrbean-warning);
    color: #7a5800;
}

.mrbean-notice-error {
    background: #fcf0f1;
    border: 1px solid var(--mrbean-error);
    color: var(--mrbean-error);
}

/* =========================================================================
   Dashboard Layout
   ========================================================================= */
.mrbean-owner-dashboard {
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 20px 60px;
    font-family: 'Roboto', sans-serif;
}

/* Explicit Roboto for all body text; headers use Josefin Sans */
.mrbean-owner-dashboard,
.mrbean-owner-dashboard * {
    font-family: 'Roboto', sans-serif;
}

.mrbean-owner-dashboard h1,
.mrbean-owner-dashboard h2,
.mrbean-owner-dashboard h3,
.mrbean-owner-dashboard h4,
.mrbean-owner-dashboard h5,
.mrbean-owner-dashboard h6,
.mrbean-owner-dashboard .mrbean-edit-header h2,
.mrbean-owner-dashboard .mrbean-section-heading {
    font-family: 'Josefin Sans', sans-serif;
}

.mrbean-owner-dashboard h2,
.mrbean-owner-dashboard .mrbean-edit-header h2 {
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #382210;
}

.mrbean-owner-dashboard h3,
.mrbean-owner-dashboard .mrbean-section-heading {
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #382210;
}

/* Auto-renew toggle */
.mrbean-autorenew-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    cursor: pointer;
    color: var(--mrbean-text-light);
    user-select: none;
}
.mrbean-autorenew-toggle input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--mrbean-primary);
}
.mrbean-autorenew-toggle input[type="checkbox"]:checked + span,
.mrbean-autorenew-toggle:has(input:checked) {
    color: var(--mrbean-primary);
    font-weight: 500;
}

/* Extend / info notice */
.mrbean-notice-info {
    background: #e8f4fd;
    border-left: 4px solid #2271b1;
    color: #1d4a7a;
}

/* Header */
.mrbean-dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 30px;
    padding-bottom: 24px;
    border-bottom: 2px solid var(--mrbean-border);
}

.mrbean-dashboard-header h1 {
    margin: 0 0 4px;
    font-size: 26px;
    color: var(--mrbean-text);
}

.mrbean-dashboard-header p {
    margin: 0;
    color: var(--mrbean-text-light);
    font-size: 14px;
}

.mrbean-dashboard-header-right {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

/* Two-column layout: sidebar + content */
.mrbean-dashboard-layout {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 28px;
    align-items: start;
}

/* Sidebar nav */
.mrbean-dashboard-sidebar {
    position: sticky;
    top: 24px;
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    overflow: hidden;
}

.mrbean-nav-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    text-decoration: none;
    color: var(--mrbean-text);
    font-size: 14px;
    border-bottom: 1px solid var(--mrbean-border);
    transition: background 0.15s, color 0.15s;
}

.mrbean-nav-item:last-child {
    border-bottom: none;
}

.mrbean-nav-item:hover {
    background: var(--mrbean-bg);
    color: var(--mrbean-primary);
}

.mrbean-nav-item.active {
    background: var(--mrbean-primary);
    color: #fff;
    font-weight: 600;
}

.mrbean-nav-icon {
    font-size: 16px;
    opacity: 0.7;
}

.mrbean-nav-divider {
    height: 1px;
    background: var(--mrbean-border);
}

/* Status dot in sidebar */
.mrbean-nav-status {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.mrbean-nav-status.mrbean-status--open         { background: var(--mrbean-success); }
.mrbean-nav-status.mrbean-status--temp-closed  { background: var(--mrbean-warning); }
.mrbean-nav-status.mrbean-status--closed       { background: var(--mrbean-error); }

/* Dashboard main content */
.mrbean-dashboard-content {
    min-width: 0;
}

/* =========================================================================
   Buttons
   ========================================================================= */
.mrbean-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    border: 2px solid transparent;
    text-decoration: none;
    transition: all 0.15s ease;
    white-space: nowrap;
    line-height: 1.4;
}

.mrbean-btn:focus { outline: 3px solid rgba(168,96,107,.35); outline-offset: 2px; }

.mrbean-btn-primary {
    background: var(--mrbean-primary);
    color: #fff;
    border-color: var(--mrbean-primary);
}
.mrbean-btn-primary:hover { background: var(--mrbean-primary-dark); border-color: var(--mrbean-primary-dark); color: #fff; }

.mrbean-btn-outline {
    background: transparent;
    color: var(--mrbean-primary);
    border-color: var(--mrbean-primary);
}
.mrbean-btn-outline:hover { background: var(--mrbean-primary); color: #fff; }

.mrbean-btn-ghost {
    background: transparent;
    color: var(--mrbean-text-light);
    border-color: var(--mrbean-border);
}
.mrbean-btn-ghost:hover { background: var(--mrbean-bg); color: var(--mrbean-text); }

.mrbean-btn-sm  { padding: 6px 14px; font-size: 13px; }
.mrbean-btn-lg  { padding: 14px 28px; font-size: 15px; }
.mrbean-btn-full { width: 100%; }

.mrbean-link-btn {
    background: none;
    border: none;
    color: var(--mrbean-primary);
    cursor: pointer;
    font-size: inherit;
    padding: 0;
    text-decoration: underline;
}

/* =========================================================================
   Section Title
   ========================================================================= */
.mrbean-section-title {
    margin: 0 0 20px;
    font-size: 20px;
    color: var(--mrbean-text);
}

/* =========================================================================
   Overview: Listings Grid
   ========================================================================= */
.mrbean-no-listings {
    text-align: center;
    padding: 70px 30px;
    background: var(--mrbean-bg);
    border-radius: var(--mrbean-radius);
}

.mrbean-no-listings-icon {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.4;
}

.mrbean-no-listings h2 { margin: 0 0 10px; }

.mrbean-no-listings p {
    margin: 0 0 24px;
    color: var(--mrbean-text-light);
}

.mrbean-no-listings-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

.mrbean-listings-grid { display: grid; gap: 20px; }

.mrbean-listing-card {
    display: grid;
    grid-template-columns: 180px 1fr;
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    box-shadow: var(--mrbean-shadow);
    transition: box-shadow 0.15s;
}

.mrbean-listing-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,.11); }

.mrbean-listing-image {
    position: relative;
    background: var(--mrbean-bg);
    overflow: hidden;
    border-radius: var(--mrbean-radius) 0 0 var(--mrbean-radius);
}

.mrbean-listing-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.mrbean-listing-image-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 140px;
    font-size: 40px;
    opacity: 0.25;
}

/* Badges */
.mrbean-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .4px;
    text-transform: uppercase;
}

.mrbean-badge-featured {
    background: #f0c040;
    color: #5a3e00;
}

.mrbean-badge-status {
    top: auto;
    bottom: 8px;
    left: 8px;
}

.mrbean-badge--open         { background: #d4edda; color: #1a5c2a; }
.mrbean-badge--temp-closed  { background: #fff3cd; color: #7a5800; }
.mrbean-badge--closed       { background: #f8d7da; color: #7c1c22; }
.mrbean-badge--verified     { background: #d4edda; color: #1a5c2a; }
.mrbean-badge--unverified   { background: #fff3cd; color: #7a5800; }

.mrbean-badge-draft {
    position: static;
    background: #e0e0e0;
    color: #555;
    margin-left: 8px;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 4px;
    font-weight: 600;
    vertical-align: middle;
}

.mrbean-listing-info { padding: 18px 20px; display: flex; flex-direction: column; gap: 10px; }

.mrbean-listing-title-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.mrbean-listing-title-row h3 { margin: 0; font-size: 16px; }

.mrbean-listing-address { margin: 0; color: var(--mrbean-text-light); font-size: 13px; }

.mrbean-listing-stats { display: flex; gap: 24px; flex-wrap: wrap; }

.mrbean-listing-stats .mrbean-stat { text-align: center; }

.mrbean-listing-stats .mrbean-stat-value {
    display: block;
    font-size: 20px;
    font-weight: 700;
    color: var(--mrbean-primary);
}

.mrbean-listing-stats .mrbean-stat-label {
    font-size: 11px;
    color: var(--mrbean-text-light);
    text-transform: uppercase;
    letter-spacing: .4px;
}

.mrbean-listing-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
    margin-top: auto;
}

/* "More actions" dropdown */
.mrbean-listing-more-actions { position: relative; }

.mrbean-more-actions-menu {
    display: none;
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    min-width: 200px;
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
    z-index: 100;
    overflow: hidden;
}

.mrbean-listing-more-actions.open .mrbean-more-actions-menu { display: block; }

.mrbean-action-item {
    display: block;
    width: 100%;
    padding: 10px 14px;
    background: none;
    border: none;
    text-align: left;
    font-size: 13px;
    cursor: pointer;
    color: var(--mrbean-text);
    transition: background 0.1s;
}

.mrbean-action-item:hover { background: var(--mrbean-bg); }

.mrbean-action-delete { color: var(--mrbean-error); }
.mrbean-action-delete:hover { background: #fcf0f1; }

.mrbean-more-actions-divider { height: 1px; background: var(--mrbean-border); margin: 4px 0; }

/* =========================================================================
   Upgrade CTA
   ========================================================================= */
.mrbean-upgrade-cta {
    margin-top: 32px;
    padding: 28px 30px;
    background: linear-gradient(135deg, var(--mrbean-primary) 0%, var(--mrbean-primary-dark) 100%);
    border-radius: var(--mrbean-radius);
    color: #fff;
    text-align: center;
}

.mrbean-upgrade-cta h3 { margin: 0 0 8px; font-size: 18px; }
.mrbean-upgrade-cta p  { margin: 0 0 18px; opacity: .9; font-size: 14px; }
.mrbean-upgrade-cta .mrbean-btn-primary {
    background: #fff;
    color: var(--mrbean-primary);
    border-color: #fff;
}
.mrbean-upgrade-cta .mrbean-btn-primary:hover { background: #f5f5f5; }

/* =========================================================================
   Edit Form
   ========================================================================= */
.mrbean-edit-header {
    margin-bottom: 24px;
}

.mrbean-back-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--mrbean-primary);
    text-decoration: none;
    font-size: 13px;
    margin-bottom: 8px;
}

.mrbean-back-link:hover { text-decoration: underline; }

.mrbean-edit-header h2 { margin: 0; font-size: 22px; }

.mrbean-edit-form {
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    overflow: hidden;
    box-shadow: var(--mrbean-shadow);
}

.mrbean-form-section {
    padding: 24px;
    border-bottom: 1px solid var(--mrbean-border);
}

.mrbean-form-section:last-of-type { border-bottom: none; }

.mrbean-form-section h3 {
    margin: 0 0 18px;
    font-size: 15px;
    font-weight: 600;
    color: var(--mrbean-text);
}

.mrbean-subsection { margin-bottom: 20px; }
.mrbean-subsection:last-child { margin-bottom: 0; }

.mrbean-subsection h4 {
    margin: 0 0 12px;
    font-size: 13px;
    font-weight: 600;
    color: var(--mrbean-text-light);
    text-transform: uppercase;
    letter-spacing: .5px;
}

/* Form rows */
.mrbean-form-row { margin-bottom: 18px; }
.mrbean-form-row:last-child { margin-bottom: 0; }

.mrbean-form-row label {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 7px;
    font-weight: 500;
    font-size: 14px;
    color: var(--mrbean-text);
}

.mrbean-form-row .required { color: var(--mrbean-error); }

.mrbean-form-row--half {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* Inputs */
.mrbean-form-row input[type="text"],
.mrbean-form-row input[type="email"],
.mrbean-form-row input[type="tel"],
.mrbean-form-row input[type="url"],
.mrbean-form-row input[type="password"],
.mrbean-form-row input[type="time"],
.mrbean-form-row select,
.mrbean-form-row textarea {
    width: 100%;
    padding: 11px 14px;
    border: 1.5px solid var(--mrbean-border);
    border-radius: 8px;
    font-size: 14px;
    color: var(--mrbean-text);
    background: var(--mrbean-bg-white);
    transition: border-color 0.15s, box-shadow 0.15s;
    box-sizing: border-box;
}

.mrbean-form-row select { cursor: pointer; }

.mrbean-form-row input:focus,
.mrbean-form-row select:focus,
.mrbean-form-row textarea:focus {
    outline: none;
    border-color: var(--mrbean-primary);
    box-shadow: 0 0 0 3px rgba(168,96,107,.15);
}

.mrbean-field-help {
    margin: 6px 0 0;
    font-size: 12px;
    color: var(--mrbean-text-light);
}

/* Character counter */
.mrbean-char-counter {
    margin-left: auto;
    font-size: 12px;
    font-weight: 400;
    color: var(--mrbean-text-light);
}

.mrbean-char-counter.over-limit { color: var(--mrbean-error); }

/* Input with prefix (social handles) */
.mrbean-input-prefix {
    display: flex;
    align-items: stretch;
    border: 1.5px solid var(--mrbean-border);
    border-radius: 8px;
    overflow: hidden;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.mrbean-input-prefix:focus-within {
    border-color: var(--mrbean-primary);
    box-shadow: 0 0 0 3px rgba(168,96,107,.15);
}

.mrbean-input-prefix span {
    display: flex;
    align-items: center;
    padding: 0 12px;
    background: var(--mrbean-bg);
    color: var(--mrbean-text-light);
    font-size: 13px;
    border-right: 1.5px solid var(--mrbean-border);
    white-space: nowrap;
}

.mrbean-input-prefix input {
    border: none !important;
    border-radius: 0 !important;
    flex: 1;
    box-shadow: none !important;
    padding-left: 10px;
}

.mrbean-input-prefix input:focus { outline: none; box-shadow: none !important; }

/* Form actions bar */
.mrbean-form-actions {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px 24px;
    background: var(--mrbean-bg);
    border-top: 1px solid var(--mrbean-border);
    flex-wrap: wrap;
}

.mrbean-save-status {
    font-size: 14px;
    color: var(--mrbean-success);
    font-weight: 500;
}

/* =========================================================================
   Opening Hours Grid
   ========================================================================= */
.mrbean-hours-grid { display: grid; gap: 10px; }

.mrbean-hours-row {
    display: grid;
    grid-template-columns: 110px auto 1fr;
    align-items: center;
    gap: 16px;
    padding: 10px 14px;
    background: var(--mrbean-bg);
    border-radius: 8px;
}

.mrbean-hours-day {
    font-weight: 500;
    font-size: 14px;
    color: var(--mrbean-text);
}

/* Toggle switch */
.mrbean-switch-label {
    display: flex !important;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 400 !important;
    margin-bottom: 0 !important;
    font-size: 13px;
    color: var(--mrbean-text-light);
}

.mrbean-switch-label input[type="checkbox"] { display: none; }

.mrbean-switch {
    display: inline-block;
    width: 36px;
    height: 20px;
    background: var(--mrbean-border);
    border-radius: 10px;
    position: relative;
    flex-shrink: 0;
    transition: background 0.2s;
}

.mrbean-switch::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    background: #fff;
    border-radius: 50%;
    transition: transform 0.2s;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
}

.mrbean-switch-label input:checked + .mrbean-switch {
    background: var(--mrbean-primary);
}

.mrbean-switch-label input:checked + .mrbean-switch::after {
    transform: translateX(16px);
}

.mrbean-hours-times {
    display: flex;
    align-items: center;
    gap: 10px;
}

.mrbean-time-input {
    width: 110px !important;
    padding: 8px 10px !important;
    font-size: 13px !important;
}

.mrbean-hours-separator {
    font-size: 13px;
    color: var(--mrbean-text-light);
}

.mrbean-hidden { display: none; }

/* =========================================================================
   Checkbox Groups
   ========================================================================= */
.mrbean-checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
}

.mrbean-checkbox-label {
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
    font-weight: 400 !important;
    font-size: 14px;
    cursor: pointer;
    color: var(--mrbean-text);
    margin-bottom: 0 !important;
}

.mrbean-checkbox-label input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--mrbean-primary);
    flex-shrink: 0;
}

/* Terms checkbox row */
.mrbean-form-row--terms label { font-weight: 400; }

/* =========================================================================
   Photos
   ========================================================================= */
.mrbean-photos-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.mrbean-photo-item {
    position: relative;
    padding-top: 100%;
    border-radius: 8px;
    overflow: hidden;
    background: var(--mrbean-bg);
}

.mrbean-photo-item img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mrbean-remove-photo {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 22px;
    height: 22px;
    background: rgba(0,0,0,.65);
    color: #fff;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    font-size: 15px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
}

.mrbean-remove-photo:hover { background: var(--mrbean-error); }

.mrbean-photo-upload { display: flex; align-items: center; gap: 14px; }

/* =========================================================================
   Analytics
   ========================================================================= */
.mrbean-analytics-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 16px;
    margin-bottom: 32px;
}

.mrbean-stat-card {
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    padding: 22px 20px;
    text-align: center;
    box-shadow: var(--mrbean-shadow);
}

.mrbean-stat-card .mrbean-stat-value {
    font-size: 30px;
    font-weight: 700;
    color: var(--mrbean-primary);
    margin-bottom: 4px;
    display: block;
}

.mrbean-stat-card .mrbean-stat-label {
    font-size: 12px;
    color: var(--mrbean-text-light);
    text-transform: uppercase;
    letter-spacing: .4px;
}

.mrbean-analytics-chart {
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    padding: 24px;
    box-shadow: var(--mrbean-shadow);
}

.mrbean-analytics-chart h3 { margin: 0 0 20px; font-size: 15px; }

/* =========================================================================
   Credits & Billing
   ========================================================================= */
.mrbean-credits-balance {
    text-align: center;
    padding: 32px 24px;
    margin-bottom: 24px;
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    box-shadow: var(--mrbean-shadow);
}

.mrbean-credits-value {
    display: block;
    font-size: 48px;
    font-weight: 700;
    color: var(--mrbean-primary);
    line-height: 1.2;
    margin-bottom: 4px;
}

.mrbean-credits-label {
    font-size: 14px;
    color: var(--mrbean-text-light);
    text-transform: uppercase;
    letter-spacing: .4px;
}

.mrbean-credits-actions {
    margin-bottom: 24px;
}

.mrbean-discount-form-section .mrbean-inline-form {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.mrbean-inline-form .mrbean-input-inline {
    flex: 1;
    min-width: 160px;
    padding: 10px 14px;
    border: 1px solid var(--mrbean-border);
    border-radius: 6px;
    font-size: 14px;
}

.mrbean-discount-status {
    display: inline-block;
    margin-left: 12px;
    font-size: 14px;
}

.mrbean-transactions-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.mrbean-transactions-table th,
.mrbean-transactions-table td {
    padding: 12px 16px;
    text-align: left;
    border-bottom: 1px solid var(--mrbean-border);
}

.mrbean-transactions-table th {
    font-weight: 600;
    color: var(--mrbean-text-light);
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: .4px;
}

.mrbean-tx-amount.positive { color: var(--mrbean-success); }
.mrbean-tx-amount.negative { color: var(--mrbean-error); }

.mrbean-auto-topup-status {
    margin: 0;
    font-size: 14px;
    color: var(--mrbean-text);
}

.mrbean-auto-topup--enabled { color: var(--mrbean-success); }

/* Credit pack purchase cards */
.mrbean-credit-packs-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 12px;
}

.mrbean-credit-pack-card {
    text-align: center;
    padding: 16px 12px;
    border: 1.5px solid var(--mrbean-border);
    border-radius: 8px;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.mrbean-credit-pack-card:hover {
    border-color: var(--mrbean-primary);
    box-shadow: 0 2px 8px rgba(168, 96, 107, 0.12);
}

.mrbean-credit-pack-card .mrbean-pack-name {
    font-weight: 600;
    font-size: 14px;
    color: var(--mrbean-text);
    margin-bottom: 4px;
}

.mrbean-credit-pack-card .mrbean-pack-price {
    font-size: 18px;
    font-weight: 700;
    color: var(--mrbean-primary);
    margin-bottom: 10px;
}

/* Billing message feedback */
.mrbean-billing-message {
    margin-top: 12px;
    padding: 10px 14px;
    border-radius: 6px;
    font-size: 14px;
}

.mrbean-msg-success {
    background: #edf7ee;
    border: 1px solid var(--mrbean-success);
    color: #2d7a33;
}

.mrbean-msg-error {
    background: #fcf0f1;
    border: 1px solid var(--mrbean-error);
    color: var(--mrbean-error);
}

/* Auto top-up info block */
.mrbean-auto-topup-info p {
    margin: 4px 0 12px;
    font-size: 14px;
    color: var(--mrbean-text);
}

/* Transactions scroll wrapper for mobile */
.mrbean-transactions-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* =========================================================================
   Advertising
   ========================================================================= */
.mrbean-advertising-balance {
    text-align: center;
    padding: 24px;
    margin-bottom: 24px;
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    box-shadow: var(--mrbean-shadow);
}

.mrbean-advertising-balance .mrbean-credits-value {
    display: block;
    font-size: 36px;
    font-weight: 700;
    color: var(--mrbean-primary);
    line-height: 1.2;
    margin-bottom: 4px;
}

.mrbean-advertising-balance .mrbean-credits-label {
    font-size: 13px;
    color: var(--mrbean-text-light);
    text-transform: uppercase;
    letter-spacing: .4px;
}

.mrbean-advertising-section {
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    margin-bottom: 24px;
    box-shadow: var(--mrbean-shadow);
}

.mrbean-promotions-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.mrbean-promotion-listing-block {
    padding: 16px;
    background: var(--mrbean-bg);
    border-radius: 8px;
}

.mrbean-promotion-listing-name {
    margin: 0 0 12px;
    font-size: 16px;
    font-weight: 600;
    color: var(--mrbean-text);
}

.mrbean-promotion-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 12px 16px;
    margin-bottom: 8px;
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: 8px;
}

.mrbean-promotion-item:last-child {
    margin-bottom: 0;
}

.mrbean-promotion-info {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.mrbean-promotion-type {
    font-weight: 600;
    font-size: 14px;
    color: var(--mrbean-text);
}

.mrbean-promotion-status {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 4px;
    font-weight: 600;
}

.mrbean-promotion-status.mrbean-status--active {
    background: #d4edda;
    color: #1a5c2a;
}

.mrbean-promotion-status.mrbean-status--expired {
    background: #f8d7da;
    color: #7c1c22;
}

.mrbean-promotion-expiry {
    font-size: 13px;
    color: var(--mrbean-text-light);
}

.mrbean-promotion-actions {
    display: flex;
    gap: 8px;
}

.mrbean-promotion-cost-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 0;
}

.mrbean-promotion-cost-label {
    font-weight: 600;
    font-size: 14px;
}

.mrbean-promotion-cost-value {
    font-size: 20px;
    font-weight: 700;
    color: var(--mrbean-primary);
}

.mrbean-promotion-cost-unit {
    font-size: 14px;
    color: var(--mrbean-text-light);
}

.mrbean-homepage-ad-fields {
    padding-top: 16px;
    border-top: 1px solid var(--mrbean-border);
    margin-top: 16px;
}

/* Promotion meta (days remaining + expiry) */
.mrbean-promotion-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.mrbean-promotion-remaining {
    font-size: 13px;
    font-weight: 600;
    color: var(--mrbean-primary);
    background: rgba(168, 96, 107, 0.08);
    padding: 2px 10px;
    border-radius: 12px;
}

.mrbean-promotion-balance-note {
    font-size: 13px;
    color: var(--mrbean-text-light);
    margin-left: 8px;
}

/* Tier info cards */
.mrbean-tiers-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
}

.mrbean-tier-card {
    padding: 20px;
    border: 1.5px solid var(--mrbean-border);
    border-radius: 8px;
    transition: border-color 0.15s;
}

.mrbean-tier-card:hover {
    border-color: var(--mrbean-primary);
}

.mrbean-tier-card h4 {
    margin: 0 0 6px;
    font-size: 15px;
    font-weight: 600;
    color: var(--mrbean-text);
}

.mrbean-tier-cost {
    font-size: 14px;
    font-weight: 600;
    color: var(--mrbean-primary);
    margin-bottom: 8px;
}

.mrbean-tier-desc {
    margin: 0;
    font-size: 13px;
    color: var(--mrbean-text-light);
    line-height: 1.5;
}

/* Ad image preview */
.mrbean-ad-image-preview {
    margin-top: 12px;
    max-width: 290px;
    border: 1px solid var(--mrbean-border);
    border-radius: 6px;
    overflow: hidden;
}

.mrbean-ad-image-preview img {
    display: block;
    width: 100%;
    height: auto;
}

/* Purchase form nested inside advertising */
.mrbean-purchase-form .mrbean-form-row {
    margin-bottom: 18px;
}

@media screen and (max-width: 768px) {
    .mrbean-promotion-item {
        flex-direction: column;
        align-items: flex-start;
    }

    .mrbean-promotion-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .mrbean-promotion-actions {
        width: 100%;
    }

    .mrbean-tiers-grid {
        grid-template-columns: 1fr;
    }

    .mrbean-credit-packs-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .mrbean-promotion-balance-note {
        display: block;
        margin-left: 0;
        margin-top: 4px;
    }
}

/* =========================================================================
   Modal (Add New Shop)
   ========================================================================= */
.mrbean-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.mrbean-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.5);
    cursor: pointer;
}

.mrbean-modal-dialog {
    position: relative;
    background: var(--mrbean-bg-white);
    border-radius: var(--mrbean-radius);
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0,0,0,.2);
}

.mrbean-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid var(--mrbean-border);
}

.mrbean-modal-header h3 { margin: 0; font-size: 18px; }

.mrbean-modal-close {
    background: none;
    border: none;
    font-size: 22px;
    cursor: pointer;
    color: var(--mrbean-text-light);
    padding: 4px 8px;
    border-radius: 4px;
    transition: color 0.15s;
}

.mrbean-modal-close:hover { color: var(--mrbean-text); }

.mrbean-modal-body {
    padding: 24px;
}

.mrbean-modal-intro {
    margin: 0 0 20px;
    font-size: 14px;
    color: var(--mrbean-text-light);
}

.mrbean-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 24px;
    border-top: 1px solid var(--mrbean-border);
    background: var(--mrbean-bg);
}

/* =========================================================================
   Login Prompt (logged-out dashboard gate)
   ========================================================================= */
.mrbean-login-prompt {
    max-width: 460px;
    margin: 80px auto;
    padding: 48px 40px 36px;
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 4px 24px rgba(0, 0, 0, .08);
}

.mrbean-login-prompt__icon {
    font-size: 48px;
    margin-bottom: 12px;
    line-height: 1;
}

.mrbean-login-prompt h2 {
    margin: 0 0 10px;
    font-size: 24px;
    font-weight: 700;
    color: var(--mrbean-text);
}

.mrbean-login-prompt > p {
    margin: 0 0 28px;
    font-size: 15px;
    line-height: 1.6;
    color: var(--mrbean-text-light);
}

.mrbean-login-prompt__actions {
    margin-bottom: 24px;
}

.mrbean-login-prompt__actions .mrbean-btn {
    font-size: 16px;
    padding: 14px 24px;
}

.mrbean-login-prompt form {
    text-align: left;
}

.mrbean-login-prompt .login-remember {
    margin-bottom: 14px;
}

.mrbean-login-prompt__footer {
    padding-top: 20px;
    border-top: 1px solid var(--mrbean-border);
}

.mrbean-login-prompt__footer p {
    margin: 0;
    font-size: 14px;
    color: var(--mrbean-text-light);
}

.mrbean-login-prompt__footer a {
    color: var(--mrbean-primary);
    font-weight: 600;
    text-decoration: none;
}

.mrbean-login-prompt__footer a:hover {
    text-decoration: underline;
}

/* =========================================================================
   Login Box
   ========================================================================= */
.mrbean-login-box {
    max-width: 420px;
    margin: 40px auto;
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    box-shadow: var(--mrbean-shadow);
    overflow: hidden;
}

.mrbean-login-header {
    padding: 30px 32px 0;
    text-align: center;
}

.mrbean-login-header h2 { margin: 0 0 8px; font-size: 22px; }
.mrbean-login-header p  { margin: 0 0 24px; color: var(--mrbean-text-light); font-size: 14px; }
.mrbean-login-body-pad  { padding: 0 32px 28px; }

/* Style wp_login_form inside our box */
.mrbean-login-box #loginform,
.mrbean-login-box form {
    padding: 0 32px 24px;
    margin: 0;
    border: none;
    box-shadow: none;
    background: none;
}

.mrbean-login-box .login-username,
.mrbean-login-box .login-password,
.mrbean-login-box .login-remember {
    margin-bottom: 16px;
}

.mrbean-login-box .login-username label,
.mrbean-login-box .login-password label {
    display: block;
    font-weight: 500;
    font-size: 14px;
    margin-bottom: 6px;
    color: var(--mrbean-text);
}

.mrbean-login-box .login-username input,
.mrbean-login-box .login-password input {
    width: 100%;
    padding: 11px 14px;
    border: 1.5px solid var(--mrbean-border);
    border-radius: 8px;
    font-size: 14px;
    box-sizing: border-box;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.mrbean-login-box .login-username input:focus,
.mrbean-login-box .login-password input:focus {
    outline: none;
    border-color: var(--mrbean-primary);
    box-shadow: 0 0 0 3px rgba(168,96,107,.15);
}

.mrbean-login-box .login-remember {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--mrbean-text-light);
}

.mrbean-login-box input[type="submit"],
.mrbean-login-box .button-primary {
    width: 100%;
    padding: 12px;
    background: var(--mrbean-primary);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
    margin-top: 8px;
}

.mrbean-login-box input[type="submit"]:hover,
.mrbean-login-box .button-primary:hover {
    background: var(--mrbean-primary-dark);
}

.mrbean-login-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 32px 28px;
    font-size: 13px;
    color: var(--mrbean-text-light);
    flex-wrap: wrap;
}

.mrbean-login-links a         { color: var(--mrbean-primary); text-decoration: none; }
.mrbean-login-links a:hover   { text-decoration: underline; }
.mrbean-login-divider         { color: var(--mrbean-border); }

@media screen and (max-width: 768px) {
    .mrbean-login-box { margin: 20px; }
    .mrbean-login-box #loginform,
    .mrbean-login-box form,
    .mrbean-login-header,
    .mrbean-login-links { padding-left: 20px; padding-right: 20px; }
}

/* =========================================================================
   Registration Form
   ========================================================================= */
.mrbean-register-box {
    max-width: 480px;
    margin: 40px auto;
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    box-shadow: var(--mrbean-shadow);
    overflow: hidden;
}

.mrbean-register-header {
    padding: 30px 32px 0;
    text-align: center;
}

.mrbean-register-header h2 { margin: 0 0 8px; font-size: 22px; }
.mrbean-register-header p  { margin: 0 0 24px; color: var(--mrbean-text-light); font-size: 14px; }

.mrbean-register-form {
    padding: 0 32px 24px;
}

.mrbean-form-messages {
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
    font-size: 14px;
}

.mrbean-form-messages.success {
    background: #edf7ee;
    color: #2d7a33;
    border: 1px solid var(--mrbean-success);
}

.mrbean-form-messages.error {
    background: #fcf0f1;
    color: var(--mrbean-error);
    border: 1px solid var(--mrbean-error);
}

.mrbean-register-login-link {
    text-align: center;
    padding: 0 32px 28px;
    font-size: 13px;
    color: var(--mrbean-text-light);
}

.mrbean-register-login-link a { color: var(--mrbean-primary); }

/* Registration success */
.mrbean-register-success {
    padding: 40px 32px;
    text-align: center;
}

.mrbean-success-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    background: #edf7ee;
    color: var(--mrbean-success);
    border-radius: 50%;
    font-size: 28px;
    margin-bottom: 16px;
}

.mrbean-register-success h3 { margin: 0 0 12px; font-size: 20px; }
.mrbean-register-success p  { margin: 0 0 12px; color: var(--mrbean-text-light); font-size: 14px; }
.mrbean-resend-hint          { font-size: 13px; color: var(--mrbean-text-light); }

/* Already logged in */
.mrbean-already-logged-in {
    padding: 24px 32px;
    font-size: 14px;
}

/* Error */
.mrbean-error {
    padding: 14px 18px;
    background: #fcf0f1;
    border: 1px solid var(--mrbean-error);
    border-radius: 8px;
    color: var(--mrbean-error);
    font-size: 14px;
}

/* =========================================================================
   Account Settings
   ========================================================================= */
.mrbean-account-status { margin-bottom: 20px; }

/* =========================================================================
   Help & Support
   ========================================================================= */
.mrbean-help-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
}

.mrbean-help-card {
    background: var(--mrbean-bg-white);
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    padding: 24px;
    box-shadow: var(--mrbean-shadow);
    transition: box-shadow 0.15s;
}

.mrbean-help-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,.11); }
.mrbean-help-icon { font-size: 32px; margin-bottom: 12px; }
.mrbean-help-card h3 { margin: 0 0 10px; font-size: 16px; color: var(--mrbean-text); }
.mrbean-help-card p { margin: 0; font-size: 14px; color: var(--mrbean-text-light); line-height: 1.6; }
.mrbean-help-card a { color: var(--mrbean-primary); }

/* =========================================================================
   Responsive
   ========================================================================= */
@media screen and (max-width: 900px) {
    .mrbean-dashboard-layout {
        grid-template-columns: 1fr;
    }

    .mrbean-dashboard-sidebar {
        position: static;
        display: flex;
        flex-wrap: wrap;
        border-radius: var(--mrbean-radius);
    }

    .mrbean-nav-item {
        border-bottom: none;
        border-right: 1px solid var(--mrbean-border);
        flex: 1 0 auto;
        justify-content: center;
    }

    .mrbean-nav-item:last-child { border-right: none; }
    .mrbean-nav-divider { display: none; }
}

@media screen and (max-width: 768px) {
    .mrbean-dashboard-header { flex-direction: column; align-items: flex-start; }
    .mrbean-dashboard-header-right { width: 100%; }

    .mrbean-listing-card { grid-template-columns: 1fr; }
    .mrbean-listing-image { height: 160px; border-radius: var(--mrbean-radius) var(--mrbean-radius) 0 0; }
    .mrbean-listing-stats { flex-wrap: wrap; gap: 14px; }
    .mrbean-listing-actions { flex-direction: column; }

    .mrbean-form-row--half { grid-template-columns: 1fr; }

    .mrbean-hours-row { grid-template-columns: 90px auto; }
    .mrbean-hours-times {
        grid-column: 1 / -1;
        flex-wrap: wrap;
    }

    .mrbean-form-actions { flex-direction: column; align-items: flex-start; }

    .mrbean-register-box { margin: 20px; }
    .mrbean-register-form,
    .mrbean-register-header,
    .mrbean-register-login-link,
    .mrbean-register-success { padding-left: 20px; padding-right: 20px; }

    .mrbean-help-grid { grid-template-columns: 1fr; }
    .mrbean-form-row--third { grid-template-columns: 1fr; }
}

/* =========================================================================
   Location Map
   ========================================================================= */
.mrbean-location-map {
    width: 100%;
    height: 320px;
    border-radius: var(--mrbean-radius);
    border: 1px solid var(--mrbean-border);
    margin-top: 12px;
}

.mrbean-form-row--third {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}

/* =========================================================================
   Add New Taxonomy Term
   ========================================================================= */
.mrbean-add-term-wrap {
    margin-top: 10px;
}

.mrbean-add-term-input {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
}

.mrbean-add-term-input input[type="text"] {
    font-size: 13px;
    padding: 5px 10px;
    border: 1px solid var(--mrbean-border);
    border-radius: var(--mrbean-radius);
    width: 180px;
}

.mrbean-btn-xs {
    font-size: 12px;
    padding: 4px 10px;
}

.mrbean-input-sm {
    font-size: 13px !important;
    padding: 5px 10px !important;
}