/** Container */
.plugin-google-search-console__container {
  background-color: white;
  border-radius: 10px;
  padding: 20px 16px;
}

.plugin-google-search-console__container--loading
  .plugin-google-search-console__content {
  display: none;
}

.plugin-google-search-console__container--loading
  .plugin-google-search-console__loader-container {
  display: flex;
}

/** Header */
#plugin-google-search-console-header {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 16px;
}

/** Content */
.plugin-google-search-console__content {
  flex-direction: column;
  gap: 1.5rem;
  display: flex;
}

/** loader */
.plugin-google-search-console__loader {
  width: 40px;
  height: 40px;
  border: 5px solid #ccc;
  border-top: 5px solid #0083fc;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

.plugin-google-search-console__loader-container {
  width: 100%;
  height: 175px;
  display: none;
  justify-content: center;
  align-items: center;
}

/** status */
.plugin-google-search-console__status--indexed:before {
  content: url('../images/submited.svg');
  vertical-align: middle;
  width: 18px;
  height: 18px;
  display: inline-block;
  margin-right: 10px;
}

.plugin-google-search-console__status--duplicate:before {
  content: url('../images/duplicate.svg');
  vertical-align: middle;
  width: 18px;
  height: 18px;
  display: inline-block;
  margin-right: 10px;
}

.plugin-google-search-console__status--warning:before {
  content: url('../images/warning.svg');
  vertical-align: middle;
  width: 18px;
  height: 18px;
  display: inline-block;
  margin-right: 10px;
}

/** crawl date  */
.plugin-google-search-console__crawl-date:before {
  content: url('../images/clock.svg');
  vertical-align: middle;
  width: 18px;
  height: 18px;
  display: inline-block;
  margin-right: 10px;
}

/** google search console link */
.plugin-google-search-console__link {
  color: #0083fc;
  text-decoration: underline #0083fc;
}

.plugin-google-search-console__link:before {
  content: url('../images/google.svg');
  vertical-align: middle;
  width: 18px;
  height: 18px;
  display: inline-block;
  margin-right: 10px;
}

/** button */
.plugin-google-search-console__button {
  border: #0083fc 2px solid;
  color: #0083fc;
  border-radius: 8px;
  font-weight: 500;
  width: fit-content;
  height: 36px;
  padding: 0 12px;
}

.plugin-google-search-console__button:hover {
  background-color: #0083fc;
  color: white;
}

.plugin-google-search-console__button:before {
  content: url('../images/reload.svg');
  width: 12px;
  height: 12px;
  display: inline-block;
  vertical-align: text-top;
  margin-right: 10px;
}

.plugin-google-search-console__button:hover:before {
  content: url('../images/reload-white.svg');
}

/** dark mode */

/** Container */
.mode-dark .plugin-google-search-console__container {
  background-color: rgb(2 6 23);
  color: white;
}

/** status */
.mode-dark .plugin-google-search-console__status--indexed:before {
  content: url('../images/submited-white.svg');
}

.mode-dark .plugin-google-search-console__status--duplicate:before {
  content: url('../images/duplicate-white.svg');
}

.mode-dark .plugin-google-search-console__status--warning:before {
  content: url('../images/warning-white.svg');
}

/** crawl date  */
.mode-dark .plugin-google-search-console__crawl-date:before {
  content: url('../images/clock-white.svg');
}

/** google search console link */
.mode-dark .plugin-google-search-console__link {
  color: #fff;
  text-decoration: underline #fff;
}

.mode-dark .plugin-google-search-console__link:before {
  content: url('../images/google-white.svg');
}

/** button */
.mode-dark .plugin-google-search-console__button {
  color: #ffffff;
}

.mode-dark .plugin-google-search-console__button:before {
  content: url('../images/reload-white.svg');
}

.mode-dark .plugin-google-search-console__button:hover {
  background-color: #0083fc;
}
