bugabinga.net

/* Managed by OpenTofu. Local changes will be overwritten. */
@import url("https://site.bugabinga.net/nugu.css");

body,
#__next,
#inner_wrapper {
  min-height: 100svh !important;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--nugu-ui-normal) 18%, transparent) 1px, transparent 1px),
    linear-gradient(color-mix(in srgb, var(--nugu-ui-normal) 18%, transparent) 1px, transparent 1px),
    var(--nugu-content-backdrop) !important;
  background-size: 24px 24px !important;
  color: var(--nugu-content-normal) !important;
}

#widgets,
#services,
#bookmarks {
  max-width: 72rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.service-card,
.bookmark,
.information-widget-resource,
.information-widget-search,
.information-widget-datetime,
.information-widget-openmeteo,
.information-widget-logo,
.information-widget-greeting,
.service-widget {
  background: var(--nugu-ui-backdrop) !important;
  border: 2px solid var(--nugu-ui-normal) !important;
  border-radius: 0 !important;
  box-shadow: 8px 8px 0 var(--nugu-ui-accent) !important;
  backdrop-filter: none !important;
}

.service-card:hover,
.bookmark:hover,
.service-card:focus-within,
.bookmark:focus-within {
  border-color: var(--nugu-ui-accent) !important;
  box-shadow: 8px 8px 0 var(--nugu-ui-focus) !important;
}

.service-group-name,
.bookmark-group-name {
  color: var(--nugu-ui-important-global) !important;
  letter-spacing: 0;
  text-transform: lowercase;
}

.service-name,
.bookmark-name {
  color: var(--nugu-ui-normal) !important;
}

.service-title-text,
.bookmark-text {
  min-width: 0 !important;
}

.service-name,
.bookmark-name,
.service-description,
.bookmark-description {
  overflow-wrap: anywhere !important;
}

.service-description,
.bookmark-description {
  color: var(--nugu-content-normal) !important;
  line-height: 1.35;
}

.information-widget-search input,
input[type="text"] {
  background: var(--nugu-content-backdrop) !important;
  color: var(--nugu-content-normal) !important;
  border: 2px solid var(--nugu-ui-normal) !important;
  border-radius: 0 !important;
}

input[type="text"]::placeholder {
  color: var(--nugu-content-minor) !important;
  opacity: 1 !important;
}

input[type="text"]:focus-visible,
a:focus-visible {
  outline: 3px solid var(--nugu-ui-focus) !important;
  outline-offset: 2px !important;
}

a,
svg {
  color: inherit;
}

[class*="text-theme-"],
.information-widget-resource *,
.information-widget-datetime *,
.information-widget-openmeteo *,
.information-widget-greeting * {
  color: var(--nugu-ui-normal) !important;
}

.service-description,
.bookmark-description,
.text-theme-500,
.text-theme-600,
.text-theme-700 {
  color: var(--nugu-content-normal) !important;
}

.bg-theme-500,
.bg-theme-600,
.bg-theme-700 {
  background-color: var(--nugu-ui-accent) !important;
}

@media (max-width: 700px) {
  #widgets,
  #services,
  #bookmarks {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: .75rem !important;
    padding-right: .75rem !important;
    gap: 1rem !important;
  }

  .service-card,
  .bookmark,
  .information-widget-resource,
  .information-widget-search,
  .information-widget-datetime,
  .information-widget-openmeteo,
  .information-widget-logo,
  .information-widget-greeting,
  .service-widget {
    min-height: 5.5rem !important;
    padding: 1.1rem !important;
  }

  .service-card {
    padding-left: 1.35rem !important;
    padding-right: 1.35rem !important;
  }

  .service-title,
  .bookmark a > div {
    align-items: flex-start !important;
  }

  .service-title-text,
  .bookmark-text {
    padding-right: 4.5rem !important;
  }

  .service-tags {
    max-width: 3.5rem !important;
    overflow: hidden !important;
    top: .6rem !important;
    right: .7rem !important;
    transform: scale(.9) !important;
    transform-origin: top right !important;
  }

  .information-widget-logo img,
  .information-widget-logo svg {
    max-width: 6rem !important;
  }
}