/* A-036 Alerts: alert rows are real buttons (same look as the old rows), and the Alerts screen. */
.pp-alert-row{appearance:none;-webkit-appearance:none;width:100%;margin:0;background:none;border:0;border-radius:0;color:inherit;font-family:inherit;line-height:inherit;text-align:left;align-items:center;box-shadow:none;min-height:0;}
.pp-alert-row:hover{background:var(--pp-surface-soft,rgba(127,127,127,.08));}
.pp-alert-row:focus-visible{outline:2px solid var(--primary,#10b981);outline-offset:2px;border-radius:8px;}
.pp-alert-row > span:last-child{flex:0 1 auto;}
.alerts-view-all{appearance:none;-webkit-appearance:none;background:none;border:0;padding:0 0 0 10px;color:var(--primary,#10b981);font:inherit;font-size:12px;font-weight:700;cursor:pointer;text-transform:none;letter-spacing:0;}
.alerts-view-all:focus-visible{outline:2px solid var(--primary,#10b981);outline-offset:2px;border-radius:6px;}
#tab-alerts .alerts-screen-head{display:flex;align-items:flex-start;gap:12px;margin:0 0 12px;}
#tab-alerts .alerts-screen-back{flex:0 0 auto;width:auto;display:inline-flex;align-items:center;gap:4px;}
#tab-alerts .alerts-screen-title{margin:0;font-size:22px;line-height:1.2;}
#tab-alerts .alerts-screen-title:focus{outline:none;}
#tab-alerts .alerts-screen-sub{margin:2px 0 0;font-size:13px;}
#tab-alerts .alerts-screen-explore{margin:0 0 12px;}
#tab-alerts .alerts-explore-head{display:flex;flex-direction:column;gap:2px;margin-bottom:10px;}
#tab-alerts .alerts-explore-head .muted{font-size:12px;}
#tab-alerts .alerts-explore-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
#tab-alerts .alerts-explore-grid button{min-width:0;min-height:64px;border:1px solid var(--border);border-radius:12px;background:var(--pp-surface-soft,transparent);color:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:8px 4px;font:inherit;cursor:pointer;}
#tab-alerts .alerts-explore-grid button span{font-weight:700;font-size:16px;}
#tab-alerts .alerts-explore-grid button b{font-size:12px;}
#tab-alerts #alerts-screen-panel{padding:10px 14px;}
@media (min-width:701px){#tab-alerts{max-width:760px;}}
@media (max-width:700px){
  #tab-alerts{padding-top:4px;}
  #tab-alerts .alerts-screen-title{font-size:24px;}
  #tab-alerts #alerts-screen-panel{padding:8px 10px!important;}
  #alerts-screen-panel .pp-alert-row{border-radius:9px;padding-left:6px!important;padding-right:6px!important;}
  #alerts-screen-panel .pp-alert-row:active{background:var(--pp-surface-soft);}
}