/* OPC MC Notice Manager - front-end styles */
.opcmc,.opcmc-dialog{--opcmc-accent:#153b5b;--opcmc-accent-dark:#0b2840;--opcmc-text:#1d2327;--opcmc-muted:#505a63;--opcmc-border:#dfe3e7;--opcmc-bg:#f5f7f8}
.opcmc{max-width:1100px;margin:30px auto;font-family:inherit;line-height:1.5}
.opcmc *,.opcmc *::before,.opcmc *::after,.opcmc-dialog *{box-sizing:border-box}
.opcmc-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Cards, headings */
.opcmc-card{background:#fff;color:var(--opcmc-text);border:1px solid var(--opcmc-border);border-radius:16px;padding:30px;box-shadow:0 8px 28px rgba(0,0,0,.06)}
.opcmc-card h2,.opcmc-heading{margin-top:0;font-size:32px;line-height:1.2}
.opcmc-kicker{text-transform:uppercase;letter-spacing:.12em;font-size:13px;font-weight:800;color:var(--opcmc-muted);margin-bottom:8px}
.opcmc-lead{margin:0 0 24px;color:var(--opcmc-muted);font-size:18px;line-height:1.55}
.opcmc-hint{margin:6px 0 0;color:var(--opcmc-muted);font-size:15px}
.opcmc-current{border-top:1px solid var(--opcmc-border);padding-top:22px;margin-top:26px}
.opcmc-current h3{margin:0 0 14px;font-size:20px}

/* Alerts and empty state */
.opcmc-alert{padding:14px 16px;border-radius:8px;margin:15px 0;font-size:16px;line-height:1.45}
.opcmc-alert[hidden]{display:none}
.opcmc-success{background:#edf9f0;color:#0d6330;border:1px solid #bfe0c9}
.opcmc-error{background:#fff0f0;color:#812020;border:1px solid #e5bcbc}
.opcmc-empty{padding:24px 18px;border-radius:10px;background:var(--opcmc-bg);color:var(--opcmc-muted);font-size:17px;text-align:center}

/* Notice list (shared by public + manager) */
.opcmc-list{list-style:none!important;margin:0!important;padding:0!important;display:grid;gap:14px}
.opcmc-item{display:flex;align-items:center;gap:16px;margin:0!important;background:#fff;color:var(--opcmc-text);border:1px solid var(--opcmc-border);border-radius:14px;padding:16px 18px;box-shadow:0 4px 16px rgba(0,0,0,.05)}
.opcmc-badge{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:56px;height:68px;border-radius:8px;color:#fff;font-size:14px;font-weight:800;letter-spacing:.04em}
.opcmc-badge-pdf{background:#a12622}
.opcmc-badge-doc{background:#1b4f8f}
.opcmc-info{flex:1 1 0;min-width:0}
.opcmc-name{display:block;font-size:19px;line-height:1.3;font-weight:700;overflow-wrap:anywhere}
.opcmc-meta{margin:4px 0 0;color:var(--opcmc-muted);font-size:15px}
.opcmc-meta a{font-weight:700;text-decoration:underline;color:var(--opcmc-accent)}
.opcmc-actions{display:flex;flex:0 0 auto;gap:10px;flex-wrap:wrap}

/* Card layout (default): side-by-side previews. Columns come from the --opcmc-cols setting. */
.opcmc-layout-cards .opcmc-list{grid-template-columns:repeat(var(--opcmc-cols,3),minmax(0,1fr));gap:22px}
.opcmc-layout-cards .opcmc-item{flex-direction:column;align-items:stretch;gap:0;padding:0;overflow:hidden}
.opcmc-layout-cards .opcmc-info{flex:1 1 auto;padding:14px 16px 4px}
.opcmc-layout-cards .opcmc-actions{margin-top:auto;padding:10px 16px 16px}
.opcmc-layout-cards .opcmc-actions .opcmc-btn{flex:1 1 0;min-height:46px!important;padding:10px 12px!important;font-size:16px!important}
.opcmc-thumb{position:relative;display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:8.5/11;overflow:hidden;background:#eef0f2;border:0!important;border-bottom:1px solid var(--opcmc-border)!important;border-radius:0;box-shadow:none!important;text-decoration:none!important;cursor:pointer;transition:background-color .15s ease}
.opcmc-thumb:hover{background:#e2e6ea}
.opcmc-thumb .opcmc-badge{width:76px;height:92px;font-size:19px}
.opcmc-thumb-img{display:block;width:100%!important;height:100%!important;max-width:none!important;object-fit:contain;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important}
.opcmc-canvas{display:none;margin:0!important;box-shadow:0 1px 6px rgba(0,0,0,.18)}
.opcmc-thumb.is-ready .opcmc-canvas{display:block}
.opcmc-thumb.has-img .opcmc-badge,.opcmc-thumb.is-ready .opcmc-badge{display:none}

/* One card per row: a single, comfortably sized card instead of an enormous page. */
.opcmc-layout-cards.opcmc-cols-1 .opcmc-list{grid-template-columns:minmax(0,1fr);max-width:560px}

/* Preview list: one notice per row with a small page preview on the left. */
.opcmc-layout-preview-list .opcmc-item{gap:20px;padding:14px 18px}
.opcmc-layout-preview-list .opcmc-thumb{flex:0 0 150px;width:150px;border:1px solid var(--opcmc-border)!important;border-radius:8px}
.opcmc-layout-preview-list .opcmc-thumb .opcmc-badge{width:56px;height:68px;font-size:15px}

/* Buttons (locked against theme overrides, high contrast, clear focus) */
.opcmc .opcmc-btn,.opcmc-dialog .opcmc-btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;appearance:none!important;-webkit-appearance:none!important;border:2px solid var(--opcmc-accent)!important;border-radius:8px!important;min-height:50px!important;padding:12px 22px!important;background:var(--opcmc-accent)!important;background-image:none!important;color:#fff!important;text-decoration:none!important;font-family:inherit!important;font-size:17px!important;font-weight:800!important;line-height:1.2!important;cursor:pointer!important;box-shadow:none!important;opacity:1!important;transition:background-color .15s ease,border-color .15s ease!important}
.opcmc .opcmc-btn:hover,.opcmc-dialog .opcmc-btn:hover{background:var(--opcmc-accent-dark)!important;border-color:var(--opcmc-accent-dark)!important;color:#fff!important}
.opcmc .opcmc-btn:focus-visible,.opcmc-dialog .opcmc-btn:focus-visible{background:var(--opcmc-accent-dark)!important;color:#fff!important;outline:4px solid #9cc5e8!important;outline-offset:3px!important}
.opcmc .opcmc-btn-secondary,.opcmc-dialog .opcmc-btn-secondary{background:#4d5963!important;border-color:#4d5963!important}
.opcmc .opcmc-btn-secondary:hover,.opcmc-dialog .opcmc-btn-secondary:hover{background:#333b42!important;border-color:#333b42!important}
.opcmc .opcmc-btn-danger{background:#a12622!important;border-color:#a12622!important}
.opcmc .opcmc-btn-danger:hover{background:#771a17!important;border-color:#771a17!important}
.opcmc .opcmc-btn-sm,.opcmc-dialog .opcmc-btn-sm{min-height:44px!important;padding:8px 16px!important;font-size:16px!important}
.opcmc .opcmc-btn-block{width:100%!important}
.opcmc .opcmc-btn[disabled]{opacity:.45!important;cursor:not-allowed!important}

/* Manager: upload form */
.opcmc-upload{display:grid;gap:12px;margin-top:22px}
.opcmc-upload label{font-size:18px;line-height:1.4}
.opcmc-upload input[type=file]{width:100%;border:2px solid #b9c3cc;border-radius:10px;padding:15px;background:#fff;color:#222;font-size:17px;min-height:64px}
.opcmc-upload input[type=file]:focus{outline:3px solid #8eb8dd;outline-offset:2px;border-color:var(--opcmc-accent)}
.opcmc-upload input[type=file]::file-selector-button{border:2px solid var(--opcmc-accent)!important;border-radius:7px!important;padding:10px 16px!important;margin-right:12px!important;background:#fff!important;color:var(--opcmc-accent)!important;font-weight:800!important;font-size:16px!important;cursor:pointer!important}
.opcmc-upload .opcmc-hint,.opcmc-upload .opcmc-alert{margin:0}

/* Manager: per-notice editing */
.opcmc-item-manage{align-items:flex-start}
.opcmc-edit{flex:1 1 0;min-width:0;margin:0}
.opcmc-title-input{display:block;width:100%;min-height:48px;padding:10px 12px;border:2px solid #b9c3cc;border-radius:8px;background:#fff;color:var(--opcmc-text);font-family:inherit;font-size:17px;font-weight:600}
.opcmc-title-input:focus{outline:3px solid #8eb8dd;outline-offset:1px;border-color:var(--opcmc-accent)}
.opcmc-controls{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}

/* PDF pop-up viewer (desktop) */
.opcmc-dialog{width:min(1100px,94vw);height:92vh;max-width:none;max-height:none;margin:auto;inset:0;padding:0;border:0;border-radius:14px;overflow:hidden;background:#fff;color:var(--opcmc-text)}
.opcmc-dialog[open]{display:flex;flex-direction:column}
.opcmc-dialog::backdrop{background:rgba(10,20,30,.65)}
.opcmc-dialog-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;border-bottom:1px solid var(--opcmc-border)}
.opcmc-dialog-title{margin:0!important;font-size:18px!important;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.opcmc-dialog-actions{display:flex;gap:10px;flex:0 0 auto}
.opcmc-dialog-frame{flex:1 1 auto;width:100%;border:0;background:#f1f2f3}
html.opcmc-lock{overflow:hidden}

/* Mobile */
@media (max-width:767px){
  .opcmc{margin:20px auto}
  .opcmc-card{padding:20px}
  .opcmc-card h2,.opcmc-heading{font-size:27px}
  .opcmc-lead{font-size:17px}
  .opcmc-item{flex-wrap:wrap;padding:14px}
  .opcmc-badge{width:48px;height:58px}
  .opcmc-name{font-size:18px}
  .opcmc-actions{width:100%}
  .opcmc-actions .opcmc-btn{flex:1 1 100%}
  .opcmc-item-manage{flex-wrap:nowrap}
  .opcmc-controls .opcmc-btn{flex:1 1 calc(50% - 8px)}
  .opcmc-dialog{display:none!important}
}
@media (max-width:767px){
  .opcmc-layout-preview-list .opcmc-thumb{flex-basis:96px;width:96px}
  .opcmc-layout-preview-list .opcmc-item{gap:14px}
}
@media (max-width:900px){.opcmc-layout-cards .opcmc-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.opcmc-layout-cards .opcmc-list{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.opcmc .opcmc-btn{transition:none!important}}