/* What: the partnership surfaces - the admin list, the picker fieldset and the workshop logos.
   Use: linked by the Partnerships views; tokens come from tokens.css.
   Needs: logical properties only, and the bright palette - selection is blue, never green. */

.partner-item { display:flex; align-items:center; gap:1.25rem; padding-block:1.25rem; border-block-end:1px solid var(--border); }
.partner-item:last-child { border-block-end:0; }
.partner-item img { inline-size:88px; block-size:100px; object-fit:contain; flex-shrink:0; }
.partner-item>div { min-inline-size:0; overflow-wrap:anywhere; }
.partner-item a { overflow-wrap:anywhere; }
.partner-item .btn { margin-block-start:.3rem; }
@media (max-width:600px) { .partner-item { gap:.75rem; } .partner-item img { inline-size:64px; block-size:80px; } }

.partnership-grid>.card { margin-block-start:0; align-self:start; }

.partner-fieldset { border:0; padding:0; margin:0; min-inline-size:0; }
.partner-fieldset legend { padding:0; }
.partner-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr)); gap:1rem; margin-block:1rem; }
.partner-list .partner-item { border:1px solid var(--border); border-radius:var(--radius-md); padding:1rem; margin:0; min-inline-size:0; text-decoration:none; color:inherit; background:var(--surface); }
.partner-list .partner-item span { min-inline-size:0; overflow-wrap:anywhere; }
.partner-list .partner-item img { inline-size:68px; block-size:80px; }
.partner-choice { cursor:pointer; }
.partner-choice:has(input:checked) { border-color:var(--primary); background:var(--primary-soft); box-shadow:inset 0 0 0 1px var(--primary); }
.partner-choice:focus-within { outline:2px solid var(--focus); outline-offset:2px; }
.partner-choice input { flex-shrink:0; inline-size:20px; block-size:20px; accent-color:var(--primary); }
.workshop-partners .partner-item:hover { border-color:var(--border-strong); }
@media (max-width:480px) { .partner-list { grid-template-columns:1fr; } .partner-list .partner-item { gap:.75rem; } .partner-list .partner-item img { inline-size:56px; block-size:68px; } }

/* The album's credit line: who the workshop was run with. The logo stands whole on white inside a
   thin brass frame - the same plaque the home page shows. The line itself is not a link and does
   not move under the pointer: only the host is the link. */
.partner-credits { display:flex; flex-wrap:wrap; gap:var(--space-3); margin-block:0 var(--space-6); }
.partner-credit { display:flex; align-items:center; gap:var(--space-4); min-inline-size:0; max-inline-size:100%;
  padding:var(--space-3); padding-inline-end:var(--space-6); border-radius:var(--radius-lg);
  background:var(--surface); border:1px solid var(--border); box-shadow:var(--shadow-1); }
.partner-credit-logo { flex:none; display:grid; place-items:center; inline-size:92px; block-size:92px; padding:8px;
  border-radius:var(--radius-md); border:1px solid transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad-gold) border-box; }
.partner-credit-logo img { display:block; max-inline-size:100%; max-block-size:100%; object-fit:contain; }
.partner-credit-words { display:grid; gap:2px; min-inline-size:0; }
.partner-credit-words small { font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace; font-size:11px; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--gold-700); }
html[lang="ar"] .partner-credit-words small { font-family:var(--font-body),var(--font-arabic),sans-serif; font-size:var(--fs-xs);
  font-weight:600; letter-spacing:0; }
.partner-credit-words b { font-family:var(--font-display),var(--font-arabic),sans-serif; font-size:var(--fs-md); font-weight:600;
  line-height:1.35; overflow-wrap:anywhere; }
.partner-credit-host { display:inline-flex; align-items:center; gap:6px; justify-self:start; font-size:var(--fs-sm); font-weight:500;
  color:var(--primary); text-decoration:none; border-radius:4px; }
.partner-credit-host .icon { inline-size:14px; block-size:14px; }
.partner-credit-host:hover { text-decoration:underline; }
.partner-credit-host:focus-visible { outline:2px solid var(--focus); outline-offset:3px; }

.admin-shell:has(#card-partnerships)>div { min-inline-size:0; }

/* The admin's Partnerships page. There will be a handful of partners, never a hundred, so each is a
   card and not a table row: the logo - the one thing that tells them apart - stands whole on a white
   stage with the plaque's brass inner frame, then both names, the state, and everything known about
   the partner. Nothing here can be wider than its column, so nothing scrolls sideways. */
.partner-cards { display:grid; gap:var(--space-5); grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr)); min-inline-size:0; }
.partner-cards > .partner-card { display:flex; flex-direction:column; min-inline-size:0; margin:0; padding:0; overflow:hidden;
  transition:border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); }
.partner-card:hover { border-color:var(--border-strong); box-shadow:var(--shadow-2); }
.partner-card.is-editing { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-soft), var(--shadow-2); }
.partner-card-logo { display:grid; place-items:center; block-size:172px; padding:var(--space-6); background:#fff;
  border-block-end:1px solid var(--border); box-shadow:inset 0 0 0 6px #fff, inset 0 0 0 7px var(--gold-100); }
.partner-card-logo img { display:block; max-inline-size:min(100%,260px); max-block-size:124px; object-fit:contain; }
.partner-card.is-off .partner-card-logo img { filter:grayscale(1); opacity:.5; }
.partner-card-body { display:grid; gap:var(--space-2); align-content:start; padding:var(--space-5) var(--space-5) var(--space-2); min-inline-size:0; }
.partner-card-badges { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 var(--space-1); }
.partner-card-name { margin:0; font-size:var(--fs-lg); line-height:1.55; overflow-wrap:anywhere; }
.partner-card-name-en { margin:0; font-size:var(--fs-sm); color:var(--text-muted); overflow-wrap:anywhere; }
.partner-card-facts { display:grid; margin:var(--space-3) 0 0; }
.partner-card-facts > div { display:grid; grid-template-columns:7.5rem minmax(0,1fr); gap:var(--space-3); align-items:start;
  padding-block:var(--space-3); border-block-start:1px solid var(--border); }
.partner-card-facts dt { display:flex; align-items:center; gap:6px; font-size:var(--fs-sm); color:var(--text-muted); }
.partner-card-facts dt .icon { flex:none; inline-size:15px; block-size:15px; }
.partner-card-facts dt b { font-weight:600; color:var(--ink-900); }
.partner-card-facts dd { margin:0; min-inline-size:0; font-size:var(--fs-sm); font-weight:500; overflow-wrap:anywhere; }
.partner-card-facts dd.is-unset { font-weight:400; color:var(--text-faint); }
.partner-card-workshops { display:grid; gap:var(--space-2); margin:0; padding:0; list-style:none; }
.partner-card-workshops a { display:block; }
.partner-card-workshops small { display:block; font-size:var(--fs-xs); font-weight:400; color:var(--text-muted); }
.partner-card-workshops .is-more { font-size:var(--fs-xs); font-weight:400; color:var(--text-muted); }
.partner-card-foot { display:flex; justify-content:flex-end; gap:var(--space-2); margin-block-start:auto; padding:var(--space-3) var(--space-5);
  border-block-start:1px solid var(--border); background:var(--ink-50); }
.partner-form-logo { display:flex; align-items:center; gap:var(--space-3); margin-block-end:var(--space-2); }
.partner-form-logo img { inline-size:96px; block-size:72px; padding:6px; object-fit:contain; border-radius:var(--radius-md);
  background:#fff; border:1px solid var(--border); }
/* The editor stays in sight while the cards scroll - and scrolls inside itself on a short screen. */
@media (min-width:1024px) {
  .partner-admin > .partner-form { position:sticky; inset-block-start:calc(var(--topbar-h) + var(--space-4));
    max-block-size:calc(100vh - var(--topbar-h) - var(--space-7)); overflow:auto; }
}