/*
 * USL Web port of TabNook's Cork Board skin.
 * Kraft cork photograph, cream index cards, photographic pushpins, Kalam
 * titles and Nunito body. Light only. Scoped to body[data-skin="cork-board"].
 */
@import url('https://fonts.googleapis.com/css2?family=Kalam:wght@400;700&family=Nunito:wght@400;500;600;700&display=swap');

body[data-skin="cork-board"] {
  --skin-radius-card: 6px;
  --skin-radius-input: 8px;
  --cork-shadow: 80, 50, 20;
  --skin-surface: #faf3e0;
  --skin-surface-strong: #fdfaf0;
  --skin-border: rgba(80, 50, 20, 0.28);
  --skin-text: #3a2e22;
  --skin-text-muted: #5c4b3a;
  --skin-text-link: #8f3a24;
  --skin-shadow: 0 1px 1px rgba(80, 50, 20, 0.12), 0 6px 14px rgba(80, 50, 20, 0.18);
  --skin-font-display: 'Kalam', 'Patrick Hand', cursive, system-ui, sans-serif;
  --skin-font-body: 'Nunito', 'Quicksand', system-ui, sans-serif;
  color-scheme: light;
  background-color: #c89c6a !important;
  background-image:
    radial-gradient(ellipse 70% 50% at 18% 22%, rgba(138, 99, 56, 0.18) 0%, transparent 55%),
    radial-gradient(ellipse 60% 45% at 82% 78%, rgba(138, 99, 56, 0.14) 0%, transparent 55%),
    url("/assets/skins/cork-board/corkboardlarge.webp") !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: auto, auto, cover !important;
  color: var(--skin-text) !important;
  font-family: var(--skin-font-body);
}

body[data-skin="cork-board"] h1,
body[data-skin="cork-board"] h2,
body[data-skin="cork-board"] h3,
body[data-skin="cork-board"] .home-wordmark-title,
body[data-skin="cork-board"] .section-head,
body[data-skin="cork-board"] .ft-name {
  font-family: var(--skin-font-display) !important;
  color: #3a2e22 !important;
  letter-spacing: 0;
  text-transform: none;
}

body[data-skin="cork-board"] .home-wordmark-rule {
  background: #8f3a24 !important;
}

body[data-skin="cork-board"] .facet-tile,
body[data-skin="cork-board"] .res-card,
body[data-skin="cork-board"] .featured-card,
body[data-skin="cork-board"] .home-store-card,
body[data-skin="cork-board"] .prod-card {
  padding-top: 18px;
}
body[data-skin="cork-board"] .facet-tile::before,
body[data-skin="cork-board"] .res-card::before,
body[data-skin="cork-board"] .featured-card::before,
body[data-skin="cork-board"] .home-store-card::before,
body[data-skin="cork-board"] .prod-card::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 50%;
  width: 14px;
  height: 22px;
  margin-left: -7px;
  background: url("/assets/skins/cork-board/redpin.webp") center bottom / contain no-repeat;
  filter: drop-shadow(0 2px 2px rgba(80, 50, 20, 0.45));
  z-index: 2;
  pointer-events: none;
}
body[data-skin="cork-board"] .tile-row > .facet-tile:nth-child(7n+2)::before,
body[data-skin="cork-board"] .res-card:nth-child(7n+2)::before { background-image: url("/assets/skins/cork-board/bluepin.webp"); }
body[data-skin="cork-board"] .tile-row > .facet-tile:nth-child(7n+3)::before,
body[data-skin="cork-board"] .res-card:nth-child(7n+3)::before { background-image: url("/assets/skins/cork-board/yellowpin.webp"); }
body[data-skin="cork-board"] .tile-row > .facet-tile:nth-child(7n+4)::before,
body[data-skin="cork-board"] .res-card:nth-child(7n+4)::before { background-image: url("/assets/skins/cork-board/greenpin.webp"); }
body[data-skin="cork-board"] .tile-row > .facet-tile:nth-child(7n+5)::before,
body[data-skin="cork-board"] .res-card:nth-child(7n+5)::before { background-image: url("/assets/skins/cork-board/pinkpin.webp"); }
body[data-skin="cork-board"] .tile-row > .facet-tile:nth-child(7n+6)::before,
body[data-skin="cork-board"] .res-card:nth-child(7n+6)::before { background-image: url("/assets/skins/cork-board/lightbluepin.webp"); }
body[data-skin="cork-board"] .tile-row > .facet-tile:nth-child(7n+7)::before,
body[data-skin="cork-board"] .res-card:nth-child(7n+7)::before { background-image: url("/assets/skins/cork-board/whitepin.webp"); }

body[data-skin="cork-board"] .modal-content::after,
body[data-skin="cork-board"] .lb-box::after,
body[data-skin="cork-board"] .rpt-box::after {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  width: 78px;
  height: 18px;
  margin-left: -39px;
  background: rgba(247, 168, 184, 0.82);
  transform: rotate(-2deg);
  z-index: 3;
  pointer-events: none;
}


body[data-skin="cork-board"] a { color: #8f3a24; }
body[data-skin="cork-board"] a:hover { color: #6d2c1a; }

body[data-skin="cork-board"] p,
body[data-skin="cork-board"] li,
body[data-skin="cork-board"] label,
body[data-skin="cork-board"] .lede,
body[data-skin="cork-board"] .site-desc,
body[data-skin="cork-board"] .store-lede,
body[data-skin="cork-board"] .disc-note,
body[data-skin="cork-board"] .text-muted,
body[data-skin="cork-board"] .form-text,
body[data-skin="cork-board"] .ft-count,
body[data-skin="cork-board"] .topic-count {
  color: var(--skin-text-muted) !important;
}

body[data-skin="cork-board"] .tile-row {
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
}
body[data-skin="cork-board"] .facet-tile .ft-name {
  font-size: 0.92rem !important;
  letter-spacing: 0 !important;
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: break-word;
  text-transform: none;
  text-shadow: none;
}

body[data-skin="cork-board"] .res-card,
body[data-skin="cork-board"] .facet-tile,
body[data-skin="cork-board"] .featured-card,
body[data-skin="cork-board"] .home-store-card,
body[data-skin="cork-board"] .prod-card,
body[data-skin="cork-board"] .card,
body[data-skin="cork-board"] .lb-box,
body[data-skin="cork-board"] .rpt-box,
body[data-skin="cork-board"] .store-lb-box,
body[data-skin="cork-board"] .sidebar,
body[data-skin="cork-board"] .usl-situation,
body[data-skin="cork-board"] .site-foot {
  position: relative;
  background: var(--skin-surface) !important;
  color: var(--skin-text) !important;
  border: 1px solid var(--skin-border) !important;
  border-radius: 6px !important;
  box-shadow: var(--skin-shadow) !important;
}

body[data-skin="cork-board"] .res-card h5,
body[data-skin="cork-board"] .featured-card h5,
body[data-skin="cork-board"] .home-store-title,
body[data-skin="cork-board"] .prod-card h2,
body[data-skin="cork-board"] .pc-title {
  color: var(--skin-text) !important;
  font-family: var(--skin-font-display);
}
body[data-skin="cork-board"] .res-card p,
body[data-skin="cork-board"] .featured-card p,
body[data-skin="cork-board"] .pc-blurb,
body[data-skin="cork-board"] .pc-price {
  color: var(--skin-text-muted) !important;
}

body[data-skin="cork-board"] .type-chip,
body[data-skin="cork-board"] .cat-chip,
body[data-skin="cork-board"] .topic-pills a,
body[data-skin="cork-board"] .rb-saved {
  background: #f3e9ce !important;
  color: #3a2e22 !important;
  border: 1px solid var(--skin-border) !important;
  border-radius: 999px !important;
}
body[data-skin="cork-board"] .type-chip:hover,
body[data-skin="cork-board"] .cat-chip.on,
body[data-skin="cork-board"] .topic-pills a[aria-current="page"] {
  background: #e6d4a8 !important;
  color: #3a2e22 !important;
}

body[data-skin="cork-board"] #navbar-placeholder .navbar {
  background: #e6d4a8 !important;
  border-bottom: 1px solid rgba(80,50,20,0.25);
  box-shadow: none !important;
  position: sticky;
  z-index: 1030;
}
body[data-skin="cork-board"] #navbar-placeholder .navbar-brand,
body[data-skin="cork-board"] #navbar-placeholder .navbar-brand-text,
body[data-skin="cork-board"] #navbar-placeholder .nav-link {
  color: var(--skin-text) !important;
  font-family: 'Rajdhani', var(--skin-font-body) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  text-shadow: none;
}
body[data-skin="cork-board"] #navbar-placeholder .btn-store,
body[data-skin="cork-board"] #navbar-placeholder .btn-suggest,
body[data-skin="cork-board"] #navbar-placeholder .btn-contact,
body[data-skin="cork-board"] #navbar-placeholder .btn-reader,
body[data-skin="cork-board"] #navbar-placeholder .btn-videos,
body[data-skin="cork-board"] #navbar-placeholder .btn-topics,
body[data-skin="cork-board"] #navbar-placeholder .btn-library,
body[data-skin="cork-board"] #navbar-placeholder .btn-auth,
body[data-skin="cork-board"] .home-store-cta,
body[data-skin="cork-board"] .btn,
body[data-skin="cork-board"] .btn-primary,
body[data-skin="cork-board"] .btn-dark,
body[data-skin="cork-board"] .btn-amazon,
body[data-skin="cork-board"] .load-more,
body[data-skin="cork-board"] .rc-btn,
body[data-skin="cork-board"] .rpt-submit,
body[data-skin="cork-board"] .rpt-cancel {
  font-family: 'Rajdhani', var(--skin-font-body) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  text-shadow: none;
  border-radius: 999px !important;
}
body[data-skin="cork-board"] #navbar-placeholder .navbar-nav .btn-store,
body[data-skin="cork-board"] #navbar-placeholder .navbar-nav .btn-suggest,
body[data-skin="cork-board"] #navbar-placeholder .navbar-nav .btn-contact,
body[data-skin="cork-board"] #navbar-placeholder .navbar-nav .btn-reader,
body[data-skin="cork-board"] #navbar-placeholder .navbar-nav .btn-videos,
body[data-skin="cork-board"] #navbar-placeholder .navbar-nav .btn-topics,
body[data-skin="cork-board"] #navbar-placeholder .navbar-nav .btn-library,
body[data-skin="cork-board"] #navbar-placeholder .navbar-nav .btn-auth {
  font-size: 0.92rem;
  box-shadow: none !important;
}
body[data-skin="cork-board"] #navbar-placeholder .btn-store,
body[data-skin="cork-board"] .home-store-cta,
body[data-skin="cork-board"] .btn-primary,
body[data-skin="cork-board"] .btn-dark,
body[data-skin="cork-board"] .btn-amazon,
body[data-skin="cork-board"] .rpt-submit {
  background: #8f3a24 !important;
  color: #fffaf3 !important;
  border-color: #8f3a24 !important;
}
body[data-skin="cork-board"] #navbar-placeholder .btn-suggest {
  background: transparent !important;
  color: #8f3a24 !important;
  border-color: #8f3a24 !important;
}
body[data-skin="cork-board"] #navbar-placeholder .btn-contact,
body[data-skin="cork-board"] #navbar-placeholder .btn-reader,
body[data-skin="cork-board"] #navbar-placeholder .btn-videos,
body[data-skin="cork-board"] #navbar-placeholder .btn-topics,
body[data-skin="cork-board"] #navbar-placeholder .btn-library,
body[data-skin="cork-board"] #navbar-placeholder .btn-auth {
  background: transparent !important;
  color: var(--skin-text) !important;
  border-color: var(--skin-border) !important;
}
body[data-skin="cork-board"] #navbar-placeholder .usl-theme-toggle,
body[data-skin="cork-board"] #navbar-placeholder .usl-saved-toggle,
body[data-skin="cork-board"] #navbar-placeholder .usl-skin-btn {
  background: #e6d4a8;
  color: var(--skin-text);
  border: 1px solid var(--skin-border);
  border-radius: 50%;
  box-shadow: none;
}
body[data-skin="cork-board"] #navbar-placeholder .usl-skin-menu {
  background: #fdfaf0;
  color: #3a2e22;
  border: 1px solid var(--skin-border);
  border-radius: 6px;
  box-shadow: var(--skin-shadow);
}
body[data-skin="cork-board"] #navbar-placeholder .usl-skin-menu li {
  color: #3a2e22;
  font-family: 'Rajdhani', var(--skin-font-body);
}
body[data-skin="cork-board"] #navbar-placeholder .usl-skin-menu li:hover,
body[data-skin="cork-board"] #navbar-placeholder .usl-skin-menu li:focus,
body[data-skin="cork-board"] #navbar-placeholder .usl-skin-menu li[aria-selected="true"] {
  background: #f3e9ce;
  color: #3a2e22;
}

body[data-skin="cork-board"] .form-control,
body[data-skin="cork-board"] select,
body[data-skin="cork-board"] textarea,
body[data-skin="cork-board"] .header-search input,
body[data-skin="cork-board"] .sort-sel,
body[data-skin="cork-board"] .store-search input {
  background: #fdfaf0 !important;
  color: #3a2e22 !important;
  border: 1px solid rgba(80,50,20,0.35) !important;
  border-radius: var(--skin-radius-input, 8px) !important;
  font-family: var(--skin-font-body) !important;
}
body[data-skin="cork-board"] .form-control::placeholder,
body[data-skin="cork-board"] .header-search input::placeholder {
  color: var(--skin-text-muted);
}
body[data-skin="cork-board"] .header-search i,
body[data-skin="cork-board"] .store-search i { color: var(--skin-text) !important; }

body[data-skin="cork-board"] .suggest {
  background: #fdfaf0 !important;
  color: #3a2e22 !important;
  border: 1px solid var(--skin-border) !important;
  z-index: 1060;
}
body[data-skin="cork-board"] .suggest div { color: #3a2e22 !important; }

body[data-skin="cork-board"] .usl-situation-headline,
body[data-skin="cork-board"] .usl-situation-copy,
body[data-skin="cork-board"] .usl-situation-kicker {
  color: var(--skin-text) !important;
}
body[data-skin="cork-board"] .site-foot,
body[data-skin="cork-board"] .site-foot .foot-copy {
  color: var(--skin-text-muted) !important;
}
body[data-skin="cork-board"] .site-foot a { color: #8f3a24 !important; }

body[data-skin="cork-board"] .dropdown-menu {
  background: #fdfaf0 !important;
  color: #3a2e22 !important;
  border: 1px solid var(--skin-border) !important;
}
body[data-skin="cork-board"] .dropdown-item { color: #3a2e22 !important; }
body[data-skin="cork-board"] .dropdown-item:hover,
body[data-skin="cork-board"] .dropdown-item:focus {
  background: #f3e9ce !important;
  color: #3a2e22 !important;
}

body[data-skin="cork-board"] .lb-overlay,
body[data-skin="cork-board"] .rpt-overlay,
body[data-skin="cork-board"] .store-lb,
body[data-skin="cork-board"] .modal { z-index: 1080; }
body[data-skin="cork-board"] .modal-content {
  background: var(--skin-surface) !important;
  color: var(--skin-text) !important;
  border: 1px solid var(--skin-border) !important;
  border-radius: 6px !important;
  box-shadow: var(--skin-shadow) !important;
}

body[data-skin="cork-board"] .result-bar,
body[data-skin="cork-board"] .header-stat,
body[data-skin="cork-board"] .header-stat b,
body[data-skin="cork-board"] #totalCount,
body[data-skin="cork-board"] .rb-count { color: var(--skin-text) !important; }

body[data-skin="cork-board"] .home-store-photo,
body[data-skin="cork-board"] .prod-card .pc-media,
body[data-skin="cork-board"] .prod-card .pc-media.has-photo,
body[data-skin="cork-board"] .store-lb-imgwrap,
body[data-skin="cork-board"] .reader-article-thumb-wrap { background: #f3e9ce !important; }

body[data-skin="cork-board"] .reader-sidebar,
body[data-skin="cork-board"] .reader-toolbar,
body[data-skin="cork-board"] .reader-guest-note,
body[data-skin="cork-board"] .reader-article {
  background: var(--skin-surface) !important;
  color: var(--skin-text) !important;
  border-color: var(--skin-border) !important;
}
body[data-skin="cork-board"] .reader-view-item,
body[data-skin="cork-board"] .reader-feed-row,
body[data-skin="cork-board"] .reader-sidebar-title,
body[data-skin="cork-board"] .reader-stream-title,
body[data-skin="cork-board"] .reader-lede,
body[data-skin="cork-board"] .reader-article-title,
body[data-skin="cork-board"] .reader-article-excerpt { color: var(--skin-text) !important; }

body[data-skin="cork-board"] .btn-outline-dark,
body[data-skin="cork-board"] .btn-outline-secondary {
  background: #fdfaf0 !important;
  color: #3a2e22 !important;
  border-color: rgba(80,50,20,0.4) !important;
}

body[data-skin="cork-board"] .home-banner { background: transparent !important; }


body[data-skin="cork-board"][data-skin-cursors="on"] {
  cursor: url('/assets/skins/cork-board/defaultarrow.png') 0 0, default !important;
}
body[data-skin="cork-board"][data-skin-cursors="on"] a,
body[data-skin="cork-board"][data-skin-cursors="on"] button,
body[data-skin="cork-board"][data-skin-cursors="on"] [role="button"],
body[data-skin="cork-board"][data-skin-cursors="on"] .btn,
body[data-skin="cork-board"][data-skin-cursors="on"] .dropdown-item,
body[data-skin="cork-board"][data-skin-cursors="on"] select,
body[data-skin="cork-board"][data-skin-cursors="on"] summary,
body[data-skin="cork-board"][data-skin-cursors="on"] label[for],
body[data-skin="cork-board"][data-skin-cursors="on"] .res-card,
body[data-skin="cork-board"][data-skin-cursors="on"] .facet-tile,
body[data-skin="cork-board"][data-skin-cursors="on"] .featured-card,
body[data-skin="cork-board"][data-skin-cursors="on"] .type-chip,
body[data-skin="cork-board"][data-skin-cursors="on"] .prod-card {
  cursor: url('/assets/skins/cork-board/pointer.png') 10 0, pointer !important;
}
body[data-skin="cork-board"][data-skin-cursors="on"] input,
body[data-skin="cork-board"][data-skin-cursors="on"] textarea {
  cursor: url('/assets/skins/cork-board/ibeam.png') 16 16, text !important;
}