/* PostcodePing plugin styles.
   Colours come from the Astra global palette, so changes in the Customizer flow through.
   Fonts are inherited from the theme. Fallbacks match the agreed teal palette. */
.pp {
    --pp-brand: var(--ast-global-color-0, #0F766E);
    --pp-brand-dark: var(--ast-global-color-1, #134E4A);
    --pp-text: var(--ast-global-color-3, #1F2933);
    --pp-panel: var(--ast-global-color-6, #F0FDFA);
    --pp-border: var(--ast-global-color-8, #D9E2E1);
    --pp-accent: var(--ast-global-color-9, #A3E635);
    --pp-accent-text: #1A2E05;
    --pp-muted: #52606D;
    --pp-danger: #B42318;
    color: var(--pp-text);
    max-width: 960px;
}
.pp h3 { margin: 0 0 .5rem; }
.pp *, .pp *::before, .pp *::after { box-sizing: border-box; }
.pp a { color: var(--pp-brand); }
.pp a:hover { color: var(--pp-brand-dark); }
.pp-signup, .pp-login { max-width: 460px; }
.pp-muted { color: var(--pp-muted); font-size: .9em; }
.pp-notice { background: var(--pp-panel); border: 1px solid var(--pp-border); border-left: 4px solid var(--pp-brand); padding: .75rem 1rem; margin: 0 0 1.25rem; border-radius: 0; }
.pp-notice--error { border-left-color: var(--pp-danger); background: #FEF3F2; }
.pp-empty { background: var(--pp-panel); border-radius: 10px; padding: 1.25rem; margin-bottom: 1.25rem; }

.pp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.25rem; margin-bottom: 1.25rem; }
.pp-card { background: #fff; border: 1px solid var(--pp-border); border-radius: 10px; padding: 1.25rem; margin-bottom: 1.25rem; }
.pp-grid .pp-card { margin-bottom: 0; }
.pp-card__head { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; margin-bottom: .75rem; }
.pp-card__title { color: var(--pp-brand-dark); font-size: 1.15em; }
.pp-card--danger { border-color: #F3C9C4; }
.pp-add { max-width: 420px; }

.pp-map { height: 170px; border-radius: 8px; background: var(--pp-panel); margin-bottom: 1rem; z-index: 0; }

.pp-form { margin: 0; }
.pp-field { margin: 0 0 .85rem; }
.pp-field label { display: block; font-weight: 500; font-size: .9em; margin-bottom: .3rem; }
.pp input[type="text"], .pp input[type="email"], .pp input[type="password"], .pp select {
    width: 100%; max-width: 100%; border: 1px solid var(--pp-border); border-radius: 6px; padding: .55rem .7rem; background: #fff; color: var(--pp-text);
}
.pp input:focus, .pp select:focus { outline: 2px solid var(--pp-brand); outline-offset: 1px; }
.pp-check label { display: flex; gap: .5rem; align-items: flex-start; font-weight: 400; }

.pp-watch__row { display: flex; justify-content: space-between; align-items: center; margin-bottom: .85rem; padding-bottom: .6rem; border-bottom: 1px solid var(--pp-border); }
.pp-watch__topic { font-weight: 500; }
.pp-toggle { display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; font-size: .9em; }
.pp-toggle input { width: 1.1em; height: 1.1em; accent-color: var(--pp-brand); }

.pp-button, .pp .login-submit input[type="submit"] {
    display: inline-block; background: var(--pp-brand); color: #fff !important; border: 0; border-radius: 6px;
    padding: .6rem 1.1rem; font-weight: 500; cursor: pointer; text-decoration: none; line-height: 1.3;
}
.pp-button:hover, .pp .login-submit input[type="submit"]:hover { background: var(--pp-brand-dark); }
.pp-button--accent { background: var(--pp-accent); color: var(--pp-accent-text) !important; }
.pp-button--accent:hover { background: var(--pp-accent); filter: brightness(.94); }
.pp-button--secondary { background: #fff; color: var(--pp-brand-dark) !important; border: 1px solid var(--pp-border); }
.pp-button--secondary:hover { background: var(--pp-panel); }
.pp-button--danger { background: var(--pp-danger); }
.pp-button--danger:hover { background: #912018; }
.pp-link-danger { background: none; border: 0; padding: 0; color: var(--pp-danger); text-decoration: underline; cursor: pointer; font-size: .9em; }
.pp-delete { margin-top: .5rem; }
.pp-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.pp-inline { display: inline; }

.pp-login form p { margin: 0 0 .85rem; }
.pp-login label { display: block; font-weight: 500; font-size: .9em; margin-bottom: .3rem; }
.pp-login .login-remember label { display: flex; gap: .5rem; align-items: center; font-weight: 400; }

.pp-table { width: 100%; border-collapse: collapse; font-size: .95em; }
.pp-table th { text-align: left; font-weight: 500; color: var(--pp-muted); border-bottom: 1px solid var(--pp-border); padding: .5rem; }
.pp-table td { border-bottom: 1px solid var(--pp-border); padding: .6rem .5rem; vertical-align: top; }
.pp-table a { color: var(--pp-brand-dark); font-weight: 500; }
.pp-rating { display: inline-block; min-width: 1.6em; text-align: center; color: #fff; font-weight: 600; border-radius: 4px; padding: .1em .4em; }
.pp-rating--poor { background: #B42318; }
.pp-rating--low { background: #C4320A; }
.pp-rating--mid { background: #B54708; }
.pp-rating--ok { background: var(--pp-brand); }

@media (max-width: 640px) {
    .pp-table thead { display: none; }
    .pp-table tr { display: block; border-bottom: 1px solid var(--pp-border); padding: .5rem 0; }
    .pp-table td { display: block; border: 0; padding: .15rem 0; }
}

/* Account: alert status line */
.pp-status { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.pp-status__dot { width: 10px; height: 10px; border-radius: 50%; background: #9aa5b1; flex: none; }
.pp-status--on .pp-status__dot { background: var(--pp-brand); box-shadow: 0 0 0 3px rgba(15,118,110,.15); }
.pp-status--paused .pp-status__dot { background: #b54708; }
.pp-status--mixed .pp-status__dot { background: #d9a400; }